/* ═══ THE GODFATHCRM (LE PARRAIN) — l'habillage du thème de cinéma (21.10.2026) ═══════════════════
   « Crée moi un thème le parrain rex, avec le logo inspiré. » Puis : le logo doit afficher « The
   GodfathCRM », un jeu de mots avec CRM, toujours dans un lettrage à empattements allongé, la main de
   marionnettiste et ses fils tombant sur les lettres ; REX reste en petit dessous.

   Les couleurs vivent dans css/99-themes.css (variables, contrastes testés) ; ici : ce que les variables ne
   disent pas — le menu, la barre iPhone, les bandeaux foncés, les titres à empattements, le logo du menu
   et le Rex mafieux de l'accueil. Même principe que les thèmes de club (css/99-menu.css) : des aplats
   noirs à encre ivoire, l'or patiné en filets et en repères, le rouge sang en simple filet bas ; jamais
   de couleur vive sous un texte. Le choix d'un thème par la date n'existe pas : tout cela ne s'applique
   que sous html[data-ambiance="parrain"], posé quand on choisit le thème dans Paramètres › Apparence.
   Les règles du logo et du Rex ne valent que si l'image a été réellement posée par js/226 (:has) : un
   fichier absent laisse le menu et l'accueil tels qu'ils sont.

   RETOUR EN ARRIÈRE : retirer la ligne de index.html. Le thème garde ses couleurs (css/99-themes.css) mais
   plus son menu, ses bandeaux ni ses titres. */

/* Les fils du marionnettiste, en filigrane dans les bandeaux : quatre fils d'or très pâles qui tombent du
   haut, chacun noué d'un petit nœud — l'écho discret du logo. */
