/* ============================================================
   motion.css — strat SUBTIL de micro-interacțiuni pentru battle_platform
   (task t_380ab6fc — „ceva animare, dar nu prea mare")

   Reguli din design-system/DESIGN_SYSTEM.md:
   - tranziții 180ms cubic-bezier(.2,.8,.2,1)
   - hover pe card/buton: translateY(-2/-1px) + umbră mărită
   - active: scale(.98)
   - focus ring vizibil (2px, offset 2px) — accesibilitate
   - reveal subtil la încărcare (fade-up, stagger mic)
   - TOTUL se dezactivează la prefers-reduced-motion

   Doar micro-tranziții pe transform/opacity/background — fără animații
   continue, fără filtre/backdrop-filter (viteză).
   ============================================================ */

:root {
    --ui-ease: cubic-bezier(.2, .8, .2, 1);
    --ui-t: 180ms;
}

/* --- carduri: urcare subtilă + umbră la hover --- */
.card, .login-card, .filter-card, .stat-card {
    transition: transform var(--ui-t) var(--ui-ease),
                box-shadow var(--ui-t) var(--ui-ease),
                border-color var(--ui-t) var(--ui-ease);
}
@media (hover: hover) {
    .card:hover, .login-card:hover, .filter-card:hover, .stat-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(0, 0, 0, .28);
    }
}

/* --- butoane: micro-ridicare la hover, apăsare fermă --- */
button, .btn, .btn-primary, .btn-success, .btn-danger, .train-btn {
    transition: transform var(--ui-t) var(--ui-ease),
                box-shadow var(--ui-t) var(--ui-ease),
                background-color var(--ui-t) var(--ui-ease),
                border-color var(--ui-t) var(--ui-ease),
                color var(--ui-t) var(--ui-ease),
                opacity var(--ui-t) var(--ui-ease);
}
@media (hover: hover) {
    button:hover:not(:disabled), .train-btn:hover {
        transform: translateY(-1px);
    }
}
button:active:not(:disabled), .train-btn:active {
    transform: scale(.98);
}
button:disabled {
    cursor: not-allowed;
}

/* --- rânduri de tabel: fundal care se topește, nu apare --- */
table tbody tr {
    transition: background-color var(--ui-t) var(--ui-ease);
}

/* --- focus vizibil (accesibilitate, design system) --- */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
    outline: 2px solid #60a5fa;
    outline-offset: 2px;
}

/* --- reveal subtil la încărcare: secțiunile de nivel 1, stagger mic ---
   fill „backwards" (nu „both") ca să NU blocheze transform-ul de hover
   după încheierea animației. Se aplică o singură dată la load —
   containerele reîmprospătate live își schimbă doar copiii, fără re-animare. */
@keyframes bpFadeUp {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: none; }
}
.main-content > *, .login-card {
    animation: bpFadeUp 320ms var(--ui-ease) backwards;
}
.main-content > *:nth-child(2) { animation-delay: 40ms; }
.main-content > *:nth-child(3) { animation-delay: 80ms; }
.main-content > *:nth-child(4) { animation-delay: 120ms; }
.main-content > *:nth-child(5) { animation-delay: 160ms; }
.main-content > *:nth-child(6) { animation-delay: 200ms; }

/* --- totul se oprește pentru utilizatorii cu reduced-motion --- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation: none !important;
        transition: none !important;
    }
    .card:hover, .login-card:hover, .filter-card:hover, .stat-card:hover,
    button:hover:not(:disabled) {
        transform: none;
    }
}