/* Tema Vilma Enxovais: um só visual para todas as telas.
   Cores tiradas do logo: roxo (principal), dourado (detalhes) e creme (fundo do logo).
   Carregado depois do estilo de cada página, então o que está aqui vale por cima. */
:root{
  --bg:#f6f2fb; --panel:#ffffff; --fg:#2a1f3d; --muted:#6f6585; --line:#e6ddf3;
  --accent:#6b3fb5; --accent-soft:#f0e9fb; --brand:#c9b6f0; --brand-ink:#2a1f3d;
  --titulo:#3d2175; --gold:#c9a45c;
  --ok:#2f7d4f; --bad:#b4442f; --warn:#a8741a; --line2:#4f6d8a;
  --sombra:0 1px 2px rgba(61,33,117,.05),0 8px 20px -12px rgba(61,33,117,.22);
}
@media (prefers-color-scheme:dark){:root{
  --bg:#17121f; --panel:#221a2e; --fg:#f1ecf9; --muted:#a99fbd; --line:#392f4a;
  --accent:#c4a9f5; --accent-soft:#33264a; --brand:#9a7fdc; --brand-ink:#17121f;
  --titulo:#e4d8fb; --gold:#d9b876;
  --ok:#6cc08f; --bad:#e88672; --warn:#e0b25c; --line2:#8fb3d6;
  --sombra:0 1px 2px rgba(0,0,0,.3),0 8px 20px -12px rgba(0,0,0,.6);
  color-scheme:dark}}

::selection{background:color-mix(in srgb,var(--accent) 28%,transparent)}
body{background:var(--bg);color:var(--fg)}

/* Títulos: roxo do logo, com um traço dourado embaixo do título da página */
h1,h2{color:var(--titulo);letter-spacing:-.005em}
h1::after{content:"";display:block;width:44px;height:3px;border-radius:2px;background:var(--gold);margin-top:6px}
.login h1::after{margin-inline:auto}
.q h1::after,.item h1::after{display:none}

/* Mais respiro nas telas de painel (as que têm o menu direto na página) */
@media (min-width:861px){.wrap:has(> .side){padding:28px 32px 56px}}
section{gap:16px;margin-top:32px}

/* Menu lateral: roxo profundo, item ativo claro, detalhe dourado */
.side{background:linear-gradient(180deg,#2e1857 0%,#1f103c 100%);border-right:0;box-shadow:inset -1px 0 0 rgba(255,255,255,.06)}
.logo{border-bottom:1px solid rgba(217,184,118,.35);margin-bottom:12px}
@media (max-width:860px){.logo{border-bottom:0;margin-bottom:0}}
.nav a{color:#d3c6ec;border-radius:10px;transition:background .15s,color .15s}
.nav a:hover{background:rgba(255,255,255,.09);color:#fff}
.nav a[aria-current=page]{background:#f3ecff;color:#2e1857;box-shadow:inset 3px 0 0 var(--gold)}
.nav a:focus-visible{outline:2px solid #e3d5ff;outline-offset:2px}
.navcnt{background:#d9b876;color:#2e1857}
.nav a[aria-current=page] .navcnt{background:#2e1857;color:#f3ecff}
.usr{border-top-color:rgba(255,255,255,.14);color:#b9a9d8}
.usr button{color:#e3d5ff}

/* Cartões e painéis */
.card,.panel,.q,.item,.agir .it{border-radius:14px;box-shadow:var(--sombra)}
.card{padding:15px 16px}
.card .val{font-size:1.5rem}
@media (min-width:761px){.cards{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}}
h1.pg{margin-top:8px}
.card .lab{font-weight:600;letter-spacing:.01em}
.card .val{color:var(--titulo)}
button.card:hover,.item:hover{background:var(--accent-soft)}

/* Botões, filtros e campos */
.btn{border-radius:10px;color:#fff;background:#6b3fb5;transition:filter .15s;box-shadow:0 4px 12px -6px rgba(107,63,181,.7)}
.btn:hover{filter:brightness(1.1)}
.btn.sec{background:var(--panel);color:var(--fg);box-shadow:none}
.chip{transition:background .15s,border-color .15s}
.chip:hover{background:var(--accent-soft);border-color:var(--brand)}
.chip[aria-pressed=true],.chip[aria-pressed=true]:hover{background:#6b3fb5;border-color:#6b3fb5;color:#fff}
.tab[aria-selected=true]{border-color:var(--accent)}
input,select,textarea{border-radius:10px;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent);outline:0}
.custom input,.tools select,.tools input,.lista input,.lista select{border-radius:10px}
:focus-visible{outline-color:var(--accent)}
a{color:var(--accent)}
td a,.usr a{color:inherit}

/* Barra de período */
.bar{background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(6px)}

/* Tabelas: cabeçalho lilás, linhas com mais respiro e realce ao passar o mouse */
td,th{padding:9px 8px}
thead th{background:var(--accent-soft);color:var(--titulo);border-bottom:0}
thead th:first-child{border-radius:8px 0 0 8px} thead th:last-child{border-radius:0 8px 8px 0}
th.sort:hover{color:var(--accent)}
:where(tbody tr:hover) td{background:color-mix(in srgb,var(--accent-soft) 55%,transparent)}
.prod img,.cab img{border-radius:8px;border:1px solid var(--line)}
.tag{background:var(--accent-soft)}

/* Avisos */
.aviso,.erro,.okbox,.falta{border-radius:12px}

/* Login */
#login form{border-radius:16px;border-top:3px solid var(--gold);box-shadow:var(--sombra)}

@media (prefers-color-scheme:dark){
  .btn,.chip[aria-pressed=true],.chip[aria-pressed=true]:hover{background:#7d52c9;border-color:#7d52c9}
}
@media (max-width:860px){
  .side{box-shadow:none}
  .nav a[aria-current=page]{box-shadow:none}
}

/* Seletor de conta no menu lateral */
.conta-menu{display:flex;flex-direction:column;gap:5px;padding:0 4px 14px;font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#b9a9d8}
.conta-menu select{font:600 .95rem "Source Sans 3",system-ui,sans-serif;letter-spacing:0;text-transform:none;color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(217,184,118,.55);border-radius:10px;padding:8px 10px;width:100%;cursor:pointer}
.conta-menu select:focus{outline:2px solid #e3d5ff;outline-offset:2px;box-shadow:none;border-color:rgba(217,184,118,.55)}
.conta-menu option{color:#2a1f3d;background:#fff}
@media (max-width:860px){.conta-menu{flex-direction:row;align-items:center;padding:0;order:2;gap:8px}.conta-menu select{width:auto;padding:6px 8px}}