/* ==========================================================================
   AOMania · re-tematizado medieval de las clases legacy (style.css)
   Se carga DESPUES de style.css y aomania.css. Reaprovecha los tokens de
   aomania.css (--piedra/--oro/--pergamino…). Objetivo: dar el look de piedra/
   pergamino/hierro a las paginas que aun usan las clases antiguas (beta, panel,
   admin) SIN tocar su markup ni sus formularios.
   ========================================================================== */

/* ── Fondo general (panel/admin no usan .ao-body) ───────────────────────────── */
body.panel-body,
.login-page {
    background: linear-gradient(180deg, var(--piedra-1) 0%, var(--piedra-2) 100%) !important;
    color: #efe4d2 !important;
    font-family: var(--serif) !important;
}

/* ── Botones ────────────────────────────────────────────────────────────────── */
.btn {
    font-family: var(--titulo) !important;
    letter-spacing: .04em;
    border-radius: 4px !important;
}
.btn-gold {
    background: linear-gradient(180deg, var(--oro-claro), var(--oro)) !important;
    color: var(--negro) !important;
    border: 1px solid var(--oro-oscuro) !important;
}
.btn-gold:hover { filter: brightness(1.06); }
.btn-outline {
    background: transparent !important;
    color: var(--oro-claro) !important;
    border: 1px solid rgba(201,162,74,.6) !important;
}
.btn-garnet {
    background: linear-gradient(180deg, var(--sangre), var(--sangre-oscura)) !important;
    color: var(--crema) !important;
    border: 1px solid var(--sangre) !important;
}

/* ── Tarjetas / paneles ─────────────────────────────────────────────────────── */
.card,
.panel,
.panel-card,
.store-card {
    background: linear-gradient(180deg, rgba(43,35,29,.6), rgba(25,19,16,.72)) !important;
    border: 1px solid rgba(201,162,74,.28) !important;
    color: #efe4d2 !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.35) !important;
}
.panel-corner { border-color: var(--oro) !important; }

/* ── Secciones / titulos legacy ─────────────────────────────────────────────── */
.section-eyebrow { color: var(--oro-claro) !important; font-family: var(--titulo) !important; }
.section-title   { font-family: var(--display) !important; color: var(--crema) !important; }
.section-sub     { color: var(--crema-apagada) !important; }

/* ── Formularios ────────────────────────────────────────────────────────────── */
.form-group label { color: var(--oro-claro) !important; font-family: var(--titulo) !important; letter-spacing: .04em; }
.form-group input,
.form-group textarea,
.form-group select,
input[type="text"], input[type="email"], input[type="password"], textarea, select {
    background: rgba(15,11,8,.55) !important;
    border: 1px solid rgba(201,162,74,.35) !important;
    color: var(--crema) !important;
    border-radius: 4px !important;
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
    border-color: var(--oro-claro) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(201,162,74,.2) !important;
}

/* ── Alertas ────────────────────────────────────────────────────────────────── */
.alert { border-radius: 4px !important; }
.alert-success { background: rgba(63,107,58,.22) !important; border: 1px solid rgba(63,107,58,.55) !important; color: #cfe6c6 !important; }
.alert-error   { background: rgba(140,42,48,.22) !important; border: 1px solid rgba(140,42,48,.6) !important;  color: #f0c9c2 !important; }
.alert-info    { background: rgba(44,74,114,.22) !important; border: 1px solid rgba(44,74,114,.55) !important; color: #cbdcf0 !important; }

/* ── Stats ──────────────────────────────────────────────────────────────────── */
.stat-card {
    background: rgba(43,35,29,.4) !important;
    border: 1px solid rgba(201,162,74,.25) !important;
}
.stat-value { color: var(--oro-claro) !important; font-family: var(--titulo) !important; }
.stat-label { color: var(--crema-apagada) !important; font-family: var(--titulo) !important; letter-spacing: .12em; }

/* ── Badges ─────────────────────────────────────────────────────────────────── */
.badge, .badge-clase {
    background: rgba(201,162,74,.16) !important;
    border: 1px solid rgba(201,162,74,.45) !important;
    color: var(--oro-claro) !important;
}
.badge-ok      { background: rgba(63,107,58,.22) !important; border-color: rgba(63,107,58,.55) !important; color: #cfe6c6 !important; }
.badge-pending { background: rgba(201,162,74,.16) !important; border-color: rgba(201,162,74,.45) !important; color: var(--oro-claro) !important; }

/* ── Tablas ─────────────────────────────────────────────────────────────────── */
.panel-table th { color: var(--oro-claro) !important; font-family: var(--titulo) !important; border-bottom: 1px solid rgba(201,162,74,.35) !important; }
.panel-table td { border-bottom: 1px solid rgba(201,162,74,.12) !important; color: #efe4d2 !important; }

/* ══ Panel de usuario ══════════════════════════════════════════════════════════ */
.panel-sidebar {
    background: linear-gradient(180deg, var(--madera-1), var(--madera-2)) !important;
    border-right: 1px solid rgba(201,162,74,.3) !important;
}
.panel-logo .logo-text,
.panel-username { color: var(--crema) !important; font-family: var(--titulo) !important; }
.panel-role { color: var(--crema-apagada) !important; }
.panel-avatar {
    background: linear-gradient(135deg, var(--oro-oscuro), var(--oro)) !important;
    color: var(--negro) !important; border: 2px solid var(--oro-claro) !important;
    font-family: var(--titulo) !important;
}
.panel-nav-link { color: var(--crema-apagada) !important; font-family: var(--titulo) !important; border-radius: 4px; }
.panel-nav-link:hover { color: var(--oro-claro) !important; background: rgba(0,0,0,.2) !important; }
.panel-nav-link.active {
    color: var(--negro) !important;
    background: linear-gradient(180deg, var(--oro-claro), var(--oro)) !important;
}
.panel-nav-sep { border-top: 1px solid rgba(201,162,74,.25) !important; }
.panel-logout { color: var(--sangre) !important; font-family: var(--titulo) !important; }
.panel-topbar { border-bottom: 1px solid rgba(201,162,74,.25) !important; }
.panel-page-title { font-family: var(--display) !important; color: var(--crema) !important; }
.nav-badge, .panel-topbar-notif span {
    background: var(--sangre) !important; color: var(--crema) !important;
}

/* ══ Login (panel/admin) ═══════════════════════════════════════════════════════ */
.login-box {
    background: linear-gradient(180deg, rgba(43,35,29,.85), rgba(25,19,16,.92)) !important;
    border: 1px solid rgba(201,162,74,.4) !important;
    box-shadow: 0 10px 40px rgba(0,0,0,.5) !important;
}
.login-logo .logo-text { color: var(--crema) !important; font-family: var(--titulo) !important; }
.gold { color: var(--oro-claro) !important; }