/* =========================================================
   NALIA � Palette rework (pink-nude-coffee premium)
   site.css (FULL)
   ========================================================= */

/* ============================= */
/* ===== Design tokens ========= */
/* ============================= */
:root {
    /* Palette */
    --nalia-pink-50: #FCF1EF; /* fondo */
    --nalia-nude: #E5D0C7; /* nude rosado */
    --nalia-beige: #C9A89B; /* beige rosado */
    --nalia-coffee: #A87C69; /* caf� rosado medio */
    --nalia-ink: #813B1D; /* caf� profundo (texto/logo) */
    /* Surfaces */
    --nalia-bg: var(--nalia-pink-50);
    --nalia-surface: rgba(255,255,255,.92);
    --nalia-surface-2: rgba(255,255,255,.78);
    /* Text */
    --nalia-text: var(--nalia-ink);
    --nalia-text-2: rgba(129,59,29,.78);
    --nalia-text-3: rgba(129,59,29,.58);
    /* Borders */
    --nalia-border: rgba(129,59,29,.14);
    --nalia-border-2: rgba(129,59,29,.10);
    /* Accent (global) */
    --nalia-accent: var(--nalia-coffee);
    --nalia-accent-hover: rgba(168,124,105,.88);
    --nalia-accent-soft: rgba(168,124,105,.18);
    /* Shadows */
    --nalia-shadow-sm: 0 10px 26px rgba(129,59,29,.08);
    --nalia-shadow-md: 0 18px 45px rgba(129,59,29,.10);
    --nalia-shadow-lg: 0 22px 70px rgba(129,59,29,.16);
    /* Radius */
    --nalia-radius-lg: 22px;
    --nalia-radius-md: 16px;
    --nalia-radius-sm: 14px;
    /* Bottom nav space */
    --nalia-footer-h: 110px;
    /* Helpers */
    --nalia-white: #fff;
}

/* ============================= */
/* ===== Base template ========= */
/* ============================= */
html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width:768px) {
    html {
        font-size: 16px;
    }
}

body {
    margin: 0;
    min-height: 100vh;
    background: var(--nalia-bg);
    color: var(--nalia-text);
    overflow-x: hidden; /* evita cortes raros */
}

/* Quita glow default bootstrap */
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: none !important;
}

/* ============================= */
/* ===== Layout spacing ======= */
/* ============================= */
.nalia-main {
    min-height: 100vh;
    padding-bottom: var(--nalia-footer-h) !important;
}

.nalia-page {
    min-height: calc(100vh - 120px);
    max-width: 780px;
    margin: 60px auto 120px;
    padding: 0 18px;
    padding-bottom: var(--nalia-footer-h) !important;
}

/* =========================================================
   HOME / HERO + SPLASH
   ========================================================= */

/* El hero recibe el bg desde inline style:
   style="--nalia-bg: url('/img/fondo-nalia.jpg');"
*/
.nalia-hero.nalia-intro {
    min-height: calc(100vh - var(--nalia-footer-h));
    width: 100%;
    position: relative;
    overflow: hidden;
}

/* HOME wrapper */
.nalia-home {
    position: relative;
    min-height: calc(100vh - var(--nalia-footer-h));
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 20px;
}

.nalia-home--hidden {
    opacity: 0;
    pointer-events: none;
}

.nalia-home--active {
    opacity: 1;
    pointer-events: auto;
    transition: opacity .35s ease;
}

/* Fondo foto */
/* background-position: foco en pelota/accesorios (parte baja de la imagen).
   center 80% en mobile (portrait), center 70% en desktop.
   Cuando tengas hero-mobile.png y hero-desktop.png, descomenta el bloque
   "IMÁGENES OPTIMIZADAS" y elimina el background-image de aquí. */
.nalia-bg {
    position: absolute;
    inset: 0;
    background-image: var(--nalia-bg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center 80%;
    transform: scale(1.10);
    filter: blur(10px) brightness(0.92);
    animation: bgFocus 1.6s ease forwards;
}

@media (min-width: 1024px) {
    .nalia-bg {
        background-position: center 70%;
    }

    /* Desplaza el bloque de marca ligeramente hacia arriba en desktop
       para alejarlo de la zona activa (pelota/reflejos) */
    .nalia-home {
        padding-bottom: 12vh;
    }
}

/* ── IMÁGENES OPTIMIZADAS (activar cuando existan los archivos) ────────────
   Recomendación de crop para hero-mobile.png:
   · Mantener pelota rosa y accesorios como foco central
   · Dejar ~30 % de aire oscuro en la parte superior (fondo/piso liso)
     para que el branding caiga sobre una zona sin conflicto visual
   · Formato sugerido: 750 × 1334 px (iPhone natural)

   Pasos para activar:
   1. Guarda hero-mobile.png y hero-desktop.png en /wwwroot/img/
   2. En Index.cshtml cambia el inline style del <section> a:
      style="--nalia-bg: url('/img/hero-mobile.png');"
   3. Descomenta el bloque @media (min-width: 1024px) de abajo

@media (min-width: 1024px) {
    .nalia-bg {
        background-image: url('/img/hero-desktop.png');
        background-position: center 70%;
    }
}
──────────────────────────────────────────────────────────────────────────── */

@keyframes bgFocus {
    0% {
        transform: scale(1.10);
        filter: blur(10px) brightness(0.92);
    }

    60% {
        transform: scale(1.05);
        filter: blur(4px) brightness(0.96);
    }

    100% {
        transform: scale(1.00);
        filter: blur(0px) brightness(0.98);
    }
}

/* Overlay suave (m�s c�lido, menos negro) */
.nalia-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient( circle at 50% 35%, rgba(252,241,239,.08), rgba(129,59,29,.42) );
}

/* Contenido centrado */
.nalia-content {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 520px;
    text-align: center;
    color: #fff;
}

/* Viñeta local invisible detrás del bloque de marca — sin formas visibles */
.nalia-content::before {
    content: "";
    position: absolute;
    inset: -18% -30%;
    background: radial-gradient(ellipse at center, rgba(0,0,0,.38) 0%, rgba(0,0,0,0) 70%);
    z-index: -1;
    pointer-events: none;
}

/* Logo wrap — limpio, sin cápsula */
.nalia-logo-wrap {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto 18px;
}

.nalia-logo {
    width: 340px;
    max-width: 90%;
    margin: 0 auto 22px auto;
    display: block;
    /* Tinte hueso #EDE3DA: normaliza → aclara → sepia cálido → desatura a beige */
    filter: grayscale(0.5) brightness(2.0) sepia(0.5) saturate(0.7)
            drop-shadow(0 16px 32px rgba(0,0,0,.30));
    opacity: 0.75;
}


/* Texto PILATES */
.nalia-line {
    font-size: 19px;
    font-weight: 800;
    letter-spacing: 5px;
    text-transform: uppercase;
    margin-bottom: 38px;
    color: #EDE3DA;
    /* base (desktop): sombra suave */
    text-shadow: 0 6px 22px rgba(0,0,0,0.22);
}

/* ── MOBILE: legibilidad del branding ─────────────────────────────────────
   Intervención mínima y sin formas visibles:
   · degradado lineal desde arriba (~26 % opacidad) solo donde cae el logo
   · logo en casi blanco cálido (#F7F1EA) para contrastar con el fondo
   · sombra de texto doble capa (separación próxima + halo ambiental)
   · bloque de contenido ligeramente desplazado hacia arriba
   ────────────────────────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
    /* Degradado sutil desde el borde superior — sin formas, sin bordes */
    .nalia-home::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 55%;
        background: linear-gradient(to bottom,
            rgba(0,0,0,0.26) 0%,
            rgba(0,0,0,0.10) 55%,
            rgba(0,0,0,0)    100%);
        z-index: 1;
        pointer-events: none;
    }

    /* Logo casi blanco cálido #F7F1EA: brightness alta + sepia mínimo */
    .nalia-logo {
        filter: grayscale(0.2) brightness(2.6) sepia(0.18) saturate(0.45)
                drop-shadow(0 16px 32px rgba(0,0,0,.28));
        opacity: 0.88;
    }

    /* Texto: doble capa — separación próxima + halo ambiental */
    .nalia-line {
        color: #F7F1EA;
        text-shadow: 0 1px 4px rgba(0,0,0,0.30), 0 6px 20px rgba(0,0,0,0.22);
    }

    /* Desplaza el bloque levemente hacia arriba buscando zona más limpia */
    .nalia-home {
        padding-bottom: 8vh;
    }
}

/* Reveal anims */
.nalia-reveal-logo {
    opacity: 0;
    transform: translateY(18px) scale(0.96);
    animation: logoIn 1s ease forwards;
    animation-delay: .55s;
}

@keyframes logoIn {
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.nalia-reveal-text {
    opacity: 0;
    transform: translateY(14px);
    animation: textIn .9s ease forwards;
    animation-delay: 1.1s;
}

@keyframes textIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.nalia-reveal-buttons {
    opacity: 0;
    transform: translateY(14px);
    animation: buttonsIn .9s ease forwards;
    animation-delay: 1.45s;
}

@keyframes buttonsIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Botonera Home */
.nalia-actions {
    display: grid;
    gap: 14px;
    width: min(460px, 92%);
    margin: 0 auto;
}

/* Botones glass SOLO para Home/Hero */
.nalia-btn-glass {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 56px;
    border-radius: 16px;
    font-weight: 800;
    letter-spacing: .5px;
    text-decoration: none;
    color: #fff;
    user-select: none;
    background: rgba(252,241,239,0.18);
    border: 1px solid rgba(255,255,255,0.26);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.20), inset 0 1px 0 rgba(255,255,255,0.18);
    transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
}

    .nalia-btn-glass:hover {
        transform: translateY(-1px);
        background: rgba(252,241,239,0.26);
        box-shadow: 0 14px 28px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.20);
    }

    .nalia-btn-glass:active {
        transform: translateY(0);
    }

    /* Glass buttons fix */
    .nalia-btn-glass,
    .nalia-btn-glass:link,
    .nalia-btn-glass:visited,
    .nalia-btn-glass:hover,
    .nalia-btn-glass:active,
    .nalia-btn-glass:focus {
        color: #ffffff !important;
        text-decoration: none;
        outline: none;
    }

/* ============================= */
/* ===== SPLASH ================= */
/* ============================= */
.nalia-splash {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nalia-splash-bg {
    position: absolute;
    inset: 0;
    background-image: var(--nalia-bg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center 35%;
    transform: scale(1.15);
    filter: blur(18px) brightness(0.82);
}

.nalia-splash-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient( circle at 50% 40%, rgba(252,241,239,0.10), rgba(129,59,29,0.62) );
}

.nalia-splash-content {
    position: relative;
    z-index: 2;
    text-align: center;
}

.nalia-splash-logo {
    width: 280px;
    max-width: 80vw;
    filter: drop-shadow(0 14px 28px rgba(0,0,0,.45));
}

.nalia-splash.hide {
    opacity: 0;
    transform: scale(1.02);
    transition: opacity .55s ease, transform .55s ease;
}

/* =========================================================
   BOTTOM NAV (iPhone style) � palette premium
   ========================================================= */
.nalia-bottom-nav {
    position: fixed !important;
    left: 14px !important;
    right: 14px !important;
    bottom: 14px !important;
    height: 78px !important;
    border-radius: 22px !important;
    background: rgba(252,241,239,.78) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid rgba(255,255,255,.55) !important;
    box-shadow: 0 10px 28px rgba(129,59,29,.16), 0 1px 0 rgba(255,255,255,.60) inset !important;
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    align-items: center !important;
    z-index: 99999 !important;
    padding-bottom: env(safe-area-inset-bottom) !important;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    transition: opacity .2s ease, transform .2s ease;
}

    /* Si lo animas en Home */
    .nalia-bottom-nav.is-home {
        opacity: 0;
        transform: translateY(12px);
        pointer-events: none;
    }

        .nalia-bottom-nav.is-home.show {
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }

    .nalia-bottom-nav .nav-item {
        height: 78px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 4px !important;
        text-decoration: none !important;
        color: var(--nalia-text) !important;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: .1px;
        border: none;
        background: transparent !important;
        cursor: pointer;
    }

    .nalia-bottom-nav .icon {
        font-size: 22px !important;
        line-height: 1 !important;
        opacity: .95;
        color: var(--nalia-ink);
    }

    .nalia-bottom-nav .label {
        color: rgba(129,59,29,.88);
        font-weight: 850;
    }

    .nalia-bottom-nav .nav-center {
        transform: translateY(-6px);
    }

        .nalia-bottom-nav .nav-center .icon {
            font-size: 22px;
        }

/* Icon logo (si usas imagen) */
.nav-logo-icon {
    width: 26px;
    height: auto;
    object-fit: contain;
    opacity: .92;
    filter: drop-shadow(0 8px 14px rgba(129,59,29,.18));
}

/* Hide bottom nav when menu open */
body.offcanvas-open .nalia-bottom-nav {
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
}
/* =========================================================
   BOTTOM NAV � 5 columnas (Inicio, Clases, Membres�a, Cuenta, Men�)
   ========================================================= */
.nalia-bottom-nav.nalia-bottom-nav--5 {
    grid-template-columns: repeat(5, 1fr) !important;
}

    /* Si quieres que NINGUNO �salte� hacia arriba (m�s limpio en 5) */
    .nalia-bottom-nav.nalia-bottom-nav--5 .nav-center {
        transform: none !important;
    }

/* =========================================================
   Evitar que el footer se vea �detr�s� (espacio para nav fijo)
   ========================================================= */
:root {
    --nalia-nav-h: 78px;
    --nalia-nav-gap: 14px;
}

/* deja espacio al final para que el nav no tape contenido/footer */
.nalia-main {
    padding-bottom: calc(var(--nalia-nav-h) + (var(--nalia-nav-gap) * 2) + env(safe-area-inset-bottom)) !important;
}

/* adem�s, el footer debe tener �margen� para no quedar bajo la barra */
.nalia-footer {
    margin-bottom: calc(var(--nalia-nav-h) + var(--nalia-nav-gap) + env(safe-area-inset-bottom)) !important;
}
.nalia-bottom-nav.nalia-bottom-nav--5 .nav-item:nth-child(3) .icon {
    transform: scale(1.06);
}

/* =========================================================
   SEO ABOUT SECTION (Home — debajo del hero)
   ========================================================= */
.nalia-about {
    padding: 56px 0 64px;
    background: var(--nalia-bg);
}

.nalia-about__title {
    font-size: 1.45rem;
    font-weight: 800;
    color: var(--nalia-ink);
    margin-bottom: 14px;
}

.nalia-about__title--sm {
    font-size: 1.2rem;
}

.nalia-about__lead {
    color: var(--nalia-text-2);
    line-height: 1.7;
    max-width: 580px;
    margin: 0 auto;
}

.nalia-about__icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: var(--nalia-accent-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: var(--nalia-ink);
}

.nalia-about__card-title {
    font-size: 1rem;
    font-weight: 750;
    color: var(--nalia-ink);
    margin-bottom: 8px;
}

.nalia-about__card-text {
    font-size: .9rem;
    color: var(--nalia-text-2);
    line-height: 1.65;
    margin: 0;
}

.nalia-about__location {
    border-top: 1px solid var(--nalia-border-2);
    padding-top: 40px;
    margin-top: 8px;
}

.nalia-about__cta {
    display: inline-block;
    margin-top: 20px;
    color: var(--nalia-ink);
    font-weight: 700;
    font-size: .9rem;
    text-decoration: none;
    border-bottom: 1.5px solid var(--nalia-beige);
    padding-bottom: 2px;
    transition: border-color .15s, color .15s;
}

.nalia-about__cta:hover {
    color: var(--nalia-coffee);
    border-color: var(--nalia-coffee);
}

/* =========================================================
   AUTH (Login/Register)� palette
   ========================================================= */
.nalia-auth {
    position: relative;
    min-height: calc(100vh - var(--nalia-footer-h));
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 26px 16px;
    overflow: hidden;
    padding-bottom: calc(var(--nalia-footer-h) + env(safe-area-inset-bottom));
}

    /* Evita m�rgenes raros en Identity */
    .nalia-auth .container {
        padding-left: 16px;
        padding-right: 16px;
    }

.nalia-auth-bg {
    position: absolute;
    inset: 0;
    background-image: var(--nalia-bg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center 35%;
    transform: scale(1.06);
    filter: blur(12px) brightness(0.96);
}

.nalia-auth-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient( circle at 50% 30%, rgba(252,241,239,0.80), rgba(252,241,239,0.96) );
}

.nalia-auth-card {
    position: relative;
    width: min(520px, 92vw);
    border-radius: var(--nalia-radius-lg);
    background: rgba(255,255,255,0.84);
    border: 1px solid rgba(129,59,29,.10);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: var(--nalia-shadow-md);
    padding: 22px 20px 18px;
    text-align: center;
    z-index: 2;
}

.nalia-auth-icon {
    width: 46px;
    height: 46px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    margin: 0 auto 10px;
    background: rgba(252,241,239,.95);
    border: 1px solid rgba(129,59,29,.10);
    box-shadow: 0 10px 24px rgba(129,59,29,.10);
}

    .nalia-auth-icon i {
        font-size: 18px;
        opacity: .9;
        color: var(--nalia-ink);
    }

.nalia-auth-title {
    font-size: 22px;
    font-weight: 950;
    margin: 4px 0 2px;
    color: var(--nalia-text);
}

.nalia-auth-sub {
    font-size: 13px;
    color: var(--nalia-text-3);
    margin: 0 0 16px;
}

.nalia-auth-form {
    text-align: left;
}

.nalia-field {
    margin-bottom: 14px;
}

.nalia-label {
    font-size: 12px;
    font-weight: 900;
    color: var(--nalia-text-2);
    margin-bottom: 6px;
    display: block;
}

/* AUTH input row */
.nalia-inputrow {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--nalia-radius-sm);
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(129,59,29,.14);
}

    .nalia-inputrow:focus-within {
        border-color: rgba(168,124,105,.55);
        box-shadow: 0 0 0 3px var(--nalia-accent-soft);
    }

    .nalia-inputrow i {
        opacity: .70;
        color: var(--nalia-ink);
    }

    .nalia-inputrow .form-control {
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        background: transparent !important;
        font-size: 14px;
        color: var(--nalia-text);
    }

