/*
  Arquivo: ag-kanban-base.css
  Origem: public/index.html
  Bloco original: <style id="kanban-base-inline-style">
  Função: estilos base do Kanban, incluindo filtros, painel, colunas, cards e estados de drag/drop.
  Observação: extração passiva; não altera lógica JS, drag/drop, clique de cards ou integração Kanban → Histórico.
*/

/* ===== kanban-base-inline-style ===== */
/* ── KANBAN ── */
.kanban-filter-panel{background:#fff;border:1.5px solid rgba(26,115,232,.14);border-radius:12px;padding:11px 12px;margin-bottom:10px;box-shadow:0 1px 6px rgba(26,115,232,.07)}
.kanban-filter-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.kanban-filter-title{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--text)}
.kanban-filter-sub{font-size:11px;color:var(--muted);margin-top:2px;line-height:1.35}
.kanban-filter-clear{padding:6px 12px;border-radius:7px;background:transparent;border:1.5px solid rgba(0,0,0,.12);color:var(--muted);font-size:10.5px;font-weight:700;white-space:nowrap;transition:all .15s;text-transform:uppercase;letter-spacing:.04em}
.kanban-filter-clear:hover{border-color:rgba(26,115,232,.35);color:var(--accent);background:rgba(26,115,232,.06)}
.kanban-filter-list{display:flex;gap:7px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin;scrollbar-color:rgba(26,115,232,.15) transparent}
.kanban-filter-btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:8px;background:var(--surface);border:1.5px solid var(--border);color:var(--muted);font-size:10.5px;font-weight:700;transition:all .15s;text-transform:uppercase;letter-spacing:.04em}
.kanban-filter-btn:hover{border-color:rgba(26,115,232,.28);color:var(--accent);background:rgba(26,115,232,.05)}
.kanban-filter-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 3px 12px rgba(26,115,232,.28)}
.kanban-filter-icon{font-size:12px;line-height:1}
.kanban-filter-label{white-space:nowrap}
.kanban-filter-count{min-width:19px;height:19px;padding:0 5px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:inherit;font-variant-numeric:tabular-nums;background:var(--surface2);border:1px solid var(--border)}
.kanban-filter-btn.active .kanban-filter-count{background:rgba(255,255,255,.25);border-color:rgba(255,255,255,.30);color:#fff}
@media(max-width:760px){.kanban-filter-head{align-items:flex-start;flex-direction:column}.kanban-filter-clear{width:100%}}
.kanban-wrap{overflow-x:auto;padding-bottom:12px;margin:0 -4px}
.kanban-board{display:flex;gap:12px;min-width:max-content;padding:4px 4px 8px}
.kanban-col{width:200px;flex-shrink:0;background:var(--surface2);border-radius:14px;padding:10px 8px;display:flex;flex-direction:column;gap:6px;min-height:100px;transition:background .15s}
.kanban-col.drag-over{background:rgba(37,99,235,.08);outline:2px dashed var(--accent)}
.kanban-col-header{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 8px;border-bottom:1px solid var(--border);margin-bottom:2px}
.kanban-col-title{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.kanban-col-count{font-size:9px;font-weight:800;background:var(--border);color:var(--muted);border-radius:99px;padding:1px 6px}
.kanban-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:8px 9px;cursor:pointer;transition:box-shadow .15s,transform .12s,border-color .15s;user-select:none;overflow:hidden}
.kanban-card:hover{border-color:var(--accent-border);box-shadow:0 6px 16px rgba(0,0,0,.14)}
.kanban-card:active{cursor:grabbing}
.kanban-card.dragging{opacity:.45;transform:scale(.96)}
.kanban-card-art{width:calc(100% + 18px);margin:-8px -9px 7px;background:var(--surface2);border-bottom:1px solid var(--border);aspect-ratio:1.45/1;display:grid;place-items:center;overflow:hidden}
.kanban-card-art img{width:100%;height:100%;object-fit:cover;display:block;background:#fff}
.kanban-card.has-art .kanban-card-num{margin-top:1px}
.kanban-card-num{font-size:9px;font-weight:700;color:var(--accent);letter-spacing:.3px;margin-bottom:2px}
.kanban-card-cliente{font-size:11px;font-weight:800;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kanban-card-prod{font-size:10px;color:var(--muted);font-weight:500;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kanban-card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:5px}
.kanban-card-val{font-size:11px;font-weight:800;color:var(--accent)}
.kanban-card-tag{font-size:9px;font-weight:700;padding:2px 5px;border-radius:99px;text-transform:uppercase;letter-spacing:.3px}
.kanban-card-tag.urgente{background:rgba(239,68,68,.12);color:#ef4444}
.kanban-card-tag.date{background:var(--surface2);color:var(--muted)}
.kanban-card-fin{display:inline-flex;align-items:center;width:max-content;max-width:100%;margin-top:6px;padding:2px 6px;border-radius:999px;font-size:9px;font-weight:800;letter-spacing:.04em;white-space:nowrap;border:1px solid var(--border);background:var(--surface2);color:var(--muted)}
.kanban-card-fin.parcial{background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.28);color:#f59e0b}
.kanban-card-fin.quitado{background:var(--green-dim);border-color:var(--green-border);color:var(--green)}
.kanban-card-fin.sem_pagamento{background:var(--red-dim);border-color:var(--red-border);color:var(--red)}

.kanban-empty{font-size:11px;color:var(--faint);text-align:center;padding:14px 4px;font-weight:600}
.kanban-col[data-status="novos"] .kanban-col-title{color:#2563eb}
.kanban-col[data-status="arte"] .kanban-col-title{color:#7c3aed}
.kanban-col[data-status="aprovacao"] .kanban-col-title{color:#f59e0b}
.kanban-col[data-status="envio"] .kanban-col-title{color:#0891b2}
.kanban-col[data-status="producao"] .kanban-col-title{color:#16a34a}
.kanban-col[data-status="expedicao"] .kanban-col-title{color:#ea580c}
.kanban-col[data-status="entregue"] .kanban-col-title{color:#64748b}
.kanban-col[data-status="pagamento"] .kanban-col-title{color:#db2777}

/* Ajuste UX: Kanban com rolagem horizontal no quadro e rolagem vertical independente por lista */
.kanban-wrap{
  width:100%;
  max-width:100%;
  height:clamp(430px, calc(100vh - 330px), 660px);
  overflow-x:auto !important;
  overflow-y:hidden !important;
  padding:4px 4px 14px !important;
  margin:0 !important;
  border-radius:18px;
  overscroll-behavior-x:contain;
  scrollbar-gutter:stable both-edges;
}
.kanban-wrap::-webkit-scrollbar{height:10px}
.kanban-wrap::-webkit-scrollbar-track{background:var(--surface2);border-radius:999px}
.kanban-wrap::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 42%,var(--border2));border-radius:999px;border:2px solid var(--surface2)}
.kanban-wrap::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--accent) 62%,var(--border2))}
.kanban-board{
  height:100%;
  min-width:max-content;
  width:max-content;
  display:flex;
  align-items:stretch;
  gap:12px;
  padding:0 2px 4px !important;
}
.kanban-col{
  width:210px;
  height:100%;
  min-height:0 !important;
  max-height:100%;
  flex:0 0 210px;
  padding:10px 8px 8px;
  overflow:hidden;
}
.kanban-col-header{
  flex:none;
  position:relative;
  z-index:1;
}
.kanban-col-scroll{
  flex:1;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  display:grid;
  gap:6px;
  align-content:start;
  padding:1px 2px 4px 0;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.kanban-col-scroll::-webkit-scrollbar{width:7px}
.kanban-col-scroll::-webkit-scrollbar-track{background:transparent;border-radius:999px}
.kanban-col-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--faint) 32%,transparent);border-radius:999px;border:2px solid transparent;background-clip:padding-box}
.kanban-col-scroll:hover::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--faint) 55%,transparent);border:2px solid transparent;background-clip:padding-box}
.kanban-empty{min-height:72px;display:grid;place-items:center}
@media (min-width:1600px){
  .kanban-col{width:220px;flex-basis:220px}
}
@media (max-width:1200px){
  .kanban-wrap{height:clamp(390px, calc(100vh - 300px), 620px)}
  .kanban-col{width:200px;flex-basis:200px}
}


/* Correção Kanban v2: scrollbar horizontal realmente visível e área de drop preservada */
.kanban-wrap{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  overflow-x:scroll !important;
  overflow-y:hidden !important;
  border:1px solid var(--border);
  background:color-mix(in srgb,var(--surface2) 52%,transparent);
  box-shadow:inset 0 -18px 0 color-mix(in srgb,var(--surface2) 72%,transparent);
  padding:8px 8px 22px !important;
  scrollbar-gutter:stable both-edges;
  scrollbar-width:auto;
  scrollbar-color: color-mix(in srgb,var(--accent) 58%,var(--border2)) var(--surface2);
}
.kanban-wrap::-webkit-scrollbar{height:16px !important}
.kanban-wrap::-webkit-scrollbar-track{background:var(--surface2);border-radius:999px;border:1px solid var(--border)}
.kanban-wrap::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 62%,var(--border2));border-radius:999px;border:4px solid var(--surface2)}
.kanban-wrap::-webkit-scrollbar-thumb:hover{background:var(--accent)}
.kanban-board{
  width:max-content !important;
  min-width:calc((220px * 8) + (12px * 7)) !important;
  height:100% !important;
}
.kanban-col{flex:0 0 220px !important;width:220px !important;min-width:220px !important}
.kanban-col-scroll{min-height:0 !important;position:relative}
.kanban-col.drag-over .kanban-col-scroll{background:rgba(26,115,232,.045);border-radius:10px}
