/* ==========================================================================
   TRÍADE — camada visual inspirada no TailAdmin (Tailwind CSS v4, MIT).
   Tokens, tipografia e componentes do TailAdmin aplicados como CSS próprio,
   sem Tailwind em tempo de execução, sem CDN e sem servidor: o protótipo
   continua abrindo direto pelo index.html.
   ========================================================================== */

@font-face{font-family:Outfit;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/outfit-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Outfit;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/outfit-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Outfit;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/outfit-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Outfit;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/outfit-latin-700-normal.woff2) format("woff2")}

:root{
  /* paleta TailAdmin */
  --ta-gray-25:#fcfcfd;--ta-gray-50:#f9fafb;--ta-gray-100:#f2f4f7;--ta-gray-200:#e4e7ec;--ta-gray-300:#d0d5dd;--ta-gray-400:#98a2b3;
  --ta-gray-500:#667085;--ta-gray-600:#475467;--ta-gray-700:#344054;--ta-gray-800:#1d2939;--ta-gray-900:#101828;
  --ta-brand-25:#f2f7ff;--ta-brand-50:#ecf3ff;--ta-brand-100:#dde9ff;--ta-brand-200:#c2d6ff;--ta-brand-300:#9cb9ff;--ta-brand-500:#465fff;--ta-brand-600:#3641f5;--ta-brand-950:#161950;
  --ta-success-50:#ecfdf3;--ta-success-500:#12b76a;--ta-success-600:#039855;
  --ta-error-50:#fef3f2;--ta-error-500:#f04438;--ta-error-600:#d92d20;
  --ta-warning-50:#fffaeb;--ta-warning-500:#f79009;--ta-warning-600:#dc6803;
  --ta-shadow-xs:0px 1px 2px 0px rgba(16,24,40,.05);
  --ta-shadow-sm:0px 1px 3px 0px rgba(16,24,40,.1),0px 1px 2px 0px rgba(16,24,40,.06);
  --ta-shadow-lg:0px 12px 16px -4px rgba(16,24,40,.08),0px 4px 6px -2px rgba(16,24,40,.03);
  --ta-focus:0px 0px 0px 4px rgba(70,95,255,.12);

  /* tokens do protótipo apontando para a paleta TailAdmin */
  --navy:var(--ta-gray-900);--navy-2:var(--ta-gray-800);--blue:var(--ta-brand-500);--blue-2:#7592ff;--blue-soft:var(--ta-brand-50);
  --ink:var(--ta-gray-800);--muted:var(--ta-gray-500);--bg:var(--ta-gray-50);--panel:#fff;--line:var(--ta-gray-200);--line-2:var(--ta-gray-100);
  --green:var(--ta-success-600);--green-soft:var(--ta-success-50);--red:var(--ta-error-600);--red-soft:var(--ta-error-50);
  --amber:var(--ta-warning-600);--amber-soft:var(--ta-warning-50);--purple:#7a5af8;--purple-soft:#f4f3ff;
  --shadow:var(--ta-shadow-xs);--radius:16px;--sidebar:290px;
}

html,body{font-family:Outfit,"Segoe UI",Arial,sans-serif;background:var(--ta-gray-50);color:var(--ta-gray-800)}
button,input,select,textarea{font-family:inherit}
::selection{background:var(--ta-brand-100)}