.nalia-pass {
    position: relative;
}

.nalia-eye {
    border: none;
    background: transparent;
    padding: 6px 8px;
    border-radius: 10px;
    cursor: pointer;
    opacity: .85;
    color: var(--nalia-ink);
}

    .nalia-eye:hover {
        background: rgba(129,59,29,.05);
    }

.nalia-check {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    font-size: 13px;
    color: var(--nalia-text-2);
}

/* Links */
.nalia-link {
    font-size: 13px;
    text-decoration: none;
    color: var(--nalia-accent);
    font-weight: 900;
}

    .nalia-link:hover {
        text-decoration: underline;
        color: var(--nalia-accent-hover);
    }

/* Bot�n principal auth: caf� profundo (no negro) */
.nalia-btn-auth {
    width: 100%;
    border: none;
    border-radius: var(--nalia-radius-sm);
    padding: 13px 14px;
    background: var(--nalia-ink);
    color: #fff;
    font-weight: 950;
    letter-spacing: .3px;
    box-shadow: 0 18px 40px rgba(129,59,29,.22);
    transition: transform .15s ease, box-shadow .15s ease, filter .2s ease;
}

    .nalia-btn-auth:hover {
        transform: translateY(-1px);
        box-shadow: 0 22px 55px rgba(129,59,29,.26);
        filter: brightness(1.03);
    }

    .nalia-btn-auth:active {
        transform: translateY(0);
    }

.nalia-auth-note {
    margin-top: 10px;
    font-size: 12px;
    color: var(--nalia-text-3);
    text-align: center;
}

    .nalia-auth-note i {
        margin-right: 6px;
    }

.nalia-auth-bottom {
    margin-top: 12px;
    font-size: 13px;
    color: var(--nalia-text-2);
    text-align: center;
}

.nalia-link-strong {
    color: var(--nalia-text);
    font-weight: 950;
    text-decoration: underline;
}

.nalia-back {
    display: inline-block;
    margin-top: 14px;
    font-size: 13px;
    text-decoration: none;
    color: var(--nalia-text-2);
}

/* =========================================================
   ADMIN / UI � Cards, forms, buttons
   ========================================================= */
.nalia-head {
    display: flex;
    gap: 14px;
    align-items: center;
}

.nalia-head-icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: rgba(229,208,199,.55);
    border: 1px solid rgba(129,59,29,.10);
    color: var(--nalia-ink);
}

.nalia-head-title {
    font-size: 1.35rem;
    font-weight: 950;
    color: var(--nalia-ink);
}

.nalia-head-sub {
    color: var(--nalia-text-3);
}

.nalia-card {
    border: 1px solid var(--nalia-border-2);
    border-radius: 18px;
    background: rgba(255,255,255,.92);
    box-shadow: var(--nalia-shadow-sm);
}

/* Admin input con icono absoluto */
.nalia-input {
    position: relative;
}

    .nalia-input > i {
        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        color: rgba(129,59,29,.70);
        pointer-events: none;
    }

.nalia-textarea > i {
    top: 18px;
    transform: none;
}

.nalia-input .form-control {
    padding-left: 40px;
    border-radius: var(--nalia-radius-sm);
    border: 1px solid rgba(129,59,29,.16);
    background: rgba(255,255,255,.96);
    color: var(--nalia-text);
}

    .nalia-input .form-control:focus {
        border-color: rgba(168,124,105,.55);
        box-shadow: 0 0 0 .2rem rgba(168,124,105,.16);
    }

.nalia-actions-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* Buttons (UI interna) */
.nalia-btn {
    border-radius: var(--nalia-radius-sm);
    padding: 10px 14px;
    font-weight: 950;
    border: 1px solid transparent;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Dark/premium = nude -> coffee */
.nalia-btn--dark {
    background: rgba(229,208,199,.70);
    border-color: rgba(129,59,29,.18);
    color: var(--nalia-ink);
}

    .nalia-btn--dark:hover {
        background: rgba(201,168,155,.70);
        color: var(--nalia-ink);
    }

.nalia-btn--outline {
    background: #fff;
    border-color: rgba(129,59,29,.18);
    color: var(--nalia-text);
}

    .nalia-btn--outline:hover {
        background: rgba(252,241,239,.55);
        color: var(--nalia-text);
    }

/* Ghost button */
.nalia-btn-ghost {
    border-radius: var(--nalia-radius-sm);
    padding: 10px 16px;
    border: 1px solid rgba(129,59,29,.22);
    background: transparent;
    color: var(--nalia-text);
    font-weight: 900;
    text-decoration: none;
}

    .nalia-btn-ghost:hover {
        background: rgba(229,208,199,.28);
        color: var(--nalia-text);
    }

/* =========================================================
   OFFCANVAS MENU � palette
   ========================================================= */
.nalia-oc {
    width: 340px;
    border: none;
    box-shadow: var(--nalia-shadow-lg);
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    overflow: hidden;
}

.nalia-oc-header,
.nalia-oc-body {
    background: rgba(252,241,239,.96);
}

.nalia-oc-header {
    padding: 14px 14px;
    border-bottom: 1px solid rgba(129,59,29,.10);
}

.nalia-oc-badge {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.75);
    border: 1px solid rgba(129,59,29,.12);
    color: var(--nalia-ink);
}

.nalia-oc-close {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(129,59,29,.12);
    background: rgba(255,255,255,.68);
    color: var(--nalia-ink);
}

    .nalia-oc-close:hover {
        background: rgba(255,255,255,.92);
    }

.nalia-oc-body {
    padding: 12px;
}

.nalia-oc-section {
    background: rgba(255,255,255,.70);
    border: 1px solid rgba(129,59,29,.10);
    border-radius: 18px;
    padding: 10px;
    margin-bottom: 12px;
}

/* Chip */
.nalia-oc-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(129,59,29,.12);
    color: var(--nalia-ink);
    font-weight: 950;
    font-size: .80rem;
    margin-bottom: 10px;
}

    .nalia-oc-chip i {
        color: rgba(129,59,29,.78);
    }

a.nalia-oc-item {
    text-decoration: none !important;
    color: var(--nalia-text) !important;
}

.nalia-oc-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 12px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(129,59,29,.12);
    margin-bottom: 10px;
    transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}

    .nalia-oc-item:hover {
        transform: translateY(-1px);
        box-shadow: 0 14px 22px rgba(129,59,29,.10);
        background: #fff;
    }

    .nalia-oc-item .left {
        display: flex;
        align-items: center;
        gap: 10px;
        font-weight: 950;
        color: var(--nalia-ink);
    }

        .nalia-oc-item .left i {
            width: 30px;
            text-align: center;
            opacity: .90;
            color: var(--nalia-ink);
        }

    .nalia-oc-item > i {
        color: rgba(129,59,29,.45);
    }

.nalia-oc-divider {
    height: 1px;
    background: rgba(129,59,29,.16);
    margin: 10px 0 12px;
}

/* Subsection group label (admin menu) */
.nalia-oc-group {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .62rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: rgba(129,59,29,.45);
    padding: 10px 2px 5px;
}

.nalia-oc-group::after {
    content: '';
    flex: 1;
    height: 1px;
    background: rgba(129,59,29,.12);
}

/* Logout rojo (se queda) */
.nalia-oc-logout {
    width: 100%;
    border-radius: 14px;
    padding: 12px 12px;
    border: 1px solid rgba(220,53,69,.35);
    background: rgba(220,53,69,.06);
    color: #dc3545;
    font-weight: 950;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

    .nalia-oc-logout:hover {
        background: rgba(220,53,69,.10);
    }

/* =========================================================
   PROFILE � palette
   ========================================================= */
.nalia-profile {
    background: rgba(255,255,255,.92);
    border-radius: 24px;
    border: 1px solid rgba(129,59,29,.10);
    box-shadow: 0 20px 50px rgba(129,59,29,.10);
    padding: 28px;
}

.nalia-profile__top {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.nalia-profile__avatar {
    width: 52px;
    height: 52px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-weight: 950;
    font-size: 1.1rem;
    background: rgba(229,208,199,.80);
    color: var(--nalia-ink);
    border: 1px solid rgba(129,59,29,.12);
    box-shadow: 0 10px 22px rgba(129,59,29,.10);
}

.nalia-profile__kicker {
    font-size: .78rem;
    color: var(--nalia-text-3);
    font-weight: 800;
}

.nalia-profile__title {
    font-weight: 950;
    letter-spacing: -.02em;
    font-size: 1.6rem;
    line-height: 1.1;
    color: var(--nalia-ink);
}

.nalia-profile__meta {
    margin-top: 10px;
}

.nalia-profile__name {
    font-weight: 950;
    color: var(--nalia-ink);
}

.nalia-profile__sub {
    color: var(--nalia-text-3);
    font-weight: 750;
    font-size: .92rem;
}

.nalia-divider {
    height: 1px;
    background: rgba(129,59,29,.14);
    margin: 14px 0;
}

/* Input-like cards */
.nalia-inputcard {
    background: rgba(255,255,255,.80);
    border: 1px solid rgba(129,59,29,.12);
    border-radius: 16px;
    padding: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.nalia-inputcard__ic {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: rgba(229,208,199,.38);
    border: 1px solid rgba(129,59,29,.10);
    color: var(--nalia-ink);
}

.nalia-inputcard__label {
    font-size: .78rem;
    color: var(--nalia-text-3);
    font-weight: 800;
}

.nalia-inputcard__value {
    font-weight: 950;
    color: var(--nalia-ink);
}

/* Tags / Pills */
.nalia-tag {
    font-size: .75rem;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(229,208,199,.35);
    border: 1px solid rgba(129,59,29,.14);
    font-weight: 900;
    color: rgba(129,59,29,.82);
    white-space: nowrap;
}

.nalia-tag--ok {
    background: rgba(168,124,105,.16);
    border-color: rgba(168,124,105,.24);
    color: rgba(129,59,29,.90);
}

.nalia-tag--muted {
    background: rgba(255,255,255,.70);
}

.nalia-tag--danger {
    background: rgba(220,53,69,.10);
    border-color: rgba(220,53,69,.22);
    color: rgba(185,28,28,.90);
}

/* Membres�a card */
.nalia-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.nalia-section-title {
    font-weight: 950;
    margin: 0;
    color: var(--nalia-ink);
}

.nalia-membershipcard {
    background: rgba(255,255,255,.82);
    border: 1px solid rgba(129,59,29,.12);
    border-radius: 16px;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.nalia-membershipcard__name {
    font-weight: 950;
    color: var(--nalia-ink);
}

.nalia-membershipcard__sub {
    color: var(--nalia-text-3);
    font-weight: 750;
}

.nalia-hint {
    color: var(--nalia-text-3);
    font-weight: 700;
    font-size: .92rem;
}

/* ===== Credits card (profile) ===== */
.nalia-credits-card {
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(129,59,29,.12);
    border-radius: 20px;
    padding: 20px 20px 16px;
    position: relative;
    overflow: hidden;
}
.nalia-credits-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--nalia-nude), var(--nalia-coffee));
    border-radius: 20px 20px 0 0;
}
.nalia-credits-card__label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .73rem;
    font-weight: 900;
    color: var(--nalia-text-3);
    text-transform: uppercase;
    letter-spacing: .07em;
    margin-bottom: 6px;
}
.nalia-credits-card__total {
    font-size: 3rem;
    font-weight: 950;
    color: var(--nalia-ink);
    line-height: 1;
    letter-spacing: -.02em;
    margin-bottom: 16px;
}
.nalia-credits-card__groups {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 12px;
}
.nalia-credit-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 8px;
    padding: 9px 14px;
    border-radius: 12px;
    background: rgba(229,208,199,.22);
    border: 1px solid rgba(129,59,29,.08);
    font-size: .86rem;
    font-weight: 700;
    color: var(--nalia-text-2);
    transition: background .15s;
}
.nalia-credit-row--urgent {
    background: rgba(210,140,50,.10);
    border-color: rgba(200,120,40,.22);
}
.nalia-credit-row__plan {
    width: 100%;
    font-size: .74rem;
    font-weight: 600;
    color: var(--nalia-text-3);
    letter-spacing: .04em;
    text-transform: uppercase;
}
.nalia-credit-row__amount {
    font-weight: 950;
    color: var(--nalia-ink);
}
.nalia-credit-row__sep {
    color: var(--nalia-text-3);
    font-weight: 400;
}
.nalia-credit-row__date {
    flex: 1;
    min-width: 0;
}
.nalia-credit-badge {
    font-size: .68rem;
    font-weight: 900;
    padding: 2px 8px;
    border-radius: 999px;
    white-space: nowrap;
    letter-spacing: .02em;
}
.nalia-credit-badge--first {
    background: rgba(168,124,105,.16);
    color: var(--nalia-coffee);
    border: 1px solid rgba(168,124,105,.26);
}
.nalia-credit-badge--urgent {
    background: rgba(210,140,50,.15);
    color: #8a5010;
    border: 1px solid rgba(200,120,40,.28);
}
.nalia-credits-card__legend {
    font-size: .73rem;
    font-weight: 700;
    color: var(--nalia-text-3);
    font-style: italic;
    padding-top: 10px;
    border-top: 1px solid rgba(129,59,29,.08);
}

/* ===== Admin check-in: roster action buttons ===== */
.ck-btn-absent,
.ck-btn-undo {
    border-radius: 8px;
    padding: 4px 8px;
    font-size: .78rem;
    cursor: pointer;
    transition: background .15s, border-color .15s;
    line-height: 1.4;
}
.ck-btn-absent {
    border: 1px solid rgba(220,53,69,.35);
    background: transparent;
    color: #dc3545;
}
.ck-btn-absent:hover { background: rgba(220,53,69,.08); }

.ck-btn-undo {
    border: 1px solid rgba(108,117,125,.3);
    background: transparent;
    color: #6c757d;
}
.ck-btn-undo:hover { background: rgba(108,117,125,.08); }

/* ===== Chips row ===== */
.nalia-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* Base chip */
.nalia-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.86);
    border: 1px solid rgba(129,59,29,.12);
    color: var(--nalia-ink);
    font-weight: 850;
}

