/* ============================================================
   Vidubes — tema oscuro compartido (tokens + header de cristal + base)
   Cargar con $extraCss = ['dark', ...] y $bodyClass = 'theme-dark ...'.
   Usado por: index (home), coach. Base para migrar el resto de páginas.
   ============================================================ */

:root {
    --hx-bg:        #0B0C0E;
    --hx-surface:   rgba(255, 255, 255, .04);
    --hx-surface-2: rgba(255, 255, 255, .07);
    --hx-line:      rgba(255, 255, 255, .08);
    --hx-line-2:    rgba(255, 255, 255, .14);
    --hx-text:      #F5F6F8;
    --hx-muted:     #94A3B8;
    --hx-orange:    #FF5722;
    --hx-orange-2:  #FF8A3D;
    --hx-amber:     #FFB547;
    --hx-glow:      0 0 24px rgba(255, 87, 34, .35);
    --hx-ease:      cubic-bezier(.2, .8, .2, 1);
}

/* ---------- Base oscura ---------- */
body.theme-dark { background: var(--hx-bg); color: var(--hx-text); }
.theme-dark .site-footer { margin-top: 0; background: #08090A; border-top: 1px solid var(--hx-line); }

/* ---------- Header: glassmorphism ---------- */
.theme-dark .site-header {
    background: rgba(15, 17, 21, .75);
    -webkit-backdrop-filter: saturate(160%) blur(12px);
    backdrop-filter: saturate(160%) blur(12px);
    border-bottom: 1px solid var(--hx-line);
}
.theme-dark .brand__name { color: #fff; }
.theme-dark .nav__link { color: #A1A8B3; transition: color .2s var(--hx-ease); }
.theme-dark .nav__link::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; border-radius: 2px;
    background: linear-gradient(90deg, var(--hx-orange), var(--hx-amber));
    transform: scaleX(0); transform-origin: left; transition: transform .25s var(--hx-ease);
}
.theme-dark .nav__link:hover { color: #fff; }
.theme-dark .nav__link:hover::after { transform: scaleX(.6); }
.theme-dark .nav__link.is-active { color: #fff; }
.theme-dark .nav__link.is-active::after { transform: scaleX(1); box-shadow: 0 0 10px rgba(255, 87, 34, .7); height: 2px; bottom: -6px; }
.theme-dark .nav__link:focus-visible { outline: 2px solid var(--hx-orange); outline-offset: 4px; border-radius: 4px; }
.theme-dark .user-pill { background: rgba(255, 255, 255, .05); border-color: var(--hx-line-2); }
.theme-dark .user-pill__name { color: #C9CED6; }
.theme-dark .user-pill__logout { background: rgba(255, 255, 255, .1); color: #fff; transition: background .2s; }
.theme-dark .user-pill__logout:hover { background: var(--hx-orange); }
.theme-dark .hamburger { border-color: var(--hx-line-2); }
.theme-dark .hamburger span { background: #fff; }
.theme-dark .nav--mobile { background: rgba(11, 12, 14, .96); border-top-color: var(--hx-line); }
.theme-dark .nav--mobile .nav__link { border-bottom-color: var(--hx-line); }
.theme-dark .nav--mobile .nav__link::after { display: none; }