html[data-ambiance="parrain"] {
  --prr-fils: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 100'%3E%3Cg fill='none' stroke='%23C9A24B' stroke-opacity='.26' stroke-width='1'%3E%3Cpath d='M20 0C20 30 24 50 24 70'/%3E%3Cpath d='M48 0C48 40 44 60 44 84'/%3E%3Cpath d='M76 0C76 36 80 56 80 76'/%3E%3Cpath d='M102 0C102 26 98 46 98 62'/%3E%3C/g%3E%3Cg fill='%23C9A24B' fill-opacity='.4'%3E%3Ccircle cx='24' cy='71' r='2.2'/%3E%3Ccircle cx='44' cy='85' r='2.2'/%3E%3Ccircle cx='80' cy='77' r='2.2'/%3E%3Ccircle cx='98' cy='63' r='2.2'/%3E%3C/g%3E%3C/svg%3E");
}
html[data-ambiance="parrain"] ::selection { background: rgba(201, 162, 75, .38); color: #FFFFFF; }

/* ── Le menu : ébène, double filet d'or en haut, liseré d'or sur le bord droit ───────────────────── */
html[data-ambiance="parrain"] .sidebar {
  --brand-cyan: #C9A24B;
  --sidebar: #0F0C0A;
  --text: #F1E8D2; --text-muted: #C9BFA6; --text-dim: #A39A83;
  --border: rgba(201, 162, 75, .22); --surface: rgba(241, 232, 210, .06); --surface-alt: rgba(241, 232, 210, .04);
  --accent: #C9A24B; --accent-dim: rgba(201, 162, 75, .16); --accent-border: rgba(201, 162, 75, .5); --on-accent: #14100A;
  background:
    linear-gradient(#C9A24B, #C9A24B) top left / 100% 3px no-repeat,
    linear-gradient(rgba(201, 162, 75, .45), rgba(201, 162, 75, .45)) left 0 top 5px / 100% 1px no-repeat,
    radial-gradient(120% 30% at 0% 0%, rgba(201, 162, 75, .10) 0%, transparent 60%),
    linear-gradient(168deg, #17120E 0%, #100C0A 55%, #0A0807 100%);
  border-right-color: #0A0807;
  box-shadow: inset -1px 0 0 rgba(201, 162, 75, .5), 4px 0 18px -6px rgba(0, 0, 0, .7);
}
html[data-ambiance="parrain"] .sidebar::before { opacity: .22; }
html[data-ambiance="parrain"] .sidebar::after { opacity: .5; }
html[data-ambiance="parrain"] .sidebar :is(.nav-item, .nav-solo-btn).active,
html[data-ambiance="parrain"] .sidebar .pmc-pole.actif {
  background: linear-gradient(90deg, rgba(201, 162, 75, .26) 0%, rgba(201, 162, 75, .05) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), inset 0 -1px 0 rgba(0, 0, 0, .5), inset 3px 0 0 #C9A24B;
}
html[data-ambiance="parrain"] .mobile-topbar {
  background:
    linear-gradient(#C9A24B, #C9A24B) bottom left / 100% 2px no-repeat,
    linear-gradient(135deg, #17120E 0%, #100C0A 60%, #0A0807 100%) !important;
  border-bottom: none !important;
}
html[data-ambiance="parrain"] .mobile-topbar .rex-topbar-marque { color: #E6C97A !important; }

/* ── Le logo du menu : « The GodfathCRM », posé par js/226 une fois le SVG vérifié ─────────────────
   Le logotype REX et la mascotte cèdent la place tant que le logo est là (:has) ; le SVG a ses propres
   couleurs (ivoire, or) : le filtre blanc du menu (--logo-filter) ne lui est pas appliqué. */
.sidebar-logo .rex-marque:has(> .prr-logo) > :is(picture, .rex-mascotte-menu, .rex-logotype-menu) { display: none !important; }
.sidebar-logo .rex-marque > .prr-logo { display: block; width: 100%; max-width: 188px; height: auto; margin: 0 auto; filter: none !important; }

/* ── Les bandeaux : noir chaud, double filet d'or en haut, filet rouge sang en bas, fils en filigrane ─
   Même liste de bandeaux que les thèmes de club ; l'encre devient ivoire par les variables --bnd-* de
   css/99-themes.css. */
html[data-ambiance="parrain"] :is(.dbx-hero, .fcx-hero, .cf-hero, .ozx-hero, .rex-bandeau, .rex-bandeau-hote) {
  background:
    linear-gradient(#C9A24B, #C9A24B) top left / 100% 3px no-repeat,
    linear-gradient(rgba(201, 162, 75, .45), rgba(201, 162, 75, .45)) left 0 top 5px / 100% 1px no-repeat,
    linear-gradient(#7A1220, #7A1220) left 0 bottom 0 / 100% 2px no-repeat,
    var(--prr-fils) right 34% top 5px / 130px 78% no-repeat,
    radial-gradient(110% 140% at 100% 0%, rgba(201, 162, 75, .12) 0%, transparent 55%),
    linear-gradient(135deg, #1D1712 0%, #100C09 52%, #070605 100%);
  color: #F1E8D2;
  border: 1px solid rgba(201, 162, 75, .38);
}
/* Le verre des boutons, de la recherche et des champs dans ces bandeaux : css/97 les peint pour un
   bandeau clair ; ici un verre sombre bordé d'or, sous une encre ivoire (même démarche que les clubs sombres). */
html[data-ambiance="parrain"] :is(.dbx-hero, .fcx-hero, .cf-hero, .ozx-hero, .rex-bandeau, .rex-bandeau-hote) :is(.btn-secondary, .btn-cancel, .btn-outline, .btn-light, .dbx-btn-verre, .tab-btn, select, input:not([type="checkbox"]):not([type="radio"])) {
  background: rgba(10, 8, 7, .55) !important;
  border: 1px solid rgba(201, 162, 75, .45) !important;
  color: #F1E8D2 !important;
  box-shadow: none !important;
}
html[data-ambiance="parrain"] :is(.dbx-hero, .fcx-hero, .cf-hero, .ozx-hero, .rex-bandeau, .rex-bandeau-hote) :is(.btn-secondary, .btn-cancel, .btn-outline, .btn-light, .dbx-btn-verre, .tab-btn):hover {
  background: rgba(10, 8, 7, .75) !important; border-color: #C9A24B !important;
}
html[data-ambiance="parrain"] .dbx-hero .dbx-recherche { background: rgba(10, 8, 7, .5); border: 1px solid rgba(201, 162, 75, .4); }
html[data-ambiance="parrain"] .dbx-hero .dbx-recherche:focus-within { background: rgba(10, 8, 7, .78); box-shadow: 0 0 0 3px rgba(201, 162, 75, .55); }
html[data-ambiance="parrain"] .dbx-hero .dbx-recherche input::placeholder { color: rgba(241, 232, 210, .80); }
html[data-ambiance="parrain"] .dbx-hero .dbx-recherche kbd { background: rgba(241, 232, 210, .12); border-color: rgba(201, 162, 75, .4); }
html[data-ambiance="parrain"] .dbx-hero .dbx-recherche input:not([type="checkbox"]):not([type="radio"]) {
  background: transparent !important; border: none !important; box-shadow: none !important;
}
html[data-ambiance="parrain"] :is(.dbx-hero, .rex-bandeau, .rex-bandeau-hote) .dbx-btn-blanc {
  background: rgba(201, 162, 75, .16) !important; border: 1px solid rgba(201, 162, 75, .7) !important; box-shadow: none !important;
}
html[data-ambiance="parrain"] :is(.dbx-hero, .rex-bandeau, .rex-bandeau-hote) .dbx-btn-blanc:hover {
  background: rgba(201, 162, 75, .28) !important; border-color: #E6C97A !important;
}
/* Les chiffres en gras du résumé d'accueil : l'or clair (9,6:1 sur le noir des bandeaux). */
html[data-ambiance="parrain"] .dbx-hero .dbx-hero-resume strong { color: #E6C97A; }

/* ── Les titres à empattements ───────────────────────────────────────────────────────────────────
   Playfair Display (chargée par js/226 au choix du thème, Google Fonts comme les autres polices du
   projet) puis Georgia. Mêmes titres que « Police des titres » (css/99-typographie-choix.css) : seulement
   les grands titres, jamais les tableaux, les boutons ni les chiffres. Un choix explicite de « Police des
   titres » (variable --police-titres) garde la main. */
html[data-ambiance="parrain"] :is(.rex-bandeau h1, .rex-bandeau-hote h1, .rex-bandeau-hote h2, .dbx-hero h1, .dbx-hero-titre, .fcx-hero h1, .cf-hero h1, .ozx-hero h1,
  .rc-tete h1, .dbx-carte-tete h2, .rbq-bloc h2, .main > h1, .main > h2, .page-title) {
  font-family: var(--police-titres, 'Playfair Display', Georgia, 'Times New Roman', serif);
  font-weight: 500; letter-spacing: .005em;
}

/* ── La fiche client dans un bandeau foncé ────────────────────────────────────────────────────────
   Comme les clubs sombres : sans ces règles, « ✏️ Modifier », le statut choisi et l'avatar restaient blancs
   sur blanc. Verre sombre, cerclé d'or. */
html[data-ambiance="parrain"] body:not(.mode-cloud):not(.mode-espace-client) .fcx-client {
  --fcx-surtitre: rgba(241, 232, 210, .86); --fcx-sous: rgba(241, 232, 210, .92);
  --fcx-puce-fond: rgba(0, 0, 0, .42); --fcx-puce-bord: rgba(201, 162, 75, .4); --fcx-puce-survol: rgba(0, 0, 0, .62);
  --fcx-ok: #BBF7D0; --fcx-ok-fond: rgba(0, 0, 0, .46); --fcx-ok-bord: rgba(74, 222, 128, .65);
  --fcx-ko: #FECACA; --fcx-ko-fond: rgba(0, 0, 0, .46); --fcx-ko-bord: rgba(229, 115, 123, .7);
  --fcx-on: #F1E8D2; --fcx-on-fond: rgba(0, 0, 0, .46); --fcx-on-bord: var(--accent);
  --fcx-trait: rgba(201, 162, 75, .28); --fcx-statut-fond: rgba(0, 0, 0, .36);
}
html[data-ambiance="parrain"] body:not(.mode-cloud):not(.mode-espace-client) .fcx-client :is(.fcx-btn-blanc, .fcx-btn-verre) {
  background: rgba(0, 0, 0, .42) !important; border: 1px solid rgba(201, 162, 75, .45) !important; box-shadow: none !important;
}
html[data-ambiance="parrain"] body:not(.mode-cloud):not(.mode-espace-client) .fcx-client .fcx-btn-blanc { border-color: var(--accent) !important; }
html[data-ambiance="parrain"] body:not(.mode-cloud):not(.mode-espace-client) .fcx-client .fcx-statut button.actif {
  background: rgba(0, 0, 0, .66) !important; box-shadow: inset 0 0 0 1px var(--accent) !important;
}
html[data-ambiance="parrain"] body:not(.mode-cloud):not(.mode-espace-client) .fcx-client .fcx-avatar > * {
  background-color: rgba(0, 0, 0, .5) !important; box-shadow: inset 0 0 0 2px var(--accent);
}

/* ── Rex en parrain : le GIF (assets/logos/rex/parrain/rex-parrain.gif) dans le bandeau de l'accueil ─
   Posé par js/226 à côté du Rex habituel, DANS .dbx-hero-droite, là où le Rex du bandeau (et celui de Noël,
   js/178) s'affiche. Tant qu'il est là, il prend la place du Rex habituel (:has) — masqué, donc immobile :
   ni marche ni combats dans l'accueil, js/117 n'anime que ce qu'il voit ; le fichier absent ou illisible,
   rien n'est posé et le Rex habituel reste. Il ne capte aucun clic. */
.dbx-hero-droite:has(> .prr-rex) > :is(.rexb-duo, img.dbx-hero-mascotte, .rxa-scene) { display: none !important; }
.dbx-hero-droite > .prr-rex { align-self: flex-end; display: block; height: 150px; width: auto; max-width: 280px; object-fit: contain;
  position: relative; z-index: 2; pointer-events: none; filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .45)); }
@media (max-width: 768px) {
  .dbx-hero-droite > .prr-rex { height: 96px; max-width: 170px; margin-right: 6px; }
}