/* Credits: caf� rosado */
.nalia-chip--credits i {
    color: var(--nalia-coffee);
}

.nalia-chip--credits strong {
    color: var(--nalia-ink);
}

/* Verde ok */
.nalia-chip--ok i,
.nalia-chip--ok strong {
    color: #2fbf71;
}

/* Rojo bad */
.nalia-chip--bad i,
.nalia-chip--bad strong {
    color: #e5533d;
}

.nalia-link-clean {
    color: var(--nalia-ink);
    text-decoration: none;
    font-weight: 600;
}
.nalia-link-clean:hover {
    text-decoration: none;
    opacity: .85;
}

/* =========================================================
   MEMBERSHIP CARDS � tones by duration (aligned to palette)
   ========================================================= */

/* Tonos por duraci�n */
:root {
    --tone-one: #813B1D; /* individual (caf� profundo) */
    --tone-month: #E5D0C7; /* 1 mes (nude rosado) */
    --tone-six: #C9A89B; /* 6 meses (beige rosado) */
    --tone-year: #A87C69; /* 1 a�o (caf� rosado) */
}

/* Base card */
.nalia-plan-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 18px;
    border-radius: 24px;
    border: 1px solid rgba(129,59,29,.12);
    background: rgba(255,255,255,.94);
    box-shadow: 0 16px 44px rgba(129,59,29,.10);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    overflow: hidden;
}

    .nalia-plan-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 22px 60px rgba(129,59,29,.14);
        border-color: rgba(129,59,29,.16);
    }

    /* Cada tono define un accent + fondo suave */
    .nalia-plan-card.tone-one {
        --accent: var(--tone-one);
        --accentSoft: rgba(129,59,29,.12);
    }

    .nalia-plan-card.tone-month {
        --accent: var(--tone-month);
        --accentSoft: rgba(229,208,199,.30);
    }

    .nalia-plan-card.tone-six {
        --accent: var(--tone-six);
        --accentSoft: rgba(201,168,155,.26);
    }

    .nalia-plan-card.tone-year {
        --accent: var(--tone-year);
        --accentSoft: rgba(168,124,105,.22);
    }

    /* Franja superior sutil */
    .nalia-plan-card::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        height: 10px;
        background: linear-gradient(90deg, rgba(0,0,0,0), var(--accentSoft), rgba(0,0,0,0));
        opacity: 1;
    }

/* Top */
.nalia-plan-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.nalia-plan-name {
    font-weight: 950;
    font-size: 1.05rem;
    letter-spacing: -.01em;
    color: var(--nalia-ink);
}

/* Precio */
.nalia-plan-price {
    margin-top: 2px;
    margin-bottom: 10px;
    font-weight: 950;
    font-size: 2.15rem;
    letter-spacing: -.03em;
    line-height: 1.05;
    color: var(--nalia-ink);
}

.nalia-plan-currency {
    font-size: 1rem;
    opacity: .75;
    vertical-align: super;
    margin-right: 2px;
}

.nalia-plan-period {
    font-size: .95rem;
    color: var(--nalia-text-3);
    font-weight: 750;
    margin-left: 6px;
}

/* Meta */
.nalia-plan-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.nalia-plan-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 14px;
    background: rgba(252,241,239,.70);
    border: 1px solid rgba(129,59,29,.10);
    color: var(--nalia-ink);
    font-weight: 850;
    font-size: .9rem;
}

    .nalia-plan-meta-item i {
        color: rgba(129,59,29,.70);
        opacity: .95;
    }

/* Descripci�n */
.nalia-plan-desc {
    margin-top: 6px;
    color: var(--nalia-text-2);
    font-weight: 650;
    font-size: .92rem;
}

/* Acciones */
.nalia-plan-actions {
    margin-top: 14px;
    display: grid;
    gap: 10px;
}

/* Bot�n por color del plan (usa --accent / --accentSoft) */
.nalia-btn-plan {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    padding: 12px 14px;
    font-weight: 950;
    letter-spacing: .2px;
    text-decoration: none !important;
    border: 1px solid rgba(129,59,29,.14);
    background: linear-gradient(180deg, rgba(129,59,29,.94), rgba(129,59,29,.86) );
    color: #fff !important;
    box-shadow: 0 18px 44px rgba(129,59,29,.16);
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

/* Si el plan tiene tono, el bot�n se �tinta� bonito */
.nalia-plan-card.tone-month .nalia-btn-plan,
.nalia-plan-card.tone-six .nalia-btn-plan,
.nalia-plan-card.tone-year .nalia-btn-plan {
    background: linear-gradient(180deg, rgba(168,124,105,.92), rgba(129,59,29,.84) );
}

/* Individual m�s intenso */
.nalia-plan-card.tone-one .nalia-btn-plan {
    background: linear-gradient(180deg, rgba(129,59,29,.98), rgba(88,33,18,.92) );
}

.nalia-btn-plan:hover {
    transform: translateY(-1px);
    filter: brightness(1.05);
    box-shadow: 0 22px 56px rgba(129,59,29,.20);
}

.nalia-btn-plan:active {
    transform: translateY(0);
    filter: brightness(0.98);
}

a.nalia-btn-plan {
    width: 100%;
}

/* Pill recomendado */
.nalia-plan-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(229,208,199,.70);
    border: 1px solid rgba(129,59,29,.18);
    color: var(--nalia-ink);
    font-weight: 950;
    font-size: .78rem;
}

/* Recomendado: glow c�lido */
.nalia-plan-card.is-recommended {
    box-shadow: 0 26px 80px rgba(168,124,105,.18);
    border-color: rgba(168,124,105,.22);
}

    .nalia-plan-card.is-recommended::after {
        content: "";
        position: absolute;
        inset: -2px;
        border-radius: 26px;
        pointer-events: none;
        box-shadow: 0 0 0 1px rgba(168,124,105,.16), 0 18px 60px rgba(168,124,105,.16);
        opacity: .95;
    }
:root {
    --tone-trial: #FCF1EF; /* base */
}

/* Tarjeta de prueba */
.nalia-plan-card.tone-trial {
    --accent: #A87C69; /* caf� rosado */
    --accentSoft: rgba(229,208,199,.45); /* nude suave */
}

/* �Gratis� se ve m�s cute */
.nalia-plan-card.is-trial .nalia-plan-pill {
    background: rgba(229,208,199,.75);
    border-color: rgba(168,124,105,.22);
}
/* ============================= */
/* CTA UNIFICADO (todos iguales) */
/* ============================= */
.nalia-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 14px;
    padding: 12px 14px;
    background: var(--nalia-ink); /* #813B1D */
    color: #fff !important;
    font-weight: 950;
    letter-spacing: .2px;
    text-decoration: none !important;
    box-shadow: 0 16px 34px rgba(129,59,29,.20);
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

    .nalia-btn-primary:hover {
        transform: translateY(-1px);
        filter: brightness(1.05);
        box-shadow: 0 20px 44px rgba(129,59,29,.24);
    }

    .nalia-btn-primary:active {
        transform: translateY(0);
        filter: brightness(.98);
    }

/* ============================= */
/* RECOMENDADO: el que resalta   */
/* ============================= */
.nalia-plan-card.is-recommended {
    border-color: rgba(168,124,105,.34);
    box-shadow: 0 26px 85px rgba(168,124,105,.22);
}

    .nalia-plan-card.is-recommended::after {
        content: "";
        position: absolute;
        inset: -2px;
        border-radius: 26px;
        pointer-events: none;
        box-shadow: 0 0 0 1px rgba(168,124,105,.18), 0 22px 70px rgba(168,124,105,.18);
        opacity: .95;
    }

    /* Badge recomendado m�s notorio */
    .nalia-plan-card.is-recommended .nalia-plan-pill {
        background: rgba(168,124,105,.18);
        border-color: rgba(168,124,105,.28);
        color: var(--nalia-ink);
        font-weight: 950;
    }

    /* Bot�n del recomendado con toque premium (sin cambiar el color) */
    .nalia-plan-card.is-recommended .nalia-btn-primary {
        box-shadow: 0 20px 52px rgba(129,59,29,.26);
    }
.nalia-bottom-nav--4 {
    grid-template-columns: repeat(4, 1fr) !important;
}
/* ============================= */
/* NUEVA PALETA � ROSAS SUAVES  */
/* ============================= */

:root {
    --rose-cream: #F3E7E4;
    --rose-conquista: #B76E79;
    --rose-conquista-deep: #9F5A64;
}

/* Tarjetas */
.nalia-plan-card {
    background: var(--rose-cream) !important;
    border: 1px solid rgba(183,110,121,.20);
    box-shadow: 0 18px 45px rgba(183,110,121,.12);
}

/* Badge recomendado */
.nalia-plan-pill {
    background: rgba(183,110,121,.15);
    border-color: rgba(183,110,121,.30);
    color: #6E3F47;
}

/* Bot�n principal rosa conquista */
.nalia-btn-primary {
    background: var(--rose-conquista) !important;
    color: #fff !important;
    box-shadow: 0 16px 34px rgba(183,110,121,.30);
}

    .nalia-btn-primary:hover {
        background: var(--rose-conquista-deep) !important;
        box-shadow: 0 20px 44px rgba(159,90,100,.35);
    }

/* Meta calendario m�s delicado */
.nalia-plan-meta-item {
    background: rgba(255,255,255,.60);
    border: 1px solid rgba(183,110,121,.25);
}
.nalia-plans-sep {
    width: 100%;
    border-radius: 18px;
    padding: 14px 16px;
    text-align: center;
    font-weight: 950;
    letter-spacing: .2px;
    color: rgba(0,0,0,.65);
    background: var(--rose-cream);
    border: 1px solid rgba(183,110,121,.20);
    box-shadow: 0 14px 35px rgba(183,110,121,.10);
}
/* ============================= */
/* Center content inside cards   */
/* ============================= */

.nalia-plan-card {
    text-align: center;
}

/* Top (t�tulo + pill) centrados */
.nalia-plan-top {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

/* Subtitle del paquete centrado */
.nalia-plan-subtitle {
    margin-top: 4px;
    font-weight: 900;
    opacity: .9;
}

/* Precio centrado y m�s "bloque" */
.nalia-plan-price {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 6px;
}

/* Meta centrado */
.nalia-plan-meta {
    display: flex;
    justify-content: center;
}

/* La pastillita del calendario centrada */
.nalia-plan-meta-item {
    justify-content: center;
}

/* (Opcional) que el pill recomendado no se vaya a esquina */
.nalia-plan-pill {
    align-self: center;
}
/* ============================= */
/* Elegant thin typography cards */
/* ============================= */

.nalia-plan-card {
    text-align: center;
}

/* T�tulo del plan */
.nalia-plan-name {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    font-size: 1.45rem;
    letter-spacing: .5px;
    color: #8B4A2F;
}

/* Subt�tulo (12 clases, etc) */
.nalia-plan-subtitle {
    font-family: 'Playfair Display', serif;
    font-weight: 300;
    font-size: 1.05rem;
    letter-spacing: .6px;
    margin-top: 4px;
}

/* Precio principal */
.nalia-plan-price {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    font-size: 2.2rem;
    letter-spacing: .5px;
    margin-top: 14px;
    margin-bottom: 18px;
}

/* S�mbolo $ m�s fino */
.nalia-plan-currency {
    font-weight: 300;
    font-size: 1.4rem;
    margin-right: 4px;
}

/* /mes, /a�o */
.nalia-plan-period {
    font-family: 'Playfair Display', serif;
    font-weight: 300;
    font-size: .9rem;
    letter-spacing: .4px;
    opacity: .8;
}

/* Quitar peso grueso si hay bold heredado */
.nalia-plan-card strong,
.nalia-plan-card b {
    font-weight: 400;
}
/* Empuja contenido (y footer) arriba del bottom-nav */
.nalia-main {
    padding-bottom: 150px; /* ajusta si cambias el alto del nav */
}

/* Bottom nav 5 items */
.nalia-bottom-nav--5 {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
}

/* Asegura que el nav tape lo que hay detr�s (adi�s �se ve el footer atr�s�) */
.nalia-bottom-nav {
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: 0 10px 25px rgba(0,0,0,.08);
}

/* Footer */
.nalia-footer {
    padding: 24px 0 26px;
    margin-top: 30px;
}

.nalia-footer-inner {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
}

.nalia-footer-brand {
    font-weight: 700;
    letter-spacing: .06em;
}

.nalia-footer-sub {
    opacity: .75;
    font-size: 14px;
}

.nalia-footer-dezlen {
    font-size: 14px;
    opacity: .85;
    text-align: right;
}

.nalia-footer-legal {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    opacity: .70;
    justify-content: flex-end;
    margin-bottom: 4px;
}

.nalia-footer-sep {
    color: var(--nalia-text-3);
}

.nalia-footer-copy {
    font-size: 13px;
    opacity: .65;
    text-align: right;
    margin-top: 6px;
}

/* ── Footer mobile ── */
@media (max-width: 768px) {
    .nalia-footer {
        padding: 28px 0 20px;
    }

    .nalia-footer-inner {
        flex-direction: column;
        align-items: center;
        gap: 20px;
        text-align: center;
    }

    /* Bloque izquierdo: marca centrada */
    .nalia-footer-left {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 2px;
    }

    .nalia-footer-brand {
        font-size: .95rem;
    }

    .nalia-footer-sub {
        font-size: 13px;
    }

    /* Bloque derecho: todo centrado en columna */
    .nalia-footer-right {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        width: 100%;
    }

    .nalia-footer-dezlen {
        justify-content: center;
        text-align: center;
        font-size: 13px;
    }

    /* Logo Dezlen más pequeño en mobile */
    .nalia-dezlen-logo {
        height: 18px;
    }

    .nalia-footer-legal {
        justify-content: center;
        margin-bottom: 0;
    }

    .nalia-footer-copy {
        text-align: center;
        margin-top: 0;
        font-size: 12px;
    }
}
.nalia-bottom-nav--5 {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}

/* Inicial circular en bottom nav */
.nalia-bottom-nav .nav-initial {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-size: 13px;
    letter-spacing: .2px;
    color: rgba(129,59,29,.95);
    background: rgba(255,255,255,.55);
    border: 1px solid rgba(129,59,29,.18);
    box-shadow: 0 6px 16px rgba(129,59,29,.12);
}
.nalia-mats-modal {
    border-radius: 24px;
    border: 1px solid rgba(129,59,29,.1);
    box-shadow: 0 24px 80px rgba(129,59,29,.18), 0 4px 20px rgba(0,0,0,.08);
    overflow: hidden;
}

/* Cancel modal: constrained width, editorial feel */
#cancelModal .modal-dialog {
    max-width: 360px;
}

.nalia-mats-wrap {
    border-radius: 18px;
    background: rgba(255,255,255,.65);
    border: 1px solid rgba(0,0,0,.06);
    padding: 14px;
}

.nalia-mats-grid {
    display: grid;
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(7, 52px);
    gap: 12px;
    grid-template-areas:
        ".   t10  t9  t8  t7  t6  t5  t4  ."
        ".   t10  t9  t8  t7  t6  t5  t4  ."
        ".   .   .    .   .   .   .   .   ."
        "l11 l11 .    .   .   .   .   t3  t3"
        "l12 l12 .    .   .   .   .   r2  r2"
        "l13 l13 .    .   .   .   .   r1  r1"
        "l14 l14 .    .   .   .   .   .   ."
        
}

.mat {
    width: 100%;
    height: 100%;
    border-radius: 14px;
    border: 1px solid rgba(0,0,0,.08);
    background: #ECECEC; /* gris libre */
    color: rgba(0,0,0,.70);
    font-weight: 700;
    display: grid;
    place-items: center;
    transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}

    .mat:hover {
        transform: translateY(-1px);
        box-shadow: 0 10px 18px rgba(0,0,0,.10);
    }

    .mat.is-occupied {
        background: #F2A7B7; /* rosa ocupado */
        color: rgba(0,0,0,.55);
        cursor: not-allowed;
        box-shadow: none;
        transform: none;
        opacity: .95;
    }

    .mat.is-selected {
        outline: 3px solid rgba(0,0,0,.12);
        background: #D9D9D9;
    }

