/* Obrix Fiscal — estilos compartilhados do sistema (dashboard) */
:root { --accent: #3b82f6; }
* { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif; }
.font-mono { font-family: 'JetBrains Mono', ui-monospace, monospace; }
body { background: #0a0a0a; }

.border-gradient { position: relative; }
.border-gradient::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  background: linear-gradient(225deg, rgba(255,255,255,0.0) 0%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0.0) 100%);
  pointer-events: none;
}

input:-webkit-autofill, select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 40px #0a0a0a inset !important;
  -webkit-text-fill-color: #fff !important;
}

/* Sem isso, o campo fica escuro mas a lista de opções (renderizada pelo
   próprio navegador) cai no branco padrão do sistema com texto ilegível. */
select { color-scheme: dark; }
select option { background-color: #171717; color: #f5f5f5; }
select option:checked, select option:hover, select option:focus {
  background-color: #2563eb; color: #fff;
}

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.16); }

@keyframes fadeSlideIn { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } }
.animate-in { animation: fadeSlideIn .5s ease-out both; }
.delay-1 { animation-delay: .05s; } .delay-2 { animation-delay: .1s; } .delay-3 { animation-delay: .15s; }

.card-glow { background: linear-gradient(225deg, rgba(255,255,255,0.0) 0%, rgba(255,255,255,0.05) 50%, rgba(255,255,255,0.0) 100%); }

.sidebar-link { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0.85rem; border-radius: 10px; font-size: 0.875rem; font-weight: 500; color: rgb(163 163 163); transition: all .15s; }
.sidebar-link:hover { color: #fff; background: rgba(255,255,255,0.05); }
.sidebar-link.active { color: #fff; background: rgba(59,130,246,0.12); }
.sidebar-link.active .side-ic { color: #60a5fa; }
.sidebar-link.active-group { color: #e5e5e5; }
.sidebar-sublink { padding-left: 2.5rem; font-size: 0.82rem; }
.sidebar-sublink .side-ic { width: 4px; }
.sidebar-sublink.active { position: relative; }
.sidebar-sublink.active::before { content: ""; position: absolute; left: 1.65rem; top: 50%; transform: translateY(-50%); width: 4px; height: 4px; border-radius: 9999px; background: #60a5fa; }

.table-row:hover { background: rgba(255,255,255,0.03); }

.modal-backdrop { background: rgba(0,0,0,0.6); backdrop-filter: blur(4px); }

.toast { animation: fadeSlideIn .3s ease-out both; }

.badge { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.25rem 0.625rem; border-radius: 9999px; font-size: 0.72rem; font-weight: 600; white-space: nowrap; }
.badge-dot { width: 6px; height: 6px; border-radius: 9999px; }
.badge-atrasado { background: rgba(239,68,68,0.12); color: #fca5a5; }
.badge-atrasado .badge-dot { background: #f87171; }
.badge-pendente { background: rgba(245,158,11,0.12); color: #fcd34d; }
.badge-pendente .badge-dot { background: #fbbf24; }
.badge-em_dia { background: rgba(59,130,246,0.12); color: #93c5fd; }
.badge-em_dia .badge-dot { background: #60a5fa; }
.badge-cumprida { background: rgba(34,197,94,0.12); color: #86efac; }
.badge-cumprida .badge-dot { background: #4ade80; }
.badge-ativa { background: rgba(34,197,94,0.12); color: #86efac; }
.badge-ativa .badge-dot { background: #4ade80; }
.badge-inativa { background: rgba(163,163,163,0.12); color: #a3a3a3; }
.badge-inativa .badge-dot { background: #a3a3a3; }
.badge-alta { background: rgba(239,68,68,0.12); color: #fca5a5; }
.badge-alta .badge-dot { background: #f87171; }
.badge-media { background: rgba(245,158,11,0.12); color: #fcd34d; }
.badge-media .badge-dot { background: #fbbf24; }
.badge-baixa { background: rgba(59,130,246,0.12); color: #93c5fd; }
.badge-baixa .badge-dot { background: #60a5fa; }
.badge-interna { background: rgba(163,163,163,0.12); color: #d4d4d4; }
.badge-interna .badge-dot { background: #a3a3a3; }
.badge-cliente { background: rgba(168,85,247,0.14); color: #d8b4fe; }
.badge-cliente .badge-dot { background: #c084fc; }
.badge-aberta, .badge-em_andamento { background: rgba(59,130,246,0.12); color: #93c5fd; }
.badge-aberta .badge-dot, .badge-em_andamento .badge-dot { background: #60a5fa; }
.badge-andamento { background: rgba(245,158,11,0.12); color: #fcd34d; }
.badge-andamento .badge-dot { background: #fbbf24; }
.badge-aguardando { background: rgba(168,85,247,0.14); color: #d8b4fe; }
.badge-aguardando .badge-dot { background: #c084fc; }
.badge-concluida, .badge-concluido, .badge-recebido, .badge-pago { background: rgba(34,197,94,0.12); color: #86efac; }
.badge-concluida .badge-dot, .badge-concluido .badge-dot, .badge-recebido .badge-dot, .badge-pago .badge-dot { background: #4ade80; }
.badge-cancelado, .badge-nao_pago { background: rgba(163,163,163,0.12); color: #a3a3a3; }
.badge-cancelado .badge-dot, .badge-nao_pago .badge-dot { background: #a3a3a3; }
.badge-classificado, .badge-visualizado { background: rgba(59,130,246,0.12); color: #93c5fd; }
.badge-classificado .badge-dot, .badge-visualizado .badge-dot { background: #60a5fa; }
.badge-enviado { background: rgba(59,130,246,0.12); color: #93c5fd; }
.badge-enviado .badge-dot { background: #60a5fa; }

.dropzone { border: 1.5px dashed rgba(255,255,255,0.15); transition: all .15s; }
.dropzone.drag-over { border-color: rgba(59,130,246,0.5); background: rgba(59,130,246,0.06); }
.step-line { position: relative; }
.step-line::before { content: ""; position: absolute; left: 11px; top: 26px; bottom: -8px; width: 2px; background: rgba(255,255,255,0.08); }
.step-line:last-child::before { display: none; }

.kanban-col { min-height: 120px; }
.kanban-card { cursor: grab; }
.kanban-card.dragging { opacity: 0.4; }
.kanban-col.drag-over { background: rgba(59,130,246,0.06); border-radius: 16px; }