/* ═══════════════════════════════════════════════════════════════════════
   MULLIGAN TV — THÈME PARTAGÉ « 6 ENCRES »
   Inspiré des six couleurs d'encre du jeu de cartes (Ambre, Améthyste,
   Émeraude, Rubis, Saphir, Acier) — uniquement du CSS/typographie, aucune
   image ou logo sous copyright. Chargé par les 4 pages (index, admin-login,
   client, admin) en complément de leur propre <style> : ce fichier ne fait
   qu'ajouter/affiner, il ne retire rien à l'existant.
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  --amber:#c9a84c;     --amber-light:#e8c97a;
  --amethyst:#7c5cbf;  --amethyst-light:#a07de0;
  --emerald:#1d8a5e;   --emerald-light:#4dd4a0;
  --ruby:#b83c3c;      --ruby-light:#e8807c;
  --sapphire:#2e6fb4;  --sapphire-light:#70aaee;
  --steel:#8c9aa3;     --steel-light:#c2ccd2;
}

/* ─── Logo / lockup de marque ─── */
.brand-lockup{display:flex;align-items:center;gap:10px;}
.brand-lockup.stack{flex-direction:column;text-align:center;}
.brand-logo{display:block;border-radius:50%;object-fit:cover;flex-shrink:0;
  box-shadow:0 0 0 1px rgba(201,168,76,0.45),0 4px 18px rgba(0,0,0,0.45);}
.brand-logo.size-sm{width:26px;height:26px;}
.brand-logo.size-md{width:38px;height:38px;}
.brand-logo.size-lg{width:68px;height:68px;box-shadow:0 0 0 2px rgba(201,168,76,0.5),0 8px 28px rgba(0,0,0,0.5);}

/* ─── Pips d'encre — motif décoratif des 6 couleurs du jeu ─── */
.ink-pips{display:flex;gap:6px;justify-content:center;}
.ink-pips span{width:7px;height:7px;border-radius:50%;display:block;box-shadow:0 0 6px currentColor;}
.ink-pips span:nth-child(1){background:var(--amber);color:var(--amber);}
.ink-pips span:nth-child(2){background:var(--amethyst);color:var(--amethyst);}
.ink-pips span:nth-child(3){background:var(--emerald);color:var(--emerald);}
.ink-pips span:nth-child(4){background:var(--ruby);color:var(--ruby);}
.ink-pips span:nth-child(5){background:var(--sapphire);color:var(--sapphire);}
.ink-pips span:nth-child(6){background:var(--steel);color:var(--steel);}

/* ─── Halo de fond multi-encres, plus riche que les radiaux ponctuels existants ─── */
.ink-aura{position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 50% 38% at 8% 6%,  rgba(201,168,76,0.10) 0%, transparent 60%),
    radial-gradient(ellipse 46% 34% at 92% 12%, rgba(124,92,191,0.10) 0%, transparent 60%),
    radial-gradient(ellipse 46% 34% at 88% 92%, rgba(46,111,180,0.09) 0%, transparent 60%),
    radial-gradient(ellipse 46% 34% at 6% 90%,  rgba(29,138,94,0.08) 0%, transparent 60%);
}

/* ─── Effet de brillance (« foil ») au survol des boutons dorés ─── */
.btn-gold,.btn-login,.btn-claim,.btn-action{position:relative;overflow:hidden;isolation:isolate;}
.btn-gold::after,.btn-login::after,.btn-claim::after,.btn-action::after{
  content:'';position:absolute;top:0;left:-60%;width:35%;height:100%;
  background:linear-gradient(115deg,transparent,rgba(255,255,255,0.4),transparent);
  transform:skewX(-20deg);transition:left .5s ease;pointer-events:none;}
.btn-gold:hover::after,.btn-login:hover::after,.btn-claim:hover::after,.btn-action:hover::after{left:130%;}

/* ─── Cartes de métriques (admin) : liseré supérieur cyclant sur les 6 encres, sans JS ─── */
.metrics-grid .metric-card:nth-of-type(6n+1){--accent:var(--amber);}
.metrics-grid .metric-card:nth-of-type(6n+2){--accent:var(--amethyst);}
.metrics-grid .metric-card:nth-of-type(6n+3){--accent:var(--sapphire);}
.metrics-grid .metric-card:nth-of-type(6n+4){--accent:var(--emerald);}
.metrics-grid .metric-card:nth-of-type(6n+5){--accent:var(--ruby);}
.metrics-grid .metric-card:nth-of-type(6n+6){--accent:var(--steel);}
.metric-card{transition:transform .18s,box-shadow .18s;}
.metric-card:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,0,0,0.35);}

/* ─── Icônes de la nav admin : une encre par rubrique (purement décoratif) ─── */
.nav-item:nth-of-type(1) .nav-icon{color:var(--amber);}
.nav-item:nth-of-type(2) .nav-icon{color:var(--sapphire-light);}
.nav-item:nth-of-type(3) .nav-icon{color:var(--amethyst-light);}
.nav-item:nth-of-type(4) .nav-icon{color:var(--steel-light);}
.nav-item:nth-of-type(5) .nav-icon{color:var(--emerald-light);}
.nav-item:nth-of-type(6) .nav-icon{color:var(--ruby-light);}
.nav-item:nth-of-type(7) .nav-icon{color:var(--amber-light);}
.nav-item.active .nav-icon{color:inherit;}

/* ─── Liseré « foil » subtil sur les cartes premium (login, modal) ─── */
.login-card,.modal{position:relative;isolation:isolate;}
.login-card::before,.modal::before{
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:linear-gradient(135deg, rgba(201,168,76,0.14) 0%, transparent 18%, transparent 82%, rgba(124,92,191,0.12) 100%);}

/* ─── Scrollbar cohérente sur toutes les pages ─── */
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:rgba(201,168,76,0.35);border-radius:3px;}

@media print{.ink-aura{display:none;}}