.nalia-btn-confirm {
    border-radius: 14px;
    padding: 10px 16px;
    border: 1px solid rgba(0,0,0,.10);
    background: rgba(0,0,0,.90);
    color: #fff;
    font-weight: 700;
}

    .nalia-btn-confirm:disabled {
        opacity: .45;
        cursor: not-allowed;
    }
/* Modal siempre por encima del bottom nav */
.modal-backdrop {
    z-index: 200000 !important;
}

.modal {
    z-index: 200010 !important;
}

/* Cuando haya modal abierto, ocultar bottom nav */
body.modal-open .nalia-bottom-nav {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(20px) !important;
}
/* ============================= */
/* ===== MemberCode Premium ==== */
/* ============================= */

.nalia-membercode {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 22px;
    border-radius: 18px;
    background: linear-gradient(135deg, #f7e6e1, #f3d6ce);
    box-shadow: 0 8px 20px rgba(129,59,29,.08);
    border: 1px solid rgba(255,255,255,.6);
}

.nalia-membercode__left {
    display: flex;
    align-items: center;
    gap: 14px;
}

.nalia-membercode__icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: rgba(129,59,29,.08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #813b1d;
}

.nalia-membercode__label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .08em;
    opacity: .7;
}

.nalia-membercode__value {
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 2px;
    margin-top: 4px;
    color: #813b1d;
}

.nalia-membercode__empty {
    font-size: 16px;
    margin-top: 4px;
    opacity: .5;
}

.nalia-membercode__badge {
    padding: 6px 12px;
    font-size: 11px;
    border-radius: 999px;
    background: rgba(129,59,29,.12);
    color: #813b1d;
    font-weight: 500;
    letter-spacing: .05em;
}
/* ============================= */
/* ===== Tipograf�a base ======= */
/* ============================= */

body {
    font-weight: 400;
}

/* Encabezados */
h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
}

/* T�tulos personalizados Nalia */
.nalia-head-title,
.nalia-card-title,
.nalia-section-title {
    font-weight: 700;
}

/* Texto normal */
.nalia-head-sub,
.nalia-card-text,
.nalia-meta,
.nalia-description {
    font-weight: 400;
}
/* =========================================================
   NALIA � Typography Pass (solo encabezados bold)
   Pegar al FINAL del site.css
   ========================================================= */

/* Base */
body {
    font-weight: 400;
}

/* Encabezados reales */
h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
}

/* Header de secci�n (tus �t�tulos grandes�) */
.nalia-head-title,
.nalia-profile__title,
.nalia-section-title {
    font-weight: 700 !important;
}

/* Subt�tulos / texto auxiliar */
.nalia-head-sub,
.nalia-profile__kicker,
.nalia-profile__sub,
.nalia-hint,
.nalia-plan-desc {
    font-weight: 400 !important;
}

/* ============================= */
/* Membres�as: jerarqu�a ligera  */
/* ============================= */

/* T�TULO del plan = el �nico �bold� dentro de la tarjeta */
.nalia-plan-name {
    font-weight: 700 !important; /* antes lo dejaste en 400, aqu� lo ponemos bold */
}

/* Subt�tulo (Paquete de X clases / etc) ligero */
.nalia-plan-subtitle {
    font-weight: 400 !important;
}

/* Precio: elegante, no pesado */
.nalia-plan-price {
    font-weight: 400 !important;
}

.nalia-plan-currency {
    font-weight: 300 !important;
}

.nalia-plan-period {
    font-weight: 300 !important;
}

/* Pastillas / badges */
.nalia-plan-pill,
.nalia-tag,
.nalia-chip,
.nalia-plan-meta-item {
    font-weight: 500 !important;
}

/* Botones: semibold, no ultra bold */
.nalia-btn-primary,
.nalia-btn-plan,
.nalia-btn,
.nalia-btn-ghost,
.nalia-btn-auth {
    font-weight: 600 !important;
}

/* ============================= */
/* Men� + bottom nav m�s ligero  */
/* ============================= */

.nalia-bottom-nav .nav-item {
    font-weight: 500 !important;
}

.nalia-bottom-nav .label {
    font-weight: 600 !important;
}

/* Offcanvas items: que no se vean todos �gritando� */
.nalia-oc-item .left {
    font-weight: 600 !important;
}

.nalia-oc-chip {
    font-weight: 600 !important;
}

/* Labels de formularios (que hoy est�n muy pesados) */
.nalia-label {
    font-weight: 600 !important;
}

/* Evita que <strong> te �reviente� la jerarqu�a */
strong, b {
    font-weight: 600;
}
/* =========================================================
   NALIA � Profile view: solo encabezados bold
   (Pegar al FINAL)
   ========================================================= */

/* Mant�n encabezados bold */
.nalia-profile__title,
.nalia-head-title,
.nalia-section-title {
    font-weight: 700 !important;
}

/* Todo lo dem�s en Mi perfil, ligero */
.nalia-profile__kicker,
.nalia-profile__name,
.nalia-profile__sub {
    font-weight: 400 !important;
}

/* Cards tipo �input� dentro del perfil */
.nalia-inputcard__label {
    font-weight: 400 !important;
}

.nalia-inputcard__value {
    font-weight: 400 !important;
}

/* MemberCode: etiqueta ligera, valor semibold (para que se lea premium sin gritar) */
.nalia-membercode__label {
    font-weight: 400 !important;
}

.nalia-membercode__value {
    font-weight: 600 !important; /* c�mbialo a 400 si lo quieres 100% light */
}

/* Chips / badges tipo �Verificado� */
.nalia-membercode__badge,
.nalia-tag {
    font-weight: 500 !important;
}
/* =========================================================
   NALIA � Final Patch (fondo con m�s contraste + jerarqu�a ligera)
   Pegar AL FINAL de site.css
   ========================================================= */

/* 1) Fondo con m�s aire (ya no se �pierde� con las cards) */
:root {
    --nalia-bg: #FBF6F4; /* fondo m�s claro */
    --nalia-text: #5E3A32; /* caf� suave premium */
}

/* Degradado ultra sutil para profundidad (opcional pero recomendado) */
body {
    background: linear-gradient(180deg, #FBF6F4 0%, #F6ECE8 100%) !important;
    color: var(--nalia-text);
}

/* 2) Cards: mantienen tu estilo pero �flotan� mejor */
.nalia-plan-card {
    border: 1px solid rgba(183,110,121,.18) !important;
    box-shadow: 0 18px 45px rgba(183,110,121,.10) !important;
}

/* 3) Jerarqu�a tipogr�fica (solo encabezados bold) */
body {
    font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
}

/* T�tulos grandes */
.nalia-head-title,
.nalia-profile__title,
.nalia-section-title {
    font-weight: 700 !important;
}

/* Membres�as: solo el nombre del plan bold */
.nalia-plan-name {
    font-weight: 700 !important;
}

.nalia-plan-subtitle {
    font-weight: 400 !important;
}

/* Precio elegante, no pesado */
.nalia-plan-price {
    font-weight: 400 !important;
}

.nalia-plan-currency {
    font-weight: 300 !important;
}

.nalia-plan-period {
    font-weight: 300 !important;
}

/* Texto normal / auxiliares */
.nalia-head-sub,
.nalia-profile__kicker,
.nalia-profile__name,
.nalia-profile__sub,
.nalia-plan-desc,
.nalia-hint,
.nalia-inputcard__label,
.nalia-inputcard__value {
    font-weight: 400 !important;
}

/* Pills / chips */
.nalia-plan-pill,
.nalia-tag,
.nalia-chip,
.nalia-plan-meta-item,
.nalia-membercode__badge {
    font-weight: 500 !important;
}

/* MemberCode: valor visible pero sin gritar */
.nalia-membercode__label {
    font-weight: 400 !important;
}

.nalia-membercode__value {
    font-weight: 600 !important;
}

/* Botones: semibold premium */
.nalia-btn-primary,
.nalia-btn-plan,
.nalia-btn,
.nalia-btn-ghost,
.nalia-btn-auth {
    font-weight: 600 !important;
}

/* Bottom nav m�s ligera */
.nalia-bottom-nav .nav-item {
    font-weight: 500 !important;
}

.nalia-bottom-nav .label {
    font-weight: 600 !important;
}

/* Evita que <strong> reviente la jerarqu�a */
strong, b {
    font-weight: 600;
}
/* M�s profundidad en cards */
.nalia-plan-card {
    background: #F5E9E6 !important;
    border: 1px solid rgba(183,110,121,.22) !important;
    box-shadow: 0 22px 55px rgba(183,110,121,.16) !important;
}
.nalia-plan-card {
    position: relative;
}

    .nalia-plan-card::after {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: 24px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.35);
        pointer-events: none;
    }
/* =========================================================
   NALIA � Admin Clases (look & feel Nalia)
   ========================================================= */

.nalia-kicker {
    font-size: .78rem;
    color: var(--nalia-text-3);
    font-weight: 500;
}

.nalia-card-title {
    font-weight: 700;
    color: var(--nalia-ink);
}

.nalia-muted {
    color: var(--nalia-text-3);
    font-weight: 400;
}

.nalia-badge-ic {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: rgba(229,208,199,.55);
    border: 1px solid rgba(129,59,29,.10);
    color: var(--nalia-ink);
}

.nalia-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

/* Alerts */
.nalia-alert {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 14px;
    border-radius: 18px;
    border: 1px solid rgba(129,59,29,.10);
    background: rgba(255,255,255,.80);
    box-shadow: 0 18px 45px rgba(129,59,29,.10);
}

    .nalia-alert i {
        margin-top: 2px;
    }

.nalia-alert--ok {
    border-color: rgba(47,191,113,.20);
    background: rgba(47,191,113,.08);
    color: #1f7a49;
}

.nalia-alert--err {
    border-color: rgba(229,83,61,.22);
    background: rgba(229,83,61,.08);
    color: #a23828;
}

/* Pills / badges */
.nalia-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.70);
    border: 1px solid rgba(129,59,29,.12);
    color: var(--nalia-ink);
    font-weight: 500;
    font-size: .85rem;
}

.nalia-pill--soft {
    background: rgba(252,241,239,.70);
}

/* Status */
.nalia-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 999px;
    font-weight: 500;
    font-size: .86rem;
    border: 1px solid rgba(129,59,29,.12);
}

.nalia-status--ok {
    background: rgba(47,191,113,.10);
    color: #1f7a49;
    border-color: rgba(47,191,113,.20);
}

.nalia-status--bad {
    background: rgba(229,83,61,.10);
    color: #a23828;
    border-color: rgba(229,83,61,.22);
}

/* Table */
.nalia-table thead th {
    font-size: .78rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(129,59,29,.55);
    font-weight: 600;
    background: rgba(252,241,239,.65);
    border-bottom: 1px solid rgba(129,59,29,.10) !important;
}

.nalia-table tbody td {
    border-color: rgba(129,59,29,.10) !important;
}

.nalia-table tbody tr:hover {
    background: rgba(252,241,239,.45);
}

.nalia-td-title {
    font-weight: 600;
    color: var(--nalia-ink);
}

/* Empty */
.nalia-empty-ic {
    width: 64px;
    height: 64px;
    margin: 0 auto 12px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: rgba(252,241,239,.70);
    border: 1px solid rgba(129,59,29,.10);
    color: rgba(129,59,29,.70);
    font-size: 24px;
}

.nalia-empty-title {
    font-weight: 700;
    color: var(--nalia-ink);
    margin-bottom: 4px;
}

/* Small buttons */
.nalia-btn--sm {
    padding: 9px 12px;
    border-radius: 12px;
    font-size: .92rem;
}

/* Variants */
.nalia-btn--success {
    background: rgba(47,191,113,.10);
    border: 1px solid rgba(47,191,113,.22);
    color: #1f7a49;
}

    .nalia-btn--success:hover {
        background: rgba(47,191,113,.14);
    }

.nalia-btn--danger {
    background: rgba(229,83,61,.10);
    border: 1px solid rgba(229,83,61,.22);
    color: #a23828;
}

    .nalia-btn--danger:hover {
        background: rgba(229,83,61,.14);
    }

.nalia-dezlen-logo {
    height: 60px;
    width: auto;
    opacity: .9;
}

.nalia-footer-link {
    text-decoration: none;
    font-weight: 600;
}

    .nalia-footer-link:hover {
        text-decoration: underline;
    }

/* Link del bloque Dezlen */
.nalia-footer-dezlen {
    color: inherit;
}

    .nalia-footer-dezlen:link,
    .nalia-footer-dezlen:visited,
    .nalia-footer-dezlen:hover,
    .nalia-footer-dezlen:active {
        color: inherit;
        text-decoration: none;
    }

/* Link de Dezlen en el copyright */
.nalia-footer-link {
    color: inherit;
    text-decoration: none;
    font-weight: 600;
}

    .nalia-footer-link:hover {
        opacity: .8;
    }
