/* ============================================================
   CRÉAPROD-JISTA — thème de l'agence pour les espaces clients
   Charte graphique — synthèse identité visuelle du 05/09/2026
   Palette : Doré #D4AF37 · Anthracite #1A1A1A · Blanc cassé #F8F6F2 · Rouge #C8102E · Vert #009E49
   Version principale officielle : CJ doré sur fond sombre.
   À charger APRÈS dashboard-style.css (il en redéfinit les couleurs et les polices).
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Cormorant+Garamond:ital,wght@1,500;1,600&family=Inter:wght@400;500;600;700&display=swap');

:root{
  /* Palette officielle */
  --cj-dore:#D4AF37; --cj-dore-fonce:#B8962A; --cj-anthracite:#1A1A1A; --cj-blanc-casse:#F8F6F2;
  --cj-rouge:#C8102E; --cj-vert:#009E49; --cj-vert-fonce:#007F3A;
  --cj-titre:'Cinzel',Georgia,serif; --cj-accent:'Cormorant Garamond',Georgia,serif; --cj-texte:'Inter',system-ui,sans-serif;
  /* Correspondance avec les variables du gabarit (dashboard-style.css) */
  --noir-volcan:var(--cj-anthracite); --anthracite:#2A2A2A; --blanc-casse:var(--cj-blanc-casse);
  --vert-creation:var(--cj-vert); --vert-creation-dark:var(--cj-vert-fonce);
  --dore-signature:var(--cj-dore); --rouge-passion:var(--cj-rouge);
  --gris-pierre:#DCD6CA; --gris-clair:#ECE8E0;
}
body{font-family:var(--cj-texte)}
a{color:#7A6216}
a:hover{color:var(--cj-anthracite)}

/* En-tête sombre avec le monogramme principal */
header.dash-header{background:var(--cj-anthracite);padding:30px 0 36px;margin-bottom:34px;border-bottom:2px solid var(--cj-dore);position:relative}
header.dash-header::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:4px;background:linear-gradient(90deg,var(--cj-rouge) 0 33%,var(--cj-dore) 33% 66%,var(--cj-vert) 66%);opacity:.9}
.agency-wordmark{gap:0}
.agency-brand .agency-wordmark img{height:116px;width:auto;border-radius:0}
.dash-title{border-top:1px solid rgba(212,175,55,.35);margin-top:26px;padding-top:26px}
.dash-title h1{font-family:var(--cj-titre);font-weight:600;letter-spacing:.08em;color:var(--cj-blanc-casse)}
.dash-title .client-name{font-family:var(--cj-accent);font-style:italic;font-weight:600;font-size:1.45rem;color:var(--cj-dore);letter-spacing:.01em}
header.dash-header .retour{color:var(--cj-dore)}
header.dash-header .retour:hover{color:var(--cj-blanc-casse)}

/* Titres */
.title-font,.card h2,.doc-block h3{font-family:var(--cj-titre);letter-spacing:.07em}
.card h2{font-weight:700}
.card{border-color:var(--gris-clair)}

/* Avancement : doré, le vert reste réservé aux étapes terminées */
.progress-fill,.frise-fill{background:linear-gradient(90deg,var(--cj-dore-fonce),var(--cj-dore))}
.progress-pct{font-family:var(--cj-titre);color:var(--cj-anthracite)}
.update-date,.timeline .t-date{font-family:var(--cj-titre);color:#7A6216;letter-spacing:.08em}
.timeline li::before{background:var(--cj-dore)}
.frise-today-label,.frise-dates{font-family:var(--cj-texte)}

/* Boutons : anthracite + doré */
.btn{font-family:var(--cj-texte);letter-spacing:.02em}
.btn-primary{background:var(--cj-anthracite);color:var(--cj-dore)}
.btn-primary:hover{background:var(--cj-dore);color:var(--cj-anthracite)}
.btn-outline{color:var(--cj-anthracite);border-color:var(--cj-anthracite)}
.btn-outline:hover{border-color:var(--cj-dore);color:#7A6216}
#request-form label{font-family:var(--cj-texte)}
#request-form input:focus,#request-form textarea:focus{border-color:var(--cj-dore)}
.doc-block ul li a{color:#7A6216}

/* Pied de page */
footer.dash-footer{background:var(--cj-anthracite);color:#B9B3A6;border-top:2px solid var(--cj-dore);margin-top:40px}
footer.dash-footer strong{font-family:var(--cj-titre);color:var(--cj-dore);letter-spacing:.08em;font-weight:600}

@media (max-width:640px){
  .agency-brand .agency-wordmark img{height:88px}
  .dash-title .client-name{font-size:1.2rem}
}