/* Institutional palette — Secretaria Municipal de Educação / Prefeitura de Belém do Piauí */
:root{
  --ink:#f5f8fc;
  --panel:#132a4d;
  --panel-2:#1b3862;
  --chalk:#0f2038;
  --chalk-dim:#4c5c78;
  --blue:#1c4fa0;
  --green:#1f8a4c;
  --accent:#f2a900;
  --accent-ink:#2a1a00;
  --line: rgba(15,32,56,0.12);
  --danger:#c0392b;
  --good:#1f8a4c;
  --shadow: 0 16px 36px -22px rgba(15,32,56,0.28);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#0c1930;
    --panel:#132a4d;
    --panel-2:#1b3862;
    --chalk:#eef3fb;
    --chalk-dim:#aab8d1;
    --blue:#5b8fd6;
    --green:#3fb56d;
    --accent:#f3b93a;
    --accent-ink:#241800;
    --line: rgba(238,243,251,0.16);
    --shadow: 0 18px 40px -20px rgba(0,0,0,0.55);
  }
}
:root[data-theme="dark"]{
  --ink:#0c1930;
  --panel:#132a4d;
  --panel-2:#1b3862;
  --chalk:#eef3fb;
  --chalk-dim:#aab8d1;
  --blue:#5b8fd6;
  --green:#3fb56d;
  --accent:#f3b93a;
  --accent-ink:#241800;
  --line: rgba(238,243,251,0.16);
  --shadow: 0 18px 40px -20px rgba(0,0,0,0.55);
}
:root[data-theme="light"]{
  --ink:#f5f8fc;
  --panel:#ffffff;
  --panel-2:#eef3fb;
  --chalk:#14213a;
  --chalk-dim:#51607a;
  --blue:#1c4fa0;
  --green:#1f8a4c;
  --accent:#f2a900;
  --accent-ink:#2a1a00;
  --line: rgba(20,33,58,0.12);
  --danger:#c0392b;
  --good:#1f8a4c;
  --shadow: 0 16px 36px -22px rgba(15,32,56,0.16);
}

*{box-sizing:border-box;}
html, body{ height:auto; }
body{
  margin:0;
  background:var(--ink);
  color:var(--chalk);
  font-family:"Work Sans", ui-sans-serif, system-ui, sans-serif;
  padding-inline:16px;
  padding-block: 24px 40px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{ font-family:"Fraunces", Georgia, serif; text-wrap:balance; margin:0; }
.wrap{ max-width:560px; margin:0 auto; }

.badge{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--panel-2); border:1px solid var(--line);
  color:var(--chalk-dim); font-size:12.5px; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase;
  padding:6px 12px; border-radius:999px;
}
.badge svg{ width:14px; height:14px; flex:none; }

header.hero{ text-align:center; padding-block:28px 18px; }
.crest-row{ display:flex; align-items:center; justify-content:center; gap:20px; margin-bottom:18px; }
.crest{ height:60px; width:auto; display:block; }
.crest-divider{ width:1px; height:38px; background:var(--line); }