.nalia-auth-wrap {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nalia-confirm-card {
    max-width: 580px;
    margin: 0 auto;
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(125,89,63,.10);
    border-radius: 28px;
    padding: 40px 30px;
    box-shadow: 0 18px 50px rgba(83,52,35,.08);
    text-align: center;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.nalia-confirm-icon {
    width: 74px;
    height: 74px;
    margin: 0 auto 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, rgba(189,154,128,.18), rgba(189,154,128,.08));
    color: var(--nalia-accent, #7b4c33);
    font-size: 2rem;
}

.nalia-confirm-kicker {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .18em;
    color: #9a7a67;
    margin-bottom: 8px;
    font-weight: 700;
}

.nalia-confirm-title {
    font-size: 2.1rem;
    line-height: 1.05;
    margin-bottom: 14px;
    color: var(--nalia-accent, #7b4c33);
    font-weight: 800;
}

.nalia-confirm-text {
    font-size: 1rem;
    line-height: 1.7;
    color: #6f625a;
    margin: 0 auto 18px;
    max-width: 460px;
}

.nalia-confirm-email {
    display: inline-block;
    margin-bottom: 22px;
    padding: 10px 16px;
    border-radius: 999px;
    background: #f7f0eb;
    color: #6e584b;
    font-size: .95rem;
}

.nalia-confirm-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

.nalia-confirm-note {
    font-size: .92rem;
    color: #9a8f88;
}

.nalia-btn-soft {
    background: #f4ece7;
    color: #6d5243;
    border: 1px solid rgba(125,89,63,.10);
    border-radius: 999px;
    padding: .8rem 1.2rem;
    text-decoration: none;
    font-weight: 600;
}

    .nalia-btn-soft:hover {
        color: #6d5243;
        background: #efe4dd;
    }

/* =========================================================
   SCHEDULE VIEW — Clases cliente (Week/Day/Card layout)
   ========================================================= */

/* ----- Week accordion ----- */
.nalia-week-accordion {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.nalia-week-item {
    border: 1px solid var(--nalia-border-2);
    border-radius: var(--nalia-radius-md);
    overflow: hidden;
    background: var(--nalia-surface);
    transition: border-color .2s;
}

    /* highlight the open item's border */
    .nalia-week-item:has(.nalia-week-item__btn:not(.collapsed)) {
        border-color: var(--nalia-coffee, #c2967a);
    }

.nalia-week-item__btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 15px 18px;
    gap: 12px;
    background: rgba(229,208,199,.15);
    border: none;
    border-left: 3px solid transparent;
    cursor: pointer;
    text-align: left;
    transition: background .2s, border-color .2s;
}

    /* expanded state */
    .nalia-week-item__btn:not(.collapsed) {
        background: rgba(229,208,199,.28);
        border-left-color: var(--nalia-coffee, #c2967a);
    }

    .nalia-week-item__btn:hover,
    .nalia-week-item__btn:focus-visible {
        background: rgba(229,208,199,.32);
        outline: none;
    }

.nalia-week-item__label {
    font-size: .95rem;
    font-weight: 700;
    color: var(--nalia-ink);
    line-height: 1.2;
}

.nalia-week-item__range {
    font-size: .76rem;
    color: var(--nalia-text-3);
    font-weight: 400;
    margin-top: 2px;
}

.nalia-week-item__chevron {
    font-size: 1rem;
    color: var(--nalia-text-2);
    transition: transform .25s ease, color .2s;
    flex-shrink: 0;
}

    /* expanded: chevron points up and gets accent color */
    .nalia-week-item__btn:not(.collapsed) .nalia-week-item__chevron {
        transform: rotate(0deg);
        color: var(--nalia-coffee, #c2967a);
    }

    /* collapsed: chevron points right */
    .nalia-week-item__btn.collapsed .nalia-week-item__chevron {
        transform: rotate(-90deg);
    }

.nalia-week-item__body {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

    /* day groups inside accordion: gap handles spacing, remove margin-bottom */
    .nalia-week-item__body .nalia-day-group {
        margin-bottom: 0;
    }

@media (max-width: 575.98px) {
    .nalia-week-item__btn {
        padding: 12px 14px;
    }

    .nalia-week-item__body {
        padding: 12px;
        gap: .6rem;
    }
}

/* ----- Day group (visual container per day) ----- */
.nalia-day-group {
    background: var(--nalia-surface);
    border: 1px solid var(--nalia-border-2);
    border-radius: var(--nalia-radius-md);
    overflow: hidden;
    margin-bottom: 1rem;
}

.nalia-day-group__header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 18px;
    background: rgba(229,208,199,.18);
    border-bottom: 1px solid var(--nalia-border-2);
}

.nalia-day-group__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--nalia-coffee);
    flex-shrink: 0;
}

.nalia-day-group__name {
    font-size: .9rem;
    font-weight: 700;
    color: var(--nalia-ink);
    text-transform: capitalize;
    line-height: 1.2;
}

.nalia-day-group__date {
    font-size: .74rem;
    color: var(--nalia-text-3);
    line-height: 1.3;
}

.nalia-day-group__count {
    font-size: .72rem;
    font-weight: 600;
    color: var(--nalia-text-2);
    background: rgba(229,208,199,.4);
    border-radius: 99px;
    padding: 2px 10px;
    white-space: nowrap;
    margin-left: auto;
}

.nalia-day-group__cards {
    padding: 16px;
}

@media (max-width: 575.98px) {
    .nalia-day-group__header {
        padding: 10px 14px;
    }

    .nalia-day-group__cards {
        padding: 12px;
    }
}

/* ----- Class card ----- */
.nalia-class-card {
    background: var(--nalia-surface);
    border: 1px solid var(--nalia-border-2);
    border-radius: var(--nalia-radius-md);
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: box-shadow .2s ease, transform .15s ease;
}

    .nalia-class-card:hover {
        box-shadow: var(--nalia-shadow-md);
        transform: translateY(-2px);
    }

.nalia-class-card__time-start {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--nalia-ink);
    line-height: 1;
    letter-spacing: -.02em;
}

.nalia-class-card__name {
    font-size: 1rem;
    font-weight: 700;
    color: var(--nalia-ink);
    margin: 6px 0 2px;
    line-height: 1.2;
}

.nalia-class-card__range {
    font-size: .76rem;
    color: var(--nalia-text-3);
}

/* ----- Occupancy badge ----- */
.nalia-occ-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .7rem;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 99px;
    white-space: nowrap;
    flex-shrink: 0;
}

.nalia-occ-badge--ok {
    background: rgba(47,191,113,.11);
    color: #1a9454;
}

.nalia-occ-badge--few {
    background: rgba(184,124,18,.10);
    color: #a06a00;
}

.nalia-occ-badge--full {
    background: rgba(129,59,29,.09);
    color: var(--nalia-text-3);
}

/* ----- Booked tag (ya reservado) ----- */
.nalia-booked-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .76rem;
    font-weight: 600;
    color: #1a9454;
    background: rgba(47,191,113,.10);
    border-radius: 99px;
    padding: 4px 11px;
    width: auto;
    max-width: 100%;
}

/* Bloque de acciones de la card reservada */
.nalia-class-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

/* Botón "Ver mis reservas" — sin partir en líneas */
.nalia-class-link-btn {
    white-space: nowrap;
    min-width: 140px;
}


/* =========================================================
   ADMIN RECEPTION — Agendar clase
   ========================================================= */

/* User search result card */
.nalia-user-result {
    padding: 12px 14px;
    border: 1px solid var(--nalia-border-2);
    border-radius: var(--nalia-radius-sm);
    background: var(--nalia-surface);
    color: var(--nalia-text);
    transition: box-shadow .15s ease, border-color .15s ease;
}

    .nalia-user-result:hover,
    .nalia-user-result.is-selected {
        border-color: var(--nalia-beige);
        box-shadow: var(--nalia-shadow-sm);
        color: var(--nalia-text);
    }

.nalia-user-result__avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--nalia-accent-soft);
    color: var(--nalia-ink);
    font-weight: 700;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.nalia-user-result__name {
    font-weight: 600;
    color: var(--nalia-ink);
    font-size: .9rem;
}

/* Upcoming reservation row */
.nalia-upcoming-res {
    font-size: .8rem;
    padding: 5px 10px;
    background: rgba(229,208,199,.18);
    border-radius: var(--nalia-radius-sm);
    color: var(--nalia-text-2);
}

/* Booking summary inside mat modal */
.nalia-recep-summary {
    background: rgba(229,208,199,.18);
    border: 1px solid var(--nalia-border-2);
    border-radius: var(--nalia-radius-sm);
    padding: 10px 14px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.nalia-recep-summary__row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .82rem;
    color: var(--nalia-text-2);
}

    .nalia-recep-summary__row i {
        color: var(--nalia-coffee);
        flex-shrink: 0;
    }

/* ── DAY PILL SELECTOR ─────────────────────────────────── */
.nalia-day-pills {
    display: flex;
    gap: .45rem;
    flex-wrap: wrap;
}

