/* ═══════════════════════════════════════════════════════════
   Cybernostra CMS — Tema Turbo Vision Refinado
   ═══════════════════════════════════════════════════════════ */

/* ── Tokens globais ───────────────────────────────────────── */
:root {
    /* Paleta base */
    --tv-bg-a:              #001f8f;
    --tv-bg-b:              #0027aa;
    --tv-panel-blue:        #0032b8;
    --tv-panel-blue-dark:   #00238b;
    --tv-menu-bg:           #c0c0c0;
    --tv-menu-border:       #8a8a8a;
    --tv-yellow:            #ffff00;
    --tv-white:             #ffffff;
    --tv-black:             #000000;
    --tv-red-cursor:        #aa0000;

    /* Paleta pública (azul/ciano) */
    --tv-pub-bg-a:          #002b55;
    --tv-pub-bg-b:          #003870;
    --tv-pub-panel:         #004488;
    --tv-pub-panel-dark:    #003366;
    --tv-pub-accent:        #00d4ff;

    /* Paleta admin (azul/cinza) */
    --tv-adm-bg-a:          #0a0a1a;
    --tv-adm-bg-b:          #0f0f2a;
    --tv-adm-panel:         #1a1a3a;
    --tv-adm-panel-dark:    #111128;
    --tv-adm-accent:        #a0a0c0;

    /* Paleta login (escuro) */
    --tv-lgn-bg-a:          #090918;
    --tv-lgn-bg-b:          #0d0d22;
    --tv-lgn-panel:         #14143a;
    --tv-lgn-panel-dark:    #0f0f28;
    --tv-lgn-accent:        #6060ff;

    /* Sombra DOS bloco */
    --tv-shadow-dos:
        0 0 0 2px var(--tv-white),
        0 0 0 4px var(--tv-black),
        0 0 0 6px var(--tv-white),
        8px 8px 0 var(--tv-black);
}

/* ── Base ─────────────────────────────────────────────────── */
body {
    font-family: 'Courier New', Courier, monospace;
    color: var(--tv-white);
}

/* ── Fundo xadrez ASCII 176 (░) — estilo Turbo Pascal 7 ───── */
/* Tile 8×8px: dois blocos 4×4 alternados (xadrez 50%) em teal escuro */
.tv-theme {
    background-color: #002040;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Crect width='8' height='8' fill='%23002040'/%3E%3Crect x='0' y='0' width='4' height='4' fill='%23003870'/%3E%3Crect x='4' y='4' width='4' height='4' fill='%23003870'/%3E%3C/svg%3E");
    background-size: 8px 8px;
    image-rendering: pixelated;
}

/* ── Paleta Pública (azul/ciano — leitura de artigos) ──────── */
/* Teal mais saturado, dois tons de azul-ciano */
.tv-palette-public {
    background-color: #002855;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Crect width='8' height='8' fill='%23002855'/%3E%3Crect x='0' y='0' width='4' height='4' fill='%23004A8A'/%3E%3Crect x='4' y='4' width='4' height='4' fill='%23004A8A'/%3E%3C/svg%3E");
    background-size: 8px 8px;
    image-rendering: pixelated;
}
.tv-palette-public .w3-content.w3-card-4 {
    background: linear-gradient(180deg, var(--tv-pub-panel), var(--tv-pub-panel-dark)) !important;
    border-top-color:   var(--tv-pub-accent) !important;
    border-left-color:  var(--tv-pub-accent) !important;
}
.tv-palette-public .w3-blue-grey { background-color: var(--tv-pub-panel-dark) !important; }

