:root{--bg:#f8fafc;--fg:#1e293b;--card:#fff;--border:#e2e8f0;--muted:#64748b;--th:#f8fafc;--thover:#f8fafc;--input-bg:#fff;--input-border:#cbd5e1}
html.dark{--bg:#020617;--fg:#e2e8f0;--card:#0f172a;--border:#1e293b;--muted:#94a3b8;--th:#020617;--thover:#1e293b;--input-bg:#0f172a;--input-border:#334155}
html.dark body{background:var(--bg) !important;color:var(--fg)}
html.dark .bg-slate-50{background:var(--bg) !important}
html.dark .text-slate-800{color:var(--fg) !important}
html.dark .text-slate-500,html.dark .text-slate-600{color:var(--muted) !important}
html.dark .text-slate-700{color:#cbd5e1 !important}
html.dark .card{background:var(--card);border-color:var(--border)}
html.dark th{background:var(--th);color:#cbd5e1;border-color:var(--border)}
html.dark td{border-color:var(--border)}
html.dark tr:hover td{background:var(--thover)}
html.dark .input,html.dark .select{background:var(--input-bg);border-color:var(--input-border);color:var(--fg)}
html.dark .btn-s{background:#334155;color:#e2e8f0;border-color:#475569}
html.dark .btn-s:hover{background:#475569}
html.dark .modal{background:#0f172a;color:var(--fg);border:1px solid #1e293b}
html.dark .bg-white{background:#0f172a !important;color:#e2e8f0}
html.dark .border-slate-300{border-color:#475569 !important}
html.dark .hover\:bg-slate-100:hover{background:#334155 !important}
html.dark header h1,html.dark header p{color:var(--fg)}
.nav-item{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-radius:.375rem;color:#cbd5e1;cursor:pointer}
.nav-item:hover{background:#1e293b;color:#fff}
.nav-item.active{background:#334155;color:#fff}
.card{background:#fff;border:1px solid #e2e8f0;border-left:4px solid #dc2626;border-radius:.5rem;padding:1rem;box-shadow:0 1px 2px rgba(0,0,0,.04)}
html.dark .card{background:#0f172a;border-color:#1e293b;border-left-color:#ef4444}
.kpi{display:flex;flex-direction:column;gap:.25rem}
.kpi .label{font-size:.75rem;color:#64748b;text-transform:uppercase;letter-spacing:.05em}
.kpi .value{font-size:1.5rem;font-weight:700}
.kpi .hint{font-size:.75rem;color:#64748b}
.sem-v{border-left:4px solid #16a34a}
.sem-a{border-left:4px solid #eab308}
.sem-r{border-left:4px solid #dc2626}
.badge{display:inline-block;padding:.1rem .5rem;border-radius:999px;font-size:.7rem;font-weight:600}
.badge-v{background:#dcfce7;color:#166534}
.badge-a{background:#fef9c3;color:#854d0e}
.badge-r{background:#fee2e2;color:#991b1b}
.badge-g{background:#e2e8f0;color:#334155}
table{width:100%;border-collapse:collapse;font-size:.875rem}
th{text-align:left;padding:.5rem;border-bottom:1px solid #e2e8f0;color:#475569;font-weight:600;background:#f8fafc}
td{padding:.5rem;border-bottom:1px solid #f1f5f9}
tr:hover td{background:#f8fafc}
/* Caixas de texto com moldura estilo CRM (accent vermelho CETEM a esquerda) */
.input, .select, textarea.input {
  border: 1px solid #cbd5e1;
  border-left: 4px solid #dc2626;
  border-radius: .5rem;
  padding: .5rem .7rem;
  font-size: .875rem;
  width: 100%;
  background: #fff;
  transition: border-color .15s, background-color .15s, box-shadow .15s;
}
.input:hover, .select:hover, textarea.input:hover {
  background: #fef2f2;
  border-color: #94a3b8;
  border-left-color: #b91c1c;
}
.input:focus, .select:focus, textarea.input:focus {
  outline: none;
  border-color: #94a3b8;
  border-left-color: #991b1b;
  background: #fff7f7;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, .15);
}
html.dark .input, html.dark .select, html.dark textarea.input {
  background: #0f172a;
  border-color: #334155;
  border-left-color: #ef4444;
  color: #f1f5f9;
}
html.dark .input:hover, html.dark .select:hover, html.dark textarea.input:hover {
  background: #1e293b;
  border-color: #475569;
  border-left-color: #f87171;
}
html.dark .input:focus, html.dark .select:focus, html.dark textarea.input:focus {
  background: #1e293b;
  border-color: #475569;
  border-left-color: #f87171;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, .25);
}
.btn{padding:.45rem .9rem;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;border:1px solid transparent}
.btn-p{background:#2563eb;color:#fff}.btn-p:hover{background:#1d4ed8}
.btn-s{background:#fff;border-color:#cbd5e1;color:#334155}.btn-s:hover{background:#f1f5f9}
.btn-d{background:#fee2e2;color:#991b1b}.btn-d:hover{background:#fecaca}
.modal-bg{position:fixed;inset:0;background:rgba(15,23,42,.5);display:flex;align-items:center;justify-content:center;z-index:50}
.modal{background:#fff;border-radius:.5rem;padding:1.5rem;width:520px;max-width:92vw;max-height:90vh;overflow:auto}
.alert{padding:.75rem 1rem;border-radius:.375rem;border:1px solid;font-size:.875rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.alert-r{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.alert-a{background:#fffbeb;border-color:#fde68a;color:#854d0e}
.alert-v{background:#f0fdf4;border-color:#bbf7d0;color:#166534}
.grid-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}
@media (max-width:768px){
  .card{padding:.75rem}
  table{font-size:.8rem}
  th,td{padding:.35rem}
  .kpi .value{font-size:1.15rem}
}
@media print{
  aside,#btn-menu,#sidebar-overlay,.no-print,button{display:none !important}
  body{background:#fff}
  main{padding:0 !important}
  .card{box-shadow:none;border-color:#ccc;break-inside:avoid}
  .grid-kpi{grid-template-columns:repeat(4,1fr)}
  header{border-bottom:2px solid #000;padding-bottom:.5rem;margin-bottom:1rem}
  table{page-break-inside:auto}
  tr{page-break-inside:avoid}
}
.palette{position:fixed;inset:0;background:rgba(15,23,42,.5);display:flex;align-items:flex-start;justify-content:center;padding-top:8vh;z-index:60}
.palette-box{width:560px;max-width:92vw;background:var(--card);border:1px solid var(--border);border-radius:.5rem;box-shadow:0 20px 40px rgba(0,0,0,.3);overflow:hidden}
.palette-box input{width:100%;padding:1rem;border:none;border-bottom:1px solid var(--border);font-size:1rem;background:var(--input-bg);color:var(--fg);outline:none}
.palette-results{max-height:50vh;overflow:auto}
.palette-item{padding:.6rem 1rem;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--border);color:var(--fg)}
.palette-item:hover,.palette-item.active{background:var(--thover,#e2e8f0)}
.palette-item .meta{font-size:.75rem;color:var(--muted)}
.print-only{display:none}
@media print{.print-only{display:block}}


/* ===== Fase A: toasts não bloqueantes e realce de campo inválido ===== */
.toast-host{position:fixed;bottom:1rem;right:1rem;z-index:100;display:flex;flex-direction:column;gap:.5rem;pointer-events:none}
.toast{padding:.6rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:500;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.15);opacity:1;transform:translateX(0);transition:opacity .3s, transform .3s;pointer-events:auto}
.toast-v{background:#16a34a}
.toast-a{background:#eab308;color:#1e293b}
.toast-r{background:#dc2626}
.toast-g{background:#475569}
.toast-out{opacity:0;transform:translateX(1rem)}
.input-erro{border-color:#dc2626 !important;background:#fef2f2}
html.dark .input-erro{background:#3f1d1d !important;border-color:#dc2626 !important}
.campo-erro-msg{display:block;font-size:.7rem;color:#b91c1c;margin-top:.15rem}
.banner-estimativa{background:#fffbeb;border:1px solid #fde68a;color:#92400e;padding:.5rem .75rem;border-radius:.375rem;font-size:.8rem;margin-bottom:.5rem}
html.dark .banner-estimativa{background:#3a2a09;color:#fcd34d;border-color:#78350f}
/* ===== Modo claro: fundo cinza mais presente (dá destaque aos cards brancos) ===== */
body.bg-slate-50 { background: #e2e8f0; }
/* Ajusta th/thover para não ficarem indistinguíveis do fundo no modo claro */
:root { --th: #f1f5f9; --thover: #f1f5f9; }
th { background: #f1f5f9; }
tr:hover td { background: #f1f5f9; }

/* ===== Autocomplete (substitui select gigante) ===== */
.autocomplete-wrap { position: relative; }
.autocomplete-input { padding-right: 2rem; }
.autocomplete-clear {
  position: absolute; right: .5rem; top: 50%; transform: translateY(-50%);
  background: transparent; border: 0; color: #94a3b8; cursor: pointer;
  font-size: 1.25rem; line-height: 1; padding: 0 .25rem;
}
.autocomplete-clear:hover { color: #475569; }
.autocomplete-dropdown {
  position: absolute; left: 0; right: 0; top: 100%; margin-top: 2px;
  background: white; border: 1px solid #cbd5e1; border-radius: .375rem;
  box-shadow: 0 8px 16px -4px rgba(0,0,0,.15);
  max-height: 300px; overflow-y: auto; z-index: 60;
}
html.dark .autocomplete-dropdown { background: #1e293b; border-color: #334155; }
.autocomplete-dropdown.hidden { display: none; }
.autocomplete-item {
  padding: .5rem .625rem; cursor: pointer; border-bottom: 1px solid #f1f5f9;
}
html.dark .autocomplete-item { border-bottom-color: #334155; }
.autocomplete-item:last-child { border-bottom: 0; }
.autocomplete-item:hover, .autocomplete-item.active {
  background: #e0f2fe;
}
html.dark .autocomplete-item:hover, html.dark .autocomplete-item.active {
  background: #1e3a5f;
}
.autocomplete-label { font-size: .875rem; font-weight: 500; color: #0f172a; }
html.dark .autocomplete-label { color: #f1f5f9; }
.autocomplete-meta { font-size: .75rem; color: #64748b; margin-top: 1px; }
html.dark .autocomplete-meta { color: #94a3b8; }
.autocomplete-empty { padding: .75rem; font-size: .8125rem; color: #94a3b8; text-align: center; }

/* Linha "+ Cadastrar novo" no rodape do autocomplete */
.autocomplete-create {
  padding: .5rem .625rem; cursor: pointer;
  background: #f8fafc; border-top: 1px solid #e2e8f0;
  font-size: .8125rem; font-weight: 600; color: #0e7c66;
  display: flex; align-items: center; gap: .25rem;
}
.autocomplete-create:hover { background: #ecfdf5; color: #064e3b; }
html.dark .autocomplete-create { background: #1e293b; border-top-color: #334155; color: #34d399; }
html.dark .autocomplete-create:hover { background: #064e3b; color: #d1fae5; }

/* Quando o card usa semaforo (.sem-r/a/v/g/b), a cor da faixa segue a severidade */
.card.sem-r{border-left-color:#dc2626}
.card.sem-a{border-left-color:#d97706}
.card.sem-v{border-left-color:#16a34a}
.card.sem-g{border-left-color:#64748b}
.card.sem-b{border-left-color:#2563eb}
