/* Any element with the native [hidden] attribute must stay hidden even if
   a later, equal-specificity class rule also sets display: — otherwise the
   class rule wins by source order and the element stays visible. */
[hidden] { display: none !important; }

/* VLabs Loyalty Points - camera capture UI (shared by admin + portal) */

.vlplp-fc-camera-btn {
	display: inline-flex; align-items: center; gap: 6px;
	margin-top: 6px; padding: 8px 12px; font-size: 13px; font-weight: 600;
	background: #eef0f3; color: #1f2937; border: none; border-radius: 8px; cursor: pointer;
}
.vlplp-fc-camera-btn:hover { background: #e2e5ea; }

.vlplp-fc-preview {
	display: flex; align-items: center; gap: 10px; margin-top: 8px;
}
.vlplp-fc-preview[hidden] { display: none; }
.vlplp-fc-preview img {
	width: 56px; height: 56px; object-fit: cover; border-radius: 8px; border: 1px solid #e5e7eb;
}
.vlplp-fc-preview-label {
	font-size: 12px; color: #6b7280;
}

.vlplp-fc-overlay {
	position: fixed !important; inset: 0 !important; background: rgba(11, 24, 48, .75);
	display: flex !important; align-items: center; justify-content: center;
	padding: 20px; z-index: 2147483647 !important;
}
.vlplp-fc-modal {
	background: #101828; border-radius: 16px; padding: 16px;
	width: 420px; max-width: 100%; box-shadow: 0 20px 50px rgba(0,0,0,.4);
}
.vlplp-fc-stage {
	position: relative; width: 100%; aspect-ratio: 4/3; background: #000;
	border-radius: 10px; overflow: hidden;
}
.vlplp-fc-video, .vlplp-fc-canvas {
	position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.vlplp-fc-error {
	color: #ffb4b4; font-size: 13px; margin: 10px 4px 0; text-align: center;
}
.vlplp-fc-controls {
	display: flex; gap: 10px; margin-top: 14px; justify-content: center;
}
.vlplp-fc-controls[hidden] { display: none; }
.vlplp-fc-btn {
	border: none; border-radius: 10px; padding: 12px 16px; font-size: 14px; font-weight: 700;
	cursor: pointer; background: rgba(255,255,255,.12); color: #fff;
}
.vlplp-fc-btn:hover { background: rgba(255,255,255,.2); }
.vlplp-fc-btn-primary { background: #d4af37; color: #101828; }
.vlplp-fc-btn-primary:hover { background: #c49f2d; }
.vlplp-fc-flip { flex: 0 0 auto; font-size: 18px; padding: 12px 14px; }
.vlplp-fc-shoot { flex: 1; }
.vlplp-fc-cancel { flex: 0 0 auto; }
.vlplp-fc-confirm { flex: 1; }

@media (max-width: 480px) {
	.vlplp-fc-modal { padding: 12px; }
	.vlplp-fc-controls { flex-wrap: wrap; }
}