/* ---------- sidebar (TailAdmin: branca, borda à direita, menu em grupos) */
.sidebar{background:#fff;color:var(--ta-gray-700);border-right:1px solid var(--ta-gray-200);padding:0 20px 16px;box-shadow:none}
.sidebar-brand{padding:28px 4px 22px;border-bottom:0}
.brand-logo{display:flex;align-items:center;gap:10px}
.brand-logo .brand-symbol,.brand-side .brand-symbol,.login-brand-footer .brand-symbol{transform:none;display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--ta-brand-500);color:#fff;font-size:17px;font-weight:700;flex:none}
.sidebar .brand-wordmark{font-size:24px;letter-spacing:1.5px;font-weight:700;color:var(--ta-gray-900)}
.sidebar .brand-byline{font-size:13px;color:var(--ta-gray-500);margin-top:6px}
.nav-group{margin-top:14px}
.nav-label{font-size:12px;line-height:20px;letter-spacing:.4px;color:var(--ta-gray-400);font-weight:500;padding:0 12px 6px}
.nav-link{gap:12px;padding:9px 12px;margin:2px 0;border-radius:8px;font-size:14px;font-weight:500;color:var(--ta-gray-700);box-shadow:none;background:transparent}
.nav-link .nav-icon{color:var(--ta-gray-500)}
.nav-link:hover{background:var(--ta-gray-100);color:var(--ta-gray-700)}
.nav-link:hover .nav-icon{color:var(--ta-gray-700)}
.nav-link.active{background:var(--ta-brand-50);color:var(--ta-brand-500);box-shadow:none}
.nav-link.active .nav-icon{color:var(--ta-brand-500)}
.side-bottom{border-top:1px solid var(--ta-gray-200);padding:14px 4px 2px}
.brand-side{color:var(--ta-gray-500);font-size:12px;line-height:1.4;gap:10px}
.collapse-btn{color:var(--ta-gray-500);border:1px solid var(--ta-gray-200);border-radius:8px;width:32px;height:32px;background:#fff}
.collapse-btn:hover{background:var(--ta-gray-100);color:var(--ta-gray-700)}

/* ---------- header (TailAdmin: branco, borda inferior, busca e botões quadrados) */
.topbar{height:76px;background:#fff;border-bottom:1px solid var(--ta-gray-200);padding:0 24px;backdrop-filter:none}
.top-search{height:44px;border:1px solid var(--ta-gray-200);border-radius:8px;background:transparent;color:var(--ta-gray-800);font-size:14px;box-shadow:var(--ta-shadow-xs)}
.top-search::placeholder{color:var(--ta-gray-400)}
.top-search:focus{border-color:var(--ta-brand-300);box-shadow:var(--ta-focus)}
.top-search-wrap>span{color:var(--ta-gray-500)}
.period-btn{height:44px;border:1px solid var(--ta-gray-300);border-radius:10px;color:var(--ta-gray-700);background:#fff;font-weight:500;box-shadow:var(--ta-shadow-xs)}
.bell-btn,.mobile-menu-btn,.logout-compact{width:44px;height:44px;border:1px solid var(--ta-gray-300)!important;border-radius:10px!important;background:#fff;color:var(--ta-gray-700);display:inline-grid;place-items:center;padding:0;font-size:18px;box-shadow:var(--ta-shadow-xs)}
.bell-btn i{background:#fd853a;color:#fff}
.bell-btn:hover,.period-btn:hover,.logout-compact:hover{background:var(--ta-gray-50)}
.profile{border-left:0;padding:4px 8px;border-radius:10px}
.profile:hover{background:var(--ta-gray-50)}
.profile b{color:var(--ta-gray-700);font-weight:500}
.profile small{color:var(--ta-gray-500)}
.avatar{width:44px;height:44px;border-radius:50%;background:var(--ta-brand-50);color:var(--ta-brand-500);font-weight:600}
.demo-statusbar{background:var(--ta-warning-50);border-bottom:1px solid #fedf89;color:#b54708;font-size:13px;padding:8px 24px}
.demo-statusbar b{color:#93370d}
.status-dot{background:var(--ta-warning-500)!important}

/* ---------- página */
.page{padding:24px;max-width:1600px}
.crumbs{font-size:13px;color:var(--ta-gray-500);margin-bottom:6px}
.crumbs b{color:var(--ta-gray-800);font-weight:500}
.page-path{color:var(--ta-gray-500);font-weight:500}
.page-head{margin-bottom:20px;align-items:center}
.page-head h1{font-size:22px;line-height:30px;font-weight:600;letter-spacing:0;color:var(--ta-gray-800)}
.page-head p{color:var(--ta-gray-500);font-size:14px}
.grid{gap:16px}
.card,.dossier-cover,.login-card,.modal{border:1px solid var(--ta-gray-200);border-radius:16px;box-shadow:none;background:#fff}
.section-card{padding:20px 24px}
.section-head h2,.card h2{font-size:18px;line-height:28px;font-weight:600;color:var(--ta-gray-800);letter-spacing:0}
.section-head span{color:var(--ta-gray-500);font-size:13px}
.eyebrow{color:var(--ta-gray-500);font-weight:500;letter-spacing:.6px}
.notice{border-radius:12px;border:1px solid var(--ta-brand-100);background:var(--ta-brand-25);color:var(--ta-gray-600)}
.notice b{color:var(--ta-gray-800)}
.notice.warn{background:var(--ta-warning-50);border-color:#fedf89;color:#b54708}
.notice.danger{background:var(--ta-error-50);border-color:#fecdca;color:#b42318}

/* ---------- métricas (TailAdmin: ícone em caixa, valor grande) */
.kpi{padding:20px;min-height:132px}
.kpi-icon,.case-metric .kpi-icon{width:48px;height:48px;border-radius:12px;background:var(--ta-gray-100);color:var(--ta-gray-800);font-size:20px;margin-bottom:16px}
.kpi-icon.red{background:var(--ta-error-50);color:var(--ta-error-600)}
.kpi-icon.green{background:var(--ta-success-50);color:var(--ta-success-600)}
.kpi .label{font-size:14px;color:var(--ta-gray-500)}
.kpi .value{font-size:24px;font-weight:700;color:var(--ta-gray-800);letter-spacing:0;margin:6px 0 4px}
.kpi .sub{color:var(--ta-gray-400)}
.trend-up,.trend-down{display:inline-flex;align-items:center;border-radius:999px;padding:2px 8px;font-size:12px;font-weight:500}
.trend-up{background:var(--ta-success-50);color:var(--ta-success-600)}
.trend-down{background:var(--ta-error-50);color:var(--ta-error-600)}
.case-metric{padding:20px}
.case-metric label{color:var(--ta-gray-500)}
.case-metric b{color:var(--ta-gray-800)}

/* ---------- tabelas (TailAdmin: cabeçalho discreto, linhas com borda suave) */
.table-wrap{border-radius:12px}
.table th{background:transparent;color:var(--ta-gray-500);font-size:12px;font-weight:500;padding:12px 16px;border-top:1px solid var(--ta-gray-100);border-bottom:1px solid var(--ta-gray-100)}
.table td{padding:12px 16px;border-bottom:1px solid var(--ta-gray-100);color:var(--ta-gray-500);font-size:14px}
.table b{color:var(--ta-gray-800);font-weight:500}
.table tbody tr:hover{background:var(--ta-gray-50)}

/* ---------- badges (TailAdmin: pílula com fundo claro) */
.badge{border-radius:999px;padding:2px 10px;font-size:12px;font-weight:500;line-height:20px}
.badge.green{background:var(--ta-success-50);color:var(--ta-success-600)}
.badge.red{background:var(--ta-error-50);color:var(--ta-error-600)}
.badge.amber{background:var(--ta-warning-50);color:var(--ta-warning-600)}
.badge.gray{background:var(--ta-gray-100);color:var(--ta-gray-700)}
.badge.blue{background:var(--ta-brand-50);color:var(--ta-brand-500)}
.source-chip{border-radius:999px;border-color:var(--ta-gray-200);background:#fff;color:var(--ta-gray-600);font-weight:500}
.source-chip.blue{background:var(--ta-brand-50);border-color:var(--ta-brand-100);color:var(--ta-brand-500)}

/* ---------- botões (TailAdmin) */
.btn{border-radius:8px;font-weight:500;font-size:14px;padding:10px 16px;min-height:40px;box-shadow:var(--ta-shadow-xs)}
.btn.sm{padding:8px 14px;font-size:14px;min-height:36px}
.btn.primary{background:var(--ta-brand-500);border-color:var(--ta-brand-500);color:#fff}
.btn.primary:hover{background:var(--ta-brand-600);border-color:var(--ta-brand-600)}
.btn.secondary,.btn.ghost,.btn.sso{background:#fff;border:1px solid var(--ta-gray-300);color:var(--ta-gray-700)}
.btn.secondary:hover,.btn.ghost:hover,.btn.sso:hover{background:var(--ta-gray-50);color:var(--ta-gray-800)}
.btn.danger{background:var(--ta-error-500);border-color:var(--ta-error-500)}
.btn.demo{background:var(--ta-gray-900);border-color:var(--ta-gray-900);color:#fff;box-shadow:var(--ta-shadow-xs)}
.link-button,.link{color:var(--ta-brand-500)}

/* ---------- formulários (TailAdmin: h-11, borda cinza, anel de foco) */
.input,.select,.textarea{border:1px solid var(--ta-gray-300);border-radius:8px;background:#fff;color:var(--ta-gray-800);box-shadow:var(--ta-shadow-xs)}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--ta-brand-300);box-shadow:var(--ta-focus)}
.input::placeholder,.textarea::placeholder{color:var(--ta-gray-400)}
.filter-group label,.field label{color:var(--ta-gray-700);font-weight:500}
.filters .input,.filters .select{height:44px}
.toggle{background:var(--ta-gray-200)}
.toggle.on{background:var(--ta-brand-500)}

/* ---------- abas (TailAdmin: segmentos em fundo cinza) */
.tabs{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;background:var(--ta-gray-100);border-radius:10px;border-bottom:0;margin-bottom:16px}
.tab{border:0;border-radius:8px;padding:8px 14px;font-size:14px;font-weight:500;color:var(--ta-gray-500);border-bottom:0}
.tab:hover{color:var(--ta-gray-800)}
.tab.active{background:#fff;color:var(--ta-gray-900);box-shadow:var(--ta-shadow-xs);border-bottom:0}

/* ---------- gráficos e progresso */
.progress{background:var(--ta-gray-200)}
.progress>span{background:var(--ta-brand-500)}

/* ---------- modais e avisos */
.modal{border-radius:24px;box-shadow:var(--ta-shadow-lg)}
.modal-head,.modal-foot{border-color:var(--ta-gray-200)}
.modal-backdrop{background:rgba(16,24,40,.35);backdrop-filter:blur(2px)}
.xbtn{background:var(--ta-gray-100);color:var(--ta-gray-500)}
.toast{border-radius:12px;background:var(--ta-gray-900);font-size:14px}
.toast.success{background:var(--ta-success-600)}
.toast.warn{background:var(--ta-warning-600)}
.footer-note{color:var(--ta-gray-400)}

/* ---------- login (TailAdmin: formulário limpo + painel brand-950 com grade) */
.login-shell{background:#fff}
.login-brand-panel{background:var(--ta-brand-950);background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:56px 56px}
.login-brand-panel:before{border-color:rgba(117,146,255,.18)}
.login-brand-panel:after{background:linear-gradient(180deg,rgba(70,95,255,.22),rgba(22,25,80,.9))}
.login-brand-panel .brand-wordmark{color:#fff}
.login-brand-panel .brand-byline{color:var(--ta-brand-200)}
.login-message h1 span{color:var(--ta-brand-300)}
.login-benefit-icon{border-color:rgba(156,185,255,.25);background:rgba(70,95,255,.16);color:var(--ta-brand-300);border-radius:12px}
.login-brand-footer{color:var(--ta-brand-100)}
.login-form-panel{background:#fff}
.login-card{border:0;box-shadow:none;padding:24px 8px}
.login-card-title h2{font-size:30px;line-height:38px;font-weight:600;color:var(--ta-gray-800)}
.login-card-title p{color:var(--ta-gray-500)}
.mfa-box{border-radius:12px;border-color:var(--ta-gray-200);background:var(--ta-gray-50)}
.mfa-options button{border-radius:12px;border-color:var(--ta-gray-200);background:#fff}
.mfa-options button[aria-pressed=true]{border-color:var(--ta-brand-300);background:var(--ta-brand-50)}
.language-switch,.demo-watermark{color:var(--ta-gray-500)}

/* ---------- foco acessível */
:focus-visible{outline:2px solid var(--ta-brand-300);outline-offset:2px}

@media(max-width:820px){
  :root{--sidebar:72px}
  .sidebar{padding:0 10px 12px}
  .sidebar-brand:before{background:var(--ta-brand-500);color:#fff;border-radius:9px}
  .brand-logo{display:none}
}

/* grades de métricas sem cartão "órfão" na última linha */
@media(min-width:1101px){
  .grid:has(> .kpi){grid-template-columns:repeat(auto-fit,minmax(165px,1fr))!important}
}
.kpi{min-height:0}
.kpi-icon{margin-bottom:14px}

/* Alinhamento com o Business Deck: fonte por afirmação, consolidação e abstenção */
.claim-src{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:999px;background:var(--ta-brand-50,#ecf3ff);color:#3641f5;font-size:11px;font-weight:500;white-space:nowrap}
.claims-list{display:grid;gap:6px}
.claims-list .claim{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:8px 12px;border:1px solid #e4e7ec;border-radius:10px;background:#fff;font-size:13px;color:#344054}
.claims-list .claim b{font-size:11px;font-weight:600;color:#3641f5;white-space:nowrap}
.claims-list .claim.gap{border-color:#fedf89;background:#fffaeb}
.claims-list .claim.gap b{color:#b54708}
.cons-points{display:grid;gap:8px;margin-top:10px}
.cons-points b{font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:#475467}
.cons-points ul{margin:4px 0 0;padding-left:18px;font-size:13px;line-height:1.45;color:#344054}
.agent-card.muted-card{background:#f9fafb}
.agent-card.muted-card .agent-result{color:#98a2b3}
.insufficient-box{margin-bottom:10px}
.insufficient-box ul{margin:4px 0 6px;padding-left:20px;line-height:1.5}
.table .link{white-space:nowrap}