/* =========================================================
   alma_auth.css — ALMA · animación Nivel 3 (movimiento) para
   las vistas de auth, admin, config, errores y la ficha legacy.
   Scoped por gancho de página de cada vista.

   PATRÓN SEGURO: estado base VISIBLE (opacity:1). Entrada animada solo
   con @media (prefers-reduced-motion: no-preference). NO anima inputs.
   ========================================================= */
.auth-page, .landing-page, .admin-base-page, .admin-temarios-page,
.admin-temarios-revisar-page, .config-marca-page, .config-telegram-page,
.proximamente-page, .error-page, .error-404-page, .ficha-legacy-page {
    --alma-spring: cubic-bezier(.34, 1.56, .64, 1);
    --alma-ease:   cubic-bezier(.2, .7, .2, 1);
}

@keyframes authIn  { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes authRow { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: none; } }
@keyframes authPop { from { opacity: 0; transform: translateY(14px) scale(.96); } to { opacity: 1; transform: none; } }

/* =========================================================
   AUTH (login / registro / confirmación / cuenta) — .auth-page
   La card central entra con pop; el resto en cascada.
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .auth-page .auth-card, .auth-page .confirmacion-card {
        animation: authPop .55s var(--alma-spring) both;
    }
    .auth-page .auth-titulo   { animation: authIn .5s var(--alma-spring) both; animation-delay: .08s; }
    .auth-page .auth-subtitulo{ animation: authIn .5s var(--alma-spring) both; animation-delay: .12s; }
    .auth-page .auth-footer   { animation: authIn .5s var(--alma-spring) both; animation-delay: .20s; }
    /* secciones internas (cuenta tiene varias seccion-card) en cascada */
    .auth-page .seccion-card { animation: authIn .5s var(--alma-spring) both; }
    .auth-page .seccion-card:nth-of-type(1) { animation-delay: .06s; }
    .auth-page .seccion-card:nth-of-type(2) { animation-delay: .12s; }
    .auth-page .seccion-card:nth-of-type(n+3) { animation-delay: .16s; }
    .auth-page .confirmacion-icono { animation: authPop .5s var(--alma-spring) both; animation-delay: .14s; }
}
.auth-page .auth-card, .auth-page .confirmacion-card, .auth-page .seccion-card {
    transition: transform .25s var(--alma-spring), box-shadow .25s var(--alma-ease);
}
.auth-page .seccion-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--forge-elev-2, 0 2px 8px rgba(44,36,24,0.07));
}
.auth-page .btn-primario, .auth-page .btn-destructivo, .auth-page .toggle-perfil-btn,
.auth-page .tab-button {
    transition: transform .2s var(--alma-spring), box-shadow .2s var(--alma-ease), filter .14s;
}
.auth-page .btn-primario:hover, .auth-page .btn-destructivo:hover,
.auth-page .toggle-perfil-btn:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 8px 18px -8px rgba(44,36,24,.5);
}
.auth-page .btn-primario:active { transform: translateY(0) scale(.97); }
.auth-page .tab-button:hover { transform: translateY(-1px); }

