/* ============================================================
   _dark-base.css
   Shared selector overrides for any dark theme variant.
   Each variant CSS file only redefines the colour tokens;
   this file adapts the few hard-coded element styles so
   everything reads correctly on a dark canvas.
   ============================================================ */

/* Cards (Réalisations, Skills, Callouts) — paper-alt instead of pure white */
.callout,
.hl,
.skills__group{
    background: var(--paper-alt);
    border-color: var(--rule);
    box-shadow: none;
}
.hl:hover,
.skills__group:hover{
    border-color: var(--blue);
    box-shadow: none;
}

/* Outline button needs an inverted hover state on dark backgrounds */
.btn--outline{
    color: var(--ink);
    border-color: var(--ink);
}
.btn--outline:hover{
    background: var(--ink);
    color: var(--paper);
    border-color: var(--ink);
}

/* Sticky nav background when scrolled */
.nav.is-scrolled{
    background: color-mix(in srgb, var(--paper) 92%, transparent);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom-color: var(--rule);
}

/* Mobile drawer panel */
.drawer{ background: var(--paper); }
.drawer__nav a{ color: var(--ink); border-bottom-color: var(--rule); }

/* For-role sticky aside — use the alt panel */
.for-role__aside{ background: var(--paper-alt); }

/* Photo placeholder + slight contrast lift in dark */
.profile__photo img{
    filter: grayscale(0%) contrast(1.0) brightness(1.02);
}

/* Awards (blue section) — keep contrast against dark page */
.section--blue .award-row{ border-top-color: rgba(255,255,255,.18); }
.section--blue .award-row:last-child{ border-bottom-color: rgba(255,255,255,.18); }

/* Footer rule */
.footer{ border-top-color: var(--rule); }

/* Selection contrast */
::selection{ background: var(--blue); color: var(--paper); }