/* ==========================================================================
   CRM Bonifácio — camada visual global
   Redesign minimalista sobre Bootstrap 5.3. Não substitui Bootstrap: só
   sobrescreve tokens/aparência dos componentes já usados nos 70+ templates
   (card, btn, table, badge, form, dropdown, alert) e define o novo shell
   (sidebar/topbar) usado em base.html e portal_base.html.
   ========================================================================== */

:root{
  --ui-bg:#f6f7f9;
  --ui-surface:#ffffff;
  --ui-surface-2:#fafbfc;
  --ui-border:#e6e8ec;
  --ui-border-strong:#d3d7de;
  --ui-text:#14161a;
  --ui-text-2:#5b626e;
  --ui-text-3:#8a919e;
  --ui-accent:#2563eb;
  --ui-accent-soft:#eef3ff;
  --ui-ok:#0f8a5f; --ui-ok-soft:#e8f6f0;
  --ui-warn:#b45309; --ui-warn-soft:#fdf3e7;
  --ui-danger:#c2323b; --ui-danger-soft:#fdeef0;
  --ui-info:#0e7490; --ui-info-soft:#e7f5f8;
  --ui-neutral:#5b626e; --ui-neutral-soft:#eef0f3;

  --ui-r:10px; --ui-r-sm:7px; --ui-r-lg:14px;
  --ui-shadow:0 1px 2px rgba(16,20,28,.05);
  --ui-shadow-pop:0 8px 24px -8px rgba(16,20,28,.18);
  --ui-sidebar-w:244px;
  --ui-sidebar-w-collapsed:64px;
  --ui-topbar-h:56px;

  --nav-bg:#ffffff;
  --nav-border:var(--ui-border);
  --nav-text:#4b5563;
  --nav-text-hover:#14161a;
  --nav-hover-bg:#f2f4f7;
  --nav-active-bg:var(--ui-accent-soft);
  --nav-active-text:var(--ui-accent);
  --nav-section:#9aa1ae;
  --nav-brand:#14161a;
}

/* Tema escuro — troca só os tokens; todo componente construído com var(--ui-*)
   se adapta sozinho. Ativado via html[data-theme="dark"] (JS no rodapé do
   base.html / portal_base.html), não segue prefers-color-scheme automaticamente. */
html[data-theme="dark"]{
  color-scheme:dark;
  --ui-bg:#0e1014;
  --ui-surface:#15181e;
  --ui-surface-2:#1b1f26;
  --ui-border:#272c35;
  --ui-border-strong:#363d49;
  --ui-text:#e9ecf1;
  --ui-text-2:#9aa2b0;
  --ui-text-3:#6f7683;
  --ui-accent:#5b8cff;
  --ui-accent-soft:#182338;
  --ui-ok:#4ade9f; --ui-ok-soft:#122a20;
  --ui-warn:#f0b360; --ui-warn-soft:#2c2010;
  --ui-danger:#f87f8a; --ui-danger-soft:#2e1519;
  --ui-info:#5ec8dd; --ui-info-soft:#10262b;
  --ui-neutral:#a8b0bd; --ui-neutral-soft:#232833;

  --ui-shadow:0 1px 2px rgba(0,0,0,.45);
  --ui-shadow-pop:0 12px 28px -8px rgba(0,0,0,.55);

  --nav-bg:#111318;
  --nav-border:var(--ui-border);
  --nav-text:#9aa2b0;
  --nav-text-hover:#ffffff;
  --nav-hover-bg:#1b1f26;
  --nav-active-bg:#1c2740;
  --nav-active-text:#8fb0ff;
  --nav-section:#5c6472;
  --nav-brand:#ffffff;
}
html[data-theme="dark"] .topbar{ background:rgba(21,24,30,.86); }

/* Bootstrap usa cor literal (com !important) nessas utilities — não seguem os
   tokens automaticamente. Remapeia só para o tema escuro. */
