/* Tema dos botões do Ludus: placas de bronze com relevo (secundário), vermelho imperial com friso
   dourado (ação principal) e ouro (compras premium). Carregado depois do <style> do index.html. */
:root {
    --bronze-top: #4a3523;
    --bronze-mid: #2b1d12;
    --bronze-bottom: #1b120b;
    --bronze-edge: #8a6a3a;
    --gold-edge: #d9a94e;
    --gold-text: #f6e7c8;
    --imperial-top: #b3301f;
    --imperial-mid: #861f14;
    --imperial-bottom: #5e140c;
}

/* ---------- secundário: placa de bronze ---------- */
.act-btn {
    background: linear-gradient(180deg, var(--bronze-top) 0%, var(--bronze-mid) 52%, var(--bronze-bottom) 100%);
    border: 1px solid var(--bronze-edge);
    border-radius: 3px;
    color: var(--gold-text);
    text-shadow: 0 1px 0 #000;
    letter-spacing: .5px;
    box-shadow: inset 0 1px 0 rgba(255, 222, 160, .22), inset 0 -2px 0 rgba(0, 0, 0, .45), 0 2px 4px rgba(0, 0, 0, .55);
    transition: border-color .15s, box-shadow .15s, transform .08s, color .15s;
}
.act-btn:hover {
    background: linear-gradient(180deg, #5a4129 0%, #33231a 52%, #20150d 100%);
    border-color: var(--gold-edge);
    color: #fff4dc;
    box-shadow: inset 0 1px 0 rgba(255, 222, 160, .3), inset 0 -2px 0 rgba(0, 0, 0, .45), 0 0 10px rgba(217, 169, 78, .35);
}
.act-btn:active { transform: translateY(1px); box-shadow: inset 0 2px 4px rgba(0, 0, 0, .6); }
.act-btn.active {
    background: linear-gradient(180deg, #9a6a26 0%, #6b4515 55%, #4a2e0c 100%);
    border-color: #f0c766;
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 236, 180, .45), inset 0 -2px 0 rgba(0, 0, 0, .4), 0 0 12px rgba(240, 199, 102, .35);
}
.act-btn:focus-visible, .btn-advance-day:focus-visible, .btn-gold:focus-visible { outline: 2px solid #fde68a; outline-offset: 2px; }

/* ---------- principal: vermelho imperial com friso dourado ---------- */
.btn-advance-day {
    background: linear-gradient(180deg, var(--imperial-top) 0%, var(--imperial-mid) 55%, var(--imperial-bottom) 100%);
    border: 1px solid var(--gold-edge);
    border-radius: 3px;
    color: #fff3dc;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .8);
    box-shadow: inset 0 1px 0 rgba(255, 200, 160, .35), inset 0 -2px 0 rgba(0, 0, 0, .4), 0 2px 6px rgba(0, 0, 0, .6);
}
.btn-advance-day:hover {
    background: linear-gradient(180deg, #c8402c 0%, #9a2618 55%, #6c170e 100%);
    box-shadow: inset 0 1px 0 rgba(255, 210, 170, .45), inset 0 -2px 0 rgba(0, 0, 0, .4), 0 0 14px rgba(217, 169, 78, .45);
    transform: none;
}
.btn-advance-day:active { transform: translateY(1px); }
.btn-advance-day:disabled { filter: grayscale(.7) brightness(.7); cursor: default; box-shadow: none; }

/* ---------- premium: ouro (passe premium, compras com denários) ---------- */
.btn-gold {
    background: linear-gradient(180deg, #f3d27a 0%, #c9952f 50%, #8a5e17 100%);
    border: 1px solid #ffe7a3;
    border-radius: 3px;
    color: #2a1a08;
    font-family: var(--font-roman);
    font-weight: 900;
    text-shadow: 0 1px 0 rgba(255, 240, 200, .6);
    box-shadow: inset 0 1px 0 rgba(255, 250, 220, .7), inset 0 -2px 0 rgba(90, 55, 10, .5), 0 0 12px rgba(240, 190, 80, .45);
    cursor: pointer;
}
.btn-gold:hover { filter: brightness(1.08); }
.btn-gold:active { transform: translateY(1px); }
.btn-gold:disabled { filter: grayscale(.8) brightness(.75); cursor: default; box-shadow: none; }

/* contagem do próximo dia: placa principal, mas só leitura */
.day-timer { cursor: default; }
.day-timer:hover { background: linear-gradient(180deg, var(--imperial-top) 0%, var(--imperial-mid) 55%, var(--imperial-bottom) 100%); }

/* ícones pixel-art no lugar dos emoji (icons.js; arte em static/icons, tools/make_px_icons.py) */
.px-icon { width: 1.45em; height: 1.45em; object-fit: contain; image-rendering: pixelated; vertical-align: middle; margin-top: -.2em; flex: none; }
.slot-empty { filter: brightness(0) invert(.62) sepia(1) saturate(1.6); opacity: .45; }  /* encaixe vazio: silhueta de bronze do item básico */

/* chips do topo (passe, loja, admin): placas de bronze menores, mesma família dos botões */
.hud-chip { padding: 4px 10px; font-size: .78rem; gap: 5px; border-radius: 3px; text-decoration: none; }
.hud-chip.admin { border-color: #b91c1c; }

/* barras de rolagem das janelas: polegar de bronze num trilho escuro, no lugar da barra branca do sistema.
   Chrome/Edge/Firefox usam scrollbar-color; o ::-webkit-scrollbar fica para o Safari. */
.game-window, .game-window *, #battleResult { scrollbar-width: thin; scrollbar-color: var(--bronze-edge) rgba(0, 0, 0, .4); }
.game-window ::-webkit-scrollbar { width: 9px; height: 9px; }
.game-window ::-webkit-scrollbar-track { background: rgba(0, 0, 0, .4); }
.game-window ::-webkit-scrollbar-thumb { background: var(--bronze-edge); border: 2px solid #1b120b; border-radius: 5px; }
.game-window ::-webkit-scrollbar-thumb:hover { background: var(--gold-edge); }
.game-window ::-webkit-scrollbar-corner { background: transparent; }
