/* =====================================================
   PLATAFORMA — core.css  v1.0
   -----------------------------------------------------
   Design system compartilhado por todos os módulos.
   Tokens e componentes extraídos do PAI (tema claro +
   dark) e do Termômetro (tema escuro espelhado).
   Regra: módulos importam este arquivo e só adicionam
   CSS próprio para o que for exclusivo do módulo.
   ===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&family=Spline+Sans+Mono:wght@400;500;600&display=swap');

/* ---------- TOKENS ---------- */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#F5F2EC;
  --surface:#FDFBF7;
  --border:#DDD8CE;
  --accent:#2C4A6B;
  --accent-hover:#3E5F84;
  --accent2:#C8A96E;
  --accent2-hover:#d4b578;
  --text:#1C1C1A;
  --muted:#6B6860;
  --muted-2:#8a8780;
  --danger:#B84040;
  --success:#2C4A6B;
  --info:#1A4A6E;
  --verde:#1F8F6A;          /* escala de risco (Termômetro) */
  --ambar:#C8A96E;
  --laranja:#E8843D;
  --rubro:#B84040;
  --radius:10px;
  --shadow:0 2px 12px rgba(0,0,0,0.07);
  --font-display:'Outfit',sans-serif;
  --font-body:'Plus Jakarta Sans',system-ui,sans-serif;
  --font-mono:'Spline Sans Mono',monospace;
}
body.dark{
  --bg:#141414;
  --surface:#1E1E1E;
  --border:#2E2E2E;
  --accent:#4E7096;
  --accent-hover:#5F84AC;
  --accent2:#C8A96E;
  --text:#F0EDE8;
  --muted:#888480;
  --muted-2:#6B6860;
  --danger:#D46060;
  --success:#4E7096;
  --info:#6E95C2;
  --verde:#2FBF8F;
  --rubro:#D46060;
  --shadow:0 2px 12px rgba(0,0,0,0.35);
}
body{
  font-family:var(--font-body);
  background:var(--bg);
  color:var(--text);
  min-height:100vh;
  font-size:15px;
  line-height:1.5;
}
body.dark input,body.dark select,body.dark textarea{background:#252525;color:var(--text);border-color:var(--border)}
body.dark input[readonly]{background:#1a1a1a}
body.dark tr:hover td{background:#242424}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- HEADER GLOBAL ---------- */
.app-header{background:var(--accent);padding:0 2rem;display:flex;align-items:center;justify-content:space-between;height:58px;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,0.18)}
.app-logo{font-family:var(--font-display);color:#fff;font-size:1.35rem;letter-spacing:0.01em;font-weight:400;text-decoration:none}
.app-logo span{color:var(--accent2)}
.app-header-sub{font-size:12px;color:rgba(255,255,255,0.5);font-weight:300;margin-left:0.75rem;letter-spacing:0.03em}
.app-header-right{display:flex;align-items:center;gap:1rem}
.app-header-user{font-size:12px;color:rgba(255,255,255,0.5);font-weight:500}
.btn-header{background:transparent;border:1px solid rgba(255,255,255,0.25);color:rgba(255,255,255,0.6);padding:5px 12px;border-radius:6px;font-family:var(--font-body);font-size:12px;cursor:pointer;transition:all 0.15s}
.btn-header:hover{border-color:rgba(255,255,255,0.6);color:#fff}
.dark-toggle{background:none;border:1px solid rgba(255,255,255,0.25);color:rgba(255,255,255,0.75);border-radius:20px;padding:4px 12px;font-size:12px;font-family:var(--font-body);cursor:pointer;display:flex;align-items:center;gap:5px;transition:all 0.2s}
.dark-toggle:hover{background:rgba(255,255,255,0.1)}

/* ---------- LAYOUT ---------- */
main.app-main{max-width:1100px;margin:0 auto;padding:2rem}
@media(max-width:600px){main.app-main{padding:1rem}}

/* ---------- CARDS ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow);margin-bottom:1.25rem}
.card-title{font-family:var(--font-display);font-size:1.05rem;font-weight:400;color:var(--accent);margin-bottom:1rem;display:flex;align-items:center;gap:0.5rem}
.card-title::before{content:'';width:3px;height:1.1em;background:var(--accent2);border-radius:2px;display:inline-block}

/* ---------- FORM ---------- */
.form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}
.form-grid.wide{grid-template-columns:1fr 1fr}
.field{display:flex;flex-direction:column;gap:5px}
.field.full{grid-column:1/-1}
label{font-size:12px;font-weight:500;color:var(--muted);text-transform:uppercase;letter-spacing:0.06em}
input,select,textarea{font-family:var(--font-body);font-size:14px;padding:9px 12px;border:1px solid var(--border);border-radius:8px;background:#fff;color:var(--text);transition:border 0.15s;outline:none;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--accent)}
input[readonly]{background:var(--bg);color:var(--muted)}
textarea{resize:vertical;min-height:70px}
.tip{font-size:11px;color:var(--muted);margin-top:3px}

/* ---------- BUTTONS ---------- */
.btn{font-family:var(--font-body);font-size:13.5px;font-weight:500;padding:9px 18px;border-radius:8px;cursor:pointer;border:none;display:inline-flex;align-items:center;gap:6px;transition:all 0.15s}
.btn:disabled{opacity:0.5;cursor:not-allowed}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-hover)}
.btn-ghost{background:transparent;color:var(--muted);border:1px solid var(--border)}
.btn-ghost:hover{background:var(--bg);color:var(--text)}
.btn-danger{background:transparent;color:var(--danger);border:1px solid #e8c5c5}
.btn-danger:hover{background:#fdf0f0}
.btn-gold{background:var(--accent2);color:#3a2800;font-weight:600}
.btn-gold:hover{background:var(--accent2-hover)}
.btn-bar{display:flex;gap:10px;flex-wrap:wrap;margin-top:1rem}
.btn-icon{background:none;border:none;cursor:pointer;color:var(--muted);font-size:16px;padding:4px 6px;border-radius:6px;transition:all 0.1s}
.btn-icon:hover{color:var(--danger);background:#fdf0f0}

/* ---------- TABLE ---------- */
.tbl-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius)}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{background:var(--accent);color:#fff;padding:10px 12px;text-align:left;font-weight:500;font-size:12px;text-transform:uppercase;letter-spacing:0.05em;white-space:nowrap}
td{padding:9px 12px;border-bottom:1px solid var(--border);vertical-align:middle}
tr:last-child td{border-bottom:none}
tr:hover td{background:#f9f7f3}
.badge{display:inline-block;font-size:11px;font-weight:600;padding:3px 9px;border-radius:20px;letter-spacing:0.03em}
.badge-ok{background:#d4edda;color:#2C4A6B}
.badge-out{background:#fde8d8;color:#8a3a10}
.badge-alvo{background:#dce8f5;color:#0c3d6b}

/* ---------- METRIC CARDS ---------- */
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-top:1.25rem}
.metric{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.1rem 1.3rem}
.metric-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.07em;color:var(--muted);margin-bottom:5px}
.metric-value{font-family:var(--font-display);font-size:1.55rem;font-weight:400;color:var(--text)}
.metric.highlight{background:var(--accent);border-color:var(--accent)}
.metric.highlight .metric-label{color:rgba(255,255,255,0.65)}
.metric.highlight .metric-value{color:#fff}
.metric.gold{background:#fdf6e3;border-color:#e8d5a3}
.metric.gold .metric-value{color:#7a4f00}
body.dark .metric.gold{background:rgba(200,169,110,0.12);border-color:rgba(200,169,110,0.4)}
body.dark .metric.gold .metric-value{color:var(--accent2)}

/* ---------- ALERTAS INLINE (equivalente st.info/warning/error/success) ---------- */
.alert{border-radius:8px;padding:10px 14px;font-size:13px;margin:0.75rem 0;border:1px solid transparent}
.alert-info{background:#dce8f5;border-color:#b8cfe6;color:#0c3d6b}
.alert-success{background:#d4edda;border-color:#a3d4b0;color:#1a4a2e}
.alert-warning{background:#fdf6e3;border-color:#e8d5a3;color:#7a4f00}
.alert-danger{background:#fdf0f0;border-color:#e8c5c5;color:#8a1c1c}
body.dark .alert-info{background:rgba(110,149,194,0.14);border-color:rgba(110,149,194,0.4);color:#9dbede}
body.dark .alert-success{background:rgba(47,191,143,0.12);border-color:rgba(47,191,143,0.35);color:#7fd4b4}
body.dark .alert-warning{background:rgba(200,169,110,0.12);border-color:rgba(200,169,110,0.4);color:#dcc08a}
body.dark .alert-danger{background:rgba(212,96,96,0.12);border-color:rgba(212,96,96,0.4);color:#e6a0a0}

/* ---------- TOOLTIP ---------- */
.info-icon{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:50%;background:var(--border);color:var(--muted);font-size:9px;font-weight:700;cursor:default;margin-left:5px;vertical-align:middle;flex-shrink:0;transition:background 0.15s;position:relative}
.info-icon:hover{background:var(--accent);color:#fff}
.tooltip-box{position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);background:#1C1C1A;color:#fff;font-size:11.5px;font-weight:400;line-height:1.5;padding:8px 12px;border-radius:8px;white-space:normal;width:240px;text-align:left;pointer-events:none;opacity:0;transition:opacity 0.15s;z-index:500;box-shadow:0 4px 16px rgba(0,0,0,0.22)}
.tooltip-box::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:#1C1C1A}
.info-icon:hover .tooltip-box,.info-icon:focus .tooltip-box{opacity:1}

/* ---------- TOAST ---------- */
#toast-container{position:fixed;bottom:1.5rem;right:1.5rem;z-index:99999;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{background:#1C1C1A;color:#fff;padding:11px 18px;border-radius:10px;font-size:13.5px;font-weight:500;display:flex;align-items:center;gap:8px;box-shadow:0 4px 20px rgba(0,0,0,0.22);opacity:0;transform:translateY(12px);transition:all 0.25s ease;pointer-events:none;max-width:320px}
.toast.show{opacity:1;transform:translateY(0)}
.toast.toast-success{border-left:4px solid #2C4A6B}
.toast.toast-error{border-left:4px solid #B84040}
.toast.toast-info{border-left:4px solid #C8A96E}
.toast-icon{font-size:15px;flex-shrink:0}

/* ---------- AVISO DE CONEXÃO (fonte única, sem fallback) ---------- */
.aviso-conexao{display:none;align-items:flex-start;gap:9px;margin:0 0 1rem;padding:11px 13px;border:1px solid rgba(184,64,64,.4);border-radius:9px;background:rgba(184,64,64,.08);color:#8a1c1c;font-size:12.5px;line-height:1.5}
body.dark .aviso-conexao{border-color:rgba(212,96,96,.4);background:rgba(212,96,96,.10);color:#E6A0A0}
.aviso-conexao.show{display:flex}
.stale{opacity:.45;filter:saturate(.4);transition:opacity .2s}

/* ---------- EMPTY STATE ---------- */
.empty{text-align:center;padding:3rem 1rem;color:var(--muted)}
.empty-icon{font-size:2.5rem;margin-bottom:0.75rem;opacity:0.35}
.empty p{font-size:14px;margin-top:6px}

/* ---------- LANDING / LOGIN (telas cheias) ---------- */
.screen{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}
.auth-box{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:2.5rem 2rem;box-shadow:0 8px 32px rgba(0,0,0,0.12);width:100%;max-width:380px}
body.dark .auth-box{background:#1E1E1E}
.auth-logo{font-family:var(--font-display);font-weight:400;color:var(--accent);font-size:2rem;text-align:center;margin-bottom:0.25rem}
.auth-logo span{color:var(--accent2)}
.auth-sub{font-size:12px;color:var(--muted);margin-bottom:2rem;letter-spacing:0.04em;text-align:center}
.auth-field{text-align:left;margin-bottom:1rem}
.auth-field label{display:block;margin-bottom:5px}
.auth-btn{width:100%;padding:11px;background:var(--accent);color:#fff;border:none;border-radius:8px;font-family:var(--font-body);font-size:14px;font-weight:600;cursor:pointer;margin-top:0.5rem;transition:background 0.15s;letter-spacing:0.02em}
.auth-btn:hover{background:var(--accent-hover)}
.auth-btn:disabled{opacity:0.6;cursor:wait}
.auth-error{color:var(--danger);font-size:12.5px;margin-top:0.75rem;min-height:18px;text-align:center}
.auth-back{background:none;border:none;color:var(--muted);font-size:13px;cursor:pointer;margin-top:1rem;display:block;width:100%;text-align:center;padding:6px}
.auth-back:hover{color:var(--accent)}
.landing-divider{width:40px;height:2px;background:var(--accent2);margin:0 auto 2rem}

/* ---------- HUB DE MÓDULOS ---------- */
.hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.25rem;margin-top:1.5rem}
.hub-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;cursor:pointer;transition:all 0.18s;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:0.5rem;text-decoration:none;color:var(--text);position:relative}
.hub-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,0.10)}
.hub-card-icon{font-size:1.8rem;margin-bottom:0.25rem}
.hub-card-title{font-family:var(--font-display);font-size:1.1rem;font-weight:500;color:var(--accent)}
.hub-card-desc{font-size:12.5px;color:var(--muted);line-height:1.55;flex:1}
.hub-card-cta{font-size:12px;font-weight:600;color:var(--accent2);letter-spacing:0.04em;margin-top:0.5rem}
.hub-card.em-breve{opacity:0.55;cursor:default;pointer-events:none}
.hub-card .badge-breve{position:absolute;top:12px;right:12px;font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;background:var(--border);color:var(--muted);border-radius:20px;padding:3px 9px}

/* ---------- NÚMEROS MONO (padrão Termômetro) ---------- */
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}

/* ---------- DIVIDER ---------- */
.divider{border:none;border-top:1px solid var(--border);margin:1.5rem 0}