.mini-header{
  display:flex; flex-direction:column; align-items:center; gap:10px;
  margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--line);
}
.mini-header .crest-row{ margin-bottom:0; gap:14px; }
.mini-header .crest{ height:36px; }
.mini-header .crest-divider{ height:26px; }
.mini-header .mini-title{
  font-family:"Fraunces", Georgia, serif; font-weight:700; font-size:18px; color:var(--chalk);
}
header.hero h1{ font-size:clamp(28px,7vw,38px); font-weight:700; color:var(--chalk); }
.tribute-box{
  margin-top:18px; margin-inline:auto; max-width:54ch;
  padding:18px 24px; border-radius:16px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--blue) 12%, var(--panel)), color-mix(in srgb, var(--accent) 16%, var(--panel)));
  border:1px solid var(--line);
}
header.hero p.tribute{
  margin:0; font-family:"Playfair Display","Fraunces", Georgia, serif; font-style:italic;
  font-weight:700; font-size:clamp(18px,4.3vw,22px); line-height:1.55;
  text-wrap:balance;
  color:var(--blue);
  background: linear-gradient(90deg, var(--blue), var(--green) 55%, var(--accent));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
header.hero p.sub{ margin-top:10px; color:var(--chalk-dim); font-size:15.5px; max-width:42ch; margin-inline:auto; }

.card{
  position:relative; overflow:hidden;
  background:var(--panel); border:1px solid var(--line);
  border-radius:20px; padding:26px 22px 22px; box-shadow:var(--shadow);
}
.card::before{
  content:""; position:absolute; inset:0 0 auto 0; height:5px;
  background:linear-gradient(90deg, var(--blue), var(--green), var(--accent));
}
.stack{ display:flex; flex-direction:column; gap:18px; }

.notice{
  background:var(--panel-2); border:1px solid var(--line);
  border-radius:14px; padding:16px 18px; font-size:14.5px; color:var(--chalk-dim);
}
.notice strong{ color:var(--chalk); }
.notice.notice-lg{
  padding:20px 22px; font-size:16.5px; line-height:1.6; font-weight:500; color:var(--chalk);
}
.notice.notice-lg strong{ color:var(--blue); }

.agree-row{
  display:flex; align-items:center; justify-content:center; gap:10px;
  margin-top:16px; font-size:14.5px; font-weight:600; color:var(--chalk); cursor:pointer;
}
.agree-row input{ width:19px; height:19px; accent-color:var(--blue); cursor:pointer; flex:none; }

label.field{ display:flex; flex-direction:column; gap:6px; font-size:14px; color:var(--chalk-dim); font-weight:500; }
label.field input[type="text"], label.field input[type="tel"], label.field input[type="email"], label.field select{
  font:inherit; font-size:16px; color:var(--chalk);
  background:var(--panel-2); border:1px solid var(--line);
  border-radius:10px; padding:11px 13px; outline:none;
}
label.field select{
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234c5c78' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat; background-position:right 13px center; background-size:18px;
  padding-right:38px;
}
label.field select:invalid{ color:var(--chalk-dim); }
label.field input:focus, label.field select:focus{ border-color:var(--accent); }
label.field input.err, label.field select.err{ border-color:var(--danger); }
.fieldmsg{ font-size:12.5px; color:var(--danger); min-height:1em; }

h2.section{ font-size:19px; color:var(--chalk); display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
h2.section .n{ font-size:12.5px; font-weight:600; color:var(--chalk-dim); font-family:"Work Sans", sans-serif; text-transform:uppercase; letter-spacing:.05em; }

.options{ display:flex; flex-direction:column; gap:12px; }
.opt{
  position:relative; display:flex; gap:14px; align-items:flex-start;
  background:var(--panel-2); border:1.5px solid var(--line);
  border-radius:14px; padding:15px 16px; cursor:pointer;
  transition: border-color .15s ease, background .15s ease;
}
.opt:hover{ border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); }
.opt input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.opt .icon{
  flex:none; width:38px; height:38px; border-radius:10px;
  background:var(--blue); color:#fff;
  display:flex; align-items:center; justify-content:center;
}
.opt .icon svg{ width:20px; height:20px; }
.opt .txt strong{ display:block; color:var(--chalk); font-size:15.5px; }
.opt .txt span{ display:block; color:var(--chalk-dim); font-size:13.5px; margin-top:2px; }
.opt.checked{ border-color:var(--accent); background: color-mix(in srgb, var(--accent) 14%, var(--panel-2)); }
.opt .tick{
  flex:none; width:20px; height:20px; border-radius:50%; margin-top:2px;
  border:1.5px solid var(--chalk-dim); background:transparent;
}
.opt.checked .tick{ border-color:var(--accent); background:var(--accent); position:relative; }
.opt.checked .tick::after{
  content:""; position:absolute; inset:0; margin:auto; width:6px; height:10px;
  border-right:2px solid var(--accent-ink); border-bottom:2px solid var(--accent-ink);
  transform: rotate(45deg) translate(-1px,-1px);
}

.subchoice{
  margin-left:52px; margin-top:-4px; display:none; gap:10px; flex-wrap:wrap;
}
.subchoice.show{ display:flex; }
.subchoice label{
  flex:1 1 140px; text-align:center; font-size:14px; font-weight:600;
  background:var(--panel-2); border:1.5px solid var(--line); border-radius:10px;
  padding:10px 10px; cursor:pointer; color:var(--chalk-dim); position:relative;
}
.subchoice input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.subchoice label.checked{ border-color:var(--accent); color:var(--chalk); background: color-mix(in srgb, var(--accent) 22%, var(--panel-2)); }

button.primary{
  font:inherit; font-weight:700; font-size:16px; color:var(--accent-ink);
  background:var(--accent); border:none; border-radius:12px; padding:14px 18px;
  cursor:pointer; width:100%;
}
button.primary:active{ transform: translateY(1px); }
button.primary:disabled{ opacity:.6; cursor:default; }
button.ghost{
  font:inherit; font-weight:600; font-size:14px; color:var(--chalk);
  background:transparent; border:1.5px solid var(--line); border-radius:10px; padding:10px 14px; cursor:pointer;
}

footer.meta{ text-align:center; color:var(--chalk-dim); font-size:12.5px; margin-top:22px; }

.summary-line{ display:flex; justify-content:space-between; gap:12px; font-size:14.5px; padding:8px 0; border-bottom:1px dashed var(--line); }
.summary-line:last-child{ border-bottom:none; }
.summary-line span:first-child{ color:var(--chalk-dim); }
.summary-line strong{ text-align:right; }

.submit-error{ font-size:13.5px; color:var(--danger); text-align:center; min-height:1em; }

[hidden]{ display:none !important; }

@media (prefers-reduced-motion: no-preference){
  .card{ animation: rise .5s ease both; }
  @keyframes rise{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:none; } }
}

/* ---- Painel do administrador ---- */
.admin-wrap{ max-width:960px; margin:0 auto; }
.admin-card{
  background:var(--panel); border:1px solid var(--line); border-radius:16px;
  padding:22px; box-shadow:var(--shadow); margin-bottom:18px;
}
.admin-header{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
.admin-header h1{ font-size:22px; }
.stat-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:18px; }
.stat-tile{ background:var(--panel-2); border:1px solid var(--line); border-radius:12px; padding:14px 16px; }
.stat-tile .n{ font-size:26px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--blue); }
.stat-tile .l{ font-size:12.5px; color:var(--chalk-dim); margin-top:2px; }
table.votes{ width:100%; border-collapse:collapse; font-size:13.5px; }
table.votes th, table.votes td{ text-align:left; padding:9px 10px; border-bottom:1px solid var(--line); white-space:nowrap; }
table.votes th{ color:var(--chalk-dim); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.03em; }
.table-scroll{ overflow-x:auto; }
.login-box{ max-width:360px; margin:60px auto; }
a.btn-link{ display:inline-block; text-decoration:none; }

/* ---- Ação de exclusão ---- */
.delete-form{ margin:0; }
.btn-delete{
  font:inherit; font-size:12.5px; font-weight:600; color:var(--danger);
  background:transparent; border:1.5px solid var(--danger); border-radius:8px;
  padding:6px 12px; cursor:pointer; white-space:nowrap;
}
.btn-delete:hover{ background:var(--danger); color:#fff; }
