/* =========================================================
   Bizz Consent — bandeau RGPD, habillage « BizzCab » sombre.
   Direction : « Same kit as the widget » — on rejoue 1:1 le
   design system du widget de réservation (widget-theme.css) :
   surface #11151f, bordures #283047, rayons 12-16, boutons
   pilule comme .mr-btn, cartes catégorie comme .mr-subpanel,
   interrupteur calé sur les switches du widget.
   Tout est préfixé .bizz- pour éviter les conflits de thème.
   ========================================================= */

#bizz-consent-root * { box-sizing: border-box; }

/* ---------------------------------------------------------
   Tokens (mêmes valeurs que widget-theme.css, en repli).
   L'accent réel est injecté inline en --bizz-color sur
   .bizz-banner et .bizz-modal (couleur choisie dans l'admin
   WP) : on le pointe via --bizz-accent, et on dérive
   hovers / anneaux / halos avec color-mix, exactement comme
   --accent-strong / --accent-soft / --accent-ring du widget.
   Un cyan secondaire sert de fine ligne / lueur en haut.
   --------------------------------------------------------- */
.bizz-banner,
.bizz-modal {
	/* Palette maîtresse (sombre BizzCab) */
	--bizz-bg:        #0a0d14;   /* fond de page sous le bandeau */
	--bizz-surface:   #11151f;   /* surface carte */
	--bizz-field:     #161b28;   /* fond inséré (interrupteur off) */
	--bizz-border:    #283047;   /* bordures / séparateurs */
	--bizz-text:      #f3f5fb;   /* texte principal */
	--bizz-muted:     #8e98b4;   /* texte secondaire, descriptions */

	/* Accent = couleur admin (repli bleu électrique du hero) */
	--bizz-accent:    var(--bizz-color, #1158FE);
	--bizz-on-accent: #ffffff;
	--bizz-cyan:      #22d3ee;   /* accent secondaire (hairline / glow) */

	/* Dérivés — jamais à partir de --bizz-bg (règle du widget) */
	--bizz-surface-2:     color-mix(in oklab, var(--bizz-surface) 94%, var(--bizz-text));
	--bizz-border-strong: color-mix(in oklab, var(--bizz-border) 60%, var(--bizz-text));
	--bizz-text-2:        color-mix(in oklab, var(--bizz-text) 75%, var(--bizz-muted));
	--bizz-accent-strong: color-mix(in oklab, var(--bizz-accent) 80%, var(--bizz-text));
	--bizz-accent-soft:   color-mix(in oklab, var(--bizz-accent) 16%, var(--bizz-surface));
	--bizz-accent-ring:   color-mix(in oklab, var(--bizz-accent) 30%, transparent);

	/* Rayons + motion (identiques au widget) */
	--bizz-r-sm:   8px;
	--bizz-r-md:  12px;
	--bizz-r-lg:  16px;
	--bizz-r-xl:  22px;
	--bizz-pill: 999px;
	--bizz-ease: cubic-bezier(.2, .7, .2, 1);
	--bizz-dur:  180ms;

	/* Ombres dérivées du texte (comme --shadow-card / --shadow-pop) */
	--bizz-shadow-card: 0 1px 0 color-mix(in oklab, var(--bizz-text) 6%, transparent),
	                    0 18px 40px -22px color-mix(in oklab, var(--bizz-text) 30%, transparent);
	--bizz-shadow-pop:  0 24px 60px -20px color-mix(in oklab, var(--bizz-text) 40%, transparent);

	font-family: Nunito, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: var(--bizz-text);
	line-height: 1.5;
}

/* =========================================================
   Bandeau (variantes bottom = barre, box = carte)
   Verre sombre : surface translucide + blur, repli solide.
   ========================================================= */
.bizz-banner {
	position: fixed;
	z-index: 999999;
	/* Repli solide d'abord (blur non supporté → reste lisible) */
	background: var(--bizz-surface);
	background: color-mix(in oklab, var(--bizz-surface) 86%, transparent);
	-webkit-backdrop-filter: blur(18px) saturate(1.4);
	backdrop-filter: blur(18px) saturate(1.4);
	border: 1px solid var(--bizz-border);
	box-shadow: var(--bizz-shadow-card);
	animation: bizz-in .32s var(--bizz-ease);
}

/* Barre pleine largeur en bas : fine ligne accent + lueur cyan en tête */
.bizz-pos-bottom {
	left: 0; right: 0; bottom: 0;
	border-left: 0; border-right: 0; border-bottom: 0;
	border-top: 1px solid var(--bizz-border);
	box-shadow: 0 -18px 50px -24px color-mix(in oklab, var(--bizz-text) 34%, transparent);
}
.bizz-pos-bottom::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 2px;
	/* Filet dégradé accent → cyan, comme les lueurs du site hôte */
	background: linear-gradient(90deg,
		transparent,
		var(--bizz-accent) 22%,
		var(--bizz-cyan) 78%,
		transparent);
	opacity: .9;
	pointer-events: none;
}

