/* ============================================================
   Nibo SaaS — estilo baseado no app antigo (Escritório Globo)
   Paleta: azul #1a56db (primário), verde/vermelho/laranja/roxo
   ============================================================ */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background: #f0f2f5; color: #1a202c; font-size: 14px;
}

/* ── Login ── */
.login-screen { display:flex; align-items:center; justify-content:center; min-height:100vh; padding:20px; background:linear-gradient(135deg,#1a56db 0%,#3b82f6 100%); }
.login-box { background:#fff; border-radius:12px; padding:32px; width:100%; max-width:400px; box-shadow:0 12px 40px rgba(0,0,0,.25); }
.login-box h1 { font-size:22px; margin-bottom:4px; color:#1a202c; }
.login-box .sub { color:#718096; margin-bottom:22px; font-size:13px; }
.login-box label { display:block; font-size:.72rem; color:#4a5568; margin:10px 0 4px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
.login-box input { width:100%; padding:9px 11px; background:#fff; border:1px solid #cbd5e0; border-radius:7px; color:#1a202c; font-size:14px; }
.login-box input:focus { outline:none; border-color:#1a56db; }
.login-box button { width:100%; padding:10px; background:#1a56db; color:#fff; border:none; border-radius:7px; cursor:pointer; font-size:14px; font-weight:600; margin-top:16px; }
.login-box button:hover { background:#1447c0; }
.login-box .error { color:#c53030; font-size:13px; margin-top:10px; min-height:18px; }

/* ── Header ── */
header { background:#1a56db; color:#fff; padding:0 18px; height:50px; display:flex; align-items:center; gap:10px; box-shadow:0 2px 8px rgba(0,0,0,.2); position:sticky; top:0; z-index:300; }
header h1 { font-size:.88rem; font-weight:700; white-space:nowrap; }
header .sub { font-size:.7rem; opacity:.6; margin-left:2px; }
.hgap { flex:1; }
.hbtn { padding:3px 10px; background:rgba(255,255,255,.15); color:#fff; border:1px solid rgba(255,255,255,.25); border-radius:14px; cursor:pointer; font-size:.7rem; }
.hbtn:hover { background:rgba(255,255,255,.28); }
.cinfo { font-size:.68rem; opacity:.7; white-space:nowrap; }

/* ── Layout ── */
.layout { display:flex; height:calc(100vh - 50px); }

/* ── Sidebar ── */
.sidebar { width:220px; background:#fff; border-right:1px solid #e2e8f0; overflow-y:auto; flex-shrink:0; padding-bottom:20px; }
.grp { padding:11px 13px 3px; font-size:.6rem; text-transform:uppercase; letter-spacing:.08em; color:#c0c0c0; font-weight:700; }
.sidebar a { display:flex; align-items:center; gap:7px; padding:7px 13px; font-size:.79rem; color:#4a5568; cursor:pointer; text-decoration:none; border-left:3px solid transparent; transition:background .1s; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sidebar a:hover { background:#f7faff; color:#1a56db; }
.sidebar a.active { background:#eff6ff; color:#1a56db; border-left-color:#1a56db; font-weight:600; }
.sidebar a.sub { padding-left:26px; font-size:.73rem; color:#aaa; }
.sidebar a.sub:hover, .sidebar a.sub.active { color:#1a56db; }
.ico { width:16px; text-align:center; flex-shrink:0; font-size:.86rem; }

/* ── Main ── */
.main { flex:1; padding:16px 20px; overflow-y:auto; min-width:0; }

/* ── Breadcrumb ── */
.breadcrumb { display:flex; align-items:center; gap:5px; margin-bottom:12px; font-size:.76rem; color:#888; flex-wrap:wrap; }
.breadcrumb .cur { color:#4a5568; font-weight:600; }

/* ── Toolbar ── */
.toolbar { display:flex; align-items:center; gap:8px; margin-bottom:12px; flex-wrap:wrap; }
.toolbar h2 { font-size:.96rem; font-weight:700; margin-right:auto; }
.toolbar h2 small { font-size:.73rem; font-weight:400; color:#aaa; margin-left:6px; }
.btn { padding:5px 12px; border-radius:6px; cursor:pointer; font-size:.76rem; font-weight:600; border:none; display:inline-flex; align-items:center; gap:4px; white-space:nowrap; text-decoration:none; color:inherit; }
.btn-primary { background:#1a56db; color:#fff; }
.btn-primary:hover { background:#1447c0; }
.btn-secondary { background:#fff; color:#555; border:1px solid #e2e8f0; }
.btn-secondary:hover { background:#f7faff; color:#1a56db; border-color:#1a56db; }
.btn-green { background:#059669; color:#fff; } .btn-green:hover { background:#047857; }
.btn-orange { background:#d97706; color:#fff; } .btn-orange:hover { background:#b45309; }
.btn-red { background:#dc2626; color:#fff; } .btn-red:hover { background:#b91c1c; }
.srch input { padding:5px 10px 5px 27px; border:1px solid #e2e8f0; border-radius:6px; font-size:.76rem; width:220px; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' fill='none' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7' stroke='%23bbb' stroke-width='2'/%3E%3Cpath d='M16.5 16.5 21 21' stroke='%23bbb' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 8px center; }
.srch input:focus { outline:none; border-color:#1a56db; }
.mcnt { font-size:.72rem; color:#aaa; white-space:nowrap; }

/* ── Filter Panel ── */
.filter-panel { background:#fff; border:1px solid #e8ecf2; border-radius:9px; padding:10px 14px; margin-bottom:12px; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.fp-head { font-size:.75rem; font-weight:700; margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.fp-head a { font-size:.71rem; font-weight:400; color:#1a56db; cursor:pointer; margin-left:auto; text-decoration:none; }
.fp-row { display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; }
.fp-item { display:flex; align-items:center; gap:4px; flex-shrink:0; }
.fp-item label { font-size:.72rem; color:#4a5568; white-space:nowrap; cursor:pointer; user-select:none; }
.fp-item input[type=checkbox] { width:13px; height:13px; accent-color:#1a56db; cursor:pointer; flex-shrink:0; }
.fp-item input[type=text], .fp-item input[type=date], .fp-item select { padding:4px 8px; border:1px solid #e2e8f0; border-radius:5px; font-size:.73rem; background:#fff; width:160px; min-width:0; color:#1a202c; }
.fp-item input[type=date] { width:135px; }
.fp-item input:focus, .fp-item select:focus { outline:none; border-color:#1a56db; }
.fp-item .active-filter { border-color:#1a56db; background:#eff6ff; }
.fp-actions { display:flex; gap:6px; margin-top:10px; align-items:center; }

/* ── Tabs dashboard ── */
.tabs { display:flex; gap:0; margin-bottom:14px; border-bottom:2px solid #e2e8f0; }
.tab { padding:9px 18px; font-size:.82rem; font-weight:600; color:#888; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; transition:color .15s; }
.tab:hover { color:#1a56db; }
.tab.active { color:#1a56db; border-bottom-color:#1a56db; }

/* ── Cards / Table ── */
.card { background:#fff; border-radius:9px; border:1px solid #e8ecf2; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,.04); margin-bottom:16px; }
.tbl-wrap { overflow-x:auto; max-height:calc(100vh - 320px); overflow-y:auto; }
table { width:100%; border-collapse:collapse; font-size:.79rem; }
thead { position:sticky; top:0; z-index:2; }
th { text-align:left; padding:9px 12px; background:#f8fafc; border-bottom:2px solid #e8ecf2; font-weight:600; color:#4a5568; font-size:.67rem; text-transform:uppercase; letter-spacing:.05em; white-space:nowrap; }
td { padding:8px 12px; border-bottom:1px solid #f1f5f9; vertical-align:middle; max-width:300px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
tr:last-child td { border-bottom:none; }
tbody tr:hover { background:#fafcff; }
tbody tr.clickable { cursor:pointer; }
tbody tr.clickable:hover { background:#eff6ff; }

/* ── Badges ── */
.badge { display:inline-block; padding:2px 8px; border-radius:99px; font-size:.67rem; font-weight:600; white-space:nowrap; }
.bg { background:#d1fae5; color:#065f46; }
.br { background:#fee2e2; color:#991b1b; }
.bb { background:#dbeafe; color:#1e40af; }
.by { background:#fef3c7; color:#92400e; }
.bgr { background:#f1f5f9; color:#475569; }
.bpu { background:#ede9fe; color:#5b21b6; }
.bor { background:#ffedd5; color:#9a3412; }

/* ── KPIs ── */
.kpi-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:10px; margin-bottom:16px; }
.kpi { background:#fff; border-radius:9px; border:1px solid #e8ecf2; padding:14px 13px; box-shadow:0 1px 3px rgba(0,0,0,.04); transition:all .15s; cursor:pointer; }
.kpi:hover { box-shadow:0 4px 12px rgba(0,0,0,.1); transform:translateY(-2px); }
.knum { font-size:1.85rem; font-weight:800; line-height:1.1; }
.klbl { font-size:.7rem; color:#888; margin-top:4px; font-weight:500; }
.kpi.blue .knum { color:#1a56db; }
.kpi.green .knum { color:#059669; }
.kpi.red .knum { color:#dc2626; }
.kpi.orange .knum { color:#d97706; }
.kpi.purple .knum { color:#7c3aed; }
.kpi.teal .knum { color:#0891b2; }

.two-col { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:16px; }
@media(max-width:860px){ .two-col{grid-template-columns:1fr; } }
.three-col { display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px; margin-bottom:16px; }
@media(max-width:960px){ .three-col{grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .three-col{grid-template-columns:1fr; } }

.card-head { padding:11px 14px; border-bottom:1px solid #f1f5f9; font-size:.8rem; font-weight:700; display:flex; align-items:center; justify-content:space-between; }
.card-head small { font-size:.68rem; font-weight:400; color:#aaa; }
.card-body { padding:12px 14px; }

/* ── Barras (top N) ── */
.brow { padding:6px 8px; margin-bottom:1px; border-radius:5px; transition:background .1s; cursor:pointer; }
.brow:hover { background:#f7faff; }
.brow-top { display:flex; justify-content:space-between; font-size:.75rem; margin-bottom:3px; color:#555; gap:8px; }
.brow-top span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
.brow-top strong { color:#1a202c; font-weight:700; flex-shrink:0; }
.btrack { background:#f1f5f9; border-radius:99px; height:5px; overflow:hidden; }
.bfill { height:100%; border-radius:99px; transition:width .5s ease; }

/* ── Cards de usuário/departamento ── */
.resp-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:12px; }
.rcard { background:#fff; border-radius:9px; border:1px solid #e8ecf2; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.rcard-head { background:linear-gradient(135deg,#1a56db,#3b82f6); color:#fff; padding:11px 14px; display:flex; align-items:center; gap:10px; }
.avatar { width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.8rem; flex-shrink:0; }
.rname { font-weight:600; font-size:.84rem; line-height:1.2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:120px; }
.rcnt { margin-left:auto; background:rgba(255,255,255,.22); border-radius:99px; padding:3px 9px; font-size:.7rem; font-weight:700; }
.rcard-body { padding:9px 14px; }
.rstat { display:flex; justify-content:space-between; align-items:center; padding:4px 0; border-bottom:1px solid #f8fafc; font-size:.75rem; }
.rstat:last-child { border-bottom:none; }

.dept-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; }
.dcard { background:#fff; border-radius:9px; border:1px solid #e8ecf2; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,.04); cursor:pointer; transition:box-shadow .15s; }
.dcard:hover { box-shadow:0 4px 12px rgba(0,0,0,.1); }
.dcard-head { background:#f8fafc; border-bottom:1px solid #e8ecf2; padding:11px 14px; display:flex; align-items:center; justify-content:space-between; }
.dcard-head strong { font-size:.82rem; color:#1a202c; }
.dcard-body { padding:10px 14px; }
.drow { display:flex; justify-content:space-between; font-size:.76rem; color:#555; padding:3px 0; }

/* ── Planos (contratação) ── */
.plans-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; max-width:720px; }
.plan { background:#fff; border:2px solid #e8ecf2; border-radius:12px; padding:22px 20px; text-align:center; position:relative; transition:all .15s; }
.plan:hover { box-shadow:0 4px 20px rgba(0,0,0,.08); transform:translateY(-2px); }
.plan.current { border-color:#1a56db; }
.plan.current::before { content:"Plano atual"; position:absolute; top:-10px; left:50%; transform:translateX(-50%); background:#1a56db; color:#fff; padding:3px 12px; border-radius:99px; font-size:.66rem; font-weight:700; text-transform:uppercase; }
.plan .pname { font-size:1.15rem; font-weight:700; margin-bottom:4px; }
.plan .pprice { font-size:2rem; font-weight:800; color:#1a56db; margin:8px 0 4px; }
.plan .pprice small { font-size:.7rem; color:#888; font-weight:500; }
.plan ul { list-style:none; margin:16px 0; font-size:.8rem; color:#4a5568; text-align:left; }
.plan ul li { padding:5px 0; border-bottom:1px solid #f1f5f9; }
.plan ul li:before { content:"✓ "; color:#059669; font-weight:700; }
.plan button { width:100%; padding:10px; background:#1a56db; color:#fff; border:none; border-radius:7px; cursor:pointer; font-size:.82rem; font-weight:600; }
.plan button:hover { background:#1447c0; }
.plan button:disabled { background:#cbd5e0; cursor:not-allowed; }

.billing-status { background:#fff; border:1px solid #e8ecf2; border-radius:9px; padding:16px 20px; margin-bottom:18px; display:flex; align-items:center; gap:16px; }
.billing-status .bs-icon { font-size:1.8rem; }
.billing-status .bs-text { flex:1; }
.billing-status .bs-title { font-weight:700; margin-bottom:3px; font-size:.88rem; }
.billing-status .bs-sub { color:#888; font-size:.75rem; }
.billing-status.trial { border-left:4px solid #d97706; }
.billing-status.active { border-left:4px solid #059669; }
.billing-status.grace_period { border-left:4px solid #d97706; background:#fffaf0; }
.billing-status.suspended { border-left:4px solid #dc2626; background:#fff5f5; }

/* ── Paginação ── */
.pagination { display:flex; justify-content:space-between; align-items:center; padding:10px 14px; font-size:.75rem; color:#888; background:#fafcff; border-top:1px solid #f1f5f9; }
.pagination .pinfo { font-weight:500; }
.pagination button { padding:5px 12px; background:#fff; border:1px solid #e2e8f0; color:#4a5568; border-radius:6px; cursor:pointer; font-size:.74rem; font-weight:600; }
.pagination button:hover:not(:disabled) { border-color:#1a56db; color:#1a56db; }
.pagination button:disabled { opacity:.4; cursor:not-allowed; }
.infinite-status { text-align:center; color:#9ca3af; font-size:.72rem; padding:6px 14px; border-top:1px solid #f1f5f9; background:#fafcff; }

/* ── States ── */
.empty { text-align:center; padding:44px; color:#bbb; font-size:.83rem; }
.eico { font-size:2.2rem; display:block; margin-bottom:10px; }
.err { background:#fff5f5; border:1px solid #fed7d7; border-radius:8px; padding:11px 14px; color:#c53030; font-size:.79rem; margin-bottom:14px; }
.loading { text-align:center; padding:52px; color:#888; font-size:.82rem; }
.spin { display:inline-block; width:22px; height:22px; border:2px solid #e2e8f0; border-top-color:#1a56db; border-radius:50%; animation:spin .7s linear infinite; vertical-align:middle; margin-right:6px; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ── Breadcrumb (novo) ── */
.bc-link { color:#1a56db; cursor:pointer; text-decoration:none; }
.bc-link:hover { text-decoration:underline; }
.bc-sep { color:#ccc; }
.bc-current { color:#4a5568; font-weight:600; }

/* ── Btn-link (ações em tabelas) ── */
.btn-link { background:none; border:none; color:#1a56db; cursor:pointer; font-size:.73rem; padding:2px 4px; text-decoration:underline; }
.btn-link:hover { color:#1447c0; }

/* ── Task grouping (subtarefas) ── */
.task-list { display:flex; flex-direction:column; gap:8px; }
.tg-summary { font-size:.73rem; color:#888; margin-bottom:8px; padding:0 2px; }
.task-group { background:#fff; border:1px solid #e8ecf2; border-radius:10px; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,.04); }

.task-parent { padding:10px 14px; background:#f8fafc; border-bottom:1px solid #eef2f7; }
.task-parent.task-overdue { background:#fff5f5; border-left:3px solid #dc2626; }
.task-child { padding:8px 14px 8px 28px; background:#f0fdf4; border-bottom:1px dashed #d1fae5; border-left:3px solid #10b981; }
.task-child:last-child { border-bottom:none; }

.tg-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:5px; }
.tg-client { font-size:.72rem; font-weight:700; color:#1a56db; text-transform:uppercase; letter-spacing:.04em; background:#eff6ff; padding:2px 8px; border-radius:4px; }
.tg-dept { font-size:.7rem; color:#888; }
.tg-body { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:5px; }
.tg-icon { font-size:.9rem; flex-shrink:0; }
.tg-title { font-size:.82rem; font-weight:600; color:#1a202c; flex:1; min-width:120px; }
.task-child .tg-title { font-size:.79rem; font-weight:500; color:#065f46; }
.tg-badges { display:flex; gap:4px; flex-wrap:wrap; flex-shrink:0; }
.tg-footer { display:flex; gap:16px; }
.tg-responsible, .tg-date { font-size:.71rem; color:#888; }
.tg-responsible { color:#555; }

/* ── Sync progress bar ── */
.sync-progress-bar { background:#e2e8f0; border-radius:99px; height:4px; overflow:hidden; }
.sync-progress-fill { height:100%; width:40%; background:linear-gradient(90deg,#3b82f6,#60a5fa,#3b82f6); background-size:200%; animation:sync-slide 1.2s linear infinite; border-radius:99px; }
@keyframes sync-slide { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
.sync-running-badge { animation:pulse 1.5s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.65} }

/* ── Task flat list ── */
tr.task-flat-child td { background:#f8fafc; }
tr.task-flat-overdue td { background:#fff5f5; }
tr.task-flat-overdue td:first-child { border-left:3px solid #dc2626; }
.task-id-cell { font-family:monospace; font-size:.7rem; color:#94a3b8; white-space:nowrap; }
.task-dept-sub { font-size:.7rem; color:#94a3b8; margin-top:1px; }
.task-cell-sm { font-size:.78rem; }
.task-flat-info { padding:6px 14px; font-size:.75rem; color:#64748b; border-bottom:1px solid #e2e8f0; background:#fafbfc; }
.subs-label { font-size:.7rem; font-weight:700; color:#64748b; margin-bottom:6px; text-transform:uppercase; letter-spacing:.05em; }
.subs-table { width:100%; font-size:.78rem; border-collapse:collapse; }
.subs-table th { text-align:left; padding:4px 8px; color:#64748b; font-weight:600; }
.subs-table td { padding:4px 8px; border-top:1px solid #f1f5f9; }

/* ── Task expansion panel ── */
.task-exp-meta { display:flex; gap:18px; flex-wrap:wrap; padding:6px 12px; background:#f8fafc; border-bottom:1px solid #e2e8f0; font-size:.73rem; color:#64748b; }
.task-exp-meta strong { color:#374151; }
.task-exp-tabs { display:flex; gap:0; border-bottom:2px solid #e2e8f0; padding:0 8px; background:#fff; }
.task-exp-tab { padding:6px 14px; font-size:.76rem; font-weight:600; color:#94a3b8; border:none; background:none; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; transition:color .15s,border-color .15s; }
.task-exp-tab:hover { color:#1a56db; }
.task-exp-tab.task-exp-tab-active { color:#1a56db; border-bottom-color:#1a56db; }
.task-exp-body { padding:8px 12px; min-height:40px; }
.task-exp-empty { font-size:.78rem; color:#94a3b8; padding:8px 2px; }
.task-exp-note { border:1px solid #e2e8f0; border-radius:6px; margin-bottom:8px; overflow:hidden; }
.task-exp-note-header { display:flex; justify-content:space-between; align-items:center; padding:5px 10px; background:#f8fafc; border-bottom:1px solid #e2e8f0; }
.task-exp-note-author { font-size:.75rem; font-weight:600; color:#374151; }
.task-exp-note-date { font-size:.72rem; color:#94a3b8; }
.task-exp-note-body { padding:8px 10px; font-size:.8rem; color:#374151; white-space:pre-wrap; line-height:1.5; }

/* ── Sync banner no dashboard ── */
.sync-banner { display:flex; align-items:center; gap:10px; padding:8px 16px; background:#f0f9ff; border:1px solid #bae6fd; border-radius:8px; margin-bottom:12px; flex-wrap:wrap; font-size:.78rem; color:#0369a1; }
.sync-banner.sync-banner-running { background:#fefce8; border-color:#fde68a; color:#92400e; animation:pulse 2s ease-in-out infinite; }
.sync-banner-icon { font-size:1rem; flex-shrink:0; }
.sync-banner-txt { color:#64748b; }
.sync-banner-chips { display:flex; gap:6px; flex-wrap:wrap; flex:1; }
.sync-chip { font-size:.72rem; padding:2px 8px; border-radius:99px; background:rgba(255,255,255,.7); border:1px solid #bae6fd; color:#0369a1; white-space:nowrap; }
.sync-chip-running { background:#fef3c7; border-color:#fcd34d; color:#92400e; }
.sync-chip-pending { background:#f1f5f9; border-color:#cbd5e1; color:#64748b; }
.sync-chip-err { background:#fff1f2; border-color:#fecdd3; color:#be123c; }
.sync-banner-link { margin-left:auto; color:#0369a1; text-decoration:none; font-size:.75rem; white-space:nowrap; cursor:pointer; }
.sync-banner-link:hover { text-decoration:underline; }

/* ── Cenários ── */
.scenarios-bar { display:flex; align-items:center; gap:8px; padding:8px 14px; border-bottom:1px solid #e2e8f0; background:#fafbfc; flex-wrap:wrap; }
.sc-label { font-size:.72rem; font-weight:700; color:#64748b; text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; }
.sc-chips { display:flex; gap:6px; flex-wrap:wrap; flex:1; align-items:center; }
.sc-empty { color:#94a3b8; font-size:.75rem; }
.sc-chip { display:inline-flex; align-items:center; gap:4px; padding:3px 10px; border-radius:99px; border:1px solid #cbd5e1; background:white; font-size:.75rem; cursor:pointer; color:#374151; transition:all .15s; }
.sc-chip:hover { border-color:#6366f1; color:#6366f1; }
.sc-chip.sc-active { background:#6366f1; color:white; border-color:#6366f1; }
.sc-del { font-size:.9rem; line-height:1; opacity:.55; margin-left:2px; }
.sc-del:hover { opacity:1; }
.sc-save-btn { padding:3px 12px !important; font-size:.75rem !important; white-space:nowrap; }

/* ── Filtros por coluna (Excel-like) ── */
.th-task { white-space:nowrap; }
.th-inner { display:flex; align-items:center; justify-content:space-between; gap:4px; }
.th-lbl { flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.th-actions { display:flex; align-items:center; gap:2px; opacity:0; transition:opacity .15s; }
th:hover .th-actions,
th:has(.th-filter-on) .th-actions,
th:has(.th-frozen-on) .th-actions { opacity:1; }
.th-filter-btn, .th-freeze-btn { background:none; border:none; cursor:pointer; padding:1px 4px; border-radius:3px; font-size:.72rem; color:#94a3b8; line-height:1; transition:all .1s; }
.th-filter-btn:hover, .th-freeze-btn:hover { background:#e2e8f0; color:#374151; }
.th-filter-btn.th-filter-on { color:#6366f1 !important; opacity:1; }
.th-freeze-btn.th-frozen-on { color:#0ea5e9 !important; opacity:1; }

/* ── Popup de filtro por coluna ── */
.col-filter-popup { background:white; border:1px solid #e2e8f0; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,.14); min-width:190px; overflow:hidden; }
.cfp-body { padding:10px 12px; display:flex; flex-direction:column; gap:6px; }
.cfp-lbl { font-size:.7rem; color:#64748b; margin-bottom:-2px; }
.cfp-input { width:100%; padding:5px 8px; border:1px solid #e2e8f0; border-radius:5px; font-size:.8rem; box-sizing:border-box; color:#1a202c; }
.cfp-input:focus { outline:none; border-color:#6366f1; box-shadow:0 0 0 2px rgba(99,102,241,.12); }
.cfp-actions { display:flex; gap:6px; padding:8px 12px; background:#f8fafc; border-top:1px solid #f1f5f9; }
.cfp-btn { padding:4px 12px !important; font-size:.75rem !important; }

/* ── Frozen columns ── */
.col-frozen { white-space:nowrap; }

/* ── Row selection (checkboxes) ── */
.cb-col { width:32px; padding:4px 6px !important; }
.cb-col input[type=checkbox] { width:15px; height:15px; cursor:pointer; accent-color:#6366f1; }
tr.row-selected td { background:#eef2ff !important; }
tr.row-selected td:first-child { border-left:3px solid #6366f1; }
.sel-bar { display:flex; align-items:center; gap:12px; padding:7px 14px; background:#eef2ff; border-bottom:1px solid #c7d2fe; font-size:.8rem; color:#4338ca; font-weight:500; }

/* ── KPI link indicator ── */
.kpi::after { content:'→'; position:absolute; right:10px; bottom:8px; font-size:.75rem; color:#cbd5e1; transition:color .15s; }
.kpi { position:relative; }
.kpi:hover::after { color:#6366f1; }

/* ── Dashboard elementos clicáveis ── */
.dash-clickable { cursor:pointer; transition:box-shadow .15s, transform .1s; }
.dash-clickable:hover { box-shadow:0 4px 14px rgba(99,102,241,.18); transform:translateY(-1px); }
.dash-arrow { font-size:.72rem; color:#94a3b8; transition:color .15s; }
.dash-clickable:hover .dash-arrow { color:#6366f1; }
.dash-stat-link { cursor:pointer; border-radius:5px; transition:background .12s; padding:3px 6px; margin:-3px -6px; }
.dash-stat-link:hover { background:#eff6ff; }
.brow.dash-clickable { border-radius:6px; padding:4px 6px; margin:-4px -6px; }
.brow.dash-clickable:hover { background:#f8fafc; }

/* ── Ordenação por coluna ── */
.th-sortable { cursor:pointer; user-select:none; }
.th-sortable:hover { color:#1a56db; }
.sort-ind { font-size:.65rem; color:#cbd5e0; margin-left:3px; }
.sort-active { color:#1a56db; font-weight:700; }
.th-sortable[data-sort]:hover .sort-ind { color:#93c5fd; }

/* ── Export dropdown ── */
.export-item { display:block; width:100%; padding:9px 16px; text-align:left; background:none; border:none; cursor:pointer; font-size:.82rem; color:#374151; white-space:nowrap; }
.export-item:hover { background:#eff6ff; color:#1a56db; }
.export-item:first-child { border-radius:8px 8px 0 0; }
.export-item:last-child { border-radius:0 0 8px 8px; }

/* ── Form grid (gerenciar usuários) ── */
.form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; }
.form-grid label { display:block; font-size:.72rem; font-weight:600; color:#4a5568; text-transform:uppercase; letter-spacing:.04em; margin-bottom:4px; }
.form-grid input, .form-grid select { width:100%; padding:7px 10px; border:1px solid #e2e8f0; border-radius:6px; font-size:.8rem; background:#fff; color:#1a202c; }
.form-grid input:focus, .form-grid select:focus { outline:none; border-color:#1a56db; }

/* ── Checkboxes de departamento ── */
.dept-checks-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:6px; margin-top:6px; }
.dept-check-label { display:flex; align-items:center; gap:8px; padding:7px 10px; border:1px solid #e2e8f0; border-radius:6px; cursor:pointer; font-size:.82rem; background:#fafafa; transition:background .15s,border-color .15s; }
.dept-check-label:hover { background:#eff6ff; border-color:#1a56db; }
.dept-check-label input { width:15px; height:15px; cursor:pointer; accent-color:#1a56db; flex-shrink:0; }
.dept-check-label:has(input:checked) { background:#eff6ff; border-color:#1a56db; font-weight:600; }

/* ── Modal de edição ── */
.modal-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:500; align-items:center; justify-content:center; padding:16px; }
.modal-box { background:#fff; border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,.3); width:100%; max-width:680px; max-height:90vh; overflow-y:auto; }

/* ── Print (PDF export) ── */
@media print {
  header, .sidebar, .breadcrumb, .toolbar .btn, .tabs, .btn-filters, #btn-clear, .pagination, .filter-panel { display:none !important; }
  .main { padding:0; overflow:visible; }
  .layout { height:auto; }
  body { background:#fff; }
  .card { box-shadow:none; border:1px solid #ccc; }
  .kpi { break-inside:avoid; }
  .kpi-grid { grid-template-columns:repeat(4,1fr); }
  .two-col { grid-template-columns:1fr 1fr; }
}

/* ── Notificações ── */
.bell-btn { position:relative; font-size:1.1rem; padding:6px 10px !important; }
.bell-badge { position:absolute; top:2px; right:2px; background:#dc2626; color:#fff; font-size:9px; font-weight:700; border-radius:999px; padding:1px 4px; line-height:1.2; min-width:14px; text-align:center; }
.notif-list { display:flex; flex-direction:column; gap:8px; max-width:700px; }
.notif-item { background:#fff; border:1px solid #e2e8f0; border-radius:8px; padding:14px 16px; }
.notif-item.read { opacity:.65; }
.notif-item:not(.read) { border-left:3px solid #1a56db; }
.notif-title { font-weight:600; font-size:.9rem; color:#1a202c; margin-bottom:4px; }
.notif-body { font-size:.82rem; color:#4a5568; margin-bottom:6px; }
.notif-time { font-size:.72rem; color:#94a3b8; }
.btn-sm { margin-top:8px; padding:4px 12px; font-size:.75rem; background:#eff6ff; color:#1a56db; border:1px solid #bfdbfe; border-radius:5px; cursor:pointer; }
.btn-sm:hover { background:#dbeafe; }

/* ── Impersonation bar ── */
.impersonate-bar { background:#fef3c7; border-bottom:2px solid #f59e0b; padding:8px 20px; font-size:.82rem; text-align:center; }
.impersonate-bar a { color:#b45309; font-weight:700; }

/* ── Danger button ── */
.hbtn-danger { background:#dc2626 !important; color:#fff !important; border-color:#dc2626 !important; }
.hbtn-danger:hover { background:#b91c1c !important; }

/* ── Install PWA prompt ── */
.pwa-prompt { position:fixed; bottom:20px; right:20px; background:#1a56db; color:#fff; border-radius:10px; padding:14px 18px; box-shadow:0 4px 20px rgba(0,0,0,.2); display:flex; align-items:center; gap:12px; z-index:9999; font-size:.85rem; animation:slideUp .3s ease; }
.pwa-prompt button { padding:6px 14px; border-radius:6px; cursor:pointer; font-size:.82rem; }
.pwa-prompt .btn-install { background:#fff; color:#1a56db; border:none; font-weight:700; }
.pwa-prompt .btn-dismiss { background:transparent; color:rgba(255,255,255,.7); border:1px solid rgba(255,255,255,.4); }
@keyframes slideUp { from{transform:translateY(20px);opacity:0} to{transform:translateY(0);opacity:1} }

/* ── Nibo API Wizard ── */
.nibo-status { padding:12px 16px; border-radius:8px; margin-bottom:20px; font-size:.88rem; }
.nibo-status.ok   { background:#f0fdf4; border:1px solid #86efac; color:#166534; }
.nibo-status.warn { background:#fffbeb; border:1px solid #fcd34d; color:#92400e; }
.nibo-wizard { padding:28px 32px; }
.wizard-steps { display:flex; gap:0; margin-bottom:28px; border-bottom:2px solid #e2e8f0; }
.wizard-step { padding:10px 20px; font-size:.82rem; font-weight:600; color:#94a3b8; border-bottom:3px solid transparent; margin-bottom:-2px; }
.wizard-step.active { color:#1a56db; border-bottom-color:#1a56db; }
.wdesc { font-size:.84rem; color:#64748b; margin-bottom:16px; line-height:1.5; }
.sync-bar-wrap { background:#e2e8f0; border-radius:99px; height:8px; overflow:hidden; margin-top:8px; }
.sync-bar { background:linear-gradient(90deg,#1a56db,#3b82f6); height:100%; border-radius:99px; width:0; transition:width .6s ease; }

/* ── Sync status error detail ── */
.sync-err-row td { padding:0 !important; }
.sync-err-detail {
  background:#fff5f5; border-left:3px solid #fc8181;
  color:#c53030; font-size:.78rem; padding:6px 16px;
  font-family:monospace; word-break:break-all; line-height:1.5;
}

/* ── Subtask expandable ── */
.subtask-toggle { cursor:pointer; border:none; font-size:.7rem !important; padding:2px 8px; }
.subtask-toggle:hover { background:#1d4ed8; }
.subtask-area { border-top:1px dashed #d1fae5; }