/* ── Paleta Admin (quase preto — área de gerenciamento) ─────── */
/* Xadrez cinza-azulado muito escuro — atmosfera de IDE */
.tv-palette-admin {
    background-color: #0A0A1A;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Crect width='8' height='8' fill='%230A0A1A'/%3E%3Crect x='0' y='0' width='4' height='4' fill='%231A1A3A'/%3E%3Crect x='4' y='4' width='4' height='4' fill='%231A1A3A'/%3E%3C/svg%3E");
    background-size: 8px 8px;
    image-rendering: pixelated;
}
.tv-palette-admin .w3-content.w3-card-4 {
    background: linear-gradient(180deg, var(--tv-adm-panel), var(--tv-adm-panel-dark)) !important;
    border-top-color:   var(--tv-adm-accent) !important;
    border-left-color:  var(--tv-adm-accent) !important;
}
.tv-palette-admin .w3-blue-grey  { background-color: var(--tv-adm-panel-dark) !important; }
.tv-palette-admin .tv-menu       { background: #3a3a5a !important; }
.tv-palette-admin .tv-menu .w3-bar-item { color: #e0e0ff !important; }

/* ── Paleta Login (preto profundo) ────────────────────────── */
/* Xadrez quase imperceptível — austeridade máxima */
.tv-palette-login {
    background-color: #080818;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Crect width='8' height='8' fill='%23080818'/%3E%3Crect x='0' y='0' width='4' height='4' fill='%23141432'/%3E%3Crect x='4' y='4' width='4' height='4' fill='%23141432'/%3E%3C/svg%3E");
    background-size: 8px 8px;
    image-rendering: pixelated;
}
.tv-palette-login .w3-content.w3-card-4 {
    background: linear-gradient(180deg, var(--tv-lgn-panel), var(--tv-lgn-panel-dark)) !important;
    border-top-color:   var(--tv-lgn-accent) !important;
    border-left-color:  var(--tv-lgn-accent) !important;
}
.tv-palette-login .w3-blue-grey { background-color: var(--tv-lgn-panel-dark) !important; }

/* ── Painel principal — Borda dupla ASCII + Sombra DOS ─────── */
.tv-theme .w3-content.w3-card-4 {
    background: linear-gradient(180deg, var(--tv-panel-blue), var(--tv-panel-blue-dark)) !important;
    /* Borda externa visível */
    border: 2px solid var(--tv-white) !important;
    /* Borda dupla: inner white → gap black → outer white → sombra DOS bloco */
    box-shadow:
        inset  0  0 0 3px var(--tv-white),
        inset  0  0 0 5px var(--tv-black),
        inset  0  0 0 7px rgba(255,255,255,.25),
        8px 8px 0 0 var(--tv-black);
    color: var(--tv-yellow);
}

/* Sombra DOS em cards menores */
.tv-theme .w3-card-4 {
    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.15),
        6px 6px 0 var(--tv-black);
}

/* Sombra DOS nos modais */
.tv-theme .w3-modal-content {
    box-shadow:
        0 0 0 2px var(--tv-white),
        0 0 0 4px var(--tv-black),
        0 0 0 6px var(--tv-white),
        10px 10px 0 var(--tv-black);
}

/* ── W3.css overrides gerais ──────────────────────────────── */
.w3-blue-grey       { background-color: var(--tv-panel-blue-dark) !important; }
.w3-text-yellow     { color: var(--tv-yellow) !important; }
.w3-border-yellow   { border-color: var(--tv-yellow) !important; }
.w3-border-blue-grey{ border-color: var(--tv-menu-border) !important; }

header h1 {
    font-weight: bold;
    letter-spacing: 2px;
    text-shadow: 1px 1px var(--tv-black), 2px 2px 0 rgba(0,0,0,.6);
}

/* ── Menu Turbo Vision ────────────────────────────────────── */
.tv-theme .tv-menu {
    background: var(--tv-menu-bg) !important;
    border-color: var(--tv-menu-border) !important;
}

.tv-theme .tv-menu .w3-bar-item {
    color: var(--tv-black) !important;
    border-right: 1px solid var(--tv-menu-border);
    font-weight: bold;
    letter-spacing: .05em;
}

.tv-theme .tv-menu .w3-bar-item:hover,
.tv-theme .tv-menu .w3-bar-item:focus,
.tv-theme .tv-menu .w3-bar-item.tv-cursor {
    background: var(--tv-red-cursor) !important;
    color: var(--tv-white) !important;
    outline: 1px solid var(--tv-white);
    outline-offset: -2px;
}

.w3-bar-item:last-child { border-right: none; }

/* ── Layout ───────────────────────────────────────────────── */
main { min-height: 70vh; }

/* ── Formulários ──────────────────────────────────────────── */
.w3-input {
    border-color: var(--tv-white) !important;
    background-color: #001a66 !important;
    color: var(--tv-yellow) !important;
}
.w3-input:focus {
    border-color: var(--tv-yellow) !important;
    outline: none;
}
.w3-select,
textarea.w3-input {
    background-color: #001a66 !important;
    color: var(--tv-yellow) !important;
}

fieldset {
    border: 2px solid var(--tv-white) !important;
    padding: 1rem;
    margin-top: 1rem;
}
legend {
    color: var(--tv-yellow);
    font-weight: bold;
    padding: 0 .5rem;
}

/* ── Botões ───────────────────────────────────────────────── */
button, .w3-button {
    font-family: 'Courier New', Courier, monospace;
    text-transform: uppercase;
}
.tv-theme .w3-button {
    border: 1px solid var(--tv-white) !important;
    box-shadow: 3px 3px 0 var(--tv-black);
    transition: box-shadow .08s ease, transform .08s ease;
}
.tv-theme .w3-button:active {
    box-shadow: none !important;
    transform: translate(3px, 3px);
}
.tv-theme .w3-button.w3-blue-grey {
    background: var(--tv-menu-bg) !important;
    color: var(--tv-black) !important;
}
.tv-theme .w3-button.w3-blue-grey:hover,
.tv-theme .w3-button.w3-blue-grey:focus {
    background: var(--tv-red-cursor) !important;
    color: var(--tv-white) !important;
}

/* ── Links ────────────────────────────────────────────────── */
a           { color: var(--tv-yellow); }
a:hover     { color: var(--tv-white); }

/* ── Painéis e tabelas ────────────────────────────────────── */
.tv-theme .w3-black { background-color: transparent !important; }
.tv-theme .w3-panel,
.tv-theme table,
.tv-theme .w3-table,
.tv-theme .w3-card  { border-color: var(--tv-white) !important; }

/* Badges */
.tv-theme .w3-badge {
    font-family: 'Courier New', Courier, monospace;
    font-weight: bold;
    outline: 1px solid var(--tv-black);
}

/* ── Footer ───────────────────────────────────────────────── */
footer {
    border-top: 1px solid var(--tv-menu-border) !important;
    font-size: .85em;
    letter-spacing: .03em;
}

/* ── Scrollbar retrô (Chromium) ───────────────────────────── */
::-webkit-scrollbar              { width: 12px; background: var(--tv-black); }
::-webkit-scrollbar-track        { background: #0a0a2e; }
::-webkit-scrollbar-thumb        { background: var(--tv-menu-bg); border: 2px solid var(--tv-black); }
::-webkit-scrollbar-thumb:hover  { background: var(--tv-red-cursor); }

/* ── Responsividade ───────────────────────────────────────── */
@media (max-width: 600px) {
    header h1 { font-size: 1.3rem; }
    .tv-theme .w3-content.w3-card-4 { box-shadow: 4px 4px 0 var(--tv-black); }
}