/* Carte flottante en bas-gauche : coins arrondis, anneau accent 1px */
.bizz-pos-box {
	left: 20px; bottom: 20px;
	max-width: 420px;
	border: 1px solid var(--bizz-border);
	border-radius: var(--bizz-r-lg);
	overflow: hidden;
	box-shadow: var(--bizz-shadow-pop),
	            0 0 0 1px color-mix(in oklab, var(--bizz-accent) 12%, transparent);
}
.bizz-pos-box::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 2px;
	background: linear-gradient(90deg,
		var(--bizz-accent),
		var(--bizz-cyan));
	opacity: .85;
	pointer-events: none;
}

.bizz-banner-body {
	position: relative;
	max-width: 1180px;
	margin: 0 auto;
	padding: 20px 24px;
}
.bizz-pos-box .bizz-banner-body { padding: 22px 22px 20px; }

/* =========================================================
   Titres + texte (aligné sur .mr-card__head)
   ========================================================= */
.bizz-title {
	margin: 0 0 6px;
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--bizz-text);
}
/* Pastille cyan « en ligne » devant le titre du bandeau (rappel du hero) */
.bizz-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: 9px;
	border-radius: 50%;
	background: var(--bizz-cyan);
	box-shadow: 0 0 8px var(--bizz-cyan);
	vertical-align: middle;
	position: relative;
	top: -1px;
}
.bizz-intro {
	margin: 0 0 16px;
	font-size: 13.5px;
	font-weight: 500;
	color: var(--bizz-muted);
}
.bizz-privacy {
	color: var(--bizz-accent);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px solid color-mix(in oklab, var(--bizz-accent) 45%, transparent);
	transition: color var(--bizz-dur) var(--bizz-ease),
	            border-color var(--bizz-dur) var(--bizz-ease);
}
.bizz-privacy:hover {
	color: var(--bizz-accent-strong);
	border-bottom-color: var(--bizz-accent);
}
.bizz-privacy:focus-visible {
	outline: none;
	border-radius: 3px;
	box-shadow: 0 0 0 3px var(--bizz-accent-ring);
}

/* =========================================================
   Actions
   ========================================================= */
.bizz-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}
/* Barre pleine largeur : boutons alignés à droite (le texte reste à gauche) */
.bizz-pos-bottom .bizz-actions { justify-content: flex-end; }

/* =========================================================
   Boutons — pilule, calqués sur .mr-btn du widget.
   primary = accent plein / ghost = transparent + bordure,
   hover monte la bordure vers un mix « strong ».
   ========================================================= */
