/* Signature — v1.5.0, reprise fidèle de https://xo-hair-melun.netlify.app/
   (couleurs, typographie, rayons, ombres) pour validation par Chloé avant
   ajout d'un élément différenciant Templiz. Fond noir profond, cuivre en
   accent, cartes très arrondies, badges/pilules teintés accent. */

.tsb-site[data-tsb-template="signature"] {
	--tsb-radius: 20px;
	--tsb-radius-sm: 12px;
	--tsb-border: rgba(255,255,255,0.1);
	/* Élément différenciant demandé par Chloé : le CTA de réservation en
	   beige plutôt qu'en dégradé cuivre (contrairement au site de référence). */
	--tsb-cta-beige: #E8DCC4;
}

/* Nav — quasi-noir, légèrement flouté, comme le header semi-transparent
   du site de référence. */
/**
 * 35e vague, retour Chloé — item 1 : "un bug existe toujours pour toutes les
 * options désactivées, elles ne s'appliquent pas". Cause trouvée : Signature
 * est le seul thème à re-peindre certains blocs avec une couleur EN DUR
 * (jamais via une variable --tsb-*), ce qui l'emporte systématiquement sur
 * la couleur personnalisée choisie dans "Mes couleurs" (Fond de l'en-tête,
 * Fond des badges, Fond du bloc "À savoir"/"Les plus populaires"/Équipe,
 * Fond du pied de page) — qu'elle soit réglée ou non, elle n'a jamais pu
 * s'appliquer sur ce thème précis. Chaque couleur en dur ci-dessous devient
 * son propre fallback dans un var(--tsb-xxx, <valeur d'origine>) : le rendu
 * par défaut de Signature reste identique tant que rien n'est personnalisé,
 * mais la personnalisation peut enfin réellement s'appliquer.
 */
.tsb-site[data-tsb-template="signature"] .tsb-nav {
	background: var(--tsb-header-bg, rgba(10,10,10,0.88));
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}
.tsb-site[data-tsb-template="signature"] .tsb-nav-brand {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}
.tsb-site[data-tsb-template="signature"] .tsb-nav-cta {
	background: var(--tsb-cta-beige);
	color: #1a1208;
	border: none;
}
/* 37e vague, retour Chloé — bug : cette règle et le ".tsb-btn-primary"
   générique plus bas (même spécificité, 3 sélecteurs) se disputaient déjà
   background/color à spécificité égale — c'était systématiquement le
   générique qui gagnait (dernier dans le fichier), et ni l'un ni l'autre ne
   lisait header_cta_bg/header_cta_text (36e vague, item 6), qui restaient
   donc sans effet sur ce bouton. Règle à spécificité strictement
   supérieure (4 sélecteurs) qui donne la priorité à header_cta_bg/text
   sans rien changer quand ils ne sont pas réglés (même repli beige/
   #1a1208 qu'avant). */
