/* ── CoVoeur Theme — modifier uniquement ce fichier pour changer la palette ── */
:root {
    --primary:        #92BEC2;              /* couleur principale (boutons, liens, accents) */
    --primary-dark:   #5A8087;              /* variante sombre (hover, titres) */
    --primary-bg:     #F7F1EB;              /* fond très léger */
    --secondary:      #E1BA93;              /* couleur secondaire (accent doré: bordures, italiques) */
    --secondary-light: #F7F1EB;             /* variante claire secondary (fond welcome block, bg léger) */
    --tertiary:       #201926;              /* couleur tertiaire (bulle droite dans les rapports) */
    --tertiary-light: #F5F5F5;             /* variante claire (bulle gauche dans les rapports) */
    --title:          #5A8087;              /* couleur des titres */
    --text:           #201926;              /* couleur du texte principal */
    --muted:          #666666;              /* texte secondaire */
    --bg:             #ffffff;              /* fond de page */

    /* Hero landing page */
    --hero-glow-1:    var(--secondary);    /* lueur top-right */
    --hero-glow-2:    var(--secondary-light);             /* lueur bottom-left */
    --hero-gradient:  linear-gradient(160deg, #fff 0%, var(--hero-glow-2) 30%, var(--hero-glow-1) 100%);

    /* Ombres */
    --shadow-xs:      rgba(170,121,140,0.07);
    --shadow-sm:      rgba(170,121,140,0.08);
    --shadow-md:      rgba(170,121,140,0.13);
    --shadow-border:  rgba(170,121,140,0.20);

    /* Titres macro-section dans les rapports */
    --macro-title:    var(--primary-dark);

    /* QR code — hex sans # (le JS strip le # automatiquement si présent) */
    --qr-color: 5A8087;
}

/* ── Wrapper droite du header (lang-switcher + CTA / back-link) ── */
/* `!important` sur les flex props : certaines pages ont une CSS inline qui
   ré-définit `.header-right` ou des sélecteurs descendants — on garantit le
   layout row côte à côte quel que soit le contexte. */
.header-right {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
    flex-shrink: 0;
}
.header-right > * { flex-shrink: 0; }

/* ── Lang switcher FR/EN (injecté dans le header de chaque page) ── */
.lang-switcher {
    font-family: 'Inter', -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: var(--muted);
    background: transparent;
    border: 1px solid rgba(146,190,194,0.5);
    border-radius: 16px;
    padding: 5px 8px;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
    appearance: auto;
    -webkit-appearance: menulist;
    flex-shrink: 0;
}
.lang-switcher:hover { border-color: var(--primary); color: var(--primary-dark); }
.lang-switcher:focus { outline: none; border-color: var(--primary); }

/* Mobile : sur les pages où .header-cta est masquée en < 768px, on garde la
   lang-switcher visible (elle ne prend pas trop de place). Comportement par
   défaut suffit, pas de règle spéciale ici. */