.bizz-btn {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 11px 20px;
	border-radius: var(--bizz-pill);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.005em;
	line-height: 1;
	border: 1.5px solid transparent;
	cursor: pointer;
	transition: background var(--bizz-dur) var(--bizz-ease),
	            border-color var(--bizz-dur) var(--bizz-ease),
	            color var(--bizz-dur) var(--bizz-ease),
	            box-shadow var(--bizz-dur) var(--bizz-ease),
	            transform var(--bizz-dur) var(--bizz-ease);
}
/* Ghost : transparent + bordure, hover = surface + bordure forte */
.bizz-btn-ghost {
	background: transparent;
	color: var(--bizz-text-2);
	border-color: var(--bizz-border);
}
.bizz-btn-ghost:hover {
	background: var(--bizz-surface);
	border-color: var(--bizz-border-strong);
	color: var(--bizz-text);
}
/* Primary : accent plein, léger halo pour « popper » sur le sombre */
.bizz-btn-primary {
	background: var(--bizz-accent);
	color: var(--bizz-on-accent);
	box-shadow: 0 8px 22px -12px color-mix(in oklab, var(--bizz-accent) 80%, transparent),
	            inset 0 1px 0 color-mix(in oklab, #ffffff 22%, transparent);
}
.bizz-btn-primary:hover {
	background: var(--bizz-accent-strong);
	transform: translateY(-1px);
	box-shadow: 0 12px 26px -12px color-mix(in oklab, var(--bizz-accent) 88%, transparent),
	            inset 0 1px 0 color-mix(in oklab, #ffffff 26%, transparent);
}
.bizz-btn-primary:active { transform: translateY(0); }
/* Focus visible : anneau accent (mêmes 4px que le widget) sur tous les boutons */
.bizz-btn:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px var(--bizz-surface),
	            0 0 0 5px var(--bizz-accent-ring);
}

/* =========================================================
   Modale préférences — overlay sombre + carte « .mr-card »
   ========================================================= */
.bizz-overlay {
	position: fixed;
	inset: 0;
	z-index: 1000000;
	background: color-mix(in oklab, var(--bizz-bg) 72%, transparent);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	animation: bizz-fade .2s var(--bizz-ease);
}
.bizz-modal {
	position: relative;
	background: var(--bizz-surface);
	width: 100%;
	max-width: 560px;
	max-height: 88vh;
	overflow-y: auto;
	border: 1px solid var(--bizz-border);
	border-radius: var(--bizz-r-lg);
	padding: 26px 26px 24px;
	box-shadow: var(--bizz-shadow-pop),
	            0 0 0 1px color-mix(in oklab, var(--bizz-accent) 12%, transparent);
	animation: bizz-in .28s var(--bizz-ease);
}
/* Filet accent → cyan en haut de la modale (rappel du bandeau) */
.bizz-modal::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 2px;
	border-radius: var(--bizz-r-lg) var(--bizz-r-lg) 0 0;
	background: linear-gradient(90deg, var(--bizz-accent), var(--bizz-cyan));
	opacity: .85;
	pointer-events: none;
}
.bizz-modal .bizz-title { font-size: 20px; }
.bizz-modal .bizz-intro { font-size: 14px; margin-bottom: 4px; }

/* =========================================================
   Cartes catégorie — calquées sur .mr-subpanel
   (surface-2, bordure 1.5px, rayon lg)
   ========================================================= */