.nalia-day-pill {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .nalia-day-pill input[type="checkbox"] {
        position: absolute;
        opacity: 0;
        width: 0;
        height: 0;
        pointer-events: none;
    }

    .nalia-day-pill span {
        display: inline-block;
        padding: .38rem .85rem;
        border-radius: 2rem;
        border: 1.5px solid var(--nalia-border-2, #e8e0f0);
        background: #fff;
        font-size: .85rem;
        font-weight: 600;
        color: var(--nalia-text-2, #9b8bb4);
        transition: background .15s, border-color .15s, color .15s;
        user-select: none;
    }

    .nalia-day-pill input[type="checkbox"]:checked + span {
        background: var(--nalia-accent, #b07ecb);
        border-color: var(--nalia-accent, #b07ecb);
        color: #fff;
    }

    .nalia-day-pill:hover span {
        border-color: var(--nalia-accent, #b07ecb);
        color: var(--nalia-accent, #b07ecb);
    }

.nalia-day-shortcuts {
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
}

.nalia-btn-ghost-sm {
    font-size: .78rem;
    padding: .25rem .75rem;
    border-radius: 1rem;
    border: 1px solid var(--nalia-border-2, #e8e0f0);
    background: transparent;
    color: var(--nalia-text-2, #9b8bb4);
    cursor: pointer;
    transition: background .15s, border-color .15s, color .15s;
    line-height: 1.5;
}

    .nalia-btn-ghost-sm:hover {
        background: var(--nalia-accent-soft, #f5f0fc);
        color: var(--nalia-accent, #b07ecb);
        border-color: var(--nalia-accent, #b07ecb);
    }

/* =========================================================
   CHECK-IN SESSION PICKER (chip buttons)
   ========================================================= */

.ci-session-picker {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

/* Day group */
.ci-day-group { }

.ci-day-label {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .055em;
    text-transform: uppercase;
    color: var(--nalia-text-2, #9b8bb4);
    margin-bottom: .55rem;
}

.ci-day-group--today .ci-day-label {
    color: var(--nalia-coffee, #c2967a);
}

/* Chip row */
.ci-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

/* Individual chip */
.ci-chip {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    padding: .5rem 1.1rem;
    border: 1.5px solid var(--nalia-border-2, #e8e0f0);
    border-radius: var(--nalia-radius-md, 12px);
    background: var(--nalia-surface, #fff);
    cursor: pointer;
    transition: border-color .15s, background .15s, color .15s, box-shadow .15s;
    user-select: none;
    gap: 2px;
}

    .ci-chip:hover:not([disabled]) {
        border-color: var(--nalia-coffee, #c2967a);
        background: rgba(229,208,199,.14);
        box-shadow: 0 2px 8px rgba(194,150,122,.12);
    }

    .ci-chip.is-selected {
        background: var(--nalia-coffee, #c2967a);
        border-color: var(--nalia-coffee, #c2967a);
        color: #fff;
        box-shadow: 0 3px 10px rgba(194,150,122,.28);
    }

    .ci-chip--full,
    .ci-chip[disabled] {
        opacity: .42;
        cursor: not-allowed;
        pointer-events: none;
    }

/* Chip content */
.ci-chip__time {
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.15;
    color: inherit;
}

.ci-chip__notes {
    font-size: .66rem;
    font-weight: 500;
    color: inherit;
    opacity: .75;
    max-width: 120px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 1.1;
}

.ci-chip__cap {
    font-size: .67rem;
    font-weight: 500;
    color: inherit;
    opacity: .7;
    line-height: 1.1;
    display: flex;
    align-items: center;
    gap: 3px;
}

    .ci-chip__cap--full {
        opacity: 1;
        color: var(--nalia-text-3, #b0a0b0);
    }

    .ci-chip.is-selected .ci-chip__cap {
        opacity: .85;
    }

@media (max-width: 575.98px) {
    .ci-chip {
        padding: .45rem .85rem;
    }

    .ci-chip__time {
        font-size: .84rem;
    }
}

/* =========================================================
   ADMIN CHECK-IN — Premium redesign
   ========================================================= */

/* Utilities used in admin views */
.nalia-mini {
    font-size: .78rem;
    color: var(--nalia-text-3);
    font-weight: 400;
}

.nalia-h2 {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--nalia-ink);
}

/* Widen the max-width for admin pages that need more room */
.nalia-admin-pad {
    max-width: 900px !important;
}

/* Scrollable table wrapper */
.nalia-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Status badges (used in roster) */
.nalia-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 600;
    white-space: nowrap;
}

.nalia-badge-success {
    background: rgba(47,191,113,.12);
    color: #1a9454;
    border: 1px solid rgba(47,191,113,.22);
}

.nalia-badge-muted {
    background: rgba(129,59,29,.06);
    color: var(--nalia-text-3);
    border: 1px solid var(--nalia-border-2);
}

/* Small green check-in button (roster) */
.nalia-btn-mini {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    border-radius: 10px;
    font-size: .78rem;
    font-weight: 600;
    border: 1px solid rgba(47,191,113,.22);
    background: rgba(47,191,113,.10);
    color: #1a9454;
    cursor: pointer;
    transition: background .15s, border-color .15s;
    white-space: nowrap;
}

.nalia-btn-mini:hover {
    background: rgba(47,191,113,.18);
    border-color: rgba(47,191,113,.30);
}

.nalia-btn-mini:disabled {
    opacity: .45;
    cursor: not-allowed;
}

/* ── Spotlight search input ── */
.ci-search-card {
    border-top: 2px solid rgba(168,124,105,.18);
}

.ci-spotlight {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 16px;
    border-radius: 16px;
    background: rgba(255,255,255,.96);
    border: 1.5px solid rgba(129,59,29,.18);
    transition: border-color .15s, box-shadow .15s;
}

.ci-spotlight:focus-within {
    border-color: var(--nalia-coffee);
    box-shadow: 0 0 0 3px var(--nalia-accent-soft);
}

.ci-spotlight__icon {
    font-size: 1.2rem;
    color: var(--nalia-coffee);
    flex-shrink: 0;
    opacity: .85;
}

.ci-spotlight__input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 1rem;
    font-weight: 600;
    color: var(--nalia-ink);
    outline: none;
    letter-spacing: .03em;
    padding: 0;
}

.ci-spotlight__input::placeholder {
    font-weight: 400;
    color: var(--nalia-text-3);
    letter-spacing: 0;
}

/* ── User found card ── */
.ci-user-card {
    border-left: 3px solid var(--nalia-coffee);
}

.ci-user-card__top {
    display: flex;
    align-items: center;
    gap: 14px;
}

.ci-user-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(229,208,199,.70);
    color: var(--nalia-ink);
    font-weight: 700;
    font-size: 1.05rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid rgba(129,59,29,.12);
    box-shadow: 0 6px 14px rgba(129,59,29,.08);
}

.ci-user-card__name {
    font-size: .95rem;
    font-weight: 700;
    color: var(--nalia-ink);
    line-height: 1.2;
}

.ci-user-card__email {
    font-size: .8rem;
    color: var(--nalia-text-3);
    margin-top: 2px;
}

/* Reservation status block inside user card */
.ci-status-block {
    background: rgba(252,241,239,.45);
    border: 1px solid var(--nalia-border-2);
    border-radius: 14px;
    padding: 14px 16px;
}

.ci-res-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    border-radius: 12px;
    font-size: .88rem;
    font-weight: 500;
}

.ci-res-status--ok {
    background: rgba(47,191,113,.10);
    color: #1a9454;
    border: 1px solid rgba(47,191,113,.20);
}

.ci-res-status--pending {
    background: rgba(229,208,199,.35);
    color: var(--nalia-text-2);
    border: 1px solid var(--nalia-border-2);
}

.ci-res-status--cancelled {
    background: rgba(229,83,61,.08);
    color: #a23828;
    border: 1px solid rgba(229,83,61,.16);
}

.ci-res-status--none {
    background: rgba(255,255,255,.70);
    color: var(--nalia-text-3);
    border: 1px solid var(--nalia-border-2);
}

/* Occupancy pill */
.ci-occ {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 600;
    background: rgba(229,208,199,.35);
    border: 1px solid var(--nalia-border-2);
    color: var(--nalia-text-2);
    white-space: nowrap;
}

/* ── Roster card ── */
.ci-roster-card { }

.ci-roster-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--nalia-border-2);
    background: rgba(252,241,239,.45);
}

.ci-roster-list {
    display: flex;
    flex-direction: column;
}

.ci-roster-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 20px;
    border-bottom: 1px solid var(--nalia-border-2);
    transition: background .15s;
}

.ci-roster-item:last-child {
    border-bottom: none;
}

.ci-roster-item:hover {
    background: rgba(252,241,239,.50);
}

.ci-roster-item--checked {
    background: rgba(47,191,113,.05);
}

@keyframes rosterFlash {
    0%   { background: rgba(47,191,113,.22); }
    100% { background: rgba(47,191,113,.05); }
}

.ci-roster-item--flash {
    animation: rosterFlash .9s ease forwards;
}

/* Mat number badge */
.ci-mat-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(229,208,199,.55);
    border: 1px solid rgba(129,59,29,.12);
    font-weight: 700;
    font-size: .82rem;
    color: var(--nalia-ink);
    flex-shrink: 0;
}

/* Person info column */
.ci-roster-person {
    flex: 1;
    min-width: 0;
}

.ci-roster-name {
    display: block;
    font-size: .95rem;
    font-weight: 700;
    color: var(--nalia-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ci-roster-code {
    display: block;
    font-size: .7rem;
    color: var(--nalia-text-3);
    margin-top: 1px;
}

.ci-roster-type {
    font-size: .73rem;
    font-weight: 500;
    color: var(--nalia-text-3);
    white-space: nowrap;
    flex-shrink: 0;
    width: 60px;
    text-align: center;
}

.ci-roster-status {
    flex-shrink: 0;
    width: 110px;
    text-align: center;
}

.ci-roster-action {
    flex-shrink: 0;
    width: 110px;
    text-align: right;
}

@media (max-width: 575.98px) {
    .ci-roster-item {
        flex-wrap: wrap;
        padding: 10px 14px;
        gap: 8px;
    }

    .ci-roster-type {
        display: none;
    }

    .ci-roster-status {
        width: auto;
    }

    .ci-roster-action {
        width: auto;
    }
}

/* =========================================================
   ADMIN CHECK-IN — Second iteration: hero, results, empty
   ========================================================= */

/* ── Day hero (initial state) ── */
.ci-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 14px 20px;
    border-radius: 22px;
    background: linear-gradient(135deg, rgba(201,168,155,.28) 0%, rgba(252,241,239,.85) 100%);
    border: 1px solid rgba(168,124,105,.20);
    box-shadow: var(--nalia-shadow-sm);
    flex-wrap: wrap;
}

.ci-hero__kicker {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .10em;
    color: var(--nalia-coffee);
    font-weight: 600;
    margin-bottom: 4px;
}

.ci-hero__date {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--nalia-ink);
    line-height: 1.1;
    margin: 0;
    letter-spacing: -.02em;
    text-transform: capitalize;
}

.ci-hero__stats {
    display: flex;
    align-items: center;
    gap: 0;
    flex-shrink: 0;
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(129,59,29,.10);
    border-radius: 16px;
    padding: 10px 14px;
    box-shadow: 0 8px 20px rgba(129,59,29,.06);
}

.ci-hero__stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 0 18px;
}

.ci-hero__stat-sep {
    width: 1px;
    height: 36px;
    background: rgba(129,59,29,.12);
    flex-shrink: 0;
}

.ci-hero__stat-num {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--nalia-ink);
    line-height: 1;
    letter-spacing: -.04em;
}

.ci-hero__stat-lbl {
    font-size: .7rem;
    color: var(--nalia-text-3);
    font-weight: 500;
    text-align: center;
    line-height: 1.3;
}

.ci-hero__stat--ok .ci-hero__stat-num {
    color: #1a9454;
}

@media (max-width: 575.98px) {
    .ci-hero {
        flex-direction: column;
        padding: 12px 16px;
    }
    .ci-hero__stats {
        width: 100%;
        justify-content: center;
        padding: 12px 0;
    }
    .ci-hero__stat {
        padding: 0 14px;
    }
    .ci-hero__stat-num {
        font-size: 1.2rem;
    }
}

/* ── Class context bar (operational states) ── */
.ci-context-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    border-radius: 14px;
    background: rgba(255,255,255,.90);
    border: 1px solid rgba(168,124,105,.25);
    border-left: 4px solid var(--nalia-coffee);
    font-size: .88rem;
}

.ci-context-bar__left {
    display: flex;
    align-items: center;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* ── Multiple search results ── */
.ci-results-section { }

.ci-results-header {
    display: flex;
    align-items: baseline;
    gap: 6px;
    padding: 0 4px 10px;
    font-size: .85rem;
    color: var(--nalia-text-2);
    font-weight: 500;
}

.ci-results-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ci-result-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 14px;
    border-radius: 18px;
    background: rgba(255,255,255,.92);
    border: 1px solid var(--nalia-border-2);
    box-shadow: var(--nalia-shadow-sm);
    transition: border-color .15s, box-shadow .15s;
}

.ci-result-card:hover {
    border-color: rgba(168,124,105,.30);
    box-shadow: var(--nalia-shadow-md);
}

.ci-result-card__avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(229,208,199,.70);
    color: var(--nalia-ink);
    font-weight: 700;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid rgba(129,59,29,.12);
}

.ci-result-card__info {
    flex: 1;
    min-width: 0;
}

.ci-result-card__name {
    font-size: .92rem;
    font-weight: 700;
    color: var(--nalia-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ci-result-card__meta {
    font-size: .78rem;
    color: var(--nalia-text-3);
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ci-result-card__code {
    font-weight: 600;
    color: var(--nalia-coffee);
    font-size: .75rem;
    padding: 1px 7px;
    background: rgba(201,168,155,.22);
    border-radius: 999px;
}

.ci-result-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
}

.ci-result-card__action {
    flex-shrink: 0;
}

.ci-result-card__btn {
    padding: 5px 14px;
    font-size: .8rem;
    border-radius: 8px;
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .ci-result-card {
        flex-wrap: wrap;
        padding: 12px 14px;
    }
    .ci-result-card__action {
        width: 100%;
    }
    .ci-result-card__action .nalia-btn-ghost {
        width: 100%;
        justify-content: center;
    }
}

/* ── Premium empty state (not found) ── */
.ci-empty-state {
    text-align: center;
    padding: 32px 24px !important;
}

.ci-empty-state__icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 14px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(229,208,199,.45);
    border: 1px solid rgba(129,59,29,.10);
    font-size: 1.6rem;
    color: rgba(129,59,29,.60);
}

.ci-empty-state__title {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--nalia-ink);
    margin-bottom: 4px;
}

.ci-empty-state__sub {
    font-size: .85rem;
    color: var(--nalia-text-3);
    margin-bottom: 16px;
}

.ci-empty-state__tips {
    list-style: none;
    padding: 0;
    margin: 0;
    display: inline-flex;
    flex-direction: column;
    gap: 6px;
    text-align: left;
    max-width: 420px;
}

.ci-empty-state__tips li {
    font-size: .83rem;
    color: var(--nalia-text-2);
    display: flex;
    align-items: flex-start;
    gap: 4px;
}

.ci-empty-state__tips li i {
    color: var(--nalia-coffee);
    flex-shrink: 0;
    margin-top: 1px;
}

/* ── User card MemberCode badge ── */
.ci-user-card__code {
    font-size: .73rem;
    font-weight: 600;
    color: var(--nalia-coffee);
    padding: 1px 8px;
    background: rgba(201,168,155,.22);
    border-radius: 999px;
    vertical-align: middle;
}

/* ── Initial guide card ── */
.ci-guide-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border-radius: 16px;
    background: rgba(229,208,199,.18);
    border: 1px dashed rgba(168,124,105,.30);
    color: var(--nalia-text-3);
    font-size: .88rem;
    font-weight: 500;
}

.ci-guide-card__icon {
    font-size: 1.5rem;
    color: var(--nalia-coffee);
    opacity: .60;
    flex-shrink: 0;
}

.ci-guide-card__title {
    font-weight: 600;
    color: var(--nalia-text-2);
    margin-bottom: 2px;
}

.ci-guide-card__sub {
    font-size: .8rem;
    color: var(--nalia-text-3);
}

/* =========================================================
   ADMIN CHECK-IN — Step-based flow redesign
   ========================================================= */

/* ── Step blocks ── */
.ci-step-block {
    margin-bottom: 2.4rem;
}

.ci-step-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 1rem;
}

.ci-step-num {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: rgba(168,124,105,.13);
    border: 1.5px solid rgba(168,124,105,.24);
    color: var(--nalia-coffee);
    font-size: .73rem;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background .2s, border-color .2s, color .2s;
    letter-spacing: 0;
}

.ci-step-num--active {
    background: var(--nalia-coffee);
    border-color: var(--nalia-coffee);
    color: #fff;
}

.ci-step-num--done {
    background: rgba(47,191,113,.14);
    border-color: rgba(47,191,113,.30);
    color: #1a9454;
}

.ci-step-text {
    font-size: .92rem;
    font-weight: 700;
    color: var(--nalia-ink);
    letter-spacing: -.01em;
}

.ci-step-hint {
    font-size: .78rem;
    color: var(--nalia-text-3);
    font-weight: 400;
}

/* ── Active class card (Step 2 header) ── */
.ci-active-class {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 18px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(201,168,155,.20) 0%, rgba(252,241,239,.78) 100%);
    border: 1.5px solid rgba(168,124,105,.26);
}

.ci-active-class__info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.ci-active-class__time {
    font-size: .9rem;
    font-weight: 700;
    color: var(--nalia-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Roster group headers ── */
.ci-roster-group-head {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 20px;
    font-size: .69rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    border-bottom: 1px solid var(--nalia-border-2);
}

.ci-roster-group-head--pending {
    background: rgba(248,245,250,.95);
    color: var(--nalia-text-2);
}

.ci-roster-group-head--done {
    background: rgba(47,191,113,.05);
    color: #1a9454;
    border-top: 1px solid rgba(47,191,113,.12);
}

/* ── Roster empty state (Step 2, no reservations) ── */
.ci-roster-empty {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    border-radius: 16px;
    background: rgba(248,245,248,.55);
    border: 1px dashed rgba(168,124,105,.22);
    color: var(--nalia-text-3);
}

.ci-roster-empty__icon {
    font-size: 1.5rem;
    opacity: .50;
    flex-shrink: 0;
}

.ci-roster-empty__title {
    font-size: .88rem;
    font-weight: 600;
    color: var(--nalia-text-2);
    margin-bottom: 2px;
}

.ci-roster-empty__sub {
    font-size: .78rem;
}

/* =========================================================
   ADMIN CHECK-IN v2 — Rediseño completo (ck-*)
   ========================================================= */

/* ── Header bar ── */
.ck-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.ck-header__left {}

.ck-header__kicker {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .10em;
    color: var(--nalia-coffee);
    font-weight: 600;
    margin-bottom: 3px;
}

.ck-header__date {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--nalia-ink);
    text-transform: capitalize;
    line-height: 1.2;
}

.ck-header__stats {
    display: flex;
    align-items: center;
    background: rgba(255,255,255,.80);
    border: 1px solid rgba(129,59,29,.10);
    border-radius: 14px;
    padding: 8px 10px;
    gap: 0;
    flex-shrink: 0;
    box-shadow: var(--nalia-shadow-sm);
}

.ck-header__stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 14px;
    gap: 2px;
}

.ck-header__stat-sep {
    width: 1px;
    height: 26px;
    background: rgba(129,59,29,.10);
    flex-shrink: 0;
}

.ck-header__stat-num {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--nalia-ink);
    line-height: 1;
    letter-spacing: -.03em;
}

.ck-header__stat-lbl {
    font-size: .66rem;
    color: var(--nalia-text-3);
    font-weight: 500;
}

.ck-header__stat--ok .ck-header__stat-num {
    color: #1a9454;
}

/* ── Active class bar ── */
.ck-active {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 20px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(194,150,122,.20) 0%, rgba(252,241,239,.88) 100%);
    border: 1.5px solid rgba(168,124,105,.28);
    box-shadow: 0 2px 12px rgba(168,124,105,.09);
    flex-wrap: wrap;
}

.ck-active__left {
    flex: 1;
    min-width: 0;
}

.ck-active__time {
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--nalia-ink);
    letter-spacing: -.03em;
    line-height: 1.1;
}

.ck-active__day {
    font-size: .8rem;
    color: var(--nalia-text-3);
    margin-top: 2px;
    text-transform: capitalize;
}

.ck-active__mid {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.ck-active__occ {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 700;
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(129,59,29,.14);
    color: var(--nalia-ink);
    white-space: nowrap;
}

.ck-active__ci-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 700;
    background: rgba(47,191,113,.12);
    border: 1px solid rgba(47,191,113,.22);
    color: #1a9454;
    white-space: nowrap;
}

.ck-change-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 10px;
    font-size: .82rem;
    font-weight: 600;
    background: rgba(255,255,255,.88);
    border: 1.5px solid rgba(168,124,105,.26);
    color: var(--nalia-coffee);
    cursor: pointer;
    transition: background .14s, border-color .14s;
    white-space: nowrap;
    flex-shrink: 0;
}

.ck-change-btn:hover {
    background: #fff;
    border-color: var(--nalia-coffee);
}

/* ── Sin clase seleccionada ── */
.ck-no-class {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 52px 24px;
    border-radius: 22px;
    background: rgba(229,208,199,.16);
    border: 1.5px dashed rgba(168,124,105,.26);
}

.ck-no-class__icon {
    font-size: 2.4rem;
    color: var(--nalia-coffee);
    opacity: .50;
    margin-bottom: 14px;
}

.ck-no-class__title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--nalia-ink);
    margin-bottom: 6px;
}

.ck-no-class__sub {
    font-size: .85rem;
    color: var(--nalia-text-3);
    max-width: 320px;
}

/* ── Two-column layout ── */
.ck-layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 22px;
    align-items: start;
}

@media (max-width: 991.98px) {
    .ck-layout { grid-template-columns: 1fr 290px; }
}

@media (max-width: 767.98px) {
    .ck-layout { grid-template-columns: 1fr; }
}

/* ── Roster ── */
.ck-roster {
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid var(--nalia-border-2);
    background: var(--nalia-surface, #fff);
    box-shadow: var(--nalia-shadow-sm);
}

.ck-roster__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 20px;
    border-bottom: 1px solid var(--nalia-border-2);
    background: rgba(252,241,239,.48);
}

.ck-roster__title {
    font-size: .8rem;
    font-weight: 700;
    color: var(--nalia-ink);
    text-transform: uppercase;
    letter-spacing: .07em;
}

.ck-roster__count {
    font-size: .78rem;
    color: var(--nalia-text-3);
    font-weight: 500;
}

.ck-group-label {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 20px;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    border-bottom: 1px solid var(--nalia-border-2);
}

.ck-group-label--pending {
    background: rgba(248,245,250,.90);
    color: var(--nalia-text-2);
}

.ck-group-label--done {
    background: rgba(47,191,113,.05);
    color: #1a9454;
    border-top: 1px solid rgba(47,191,113,.12);
}

.ck-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 20px;
    border-bottom: 1px solid var(--nalia-border-2);
    transition: background .12s;
}

.ck-row:last-child { border-bottom: none; }

.ck-row:hover { background: rgba(252,241,239,.42); }

.ck-row--checked {
    background: rgba(47,191,113,.04);
}

.ck-row--checked:hover {
    background: rgba(47,191,113,.08);
}

@keyframes ckFlash {
    0%   { background: rgba(47,191,113,.24); }
    100% { background: rgba(47,191,113,.04); }
}

.ck-row--flash {
    animation: ckFlash .9s ease forwards;
}

.ck-mat {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: rgba(229,208,199,.55);
    border: 1px solid rgba(129,59,29,.12);
    font-weight: 700;
    font-size: .80rem;
    color: var(--nalia-ink);
    flex-shrink: 0;
}

.ck-person {
    flex: 1;
    min-width: 0;
}

.ck-name {
    display: block;
    font-size: .98rem;
    font-weight: 700;
    color: var(--nalia-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2;
}

.ck-row--checked .ck-name {
    color: var(--nalia-text-2);
    font-weight: 600;
}

.ck-code {
    display: block;
    font-size: .7rem;
    color: var(--nalia-text-3);
    margin-top: 1px;
}

.ck-type {
    font-size: .72rem;
    color: var(--nalia-text-3);
    white-space: nowrap;
    flex-shrink: 0;
    width: 52px;
    text-align: center;
}

.ck-status {
    flex-shrink: 0;
    width: 102px;
    text-align: center;
}

.ck-action {
    flex-shrink: 0;
    width: 94px;
    text-align: right;
}

.ck-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: .73rem;
    font-weight: 600;
    white-space: nowrap;
}

.ck-badge--pending {
    background: rgba(168,124,105,.10);
    color: var(--nalia-text-2);
    border: 1px solid var(--nalia-border-2);
}

.ck-badge--done {
    background: rgba(47,191,113,.10);
    color: #1a9454;
    border: 1px solid rgba(47,191,113,.20);
}

.ck-btn-ci {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 11px;
    border-radius: 9px;
    font-size: .78rem;
    font-weight: 600;
    border: 1px solid rgba(47,191,113,.24);
    background: rgba(47,191,113,.10);
    color: #1a9454;
    cursor: pointer;
    transition: background .14s, border-color .14s;
    white-space: nowrap;
}

.ck-btn-ci:hover { background: rgba(47,191,113,.18); border-color: rgba(47,191,113,.32); }
.ck-btn-ci:disabled { opacity: .45; cursor: not-allowed; }

.ck-done-mark {
    color: var(--nalia-text-3);
    font-size: .88rem;
}

.ck-roster-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 36px 20px;
    color: var(--nalia-text-3);
    font-size: .88rem;
}

.ck-roster-empty i {
    font-size: 1.4rem;
    opacity: .40;
}

/* ── Search sidebar ── */
.ck-search {
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid var(--nalia-border-2);
    background: var(--nalia-surface, #fff);
    box-shadow: var(--nalia-shadow-sm);
}

.ck-search__head {
    padding: 13px 20px;
    font-size: .8rem;
    font-weight: 700;
    color: var(--nalia-ink);
    text-transform: uppercase;
    letter-spacing: .07em;
    border-bottom: 1px solid var(--nalia-border-2);
    background: rgba(252,241,239,.48);
}

.ck-search__form {
    padding: 16px 18px;
    border-bottom: 1px solid var(--nalia-border-2);
}

.ck-spotlight {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 13px;
    border-radius: 12px;
    background: rgba(248,245,250,.90);
    border: 1.5px solid rgba(129,59,29,.15);
    transition: border-color .15s, box-shadow .15s;
}

.ck-spotlight:focus-within {
    border-color: var(--nalia-coffee);
    box-shadow: 0 0 0 3px var(--nalia-accent-soft);
    background: #fff;
}

.ck-spotlight__icon {
    font-size: .95rem;
    color: var(--nalia-coffee);
    opacity: .80;
    flex-shrink: 0;
}

.ck-spotlight__input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: .95rem;
    font-weight: 500;
    color: var(--nalia-ink);
    outline: none;
    padding: 0;
    min-width: 0;
}