/* =========================================================
   LANDING — .landing-page (hero)
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .landing-page .hero-titulo    { animation: authIn .6s var(--alma-spring) both; animation-delay: .04s; }
    .landing-page .hero-subtitulo { animation: authIn .6s var(--alma-spring) both; animation-delay: .12s; }
    .landing-page .hero-cta       { animation: authIn .6s var(--alma-spring) both; animation-delay: .20s; }
    .landing-page .waitlist-box   { animation: authPop .6s var(--alma-spring) both; animation-delay: .26s; }
    .landing-page .flash-waitlist { animation: authIn .5s var(--alma-spring) both; }
}
.landing-page .btn-primario, .landing-page .btn-secundario {
    transition: transform .22s var(--alma-spring), box-shadow .22s var(--alma-ease);
}
.landing-page .btn-primario:hover, .landing-page .btn-secundario:hover {
    transform: translateY(-3px) scale(1.03); box-shadow: 0 10px 22px -10px rgba(44,36,24,.5);
}
.landing-page .waitlist-box { transition: transform .25s var(--alma-spring), box-shadow .25s var(--alma-ease); }
.landing-page .waitlist-box:hover { transform: translateY(-3px); box-shadow: var(--forge-elev-2, 0 2px 8px rgba(44,36,24,0.08)); }

/* =========================================================
   ADMIN base shell — .admin-base-page
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .admin-base-page .admin-header { animation: authIn .5s var(--alma-spring) both; animation-delay: .02s; }
    .admin-base-page .admin-tabs   { animation: authIn .5s var(--alma-spring) both; animation-delay: .10s; }
    .admin-base-page .admin-kpi-tile { animation: authIn .45s var(--alma-spring) both; }
    .admin-base-page .admin-kpi-tile:nth-child(1) { animation-delay: .14s; }
    .admin-base-page .admin-kpi-tile:nth-child(2) { animation-delay: .19s; }
    .admin-base-page .admin-kpi-tile:nth-child(3) { animation-delay: .24s; }
    .admin-base-page .admin-kpi-tile:nth-child(n+4) { animation-delay: .28s; }
}
.admin-base-page .admin-tab { transition: transform .18s var(--alma-spring), background .15s, color .15s; }
.admin-base-page .admin-tab:hover { transform: translateY(-1px); }
.admin-base-page .admin-kpi-tile {
    transition: transform .25s var(--alma-spring), box-shadow .25s var(--alma-ease);
}
.admin-base-page .admin-kpi-tile:hover { transform: translateY(-3px) scale(1.02); box-shadow: var(--forge-elev-2, 0 2px 8px rgba(44,36,24,0.08)); }

/* =========================================================
   ADMIN temarios — .admin-temarios-page (.ad-card, .ad-table)
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .admin-temarios-page .flash, .admin-temarios-page .ad-card {
        animation: authIn .5s var(--alma-spring) both;
    }
    .admin-temarios-page .ad-card:nth-of-type(1) { animation-delay: .06s; }
    .admin-temarios-page .ad-card:nth-of-type(n+2) { animation-delay: .14s; }
    .admin-temarios-page .ad-table tbody tr { animation: authRow .4s var(--alma-spring) both; animation-delay: .18s; }
}
.admin-temarios-page .ad-card { transition: transform .25s var(--alma-spring), box-shadow .25s var(--alma-ease); }
.admin-temarios-page .ad-card:hover { transform: translateY(-2px); box-shadow: var(--forge-elev-2, 0 2px 8px rgba(44,36,24,0.07)); }
.admin-temarios-page .ad-table tbody tr { transition: background .15s, transform .2s var(--alma-ease); }
.admin-temarios-page .ad-table tbody tr:hover { transform: translateX(3px); }
.admin-temarios-page .btn-primary { transition: transform .2s var(--alma-spring), box-shadow .2s var(--alma-ease); }
.admin-temarios-page .btn-primary:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 8px 18px -8px rgba(44,36,24,.5); }

/* =========================================================
   ADMIN temarios revisar — .admin-temarios-revisar-page (.rv-card, .pregunta)
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .admin-temarios-revisar-page .rv-card, .admin-temarios-revisar-page .flash {
        animation: authIn .5s var(--alma-spring) both;
    }
    .admin-temarios-revisar-page .rv-card { animation-delay: .06s; }
    .admin-temarios-revisar-page .pregunta { animation: authIn .42s var(--alma-spring) both; }
    .admin-temarios-revisar-page .pregunta:nth-child(-n+8) { animation-delay: .14s; }
}
.admin-temarios-revisar-page .pregunta {
    transition: transform .22s var(--alma-spring), box-shadow .22s var(--alma-ease), border-color .2s;
}
.admin-temarios-revisar-page .pregunta:hover { transform: translateY(-2px); box-shadow: var(--forge-elev-2, 0 2px 8px rgba(44,36,24,0.07)); }
.admin-temarios-revisar-page .btn-mini { transition: transform .18s var(--alma-spring), filter .14s; }
.admin-temarios-revisar-page .btn-mini:hover { transform: translateY(-1px) scale(1.04); }
.admin-temarios-revisar-page .btn-mini:active { transform: scale(.95); }

/* =========================================================
   CONFIG marca — .config-marca-page
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .config-marca-page .marca-card, .config-marca-page .info-card {
        animation: authIn .5s var(--alma-spring) both;
    }
    .config-marca-page .marca-card:nth-of-type(1) { animation-delay: .06s; }
    .config-marca-page .marca-card:nth-of-type(2) { animation-delay: .12s; }
    .config-marca-page .marca-card:nth-of-type(n+3) { animation-delay: .16s; }
    .config-marca-page .swatch { animation: authPop .4s var(--alma-spring) both; animation-delay: .2s; }
}
.config-marca-page .marca-card, .config-marca-page .info-card {
    transition: transform .25s var(--alma-spring), box-shadow .25s var(--alma-ease);
}
.config-marca-page .marca-card:hover, .config-marca-page .info-card:hover {
    transform: translateY(-2px); box-shadow: var(--forge-elev-2, 0 2px 8px rgba(44,36,24,0.07));
}
.config-marca-page .swatch { transition: transform .2s var(--alma-spring); }
.config-marca-page .swatch:hover { transform: scale(1.08); }
.config-marca-page .btn-primario, .config-marca-page .btn-secundario {
    transition: transform .2s var(--alma-spring), box-shadow .2s var(--alma-ease);
}
.config-marca-page .btn-primario:hover, .config-marca-page .btn-secundario:hover {
    transform: translateY(-2px) scale(1.02); box-shadow: 0 8px 18px -8px rgba(44,36,24,.5);
}

/* =========================================================
   CONFIG telegram — .config-telegram-page
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .config-telegram-page .tg-flash, .config-telegram-page .tg-card {
        animation: authIn .5s var(--alma-spring) both;
    }
    .config-telegram-page .tg-card:nth-of-type(1) { animation-delay: .06s; }
    .config-telegram-page .tg-card:nth-of-type(n+2) { animation-delay: .14s; }
}
.config-telegram-page .tg-card { transition: transform .25s var(--alma-spring), box-shadow .25s var(--alma-ease); }
.config-telegram-page .tg-card:hover { transform: translateY(-2px); box-shadow: var(--forge-elev-2, 0 2px 8px rgba(44,36,24,0.07)); }
.config-telegram-page .btn-primario, .config-telegram-page .btn-secundario, .config-telegram-page .btn-pequeno {
    transition: transform .2s var(--alma-spring), box-shadow .2s var(--alma-ease);
}
.config-telegram-page .btn-primario:hover, .config-telegram-page .btn-secundario:hover, .config-telegram-page .btn-pequeno:hover {
    transform: translateY(-2px) scale(1.02); box-shadow: 0 8px 18px -8px rgba(44,36,24,.5);
}

/* =========================================================
   PRÓXIMAMENTE — .proximamente-page
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .proximamente-page .proximamente__badge  { animation: authPop .5s var(--alma-spring) both; animation-delay: .04s; }
    .proximamente-page .proximamente__icono   { animation: authPop .55s var(--alma-spring) both; animation-delay: .10s; }
    .proximamente-page .proximamente__titulo   { animation: authIn .5s var(--alma-spring) both; animation-delay: .16s; }
    .proximamente-page .proximamente__texto    { animation: authIn .5s var(--alma-spring) both; animation-delay: .20s; }
    .proximamente-page .proximamente__volver   { animation: authIn .5s var(--alma-spring) both; animation-delay: .26s; }
}
.proximamente-page .proximamente__volver { transition: transform .2s var(--alma-spring), box-shadow .2s var(--alma-ease); }
.proximamente-page .proximamente__volver:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 8px 18px -8px rgba(44,36,24,.5); }

/* =========================================================
   ERROR / 404 — .error-page / .error-404-page
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .error-page .error-card { animation: authPop .55s var(--alma-spring) both; }
    .error-page .error-badge { animation: authPop .5s var(--alma-spring) both; animation-delay: .12s; }
    .error-404-page .estado-vacio { animation: authPop .55s var(--alma-spring) both; }
}
.error-page .error-volver, .error-404-page .btn-primario {
    transition: transform .2s var(--alma-spring), box-shadow .2s var(--alma-ease);
}
.error-page .error-volver:hover, .error-404-page .btn-primario:hover {
    transform: translateY(-2px) scale(1.02); box-shadow: 0 8px 18px -8px rgba(44,36,24,.5);
}

/* =========================================================
   FICHA LEGACY — .ficha-legacy-page
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    .ficha-legacy-page .ficha-header, .ficha-legacy-page .info-banner,
    .ficha-legacy-page .flash, .ficha-legacy-page .seccion-card {
        animation: authIn .5s var(--alma-spring) both;
    }
    .ficha-legacy-page .ficha-header { animation-delay: .02s; }
    .ficha-legacy-page .seccion-card:nth-of-type(1) { animation-delay: .10s; }
    .ficha-legacy-page .seccion-card:nth-of-type(2) { animation-delay: .15s; }
    .ficha-legacy-page .seccion-card:nth-of-type(n+3) { animation-delay: .19s; }
}
.ficha-legacy-page .seccion-card { transition: transform .25s var(--alma-spring), box-shadow .25s var(--alma-ease); }
.ficha-legacy-page .seccion-card:hover { transform: translateY(-2px); box-shadow: var(--forge-elev-2, 0 2px 8px rgba(44,36,24,0.07)); }
.ficha-legacy-page .btn-primario, .ficha-legacy-page .btn-secundario {
    transition: transform .2s var(--alma-spring), box-shadow .2s var(--alma-ease);
}
.ficha-legacy-page .btn-primario:hover, .ficha-legacy-page .btn-secundario:hover {
    transform: translateY(-2px) scale(1.02); box-shadow: 0 8px 18px -8px rgba(44,36,24,.5);
}

/* =========================================================
   Accesibilidad: prefers-reduced-motion desactiva transiciones.
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
    .auth-page .auth-card, .auth-page .seccion-card, .auth-page .btn-primario,
    .auth-page .tab-button, .landing-page .btn-primario, .landing-page .waitlist-box,
    .admin-base-page .admin-tab, .admin-base-page .admin-kpi-tile,
    .admin-temarios-page .ad-card, .admin-temarios-page .ad-table tbody tr,
    .admin-temarios-revisar-page .pregunta, .admin-temarios-revisar-page .btn-mini,
    .config-marca-page .marca-card, .config-marca-page .swatch,
    .config-telegram-page .tg-card, .proximamente-page .proximamente__volver,
    .error-page .error-volver, .error-404-page .btn-primario,
    .ficha-legacy-page .seccion-card { transition: none !important; }
}