.bizz-cats { margin: 18px 0; }
.bizz-cat {
	border: 1.5px solid var(--bizz-border);
	border-radius: var(--bizz-r-lg);
	padding: 15px 16px;
	margin-bottom: 10px;
	background: var(--bizz-surface-2);
	transition: border-color var(--bizz-dur) var(--bizz-ease);
}
.bizz-cat:hover { border-color: var(--bizz-border-strong); }
.bizz-cat:last-child { margin-bottom: 0; }
.bizz-cat-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}
.bizz-cat-title {
	font-weight: 700;
	font-size: 14.5px;
	color: var(--bizz-text);
}
/* Pastille « Toujours actifs » — vert, comme un tag validé */
.bizz-cat-always {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 11px;
	border-radius: var(--bizz-pill);
	font-size: 12px;
	font-weight: 700;
	color: #34d399;
	background: color-mix(in oklab, #34d399 16%, var(--bizz-surface));
	border: 1px solid color-mix(in oklab, #34d399 40%, transparent);
}
.bizz-cat-desc {
	margin-top: 8px;
	font-size: 12.5px;
	font-weight: 500;
	color: var(--bizz-muted);
}

/* =========================================================
   Interrupteur — calé sur les switches du widget
   (piste = bordure off / accent on, pouce = --on-accent)
   ========================================================= */
.bizz-switch {
	position: relative;
	display: inline-block;
	width: 46px;
	height: 26px;
	flex: 0 0 auto;
}
.bizz-switch input {
	position: absolute;
	opacity: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	cursor: pointer;
}
.bizz-slider {
	position: absolute;
	inset: 0;
	background: var(--bizz-border);
	border: 1px solid var(--bizz-border-strong);
	border-radius: var(--bizz-pill);
	transition: background var(--bizz-dur) var(--bizz-ease),
	            border-color var(--bizz-dur) var(--bizz-ease);
	cursor: pointer;
}
.bizz-slider::before {
	content: "";
	position: absolute;
	height: 20px; width: 20px;
	left: 2px; top: 2px;
	background: var(--bizz-on-accent);
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .45);
	transition: transform var(--bizz-dur) var(--bizz-ease);
}
.bizz-switch input:checked + .bizz-slider {
	background: var(--bizz-accent);
	border-color: var(--bizz-accent);
}
.bizz-switch input:checked + .bizz-slider::before { transform: translateX(20px); }
.bizz-switch input:focus-visible + .bizz-slider {
	box-shadow: 0 0 0 2px var(--bizz-surface),
	            0 0 0 4px var(--bizz-accent-ring);
}

/* =========================================================
   Lien de réouverture (a.bizz-consent-open) — style discret
   ========================================================= */
.bizz-consent-open {
	cursor: pointer;
	transition: color var(--bizz-dur) var(--bizz-ease);
}
.bizz-consent-open:focus-visible {
	outline: none;
	border-radius: 4px;
	box-shadow: 0 0 0 3px var(--bizz-accent-ring);
}

/* =========================================================
   Politique de confidentialité (contenu page, hérite du thème)
   ========================================================= */
.bizz-privacy-policy h2 { margin-top: 1.6em; }

/* =========================================================
   Animations d'entrée
   ========================================================= */
@keyframes bizz-in {
	from { opacity: 0; transform: translateY(10px); }
	to   { opacity: 1; transform: none; }
}
@keyframes bizz-fade {
	from { opacity: 0; }
	to   { opacity: 1; }
}

/* =========================================================
   Mobile (≤640px) : la barre s'empile, boutons pleine
   largeur et ≥44px, la variante box devient quasi pleine
   largeur avec marges latérales.
   ========================================================= */
@media (max-width: 640px) {
	.bizz-pos-box {
		left: 12px; right: 12px; bottom: 12px;
		max-width: none;
	}
	.bizz-banner-body { padding: 18px 16px; }
	.bizz-pos-box .bizz-banner-body { padding: 18px 16px; }

	.bizz-actions {
		justify-content: stretch;
	}
	.bizz-actions .bizz-btn {
		flex: 1 1 100%;
		min-height: 46px;   /* confort tactile ≥ 44px */
		text-align: center;
	}
	/* La barre pleine largeur passe en boutons empilés pleine largeur aussi */
	.bizz-pos-bottom .bizz-actions { justify-content: stretch; }

	.bizz-modal {
		padding: 22px 18px 20px;
		max-height: 90vh;
		border-radius: var(--bizz-r-lg);
	}
}

/* =========================================================
   Accessibilité : mouvement réduit → pas d'animation d'entrée
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
	.bizz-banner,
	.bizz-modal,
	.bizz-overlay {
		animation: none !important;
	}
	.bizz-btn,
	.bizz-btn-primary:hover,
	.bizz-slider,
	.bizz-slider::before {
		transition: none !important;
	}
	.bizz-btn-primary:hover { transform: none; }
}