html[data-theme="dark"] .bg-white{ background-color:var(--ui-surface)!important; }
html[data-theme="dark"] .bg-light{ background-color:var(--ui-surface-2)!important; }
html[data-theme="dark"] .text-dark{ color:var(--ui-text)!important; }
html[data-theme="dark"] .text-muted{ color:var(--ui-text-2)!important; }
html[data-theme="dark"] .text-secondary{ color:var(--ui-text-2)!important; }
html[data-theme="dark"] .table-light,
html[data-theme="dark"] .table > :not(caption) > .table-light{ background-color:var(--ui-surface-2)!important; color:var(--ui-text-2)!important; }
html[data-theme="dark"] .alert-light{ background-color:var(--ui-surface-2)!important; color:var(--ui-text)!important; border-color:var(--ui-border)!important; }
html[data-theme="dark"] .list-group-item{ background-color:var(--ui-surface)!important; color:var(--ui-text)!important; border-color:var(--ui-border)!important; }
html[data-theme="dark"] hr{ border-color:var(--ui-border); opacity:1; }
html[data-theme="dark"] .btn-close{ filter:invert(1) grayscale(1); }
html[data-theme="dark"] ::selection{ background:var(--ui-accent); color:#0e1014; }

/* ==========================================================================
   1. BASE
   ========================================================================== */
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:var(--ui-bg); color:var(--ui-text);
  font-size:.875rem; line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6{ letter-spacing:-.015em; }
::selection{ background:var(--ui-accent); color:#fff; }
.mono{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; }

/* ==========================================================================
   2. LAYOUT SHELL (sidebar + topbar) — classes novas, só no base/portal_base
   ========================================================================== */
.app-shell{ display:flex; min-height:100vh; }

.sidebar{
  position:fixed; inset:0 auto 0 0; z-index:1045;
  width:var(--ui-sidebar-w);
  background:var(--nav-bg);
  border-right:1px solid var(--nav-border);
  display:flex; flex-direction:column;
  transition:width .18s ease, transform .22s ease;
}
.app-body{
  flex:1; min-width:0;
  margin-left:var(--ui-sidebar-w);
  transition:margin-left .18s ease;
  display:flex; flex-direction:column;
  min-height:100vh;
}
html[data-sidebar="collapsed"] .sidebar{ width:var(--ui-sidebar-w-collapsed); }
html[data-sidebar="collapsed"] .app-body{ margin-left:var(--ui-sidebar-w-collapsed); }
html[data-sidebar="collapsed"] .nav-label,
html[data-sidebar="collapsed"] .nav-section,
html[data-sidebar="collapsed"] .brand-text,
html[data-sidebar="collapsed"] .nav-badge,
html[data-sidebar="collapsed"] .user-text{ display:none; }
html[data-sidebar="collapsed"] .nav-item{ justify-content:center; padding-inline:0; }
html[data-sidebar="collapsed"] .sidebar-head,
html[data-sidebar="collapsed"] .sidebar-foot{ justify-content:center; }

.sidebar-head{
  height:var(--ui-topbar-h); flex-shrink:0;
  display:flex; align-items:center; gap:.625rem;
  padding:0 .875rem; border-bottom:1px solid var(--nav-border);
}
.brand-mark{
  width:28px; height:28px; flex-shrink:0; border-radius:8px;
  background:var(--ui-accent); color:#fff;
  display:grid; place-items:center; font-weight:700; font-size:.72rem; letter-spacing:.02em;
}
.brand-text{ min-width:0; }
.brand-text b{ display:block; color:var(--nav-brand); font-size:.82rem; font-weight:650; line-height:1.15; }
.brand-text span{ display:block; color:var(--nav-section); font-size:.68rem; }

.sidebar-nav{ flex:1; overflow-y:auto; padding:.625rem .5rem; scrollbar-width:thin; }
.sidebar-nav::-webkit-scrollbar{ width:6px; }
.sidebar-nav::-webkit-scrollbar-thumb{ background:var(--nav-border); border-radius:3px; }

.nav-section{
  font-size:.65rem; font-weight:650; text-transform:uppercase; letter-spacing:.07em;
  color:var(--nav-section); padding:.9rem .625rem .3rem;
}
.nav-item{
  display:flex; align-items:center; gap:.7rem;
  padding:.5rem .625rem; margin-bottom:1px;
  border-radius:var(--ui-r-sm);
  color:var(--nav-text); font-size:.8125rem; font-weight:500;
  transition:background .12s ease, color .12s ease;
}
.nav-item i{ font-size:1rem; width:18px; text-align:center; flex-shrink:0; opacity:.85; }
.nav-item:hover{ background:var(--nav-hover-bg); color:var(--nav-text-hover); }
.nav-item.active{ background:var(--nav-active-bg); color:var(--nav-active-text); font-weight:600; }
.nav-item.active i{ opacity:1; }
.nav-label{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-badge{
  font-size:.68rem; font-weight:650; padding:.05rem .375rem; border-radius:999px;
  background:var(--ui-danger-soft); color:var(--ui-danger);
}

.sidebar-foot{
  flex-shrink:0; border-top:1px solid var(--nav-border);
  padding:.5rem; display:flex; align-items:center; gap:.55rem;
}
.avatar{
  width:28px; height:28px; flex-shrink:0; border-radius:999px;
  background:var(--nav-hover-bg); color:var(--nav-text-hover);
  display:grid; place-items:center; font-size:.7rem; font-weight:650;
}
.user-text{ min-width:0; flex:1; }
.user-text b{ display:block; font-size:.78rem; font-weight:600; color:var(--nav-brand); line-height:1.2;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.user-text span{ font-size:.68rem; color:var(--nav-section); }

.topbar{
  position:sticky; top:0; z-index:1030;
  height:var(--ui-topbar-h); flex-shrink:0;
  display:flex; align-items:center; gap:.75rem;
  padding:0 1rem;
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(8px);
  border-bottom:1px solid var(--ui-border);
}
.topbar h1{ font-size:.9375rem; font-weight:650; margin:0; letter-spacing:-.01em;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ui-text); }

.icon-btn{
  width:32px; height:32px; flex-shrink:0; border-radius:var(--ui-r-sm);
  border:1px solid transparent; background:transparent; color:var(--ui-text-2);
  display:grid; place-items:center; font-size:1rem;
  transition:background .12s, color .12s;
}
.icon-btn:hover{ background:var(--ui-surface-2); color:var(--ui-text); border-color:var(--ui-border); }

.page{ padding:1.5rem 1rem 3rem; flex:1; }
@media (min-width:768px){ .page{ padding:1.75rem 1.5rem 4rem; } .topbar{ padding:0 1.5rem; } }
/* Conteúdo é fluido: ocupa a largura toda da tela, sem faixa vazia dos lados.
   O respiro vem do padding da .page, que cresce junto com o monitor. */
.page-inner{ max-width:none; margin:0; width:100%; }
@media (min-width:1600px){ .page{ padding:2rem 2.25rem 4rem; } .topbar{ padding:0 2.25rem; } }
@media (min-width:2200px){ .page{ padding:2.25rem 3rem 4.5rem; } .topbar{ padding:0 3rem; } }

/* Formulários e telas de leitura longa continuam com largura de leitura
   confortável, mas acompanham telas grandes em vez de travar em ~700px. */
.form-shell{ max-width:1100px; }
@media (min-width:1600px){ .form-shell{ max-width:1280px; } }
/* Formulário curto (confirmação, senha, 1-2 campos) não deve esticar. */
.form-shell-sm{ max-width:560px; }

/* Grade automática: cards se acomodam sozinhos conforme a largura sobra.
   Usar quando a lista de cards não tem número fixo de colunas. */
.auto-grid{ display:grid; gap:1rem; grid-template-columns:repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.auto-grid-sm{ display:grid; gap:.75rem; grid-template-columns:repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
.auto-grid-lg{ display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill, minmax(min(100%, 440px), 1fr)); }

/* Toda tabela larga rola dentro do próprio card — a página nunca rola lateral. */
.table-responsive{ -webkit-overflow-scrolling:touch; }

.scrim{ position:fixed; inset:0; background:rgba(10,12,16,.45); z-index:1040; display:none; }
@media (max-width:991.98px){
  .sidebar{ transform:translateX(-100%); width:var(--ui-sidebar-w); box-shadow:var(--ui-shadow-pop); }
  html[data-drawer="open"] .sidebar{ transform:none; }
  html[data-drawer="open"] .scrim{ display:block; }
  .app-body{ margin-left:0!important; }
  html[data-sidebar="collapsed"] .nav-label,
  html[data-sidebar="collapsed"] .nav-section,
  html[data-sidebar="collapsed"] .brand-text,
  html[data-sidebar="collapsed"] .user-text,
  html[data-sidebar="collapsed"] .nav-badge{ display:revert; }
  html[data-sidebar="collapsed"] .nav-item{ justify-content:flex-start; padding-inline:.625rem; }
  html[data-sidebar="collapsed"] .sidebar-head,
  html[data-sidebar="collapsed"] .sidebar-foot{ justify-content:flex-start; }
}

/* page-head helper (título + ações no topo da página) */
.page-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1.25rem; }
.page-head h2{ font-size:1.25rem; font-weight:680; margin:0 0 .15rem; letter-spacing:-.02em; color:var(--ui-text); }
.page-head p{ margin:0; font-size:.8125rem; color:var(--ui-text-2); }

/* stat tile helper */
.stat{ padding:.95rem 1rem; }
.stat-label{ font-size:.7rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ui-text-3); }
.stat-value{ font-size:1.65rem; font-weight:680; letter-spacing:-.03em; line-height:1.15; margin:.2rem 0 .1rem; font-variant-numeric:tabular-nums; color:var(--ui-text); }

/* rowlist helper (lista tipo timeline usada em painéis) */
.rowlist{ display:flex; flex-direction:column; }
.rowitem{
  display:flex; align-items:center; gap:.7rem;
  padding:.6rem 1rem; border-bottom:1px solid var(--ui-border);
  color:var(--ui-text); transition:background .1s;
}
.rowitem:last-child{ border-bottom:0; }
.rowitem:hover{ background:var(--ui-surface-2); }
.rowitem .ri-icon{ width:26px; height:26px; border-radius:var(--ui-r-sm); display:grid; place-items:center;
  flex-shrink:0; font-size:.8rem; background:var(--ui-surface-2); color:var(--ui-text-2); border:1px solid var(--ui-border); }
.rowitem .ri-body{ flex:1; min-width:0; }
.rowitem .ri-title{ font-size:.8125rem; font-weight:550; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rowitem .ri-sub{ font-size:.72rem; color:var(--ui-text-3); }

/* chip — mesmo visual dos .badge (ver seção 4), usável em HTML novo */
.chip{
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.7rem; font-weight:600; line-height:1.4;
  padding:.16rem .5rem; border-radius:999px;
  background:var(--ui-surface-2); color:var(--ui-text-2);
  border:1px solid var(--ui-border);
}
.chip-ok{ background:var(--ui-ok-soft); color:var(--ui-ok); border-color:transparent; }
.chip-warn{ background:var(--ui-warn-soft); color:var(--ui-warn); border-color:transparent; }
.chip-danger{ background:var(--ui-danger-soft); color:var(--ui-danger); border-color:transparent; }
.chip-info{ background:var(--ui-info-soft); color:var(--ui-info); border-color:transparent; }
.chip-accent{ background:var(--ui-accent-soft); color:var(--ui-accent); border-color:transparent; }

/* mini calendário — usado no calendário geral e nos calendários por
   empresa (aba Contabilidade / Entregas da ficha) */
.mini-cal{ width:100%; border-collapse:separate; border-spacing:2px; table-layout:fixed; }
.mini-cal th{
  text-align:center; font-size:.62rem; font-weight:650; text-transform:uppercase;
  letter-spacing:.04em; color:var(--ui-text-3); padding-bottom:.25rem;
}
.mini-cal td{
  height:64px; vertical-align:top; width:14.28%;
  border:1px solid var(--ui-border); border-radius:var(--ui-r-sm);
  padding:.25rem; background:var(--ui-surface);
}
.mini-cal td.fora{ background:transparent; border-color:transparent; }
.mini-cal td.hoje{ background:var(--ui-accent-soft); border-color:var(--ui-accent); }
.mini-cal .dia-n{ font-size:.7rem; font-weight:650; color:var(--ui-text-2); }
.mini-cal .dia-dots{ display:flex; flex-wrap:wrap; gap:.2rem; margin-top:.2rem; }
.mini-cal .dia-dot{
  width:7px; height:7px; border-radius:999px; background:var(--ui-accent); flex-shrink:0;
}
.mini-cal .dia-mais{ font-size:.6rem; color:var(--ui-text-3); }

/* calendário de entregas por empresa — célula maior, item com status colorido
   (a diferença de .mini-cal: aqui cada item carrega urgência real, então
   ponto genérico não basta — precisa mostrar nome + cor de status) */
.cal-emp{ width:100%; border-collapse:separate; border-spacing:2px; table-layout:fixed; }
.cal-emp th{
  text-align:center; font-size:.62rem; font-weight:650; text-transform:uppercase;
  letter-spacing:.04em; color:var(--ui-text-3); padding-bottom:.25rem;
}
.cal-emp td{
  height:104px; vertical-align:top; width:14.28%;
  border:1px solid var(--ui-border); border-radius:var(--ui-r-sm);
  padding:.3rem; background:var(--ui-surface); overflow:hidden;
}
.cal-emp td.fora{ background:transparent; border-color:transparent; }
.cal-emp td.hoje{ background:var(--ui-accent-soft); border-color:var(--ui-accent); }
.cal-emp .dia-n{ font-size:.72rem; font-weight:650; color:var(--ui-text-2); }
.cal-emp .item{
  font-size:.65rem; line-height:1.2; border-radius:.3rem; padding:.08rem .3rem;
  margin-top:.2rem; display:block; font-weight:600; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis;
}
.cal-emp .item-ok{ background:var(--ui-ok-soft); color:var(--ui-ok); }
.cal-emp .item-warn{ background:var(--ui-warn-soft); color:var(--ui-warn); }
.cal-emp .item-danger{ background:var(--ui-danger-soft); color:var(--ui-danger); }
.cal-emp .item-accent{ background:var(--ui-accent-soft); color:var(--ui-accent); }
.cal-emp .item-neutro{ background:var(--ui-surface-2); color:var(--ui-text-2); }
.cal-emp .dia-mais{ font-size:.62rem; color:var(--ui-text-3); display:block; margin-top:.15rem; }

/* portal — hero card */
.portal-hero{
  border:1px solid var(--ui-border); border-radius:var(--ui-r-lg);
  background:linear-gradient(180deg, var(--ui-accent-soft), var(--ui-surface) 70%);
  padding:1.25rem;
}

/* search input com ícone */
.search{ position:relative; }
.search i{ position:absolute; left:.65rem; top:50%; transform:translateY(-50%); color:var(--ui-text-3); font-size:.85rem; pointer-events:none; }
.search .form-control{ padding-left:2rem; }

/* ==========================================================================
   3. OVERRIDES BOOTSTRAP — aplica em TODOS os templates existentes sem
   precisar renomear classe por classe.
   ========================================================================== */

/* cards */
.card{
  background:var(--ui-surface);
  border:1px solid var(--ui-border);
  border-radius:var(--ui-r);
  box-shadow:var(--ui-shadow);
}
.card-header{
  background:transparent!important; border-bottom:1px solid var(--ui-border);
  padding:.75rem 1rem;
}
.card-header h1,.card-header h2,.card-header h3,.card-header h4,.card-header h5,.card-header h6,
.card-header .card-title{ font-size:.8125rem; font-weight:650; margin:0; letter-spacing:-.005em; color:var(--ui-text)!important; }
.card-body{ padding:1rem; }
.card-footer{ background:transparent!important; border-top:1px solid var(--ui-border); }

/* sombras decorativas antigas — achata pra manter só a sombra padrão do .card */
.shadow-sm,.shadow{ box-shadow:var(--ui-shadow)!important; }

/* faixa colorida à esquerda dos cards (poluição visual antiga) */
[class*="border-start"][class*="border-4"]{
  border-left-width:1px!important;
  border-left-color:var(--ui-border)!important;
}

/* botões */
.btn{ border-radius:var(--ui-r-sm); font-weight:550; font-size:.8125rem; padding:.4rem .8rem; box-shadow:none!important; }
.btn-sm{ font-size:.775rem; padding:.28rem .6rem; }
.btn-lg{ font-size:.9rem; padding:.55rem 1.1rem; }

.btn-primary{ background:var(--ui-accent); border-color:var(--ui-accent); }
.btn-primary:hover,.btn-primary:focus{ background:color-mix(in srgb,var(--ui-accent) 85%,#000); border-color:transparent; }

.btn-secondary,.btn-light,.btn-outline-secondary{
  background:var(--ui-surface); border-color:var(--ui-border); color:var(--ui-text);
}
.btn-secondary:hover,.btn-light:hover,.btn-outline-secondary:hover{
  background:var(--ui-surface-2); border-color:var(--ui-border-strong); color:var(--ui-text);
}
.btn-outline-primary{ color:var(--ui-accent); border-color:var(--ui-accent); background:transparent; }
.btn-outline-primary:hover{ background:var(--ui-accent-soft); border-color:var(--ui-accent); color:var(--ui-accent); }
.btn-outline-success{ color:var(--ui-ok); border-color:var(--ui-ok); background:transparent; }
.btn-outline-success:hover{ background:var(--ui-ok-soft); border-color:var(--ui-ok); color:var(--ui-ok); }
.btn-outline-danger{ color:var(--ui-danger); border-color:var(--ui-danger); background:transparent; }
.btn-outline-danger:hover{ background:var(--ui-danger-soft); border-color:var(--ui-danger); color:var(--ui-danger); }
.btn-outline-light{ color:var(--ui-text-2); border-color:var(--ui-border); background:transparent; }
.btn-outline-light:hover{ background:var(--ui-surface-2); color:var(--ui-text); }
.btn-danger{ background:var(--ui-danger); border-color:var(--ui-danger); }
.btn-success{ background:var(--ui-ok); border-color:var(--ui-ok); }
.btn-warning{ background:var(--ui-warn); border-color:var(--ui-warn); color:#fff; }
.btn-info{ background:var(--ui-info); border-color:var(--ui-info); color:#fff; }
.btn-link{ color:var(--ui-accent); font-weight:550; }

/* badges → chips minimalistas (mapeia as combinações já usadas nos templates) */
.badge{
  border-radius:999px!important; font-weight:600!important; letter-spacing:0;
  padding:.16rem .55rem!important; font-size:.7rem!important; vertical-align:middle;
}
.badge.border{ border-color:transparent!important; }

.badge.bg-success,.badge.bg-success-subtle{ background:var(--ui-ok-soft)!important; color:var(--ui-ok)!important; }
.badge.bg-danger,.badge.bg-danger-subtle{ background:var(--ui-danger-soft)!important; color:var(--ui-danger)!important; }
.badge.bg-warning,.badge.bg-warning-subtle{ background:var(--ui-warn-soft)!important; color:var(--ui-warn)!important; }
.badge.bg-info,.badge.bg-info-subtle{ background:var(--ui-info-soft)!important; color:var(--ui-info)!important; }
.badge.bg-primary,.badge.bg-primary-subtle{ background:var(--ui-accent-soft)!important; color:var(--ui-accent)!important; }
.badge.bg-secondary,.badge.bg-secondary-subtle{ background:var(--ui-neutral-soft)!important; color:var(--ui-neutral)!important; }
.badge.bg-light{ background:var(--ui-surface-2)!important; color:var(--ui-text-2)!important; border:1px solid var(--ui-border)!important; }
.badge.bg-dark{ background:var(--ui-text)!important; color:#fff!important; }
.badge.text-success,.badge.text-danger,.badge.text-warning,.badge.text-info,.badge.text-primary,
.badge.text-secondary,.badge.text-info-emphasis,.badge.text-dark{ color:inherit!important; }

/* tabelas */
.table{ --bs-table-bg:transparent; margin:0; color:var(--ui-text); }
.table > :not(caption) > * > *{
  padding:.6rem 1rem; vertical-align:middle;
  border-bottom-color:var(--ui-border); background:transparent!important; color:inherit;
}
.table thead th{
  font-size:.68rem!important; font-weight:650!important; text-transform:uppercase; letter-spacing:.06em;
  color:var(--ui-text-3)!important; background:transparent!important; white-space:nowrap;
  border-bottom:1px solid var(--ui-border); padding-block:.55rem;
}
.table tbody tr{ transition:background .1s; }
.table tbody tr:hover{ background:var(--ui-surface-2)!important; }
.table tbody tr:last-child > *{ border-bottom:0; }
.table-responsive{ border-radius:var(--ui-r); }

/* formulários */
.form-control,.form-select{
  background:var(--ui-surface); color:var(--ui-text);
  border:1px solid var(--ui-border); border-radius:var(--ui-r-sm);
  font-size:.8125rem; padding:.4rem .65rem; box-shadow:none;
}
.form-control::placeholder{ color:var(--ui-text-3); }
.form-control:focus,.form-select:focus{
  border-color:var(--ui-accent); box-shadow:0 0 0 3px color-mix(in srgb,var(--ui-accent) 15%,transparent);
}
.form-label{ font-size:.75rem; font-weight:600; color:var(--ui-text-2); margin-bottom:.25rem; }
.input-group-text{ background:var(--ui-surface-2); border-color:var(--ui-border); color:var(--ui-text-2); }
.form-check-input:checked{ background-color:var(--ui-accent); border-color:var(--ui-accent); }

/* dropdown */
.dropdown-menu{
  border-radius:var(--ui-r); border:1px solid var(--ui-border); padding:.3rem;
  box-shadow:var(--ui-shadow-pop); font-size:.8125rem;
}
.dropdown-item{ border-radius:var(--ui-r-sm); padding:.35rem .6rem; font-weight:500; }
.dropdown-item:hover,.dropdown-item:focus{ background:var(--ui-surface-2); color:var(--ui-text); }

/* alertas */
.alert{ border-radius:var(--ui-r); border:1px solid var(--ui-border); font-size:.8125rem; padding:.65rem .9rem; box-shadow:var(--ui-shadow); }
.alert-success{ background:var(--ui-ok-soft); border-color:transparent; color:var(--ui-ok); }
.alert-danger{ background:var(--ui-danger-soft); border-color:transparent; color:var(--ui-danger); }
.alert-info{ background:var(--ui-info-soft); border-color:transparent; color:var(--ui-info); }
.alert-warning{ background:var(--ui-warn-soft); border-color:transparent; color:var(--ui-warn); }

/* listas */
.list-group-item{ border-color:var(--ui-border); font-size:.8125rem; }
.list-group-item-action:hover{ background:var(--ui-surface-2); }

/* abas */
.nav-tabs{
  border-bottom:1px solid var(--ui-border); flex-wrap:nowrap;
  overflow-x:auto; overflow-y:hidden; scrollbar-width:none;
}
.nav-tabs::-webkit-scrollbar{ display:none; }
.nav-tabs .nav-item{ flex-shrink:0; margin-bottom:0!important; }
.nav-tabs .nav-link{
  border:0!important; border-bottom:2px solid transparent!important; border-radius:0!important;
  color:var(--ui-text-2); font-weight:550; font-size:.8125rem; padding:.55rem .75rem; white-space:nowrap;
  background:transparent!important; margin:0!important; line-height:1.3;
}
.nav-tabs .nav-link:hover{ color:var(--ui-text); border-color:transparent!important; }
.nav-tabs .nav-link.active{
  background:transparent!important; color:var(--ui-accent)!important; border-bottom-color:var(--ui-accent)!important; font-weight:650;
}

/* título + ações no cabeçalho de card/seção não devem estourar a largura */
.card-header,
.d-flex.justify-content-between{ flex-wrap:wrap; row-gap:.5rem; }

/* paginação */
.pagination .page-link{ border-color:var(--ui-border); color:var(--ui-text-2); font-size:.8125rem; }
.pagination .page-item.active .page-link{ background:var(--ui-accent); border-color:var(--ui-accent); }

/* progress bar */
.progress{ background:var(--ui-border); border-radius:999px; height:6px; }
.progress-bar{ background:var(--ui-accent); }

/* modal */
.modal-content{ border-radius:var(--ui-r-lg); border:1px solid var(--ui-border); background:var(--ui-surface); color:var(--ui-text); }
.modal-header,.modal-footer{ border-color:var(--ui-border); }

/* accordion (usado na ficha da empresa) */
.accordion{ box-shadow:none!important; }
.accordion-item{
  background:var(--ui-surface)!important; border:1px solid var(--ui-border)!important;
  border-radius:var(--ui-r)!important; overflow:hidden;
}
.accordion-button{
  background:var(--ui-surface)!important; color:var(--ui-text)!important;
  font-size:.8125rem!important; font-weight:650!important;
  padding:.75rem 1rem!important; box-shadow:none!important;
}
.accordion-button:not(.collapsed){ background:var(--ui-surface-2)!important; color:var(--ui-text)!important; }
.accordion-button:focus{ box-shadow:none!important; border-color:var(--ui-border)!important; }
.accordion-button::after{ opacity:.6; }
.accordion-body{ background:var(--ui-surface)!important; border-top:1px solid var(--ui-border)!important; }

/* ---------------------------------------------------------------------------
   Grupos de checkbox (CheckboxSelectMultiple) — regimes, módulos, meios de
   envio. O Django renderiza uma lista crua de inputs; aqui cada opção vira uma
   pílula clicável. Estava definido só no form de entregáveis; virou global para
   os outros formulários pararem de exibir a lista sem estilo.
   --------------------------------------------------------------------------- */
.check-grid > div{ display:flex; flex-wrap:wrap; gap:.5rem; }
.check-grid > div > div{ margin:0; }
.check-grid label{
  display:inline-flex; align-items:center; gap:.4rem; cursor:pointer;
  border:1px solid var(--ui-border); border-radius:999px;
  padding:.3rem .7rem; font-size:.8125rem; line-height:1.2;
  background:var(--ui-surface); color:var(--ui-text-2);
  transition:border-color .15s ease, background .15s ease, color .15s ease;
}
.check-grid label:hover{ border-color:var(--ui-accent); }
.check-grid input[type=checkbox]{ width:1rem; height:1rem; margin:0; cursor:pointer; }
.check-grid label:has(input:checked){
  border-color:var(--ui-accent); background:var(--ui-accent-soft,rgba(13,110,253,.1));
  color:var(--ui-accent); font-weight:600;
}

/* ---------------------------------------------------------------------------
   Barra de abas com menu "Mais" (ficha da empresa).

   `.nav-tabs` rola na horizontal (overflow-x:auto / overflow-y:hidden), e isso
   RECORTA qualquer dropdown que esteja dentro dela — z-index não resolve, é
   clipping. Por isso o menu fica fora da lista que rola: a lista ocupa o espaço
   disponível e o "Mais" é irmão dela, ambos com a mesma linha de base.
   --------------------------------------------------------------------------- */
.abas-com-menu{
  display:flex; align-items:flex-end; gap:.25rem;
  border-bottom:1px solid var(--ui-border);
}
/* A lista ocupa só o que precisa: assim o "Mais" fica logo depois da última
   aba, e não grudado na borda direita. Quem decide o que não cabe é o JS da
   ficha; a rolagem herdada de .nav-tabs fica como rede de segurança (a aba
   aberta nunca vai para o menu, então ela pode passar do limite). */
.abas-com-menu > .nav-tabs{ flex:0 1 auto; min-width:0; border-bottom:0; }
.abas-com-menu > .dropdown{ flex:0 0 auto; }
.abas-com-menu > .dropdown .nav-link{
  border:0; border-bottom:2px solid transparent; border-radius:0;
  color:var(--ui-text-2); font-weight:550; font-size:.8125rem;
  padding:.55rem .75rem; white-space:nowrap; background:transparent; line-height:1.3;
}
.abas-com-menu > .dropdown .nav-link:hover{ color:var(--ui-text); }
.abas-com-menu > .dropdown .nav-link.active{
  color:var(--ui-accent); border-bottom-color:var(--ui-accent); font-weight:650;
}
.abas-com-menu .dropdown-menu{ z-index:1060; }