.tsb-site[data-tsb-template="signature"] .tsb-nav-cta.tsb-btn-primary {
	background: var(--tsb-header-cta-bg, var(--tsb-cta-bg, var(--tsb-cta-beige)));
	color: var(--tsb-header-cta-text, var(--tsb-cta-text, #1a1208));
}

/* Kicker/eyebrow — majuscules espacées, comme "@xo.haiir · Melun (77000)" */
.tsb-site[data-tsb-template="signature"] .tsb-hero-kicker,
.tsb-site[data-tsb-template="signature"] .tsb-page-banner-kicker {
	letter-spacing: 0.15em;
	color: rgba(255,255,255,0.9);
}
.tsb-site[data-tsb-template="signature"] .tsb-hero-title {
	font-weight: 600;
}

/* Badges — pilules teintées accent (fond accent à 10%, bordure à 35%),
   au lieu du blanc translucide générique. */
.tsb-site[data-tsb-template="signature"] .tsb-hero-badge {
	background: var(--tsb-badge-bg, rgba(196,114,74,0.12));
	border-color: var(--tsb-badge-bg, rgba(196,114,74,0.4));
	color: var(--tsb-badge-text, #fff);
}

/* Boutons de réservation — beige (élément différenciant Templiz), les
   autres boutons pleins gardent le dégradé cuivre + lueur du site source. */
.tsb-site[data-tsb-template="signature"] .tsb-btn-primary {
	/* item #102 — custom CTA color, falls back to Signature's own beige
	   differentiator when unset. */
	background: var(--tsb-cta-bg, var(--tsb-cta-beige));
	color: var(--tsb-cta-text, #1a1208);
	border: none;
	box-shadow: 0 4px 16px rgba(232,220,196,0.25);
}
/* 110e vague (suite, 2), retour Chloé — "il manque les options pour la
   couleur du texte et la couleur du CTA" (bandeau de réservation) :
   nouveau champ dédié (cta_banner_cta_bg/text) pour ce bouton précis, à
   spécificité strictement supérieure (4 sélecteurs) pour primer sur la
   règle générique juste au-dessus — même repli cta_bg/beige qu'avant
   quand ces 2 nouveaux champs ne sont pas réglés. */
.tsb-site[data-tsb-template="signature"] .tsb-cta-actions .tsb-btn-primary {
	background: var(--tsb-cta-banner-cta-bg, var(--tsb-cta-bg, var(--tsb-cta-beige)));
	color: var(--tsb-cta-banner-cta-text, var(--tsb-cta-text, #1a1208));
}
/* v1.9.0 — background re-asserted explicitly here (was previously only
   inherited from the ".tsb-btn-primary" rule above): base.css's hero
   override now wins ties at equal specificity by relying on load order, so
   this rule needs to match its 4-selector specificity to keep the beige
   differentiator instead of falling back to hero's default white.
   Bug Chloé (110e vague, suite) — "le bouton Prendre rendez-vous [...] je le
   vois en beige" : ce fallback beige en dur ne lisait JAMAIS hero_cta_bg
   (44e vague, item 3 — "Fond du bouton 'Prendre rendez-vous' (photo héro)",
   déjà présent dans "Mes couleurs") ni même cta_bg, contrairement à toutes
   les autres règles .tsb-btn-primary de ce fichier (nav-cta, générique) qui
   chaînent déjà correctement header_cta_bg/cta_bg avant leur propre repli
   beige. Même correctif : on relit la chaîne complète de base.css
   (--tsb-hero-cta-bg puis --tsb-cta-bg) avant de retomber sur le beige —
   un site qui n'a jamais touché ces 2 champs garde exactement le même
   rendu beige qu'avant. */
.tsb-site[data-tsb-template="signature"] .tsb-hero-actions .tsb-btn-primary {
	background: var(--tsb-hero-cta-bg, var(--tsb-cta-bg, var(--tsb-cta-beige)));
	color: var(--tsb-hero-cta-text, var(--tsb-cta-text, #1a1208));
	border-color: var(--tsb-hero-cta-bg, var(--tsb-cta-bg, var(--tsb-cta-beige)));
}
.tsb-site[data-tsb-template="signature"] .tsb-hero-actions .tsb-btn-outline {
	border-color: rgba(255,255,255,0.4);
}

/* Cartes — fond "surface" légèrement plus clair que le fond, coins très
   arrondis, bordure fine — services, avis, réserver, politiques de réservation. */
.tsb-site[data-tsb-template="signature"] .tsb-service-card,
.tsb-site[data-tsb-template="signature"] .tsb-testimonial,
.tsb-site[data-tsb-template="signature"] .tsb-reserve-card,
.tsb-site[data-tsb-template="signature"] .tsb-team-photo-placeholder {
	background: var(--tsb-sand);
	border: 1px solid var(--tsb-border);
	border-radius: var(--tsb-radius);
}
.tsb-site[data-tsb-template="signature"] .tsb-policy-item {
	background: var(--tsb-sand);
	border: 1px solid var(--tsb-border);
	border-left: 3px solid var(--tsb-border);
	border-radius: var(--tsb-radius-sm);
	padding-left: 20px;
	padding-right: 20px;
}
.tsb-site[data-tsb-template="signature"] .tsb-policy-item[open] {
	border-left-color: var(--tsb-accent);
}
.tsb-site[data-tsb-template="signature"] .tsb-service-photo-placeholder {
	border-radius: var(--tsb-radius) var(--tsb-radius) 0 0;
}

/* Sections alternent deux nuances de noir quasi identiques, comme sur le
   site de référence (home-trust/home-offers en #141414 vs #0a0a0a). */
.tsb-site[data-tsb-template="signature"] .tsb-highlights {
	background: var(--tsb-highlights-bg, #141414);
}
.tsb-site[data-tsb-template="signature"] .tsb-services {
	background: var(--tsb-services-bg, #141414);
}
.tsb-site[data-tsb-template="signature"] .tsb-team {
	background: var(--tsb-team-bg, #141414);
}
/* Bug Chloé (110e vague) — cette règle gagnait toujours sur celle de
   base.css (même spécificité, chargée après) et figeait le fond en
   --tsb-sand brut SANS jamais lire --tsb-cta-banner-bg : la couleur
   personnalisée "Fond du bloc CTA (bandeau de réservation)" n'avait donc
   aucun effet visible sur le template Signature, quelle que soit la valeur
   enregistrée côté "Mes couleurs".
   110e vague (suite) — même bug pour .tsb-urgency-card : figé en dur sur
   --tsb-sand, sans jamais lire le nouveau --tsb-urgency-bg (champ "Mes
   couleurs" ajouté dans la foulée). */
.tsb-site[data-tsb-template="signature"] .tsb-cta-banner-inner {
	background: var(--tsb-cta-banner-bg, var(--tsb-sand));
	border: 1px solid var(--tsb-border);
}
.tsb-site[data-tsb-template="signature"] .tsb-urgency-card {
	background: var(--tsb-urgency-bg, var(--tsb-sand));
	border: 1px solid var(--tsb-border);
}
.tsb-site[data-tsb-template="signature"] .tsb-highlight-index {
	font-family: var(--tsb-font-body);
	font-size: 13px;
	letter-spacing: 0.05em;
}

/* Onglets de catégories de prestations — pilule sombre, actif en dégradé cuivre. */
.tsb-site[data-tsb-template="signature"] .tsb-services-tabs {
	background: var(--tsb-sand);
}
.tsb-site[data-tsb-template="signature"] .tsb-services-tab.is-active {
	background: linear-gradient(135deg, var(--tsb-accent) 0%, #8B4513 100%);
	color: #fff;
}

.tsb-site[data-tsb-template="signature"] .tsb-footer {
	background: var(--tsb-footer-bg, #141414);
	border-top: 1px solid var(--tsb-border);
}