/* IMVICTUS — componentes compartilhados, revisão visual 2. */
html { scroll-padding-top: 90px; }
body { line-height: 1.6; }
.sidebar { background: var(--nav-bg); padding: 26px 16px 18px; border-right: 1px solid rgba(255,255,255,.05); }
.brand { padding: 0 8px 25px; gap: 12px; border-bottom: 1px solid rgba(255,255,255,.12); }
.brand-mark { width: 38px; height: 38px; border-radius: 11px; background: #405bd8; color: white; font-size: 14px; letter-spacing: -.5px; box-shadow: 0 5px 14px #0002; }
.brand-name { font-size: 16px; letter-spacing: .035em; }
.brand-name small { color: var(--nav-muted); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; margin-top: 6px; }
.nav-group { margin-top: 23px; }
.nav-group > span { color: var(--nav-muted); font-size: 10px; text-transform: uppercase; font-weight: 700; letter-spacing: .12em; padding-bottom: 9px; }
.nav { display: grid; gap: 3px; }
.nav a { padding: 10px 12px; color: var(--nav-text); font-size: 13px; border-radius: 8px; }
.nav a > .ic { opacity: .7; }
.nav a:hover { background: var(--nav-hover); }
.nav a.active { background: #405bd8; box-shadow: 0 4px 12px #0002; }
.nav a.active > .ic { opacity: 1; }
.nav a.active::before { display: none; }
.nav .count.hot { background: #b93243; }
.sidebar-foot { border-color: #ffffff1a; margin-top: 28px; padding-top: 18px; }
.sidebar-foot a { color: var(--nav-text); }
.topbar { min-height: 76px; padding: 16px 32px; background: var(--panel); gap: 18px; }
.search-global { max-width: 460px; min-width: 0; }
.search-global input { background: var(--surface); border-color: transparent; padding-left: 36px; }
.search-global .ic { top: 13px; }
.search-global kbd { top: 10px; }
.topbar-actions { gap: 10px; }
.content { padding: 30px 32px 56px; max-width: 1920px; margin: 0 auto; }
.page-head { margin-bottom: 26px; align-items: center; }
h1 { font-size: 27px; font-weight: 600; letter-spacing: -.035em; }
.page-head p { margin-top: 7px; font-size: 13px; }
.eyebrow { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .14em; font-weight: 700; color: var(--petrol); margin-bottom: 7px; }
.panel { box-shadow: var(--shadow); }
.panel-head { padding: 19px 22px; min-height: 66px; }
.panel-head h2 { font-size: 14px; font-weight: 600; }
.panel-head .sub { display: block; margin-top: 3px; font-size: 12px; }
.panel-body { padding: 22px; }
.panel-foot { padding: 16px 22px; }
.grid { gap: 20px; }
.kpis { gap: 14px; border: 0; background: transparent; box-shadow: none; border-radius: 0; }
.kpis .kpi { position: relative; padding: 19px 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: var(--shadow); min-width: 0; }
a.kpi { transition: border-color .15s, box-shadow .15s; }
a.kpi:hover { border-color: var(--petrol-400); box-shadow: 0 6px 22px -12px #405bd855; }
.kpi-label { font-weight: 600; font-size: 11px; color: var(--ink-2); gap: 7px; }
.kpi-label .ic { color: var(--petrol); }
.kpi-value { font-size: 34px; letter-spacing: -.04em; line-height: 1.2; margin: 13px 0 9px; }
.kpi-foot { font-size: 11px; line-height: 1.5; }
.kpi.warn { border-top: 3px solid var(--signal); padding-top: 17px; }
.kpi.bad { border-top: 3px solid var(--coral); padding-top: 17px; }
.kpi.good { border-top: 3px solid var(--leaf); padding-top: 17px; }
.btn { height: 39px; border-radius: 8px; font-size: 13px; font-weight: 600; gap: 7px; padding: 0 14px; transition: background .15s, border-color .15s; }
.btn:hover { border-color: var(--ink-4); }
.btn-primary { background: var(--action); border-color: var(--action); color: #fff; }
.btn-primary:hover { background: var(--action-hover); border-color: var(--action-hover); }
.btn-sm { height: 33px; padding: 0 11px; font-size: 12px; }
.btn-signal { color: var(--ink); background: var(--signal-100); border-color: var(--signal); }
.btn-signal:hover { background: var(--signal-100); border-color: var(--warning-text); }
.icon-btn { width: 38px; height: 38px; flex: none; }
.presence { height: 33px; font-size: 11px; }
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):not([type=color]), select { min-height: 40px; }
input::placeholder, textarea::placeholder { color: var(--ink-4); opacity: 1; }
label, .label { font-size: 12px; font-weight: 600; }
.field { margin-bottom: 19px; }
.form-section > h3 { font-size: 14px; margin-bottom: 17px; }
.table th { background: var(--hover); font-size: 10px; letter-spacing: .055em; text-transform: uppercase; font-weight: 700; padding: 14px 16px; }
.table td { padding: 15px 16px; }
.cell-title { font-weight: 600; font-size: 13px; }
.cell-sub { margin-top: 4px; }
.toolbar { padding: 16px 18px; gap: 10px; }
.views { padding: 12px 16px 0; gap: 8px; }
.views a { padding: 10px 12px 13px; font-size: 12px; }
.views a.active { color: var(--petrol); }
.badge { border-radius: 6px; font-size: 11px; height: 24px; }
.status { font-size: 12px; }
.dropdown-menu { padding: 8px; border-radius: 12px; box-shadow: var(--shadow-pop); }
dialog { border-radius: 16px; box-shadow: var(--shadow-pop); max-width: calc(100vw - 24px); }
dialog::backdrop { background: #10172588; backdrop-filter: blur(3px); }
.empty { padding: 35px 20px; }
.empty > .ic { color: var(--ink-4); }
.empty h3 { margin-top: 12px; }
.sla-warning .fuse-label, .flash-warning { color: var(--warning-text); }
.auth-side { background: var(--nav-bg); color: var(--nav-text); }
.auth-side p, .auth-fuses div { color: var(--nav-muted); }
.auth-card { max-width: 420px; padding: 32px; border: 1px solid var(--line); border-radius: 18px; background: var(--panel); box-shadow: var(--shadow); }
.portal-top, .portal-hero { background: var(--nav-bg); }
.portal-hero p, .portal-top nav a { color: var(--nav-text); }
.skip-link { position: fixed; top: -80px; left: 16px; z-index: 100; padding: 12px 18px; background: var(--panel); color: var(--ink); border: 2px solid var(--petrol); border-radius: 8px; }
.skip-link:focus { top: 12px; }
@media (max-width: 1450px) { .kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .topbar { gap: 10px; padding: 14px 22px; } .content { padding: 26px 22px 44px; } .presence span { display: none; } }
@media (max-width: 900px) { .sidebar { padding-top: 22px; } .topbar { padding: 12px 16px; min-height: 66px; } .content { padding: 24px 16px 40px; } .topbar-actions { gap: 5px; } .app.nav-open::after { background: #10172588; } }
@media (max-width: 680px) {
  h1 { font-size: 23px; } .page-head { gap: 16px; margin-bottom: 22px; }
  .kpis { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .kpis .kpi { padding: 16px 12px; } .kpis .kpi.warn, .kpis .kpi.bad, .kpis .kpi.good { padding-top: 14px; }
  .kpi-value { font-size: 29px; } .kpi-label { font-size: 10px; } .kpi-foot { font-size: 10px; }
  .panel-head, .panel-body { padding: 17px; } .panel-head { flex-wrap: wrap; }
  .topbar { flex-wrap: wrap; gap: 8px; } .search-global { order: 3; flex-basis: 100%; max-width: none; }
  .topbar-actions { margin-left: auto; } .toolbar > input[type=search] { max-width: none; }
  .toolbar select { flex: 1; min-width: 120px; } .form-actions { flex-wrap: wrap; }
  .auth-card { padding: 25px; } .auth-form { padding: 24px 16px; }
}
@media print { .content { padding: 0; } .kpis .kpi { box-shadow: none; } .skip-link { display: none; } }
/* Avisos e notas internas mantêm legibilidade nos dois temas. */
.msg.note .msg-head::after, .radar .clock.warn { color: var(--warning-text); }
.portal-top .brand, .auth-side .brand { border-bottom: 0; }

/* IMVICTUS: cinza neutro no tema claro; tema escuro inalterado. */
:root[data-theme="light"] { --action:#68686c; --action-hover:#4b4b50; }
:root[data-theme="light"] .btn-primary { background:#68686c; border-color:#68686c; color:#fff; }
:root[data-theme="light"] .btn-primary:hover { background:#4b4b50; border-color:#4b4b50; }
/* Tema claro automático (sem atributo data-theme): mesma paleta neutra. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) { --action:#68686c; --action-hover:#4b4b50; }
  :root:not([data-theme="dark"]) .btn-primary { background:#68686c; border-color:#68686c; color:#fff; }
  :root:not([data-theme="dark"]) .btn-primary:hover { background:#4b4b50; border-color:#4b4b50; }
}

/* Navegação da revisão: neutralidade Apple no claro, azul discreto no escuro. */
:root[data-theme="light"] .nav a.active { background:#e5e5e9; color:#303036; box-shadow:none; }
:root[data-theme="light"] .brand-mark { background:#707078; }
:root[data-theme="light"] .nav a.active .ic { color:#414149; }
:root[data-theme="dark"] .nav a.active { background:#13233d; color:#8faaff; box-shadow:none; }
:root[data-theme="dark"] .brand-mark { background:#263e68; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .nav a.active { background:#e5e5e9; color:#303036; box-shadow:none; } :root:not([data-theme="dark"]) .brand-mark { background:#707078; } }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .nav a.active { background:#13233d; color:#8faaff; box-shadow:none; } :root:not([data-theme="light"]) .brand-mark { background:#263e68; } }
/* Mensagens visíveis independentemente da posição de rolagem. */
.toasts { z-index: 1200; }
.flash-toast { width:min(420px,calc(100vw - 36px)); margin:0; padding:14px 16px; background:var(--panel); box-shadow:var(--shadow-pop); border-radius:12px; }
[hidden].theme-icon-sun, [hidden].theme-icon-moon { display:none!important; }
/* Barra lateral no tema claro: cinzas suaves, sem azul saturado. */
:root[data-theme="light"] { --nav-bg:#f2f2f4; --nav-hover:#e7e7eb; --nav-text:#36363d; --nav-muted:#6e707b; }
:root[data-theme="light"] .sidebar { border-right-color:#dddde2; }
:root[data-theme="light"] .brand { border-bottom-color:#d8d8de; }
:root[data-theme="light"] .sidebar-foot { border-color:#d8d8de; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) { --nav-bg:#f2f2f4; --nav-hover:#e7e7eb; --nav-text:#36363d; --nav-muted:#6e707b; } :root:not([data-theme="dark"]) .sidebar { border-right-color:#dddde2; } :root:not([data-theme="dark"]) .brand { border-bottom-color:#d8d8de; } }

/* Revisão visual: cinza refinado para tema claro */
:root[data-theme="light"] { --nav-bg:#e8e8eb; --nav-hover:#d6d6db; --nav-text:#27282c; --nav-muted:#666870; --action:#57585e; --action-hover:#414249; --petrol-700:#676971; --petrol-400:#8a8b92; --petrol-100:#e9e9ed; --petrol-50:#f2f2f4; }
:root[data-theme="light"] .sidebar { scrollbar-color:#9b9ba2 #e4e4e8; }
:root[data-theme="light"] .sidebar::-webkit-scrollbar { width:8px; }
:root[data-theme="light"] .sidebar::-webkit-scrollbar-track { background:#e4e4e8; }
:root[data-theme="light"] .sidebar::-webkit-scrollbar-thumb { background:#9b9ba2; border-radius:99px; border:2px solid #e4e4e8; }
:root[data-theme="light"] .nav a.active { background:#cccdd2; color:#222329; }
:root[data-theme="light"] .nav a:hover { background:#d6d6db; color:#222329; }
:root[data-theme="light"] select, :root[data-theme="light"] select option { color:#303138; background-color:#f9f9fa; }
:root[data-theme="light"] select:focus, :root[data-theme="light"] input:focus, :root[data-theme="light"] textarea:focus { border-color:#878890; box-shadow:0 0 0 3px #d9d9dd; }
:root[data-theme="light"] select[multiple] option:checked { background:linear-gradient(#d3d3d8,#d3d3d8); color:#222329; }
:root[data-theme="light"] input[type="checkbox"], :root[data-theme="light"] input[type="radio"] { accent-color:#64656c; }
/* Retornos flutuantes sempre centralizados. */
.toasts { position:fixed; top:50%; left:50%; right:auto; bottom:auto; transform:translate(-50%,-50%); z-index:1300; width:min(440px,calc(100vw - 32px)); max-width:none; display:flex; flex-direction:column; align-items:stretch; gap:10px; pointer-events:none; }
.toasts .toast, .toasts .flash-toast { pointer-events:auto; width:100%; min-height:60px; padding:17px 20px; border-radius:14px; box-shadow:0 18px 60px #0004; font-weight:600; animation:sd-popup-in .24s cubic-bezier(.2,.8,.2,1) both; }
.toasts .toast { background:var(--panel); color:var(--ink); border:1px solid var(--line); border-left:4px solid #299a69; }
.toasts .toast.bad { background:var(--panel); color:var(--ink); border-left-color:#cf4f58; }
.toasts .flash-success { border-left:4px solid #299a69; }
.toasts .flash-danger, .toasts .flash-warning { border-left:4px solid #cf4f58; }
@keyframes sd-popup-in { from { opacity:0; transform:translateY(14px) scale(.96); } to { opacity:1; transform:translateY(0) scale(1); } }
/* Kanban: feedback físico do cartão e da coluna de destino. */
.kcard { transition:box-shadow .22s ease, border-color .22s ease, opacity .2s ease; will-change:transform; }
.kcard.dragging { opacity:.35; transform:scale(.98); }
.board-col.drop-over { outline:2px dashed var(--petrol-400); outline-offset:-5px; background:var(--petrol-50); }
.kcard.sd-landing { animation:sd-card-landing .42s cubic-bezier(.18,.88,.28,1.25); box-shadow:0 8px 24px #0002; }
.board-col.sd-landed { animation:sd-column-landing .55s ease-out; }
@keyframes sd-card-landing { 0% { transform:translateY(-12px) scale(.95); opacity:.7; } 58% { transform:translateY(3px) scale(1.018); } 100% { transform:translateY(0) scale(1); opacity:1; } }
@keyframes sd-column-landing { 0% { box-shadow:inset 0 0 0 2px var(--petrol-400); } 100% { box-shadow:inset 0 0 0 0 transparent; } }
@media(prefers-reduced-motion:reduce) { .toasts .toast,.toasts .flash-toast,.kcard.sd-landing,.board-col.sd-landed { animation:none!important; } .kcard { transition:none; } }
@media(prefers-color-scheme:light) { :root:not([data-theme="dark"]):not([data-theme="light"]) { --nav-bg:#e8e8eb; --nav-hover:#d6d6db; --nav-text:#27282c; --nav-muted:#666870; --action:#57585e; --action-hover:#414249; --petrol-700:#676971; --petrol-400:#8a8b92; --petrol-100:#e9e9ed; --petrol-50:#f2f2f4; } :root:not([data-theme="dark"]):not([data-theme="light"]) .sidebar { scrollbar-color:#9b9ba2 #e4e4e8; } :root:not([data-theme="dark"]):not([data-theme="light"]) .nav a.active { background:#cccdd2; color:#222329; } :root:not([data-theme="dark"]):not([data-theme="light"]) select, :root:not([data-theme="dark"]):not([data-theme="light"]) select option { color:#303138; background-color:#f9f9fa; } }

/* Revisão — avisos compactos animados e seleção administrativa remota */
.sd-confirm-dialog.sd-alert-compact { width:min(390px,calc(100vw - 32px)); border-radius:20px; animation:sd-modal-enter .25s cubic-bezier(.2,.9,.2,1.1) both; }
.sd-alert-compact .sd-confirm-body { align-items:center; text-align:center; gap:10px; padding:25px 24px 22px; }
.sd-alert-compact .sd-confirm-icon { height:52px; width:52px; border-radius:50%; font-size:26px; }
.sd-alert-compact .sd-confirm-body h2 { font-size:19px; letter-spacing:-.03em; }
.sd-alert-compact .sd-confirm-body p { font-size:13px; line-height:1.5; margin:0 0 8px; }
.sd-alert-compact .sd-confirm-actions { justify-content:center; }
.sd-alert-compact .sd-confirm-actions .btn { min-width:112px; justify-content:center; border-radius:10px; }
.sd-alert-compact.sd-alert-exit { opacity:0; transform:translateY(5px) scale(.97); transition:opacity .15s,transform .15s; }
@keyframes sd-modal-enter { from { opacity:0; transform:translateY(18px) scale(.94); } to { opacity:1; transform:translateY(0) scale(1); } }
.toasts .toast,.toasts .flash-toast { text-align:center; justify-content:center; min-height:58px; border-radius:16px; font-size:13px; animation:sd-popup-in .25s cubic-bezier(.17,.89,.32,1.2) both; }
.toasts.sd-toast-kanban { top:auto; left:auto; right:18px; bottom:18px; transform:none; width:min(360px,calc(100vw - 36px)); }
.toasts.sd-toast-kanban .toast,.toasts.sd-toast-kanban .flash-toast { text-align:left; justify-content:flex-start; }
.remote-bulk-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; border-bottom:1px solid var(--line); }
.remote-bulk-toolbar span { font-size:12px; color:var(--ink-2); }
.remote-check-col { width:42px; text-align:center; }
.remote-check-col input { width:16px; height:16px; cursor:pointer; accent-color:var(--action,var(--petrol)); }
.remote-check-col input:disabled { cursor:not-allowed; opacity:.35; }
@media(prefers-reduced-motion:reduce) { .sd-confirm-dialog.sd-alert-compact { animation:none!important; } }