.ck-spotlight__input::placeholder {
    font-weight: 400;
    color: var(--nalia-text-3);
}

.ck-search__hint {
    font-size: .74rem;
    color: var(--nalia-text-3);
    margin-top: 7px;
}

.ck-result-area {
    border-top: 1px solid var(--nalia-border-2);
}

/* Compact result card */
.ck-result {
    margin: 0;
}

.ck-result__top {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 18px;
    border-bottom: 1px solid var(--nalia-border-2);
}

.ck-result__avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(229,208,199,.70);
    color: var(--nalia-ink);
    font-weight: 700;
    font-size: .88rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid rgba(129,59,29,.12);
}

.ck-result__info {
    flex: 1;
    min-width: 0;
}

.ck-result__name {
    font-size: .92rem;
    font-weight: 700;
    color: var(--nalia-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ck-result__meta {
    font-size: .74rem;
    color: var(--nalia-text-3);
    margin-top: 2px;
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    align-items: center;
}

.ck-result__sep {
    opacity: .40;
}

.ck-result__code {
    font-weight: 600;
    color: var(--nalia-coffee);
}

.ck-result__ok {
    font-weight: 600;
    color: #1a9454;
}

.ck-result__bad {
    font-weight: 600;
    color: #a23828;
}

.ck-result__action {
    padding: 13px 18px;
}

.ck-result__reserve-info {
    font-size: .78rem;
    color: var(--nalia-text-2);
}

.ck-result__warn {
    display: flex;
    align-items: center;
    font-size: .82rem;
    color: var(--nalia-text-3);
}

/* Multi-results */
.ck-multi {}

.ck-multi__head {
    font-size: .78rem;
    color: var(--nalia-text-2);
    font-weight: 600;
    padding: 11px 16px 8px;
}

.ck-multi-item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 16px;
    border-top: 1px solid var(--nalia-border-2);
    transition: background .12s;
    color: inherit;
}

.ck-multi-item:hover {
    background: rgba(252,241,239,.55);
    color: inherit;
}

.ck-multi-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(229,208,199,.55);
    color: var(--nalia-ink);
    font-weight: 700;
    font-size: .75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ck-multi-info {
    flex: 1;
    min-width: 0;
}

.ck-multi-name {
    font-size: .88rem;
    font-weight: 600;
    color: var(--nalia-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ck-multi-code {
    font-size: .72rem;
    color: var(--nalia-coffee);
    margin-top: 1px;
}

/* Not found */
.ck-not-found {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    color: var(--nalia-text-3);
}

.ck-not-found i {
    font-size: 1.3rem;
    opacity: .50;
    flex-shrink: 0;
}

.ck-not-found__title {
    font-size: .88rem;
    font-weight: 600;
    color: var(--nalia-text-2);
}

.ck-not-found__sub {
    font-size: .78rem;
    margin-top: 2px;
}

/* ── Inline class picker section ── */
.ck-picker-section {
    background: var(--nalia-card);
    border: 1px solid var(--nalia-border);
    border-radius: 14px;
    padding: 1.1rem 1.3rem 1.2rem;
}

.ck-picker-section__head {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: var(--nalia-text-2);
    margin-bottom: .9rem;
}

.ck-class-picker {
    display: flex;
    flex-direction: column;
    gap: 1.3rem;
    padding-bottom: 8px;
}

.ck-picker-day {}

.ck-picker-day__label {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--nalia-text-2);
    margin-bottom: .5rem;
}

.ck-picker-day--today .ck-picker-day__label {
    color: var(--nalia-coffee);
}

.ck-picker-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.ck-picker-chip {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    padding: .55rem 1.1rem;
    border: 1.5px solid var(--nalia-border-2);
    border-radius: 12px;
    background: var(--nalia-surface, #fff);
    cursor: pointer;
    transition: border-color .14s, background .14s, box-shadow .14s;
    gap: 2px;
}

a.ck-picker-chip {
    text-decoration: none;
    color: inherit;
}

.ck-picker-chip:hover:not(.is-full) {
    border-color: var(--nalia-coffee);
    background: rgba(229,208,199,.14);
}

.ck-picker-chip.is-selected {
    background: var(--nalia-coffee);
    border-color: var(--nalia-coffee);
    color: #fff;
    box-shadow: 0 3px 10px rgba(194,150,122,.28);
}

.ck-picker-chip[disabled] {
    opacity: .38;
    cursor: not-allowed;
    pointer-events: none;
}

/* Clase llena: visualmente distinta pero clickeable (admin gestiona el roster) */
.ck-picker-chip.is-full {
    opacity: .72;
    border-style: dashed;
}

.ck-picker-chip.is-full:not(.is-selected):hover {
    border-color: var(--nalia-coffee);
    background: rgba(229,208,199,.10);
}

.ck-picker-chip__time {
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.15;
    color: inherit;
}

.ck-picker-chip__notes {
    font-size: .64rem;
    font-weight: 500;
    color: inherit;
    opacity: .75;
    max-width: 110px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.ck-picker-chip__cap {
    font-size: .67rem;
    font-weight: 500;
    color: inherit;
    opacity: .68;
}

.ck-picker-chip__cap.is-full {
    opacity: 1;
}

/* ── Responsive ── */
@media (max-width: 575.98px) {
    .ck-type    { display: none; }
    .ck-status  { width: auto; }
    .ck-action  { width: auto; }
    .ck-row     { padding: 10px 14px; gap: 8px; flex-wrap: wrap; }
    .ck-header__stat { padding: 0 10px; }
    .ck-active  { gap: 10px; padding: 12px 16px; }
    .ck-active__time { font-size: 1.1rem; }
}

/* =========================================================
   MY RESERVATIONS — premium calendar view  (.mr-*)
   ========================================================= */

/* Wide page for the 7-column grid */
.nalia-page--wide { max-width: 980px; }

/* ── Week navigation ── */
.mr-week-nav {
    display: flex;
    align-items: center;
    gap: 12px;
}

.mr-week-nav__arrow {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    padding: 0;
    border-radius: 14px;
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(129,59,29,.13);
    box-shadow: 0 2px 8px rgba(129,59,29,.07);
    color: var(--nalia-ink);
    transition: background .18s, box-shadow .18s, transform .14s;
}

.mr-week-nav__arrow:hover {
    background: #fff;
    box-shadow: 0 4px 16px rgba(129,59,29,.12);
    transform: scale(1.04);
    color: var(--nalia-ink);
    text-decoration: none;
}

.mr-week-nav__center { flex: 1; text-align: center; }

.mr-week-nav__label {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--nalia-ink);
    line-height: 1.1;
}

.mr-week-nav__range {
    font-size: .74rem;
    color: rgba(129,59,29,.52);
    margin-top: 3px;
}

/* ── Toggle pill — premium ── */
.mr-toggle {
    display: inline-flex;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--nalia-border);
    border-radius: 999px;
    padding: 4px;
    gap: 2px;
    box-shadow: 0 2px 10px rgba(129,59,29,.06);
}

.mr-toggle__btn {
    padding: 6px 18px;
    border-radius: 999px;
    border: none;
    background: transparent;
    font-size: .78rem;
    font-weight: 600;
    color: var(--nalia-text-3);
    cursor: pointer;
    transition: background .2s, color .2s, box-shadow .2s;
    white-space: nowrap;
    line-height: 1;
}

.mr-toggle__btn.is-active {
    background: var(--nalia-ink);
    color: #fff;
    box-shadow: 0 3px 14px rgba(129,59,29,.22);
}

/* ── Scrollable wrapper ── */
.mr-cal-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 8px 20px;
    scroll-snap-type: x proximity;
}

/* ── 7-column grid ── */
.mr-cal-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(124px, 1fr));
    gap: 10px;
    min-width: 880px;
    transition: opacity .18s ease;
}

.mr-cal-grid.is-fading { opacity: 0; }

/* ── Day column ── */
.mr-day {
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(129,59,29,.09);
    border-radius: 18px;
    overflow: hidden;
    scroll-snap-align: start;
    transition: box-shadow .2s;
}

.mr-day:not(.mr-day--today):hover {
    box-shadow: 0 4px 18px rgba(129,59,29,.08);
}

/* Past days */
.mr-day--past {
    opacity: .62;
}

/* TODAY — hero column */
.mr-day--today {
    background: #fff;
    border: 1.5px solid var(--nalia-coffee);
    box-shadow: 0 0 0 3px rgba(168,124,105,.12), 0 6px 24px rgba(129,59,29,.08);
    opacity: 1 !important;
}

/* Day header */
.mr-day__head {
    padding: 11px 10px 9px;
    text-align: center;
    background: rgba(255,255,255,.38);
    border-bottom: 1px solid rgba(129,59,29,.07);
}

.mr-day--today .mr-day__head {
    background: var(--nalia-coffee);
    border-bottom-color: transparent;
}

.mr-day__name {
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--nalia-text-3);
    line-height: 1;
}

.mr-day--today .mr-day__name { color: rgba(255,255,255,.72); }

.mr-day__num {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--nalia-ink);
    line-height: 1.1;
    margin-top: 2px;
}

.mr-day--today .mr-day__num { color: #fff; }

/* "Hoy" badge */
.mr-day__today-badge {
    display: inline-block;
    font-size: .54rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: rgba(255,255,255,.9);
    background: rgba(255,255,255,.2);
    border-radius: 999px;
    padding: 2px 7px;
    margin-top: 4px;
}

/* Card area */
.mr-day__body {
    padding: 10px 8px 12px;
    min-height: 64px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Empty state */
.mr-day--empty .mr-day__body {
    align-items: center;
    justify-content: center;
}

.mr-day__empty-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(129,59,29,.12);
}

/* ── Empty week state ── */
.mr-empty-week {
    text-align: center;
    padding: 48px 24px;
    background: rgba(255,255,255,.7);
    border: 1px solid var(--nalia-border-2);
    border-radius: var(--nalia-radius-lg);
    margin: 0 8px;
}

.mr-empty-week__icon {
    font-size: 2rem;
    color: var(--nalia-nude);
    margin-bottom: 12px;
}

.mr-empty-week__title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--nalia-ink);
    margin-bottom: 6px;
}

.mr-empty-week__sub {
    font-size: .83rem;
    color: var(--nalia-text-3);
    margin-bottom: 20px;
}

/* ── Reservation card ── */
.mr-card {
    position: relative;
    border-radius: 14px;
    padding: 13px 13px 11px;
    border: 1px solid rgba(168,124,105,.18);
    border-left: 3px solid var(--nalia-coffee);
    background: #fff;
    box-shadow: 0 2px 12px rgba(129,59,29,.07);
    transition: transform .16s ease, box-shadow .16s ease;
}

/* Cancel hint icon — appears on hover */
.mr-card__cancel-x {
    position: absolute;
    top: 8px;
    right: 9px;
    font-size: .75rem;
    color: var(--nalia-text-3);
    opacity: 0;
    transition: opacity .15s;
    line-height: 1;
    pointer-events: none;
}

.mr-card--clickable { cursor: pointer; }

.mr-card--clickable:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(129,59,29,.13);
    border-color: rgba(168,124,105,.28);
}

.mr-card--clickable:hover .mr-card__cancel-x { opacity: 1; }

/* ── Card states ── */
.mr-card--booked {
    border-left-color: var(--nalia-coffee);
    background: #fff;
}

.mr-card--checkedin {
    border-left-color: #5a9a6a;
    background: rgba(90,154,106,.04);
    border-color: rgba(90,154,106,.18);
}

.mr-card--cancelled {
    border-left-color: rgba(168,124,105,.3);
    border-color: rgba(129,59,29,.06);
    background: rgba(245,240,238,.6);
    opacity: .62;
    filter: saturate(.45);
    cursor: default;
    box-shadow: none;
}

.mr-card--cancelled:hover {
    transform: none;
    box-shadow: none;
}

/* ── Card content ── */
.mr-card__time {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--nalia-ink);
    letter-spacing: -.02em;
    line-height: 1;
}

.mr-card--checkedin .mr-card__time { color: #3d7a4e; }
.mr-card--cancelled .mr-card__time { color: rgba(129,59,29,.38); }

.mr-card__name {
    font-size: .81rem;
    font-weight: 600;
    color: rgba(129,59,29,.7);
    line-height: 1.3;
    margin: 5px 0 7px;
}

/* Chips */
.mr-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.mr-card__chip {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: .62rem;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 6px;
    background: rgba(129,59,29,.07);
    color: rgba(129,59,29,.55);
}

.mr-card__chip--mat {
    background: rgba(168,124,105,.12);
    color: var(--nalia-coffee);
}

.mr-card__chip--trial {
    background: rgba(90,154,106,.11);
    color: #3d7a4e;
}

/* Status badges (only for non-booked states) */
.mr-card__status {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: .59rem;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.mr-card__status--checkedin {
    background: rgba(90,154,106,.12);
    color: #3d7a4e;
}

.mr-card__status--cancelled {
    background: rgba(129,59,29,.06);
    color: var(--nalia-text-3);
}

/* ── Modal refinements ── */
.mr-modal-class { font-size: 1.2rem; font-weight: 800; color: var(--nalia-ink); line-height: 1.2; }
.mr-modal-time  { font-size: .84rem; color: rgba(129,59,29,.52); margin-top: 4px; font-weight: 500; }

.mr-modal-rule {
    font-size: .84rem;
    color: var(--nalia-text-2);
    background: rgba(168,124,105,.08);
    border: 1px solid rgba(168,124,105,.14);
    border-radius: 14px;
    padding: 12px 16px;
    line-height: 1.55;
}

/* ── Toast ── */
.mr-toast {
    position: fixed;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%) translateY(14px);
    background: var(--nalia-ink);
    color: #fff;
    padding: 10px 20px;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 600;
    opacity: 0;
    pointer-events: none;
    z-index: 9999;
    transition: opacity .22s ease, transform .22s ease;
    display: flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    box-shadow: 0 10px 32px rgba(129,59,29,.24);
}

.mr-toast.is-visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}

.mr-toast__link {
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.22);
    color: #fff;
    border-radius: 999px;
    padding: 3px 12px;
    font-size: .72rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s;
    display: inline-flex;
    align-items: center;
}

.mr-toast__link:hover { background: rgba(255,255,255,.24); }

/* ── Mobile: agenda vertical ── */
@media (max-width: 639px) {
    .mr-cal-scroll { overflow-x: visible; padding: 0 0 16px; }

    .mr-cal-grid {
        display: flex;
        flex-direction: column;
        min-width: 0;
        gap: 12px;
    }

    /* Hide empty days in agenda mode */
    .mr-day--empty { display: none !important; }

    .mr-day {
        border-radius: 16px;
    }

    .mr-day__head {
        display: flex;
        align-items: center;
        gap: 10px;
        text-align: left;
        padding: 10px 14px;
    }

    .mr-day__name {
        font-size: .65rem;
        letter-spacing: .06em;
    }

    .mr-day__num {
        font-size: 1.2rem;
        margin: 0;
    }

    .mr-day__today-badge { margin: 0 0 0 auto; }

    .mr-day__body {
        flex-direction: row;
        flex-wrap: wrap;
        min-height: 0;
        padding: 10px;
        gap: 8px;
    }

    .mr-card {
        flex: 1 1 calc(50% - 4px);
        min-width: 130px;
    }

    .mr-toggle__btn { padding: 6px 14px; }
}

/* ── Empty week (all days empty for current tab) ── */
.mr-empty-week[hidden] { display: none; }


/* =========================================================
   SALE HISTORY (sh-*) — Admin historial de ventas
   ========================================================= */

/* Table wrapper */
.sh-table-wrap {
    border: 1px solid rgba(129,59,29,.10);
    border-radius: 16px;
    overflow: hidden;
    overflow-x: auto;
}

/* Table base */
.sh-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
}

.sh-table thead th {
    background: rgba(255,248,244,.85);
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: rgba(129,59,29,.55);
    padding: 11px 16px;
    border-bottom: 1.5px solid rgba(129,59,29,.10);
    white-space: nowrap;
}

.sh-table thead th.sh-th--right { text-align: right; }

.sh-table tbody td {
    padding: 14px 16px;
    border-bottom: 1px solid rgba(129,59,29,.06);
    vertical-align: middle;
}

.sh-table tbody tr:last-child td { border-bottom: none; }

.sh-table tbody tr:hover td { background: rgba(255,248,244,.55); }

/* Client cell */
.sh-client-name {
    font-weight: 700;
    font-size: .92rem;
    color: var(--nalia-ink);
    line-height: 1.2;
}

.sh-client-email {
    font-size: .75rem;
    color: var(--nalia-text-3);
    margin-top: 2px;
}

/* Date cell */
.sh-date-day {
    font-size: .88rem;
    font-weight: 600;
    color: var(--nalia-ink);
    white-space: nowrap;
}

.sh-date-time {
    font-size: .75rem;
    color: var(--nalia-text-3);
    margin-top: 1px;
}

/* Amount cell */
.sh-amount {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--nalia-ink);
    letter-spacing: -.01em;
    white-space: nowrap;
}

.sh-amount--free {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .78rem;
    font-weight: 600;
    color: #1a9454;
    background: rgba(47,191,113,.10);
    border: 1px solid rgba(47,191,113,.22);
    border-radius: 99px;
    padding: 3px 10px;
    white-space: nowrap;
}

/* Plan tag */
.sh-plan-tag {
    display: inline-block;
    font-size: .74rem;
    font-weight: 600;
    color: rgba(129,59,29,.80);
    background: rgba(168,124,105,.10);
    border: 1px solid rgba(168,124,105,.18);
    border-radius: 99px;
    padding: 3px 10px;
    white-space: nowrap;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sh-plan-tag--free {
    color: #1a7a42;
    background: rgba(47,191,113,.08);
    border-color: rgba(47,191,113,.20);
}

/* Notes */
.sh-notes {
    font-size: .78rem;
    color: var(--nalia-text-3);
    max-width: 180px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Summary bar */
.sh-summary {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    padding: 10px 0 14px;
}

.sh-summary-item {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.sh-summary-label {
    font-size: .7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: rgba(129,59,29,.45);
}

.sh-summary-value {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--nalia-ink);
    letter-spacing: -.02em;
}

.sh-summary-sep {
    width: 1px;
    height: 32px;
    background: rgba(129,59,29,.10);
    flex-shrink: 0;
}

/* Pagination */
.sh-pagination .page-link {
    border-radius: 8px !important;
    border: 1px solid rgba(129,59,29,.14);
    color: var(--nalia-ink);
    font-size: .82rem;
    padding: 6px 13px;
    margin: 0 2px;
    background: rgba(255,255,255,.9);
    transition: background .15s, box-shadow .15s;
}

.sh-pagination .page-link:hover {
    background: rgba(168,124,105,.10);
    color: var(--nalia-ink);
    border-color: rgba(129,59,29,.22);
}

.sh-pagination .page-item.active .page-link {
    background: var(--nalia-ink) !important;
    border-color: var(--nalia-ink) !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(129,59,29,.22);
}

.sh-pagination .page-item.disabled .page-link {
    color: rgba(129,59,29,.28) !important;
    border-color: rgba(129,59,29,.08) !important;
    background: transparent !important;
}

.sh-page-info {
    font-size: .8rem;
    color: var(--nalia-text-3);
}

/* =========================================================
   TÉRMINOS — checkbox de aceptación legal en registro
   ========================================================= */
.nalia-terms-check {
    margin: 18px 0 4px;
}

.nalia-terms-label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    user-select: none;
}

/* Ocultar el checkbox nativo */
.nalia-terms-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

/* Caja visual personalizada */
.nalia-terms-box {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 2px;
    border: 1.5px solid rgba(168,124,105,.45);
    border-radius: 5px;
    background: rgba(255,255,255,.72);
    transition: background .15s, border-color .15s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nalia-terms-box::after {
    content: '';
    display: block;
    width: 5px;
    height: 9px;
    border: 2px solid #fff;
    border-top: none;
    border-left: none;
    transform: rotate(45deg) translate(-1px, -1px);
    opacity: 0;
    transition: opacity .12s;
}

.nalia-terms-input:checked + .nalia-terms-box {
    background: var(--nalia-coffee);
    border-color: var(--nalia-coffee);
}

.nalia-terms-input:checked + .nalia-terms-box::after {
    opacity: 1;
}

.nalia-terms-input:focus-visible + .nalia-terms-box {
    outline: 2px solid var(--nalia-coffee);
    outline-offset: 2px;
}

.nalia-terms-text {
    font-size: .84rem;
    color: var(--nalia-text-2);
    line-height: 1.5;
}

.nalia-terms-link {
    color: var(--nalia-coffee);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: rgba(194,150,122,.4);
    text-underline-offset: 2px;
    transition: color .14s;
}

.nalia-terms-link:hover {
    color: var(--nalia-ink);
    text-decoration-color: var(--nalia-ink);
}

.nalia-terms-error {
    display: block;
    margin-top: 6px;
    margin-left: 28px;
    font-size: .8rem;
    color: #c0392b;
}

/* =========================================================
   PÁGINAS LEGALES  (/legal/terms  /legal/privacy)
   ========================================================= */
.nalia-legal-page {
    max-width: 700px !important;
}

.nalia-legal-card {
    background: var(--nalia-card, #fff);
    border: 1px solid var(--nalia-border);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 2px 16px rgba(0,0,0,.06);
}

.nalia-legal-header {
    padding: 2rem 2.2rem 1.5rem;
    background: linear-gradient(135deg, rgba(229,208,199,.22) 0%, rgba(252,241,239,.80) 100%);
    border-bottom: 1px solid var(--nalia-border);
}

.nalia-legal-kicker {
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--nalia-coffee);
    margin-bottom: .4rem;
}

.nalia-legal-title {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--nalia-ink);
    margin: 0 0 .5rem;
    letter-spacing: -.03em;
}

.nalia-legal-meta {
    font-size: .78rem;
    color: var(--nalia-text-3);
}

.nalia-legal-body {
    padding: 1.8rem 2.2rem;
    color: var(--nalia-text-2);
    line-height: 1.7;
}

.nalia-legal-section {
    margin-bottom: 1.8rem;
}

.nalia-legal-section h2 {
    font-size: .95rem;
    font-weight: 700;
    color: var(--nalia-ink);
    margin-bottom: .55rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--nalia-border);
}

.nalia-legal-section p,
.nalia-legal-section ul {
    font-size: .9rem;
    margin-bottom: .6rem;
}

.nalia-legal-section ul {
    padding-left: 1.4rem;
}

.nalia-legal-section li {
    margin-bottom: .3rem;
}

.nalia-legal-placeholder {
    margin-top: 1.4rem;
    padding: .9rem 1.1rem;
    background: rgba(255,243,205,.60);
    border: 1px solid rgba(240,173,78,.38);
    border-radius: 10px;
    font-size: .82rem;
    color: #7a5800;
}

.nalia-legal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 2.2rem 1.2rem;
    border-top: 1px solid var(--nalia-border);
    gap: 12px;
    flex-wrap: wrap;
}

.nalia-legal-sibling-link {
    font-size: .82rem;
    font-weight: 600;
    color: var(--nalia-coffee);
    text-decoration: none;
    transition: color .14s;
}

.nalia-legal-sibling-link:hover {
    color: var(--nalia-ink);
}

.nalia-legal-back {
    font-size: .82rem;
    color: var(--nalia-text-3);
    text-decoration: none;
    transition: color .14s;
}

.nalia-legal-back:hover {
    color: var(--nalia-ink);
}

@media (max-width: 575.98px) {
    .nalia-legal-header,
    .nalia-legal-body,
    .nalia-legal-footer {
        padding-left: 1.2rem;
        padding-right: 1.2rem;
    }
}

/* =========================================================
   ANALYTICS (an-*) — Admin: dashboard de asistencia
   ========================================================= */

/* ── Filtro de período: pills ───────────────────────────── */
.an-filter-bar {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.an-filter-pills {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.an-filter-pill {
    display: inline-flex;
    align-items: center;
    padding: 6px 16px;
    border-radius: 999px;
    border: 1px solid var(--nalia-border);
    background: rgba(255,255,255,.75);
    color: var(--nalia-text-2);
    font-size: .8rem;
    font-weight: 700;
    text-decoration: none;
    transition: background .15s, border-color .15s, color .15s;
    white-space: nowrap;
}

.an-filter-pill.is-active {
    background: var(--nalia-coffee);
    border-color: var(--nalia-coffee);
    color: #fff;
    box-shadow: 0 2px 8px rgba(168,124,105,.30);
}

.an-filter-pill:hover:not(.is-active) {
    background: var(--nalia-accent-soft);
    border-color: var(--nalia-beige);
    color: var(--nalia-ink);
    text-decoration: none;
}

.an-filter-custom {
    padding-top: 4px;
}

/* ── Banda de período ───────────────────────────────────── */
.an-period-strip {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    background: rgba(255,255,255,.65);
    border: 1px solid rgba(129,59,29,.09);
    border-radius: 12px;
    padding: 11px 16px;
}

.an-period-strip__label {
    font-weight: 800;
    font-size: .88rem;
    color: var(--nalia-ink);
}

.an-period-strip__dates {
    font-size: .78rem;
    color: var(--nalia-text-3);
    font-weight: 600;
    margin-top: 1px;
}

.an-period-strip__sep {
    width: 1px;
    height: 28px;
    background: var(--nalia-border);
    flex-shrink: 0;
    align-self: center;
}

.an-period-strip__stat {
    display: flex;
    flex-direction: column;
}

.an-period-strip__stat-val {
    font-weight: 900;
    font-size: 1rem;
    color: var(--nalia-coffee);
    line-height: 1.1;
    letter-spacing: -.02em;
}

.an-period-strip__stat-lbl {
    font-size: .66rem;
    color: var(--nalia-text-3);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* ── Section title ──────────────────────────────────────── */
.an-section-title {
    font-weight: 950;
    font-size: .95rem;
    color: var(--nalia-ink);
    letter-spacing: -.01em;
    display: flex;
    align-items: center;
    gap: 7px;
}

.an-section-title i {
    color: var(--nalia-coffee);
    opacity: .75;
    font-size: .9rem;
}

.an-section-title__sub {
    font-size: .75rem;
    font-weight: 600;
    color: var(--nalia-text-3);
    margin-left: auto;
}

/* ── KPI cards ──────────────────────────────────────────── */
.an-kpi-card {
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(129,59,29,.10);
    border-radius: 16px;
    padding: 16px 14px 14px;
    position: relative;
    overflow: hidden;
    height: 100%;
}

.an-kpi-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--nalia-nude), var(--nalia-beige));
    border-radius: 16px 16px 0 0;
}

.an-kpi-card--green {
    background: rgba(107,143,113,.08);
    border-color: rgba(107,143,113,.20);
}

.an-kpi-card--green::before {
    background: linear-gradient(90deg, #a8c5ac, #6b8f71);
}

.an-kpi-card--warn {
    background: #fff9ec;
    border-color: rgba(255,160,0,.25);
}

.an-kpi-card--warn::before {
    background: linear-gradient(90deg, #ffe082, #ffa000);
}

.an-kpi-card__icon {
    font-size: 1.1rem;
    color: var(--nalia-coffee);
    opacity: .70;
    margin-bottom: 10px;
    display: block;
}

.an-kpi-card--green .an-kpi-card__icon {
    color: #5a7d60;
    opacity: .85;
}

.an-kpi-card--warn .an-kpi-card__icon {
    color: #b45309;
    opacity: 1;
}

.an-kpi-card__value {
    font-size: 1.75rem;
    font-weight: 950;
    line-height: 1;
    color: var(--nalia-ink);
    letter-spacing: -.04em;
}

.an-kpi-card__unit {
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0;
    opacity: .75;
}

.an-kpi-card__label {
    font-size: .7rem;
    font-weight: 700;
    color: var(--nalia-text-3);
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-top: 7px;
    line-height: 1.3;
}

.an-kpi-card__sub {
    font-size: .67rem;
    color: var(--nalia-text-3);
    margin-top: 3px;
    opacity: .75;
    line-height: 1.3;
}

/* ── Stats secundarias (pills row) ─────────────────────── */
.an-stats-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.an-stats-pill {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,.80);
    border: 1px solid rgba(129,59,29,.10);
    border-radius: 12px;
    padding: 10px 14px;
    flex: 1;
    min-width: 90px;
}

.an-stats-pill__icon {
    font-size: 1.15rem;
    color: var(--nalia-coffee);
    opacity: .65;
    flex-shrink: 0;
}

.an-stats-pill--warn .an-stats-pill__icon {
    color: #b45309;
    opacity: 1;
}

.an-stats-pill__body {
    flex: 1;
    min-width: 0;
}

.an-stats-pill__val {
    font-size: 1.2rem;
    font-weight: 900;
    color: var(--nalia-ink);
    letter-spacing: -.03em;
    line-height: 1;
}

.an-stats-pill--warn .an-stats-pill__val {
    color: #92400e;
}

.an-stats-pill__lbl {
    font-size: .67rem;
    color: var(--nalia-text-3);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-top: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Analytics blocks (chart containers) ───────────────── */
.an-block {
    background: rgba(255,255,255,.78);
    border: 1px solid rgba(129,59,29,.09);
    border-radius: 16px;
    padding: 18px 18px 14px;
    overflow: hidden;
}

.an-block__head {
    margin-bottom: 16px;
}

.an-block__title {
    font-weight: 800;
    font-size: .9rem;
    color: var(--nalia-ink);
    display: flex;
    align-items: center;
    gap: 7px;
}

.an-block__title i {
    color: var(--nalia-coffee);
    opacity: .7;
}

.an-block__sub {
    font-size: .74rem;
    color: var(--nalia-text-3);
    margin-top: 3px;
    font-weight: 600;
}

.an-block__chart {
    position: relative;
    height: 230px;
}

.an-block__chart--sm {
    height: 190px;
}

/* ── Empty states ───────────────────────────────────────── */
.an-empty-chart {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 80px;
    color: var(--nalia-text-3);
    font-size: .82rem;
    font-weight: 600;
}

.an-empty-chart i {
    font-size: 1.1rem;
    opacity: .5;
}

.an-empty-state {
    text-align: center;
    padding: 36px 24px;
}

.an-empty-state__icon {
    display: block;
    font-size: 2.2rem;
    color: var(--nalia-coffee);
    opacity: .25;
    margin-bottom: 12px;
}

.an-empty-state__text {
    font-weight: 700;
    font-size: .9rem;
    color: var(--nalia-text-2);
    margin-bottom: 4px;
}

.an-empty-state__hint {
    font-size: .78rem;
    color: var(--nalia-text-3);
    font-weight: 600;
}

/* ── Rank badges (top clientas) ─────────────────────────── */
.an-rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 900;
    flex-shrink: 0;
    background: rgba(129,59,29,.08);
    color: var(--nalia-text-3);
    border: 1px solid rgba(129,59,29,.12);
}

.an-rank-badge--1 {
    background: linear-gradient(135deg, #FFD700, #FFA000);
    color: #7a5200;
    border-color: transparent;
    box-shadow: 0 2px 6px rgba(255,165,0,.30);
}

.an-rank-badge--2 {
    background: linear-gradient(135deg, #D8D8D8, #A8A8A8);
    color: #4a4a4a;
    border-color: transparent;
}

.an-rank-badge--3 {
    background: linear-gradient(135deg, #CDA882, #A07840);
    color: #5a3a10;
    border-color: transparent;
}

/* ── Checkin value accent ───────────────────────────────── */
.an-checkin-val {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--nalia-coffee);
    letter-spacing: -.02em;
}