/* ============================================================
   IWO Design System — v1 (09/11/2026)
   Base visual do produto: tipografia, cores, espaçamento e componentes.
   Vale só em páginas com <body class="ds">, para migrar tela a tela sem
   quebrar as que ainda usam o estilo antigo (iwo-global.css).
   Fonte: Geist (SIL Open Font License — uso comercial livre), hospedada local.
   ============================================================ */
@font-face { font-family: "Geist"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("/assets/fonts/geist-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("/assets/fonts/geist-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

.ds {
  /* cor */
  --ds-bg: #F5F6F8;
  --ds-surface: #FFFFFF;
  --ds-surface-2: #F9FAFB;
  --ds-ink: #0E1726;
  /* 09/11/2026: contraste reforçado — a tela parecia "apagada" (cinzas claros + Geist fino no Windows) */
  --ds-text: #1E2735;
  --ds-muted: #4A5465;
  --ds-subtle: #687284;
  --ds-line: #DCE0E6;
  --ds-line-strong: #BFC6D0;
  --ds-brand: #E1A400;          /* amarelo da marca IWO — usado com parcimônia */
  --ds-brand-ink: #7A5800;
  --ds-ok: #12805C;    --ds-ok-bg: #E7F6EF;
  --ds-warn: #B25E09;  --ds-warn-bg: #FDF1E3;
  --ds-bad: #C0322B;   --ds-bad-bg: #FDECEA;
  --ds-info: #2457C5;  --ds-info-bg: #EAF0FD;
  --ds-focus: #2457C5;
  /* forma */
  --ds-r-sm: 6px; --ds-r: 9px; --ds-r-lg: 12px;
  --ds-shadow: 0 1px 2px rgba(14, 23, 38, .05), 0 1px 1px rgba(14, 23, 38, .03);
  --ds-shadow-lg: 0 8px 24px rgba(14, 23, 38, .08);
  /* tipo */
  --ds-font: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-family: var(--ds-font);
  color: var(--ds-text);
  background: var(--ds-bg);
  font-feature-settings: "tnum" 0;
  font-weight: 500;               /* 400/450 do Geist ficam finos em tela Windows (pedido do usuário, 09/11/2026) */
  -webkit-font-smoothing: antialiased;
}
.ds input, .ds select, .ds button, .ds textarea { font-family: inherit; font-weight: inherit; }
.ds .num, .ds .tnum { font-variant-numeric: tabular-nums; }

/* ---------- cabeçalho da página ---------- */
.ds-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 4px 0 20px; }
.ds-head h1 { margin: 0; font-size: 26px; line-height: 1.15; font-weight: 650; letter-spacing: -.02em; color: var(--ds-ink); }
.ds-head .ds-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ds-subtle); margin-bottom: 4px; }
.ds-head .ds-meta { font-size: 13px; color: var(--ds-muted); margin-top: 6px; font-variant-numeric: tabular-nums; }
.ds-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ---------- botões ---------- */
.ds-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 36px; padding: 0 14px;
  border-radius: var(--ds-r); border: 1px solid transparent; font-size: 13.5px; font-weight: 600; line-height: 1;
  cursor: pointer; white-space: nowrap; text-decoration: none; transition: background .15s, border-color .15s, color .15s; }
.ds-btn:focus-visible { outline: 2px solid var(--ds-focus); outline-offset: 2px; }
/* ação principal: azul-marinho (09/11/2026) — a mesma cor em todas as telas */
.ds-btn-primary { background: #1E3A8A; color: #fff; }
.ds-btn-primary:hover { background: #1E40AF; }
.ds-btn-secondary { background: var(--ds-surface); color: var(--ds-ink); border-color: var(--ds-line-strong); }
.ds-btn-secondary:hover { background: var(--ds-surface-2); }
.ds-btn-ghost { background: transparent; color: var(--ds-muted); }
.ds-btn-ghost:hover { background: #EEF0F3; color: var(--ds-ink); }
.ds-btn-danger { background: var(--ds-surface); color: var(--ds-bad); border-color: #F2C2BE; }
.ds-btn-danger:hover { background: var(--ds-bad-bg); }
.ds-btn-sm { height: 30px; padding: 0 11px; font-size: 12.5px; border-radius: var(--ds-r-sm); }
/* 14/11/2026 (celular): seletores dos filtros ocupam a linha toda em vez de cortar o texto ("Ordenar: mais atras…") */
@media (max-width: 760px) { select.ds-input, select.ds-select { flex: 1 1 100%; min-width: 0; max-width: 100%; } }
/* 14/11/2026: tela de toque (celular/tablet) — alvo mínimo de 44 px para o dedo; no computador nada muda */
@media (pointer: coarse) {
  .ds-btn, .ds-btn-sm { min-height: 44px; }
  .ds-btn-sm { padding: 0 14px; font-size: 13.5px; }
  .ds-icon-btn { min-width: 44px; min-height: 44px; }
  .ds-tab, .ds-chip { min-height: 40px; }
}
.ds-icon-btn { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: var(--ds-r-sm);
  color: var(--ds-subtle); background: transparent; border: 0; cursor: pointer; text-decoration: none; }
.ds-icon-btn:hover { background: #EEF0F3; color: var(--ds-ink); }
.ds-icon-btn:focus-visible { outline: 2px solid var(--ds-focus); outline-offset: 1px; }
.ds-link { all: unset; cursor: pointer; font-size: 12.5px; font-weight: 500; color: var(--ds-muted); }
.ds-link:hover { color: var(--ds-bad); text-decoration: underline; }
.ds-link:focus-visible { outline: 2px solid var(--ds-focus); outline-offset: 2px; border-radius: 3px; }

/* ---------- abas com contagem (filas) ---------- */
.ds-tabs { display: flex; flex-direction: row; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid var(--ds-line); margin-bottom: 16px; }
.ds-tab { all: unset; box-sizing: border-box; cursor: pointer; display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 12px 11px; font-size: 13.5px; font-weight: 550; color: var(--ds-muted); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.ds-tab:hover { color: var(--ds-ink); }
.ds-tab:focus-visible { outline: 2px solid var(--ds-focus); outline-offset: -2px; border-radius: 6px; }
.ds-tab[aria-selected="true"] { color: var(--ds-ink); border-bottom-color: var(--ds-ink); }
.ds-count { min-width: 22px; height: 20px; padding: 0 7px; border-radius: 999px; display: inline-grid; place-items: center;
  font-size: 12px; font-weight: 650; background: #EEF0F3; color: var(--ds-text); font-variant-numeric: tabular-nums; }
.ds-tab.urg .ds-count { background: var(--ds-bad-bg); color: var(--ds-bad); }
.ds-tab.ok .ds-count { background: var(--ds-ok-bg); color: var(--ds-ok); }
.ds-tab.info .ds-count { background: var(--ds-info-bg); color: var(--ds-info); }

/* ---------- painel ---------- */
.ds-panel { background: var(--ds-surface); border: 1px solid var(--ds-line); border-radius: var(--ds-r-lg); box-shadow: var(--ds-shadow); }
.ds-toolbar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding: 14px; border-bottom: 1px solid var(--ds-line); }
.ds-toolbar.sub { background: var(--ds-surface-2); align-items: flex-end; }
.ds-field { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600; color: var(--ds-muted); }
.ds-input, .ds-select { height: 36px; border: 1px solid var(--ds-line-strong); border-radius: var(--ds-r); background: var(--ds-surface);
  color: var(--ds-ink); font-size: 13.5px; padding: 0 11px; outline: none; transition: border-color .15s, box-shadow .15s; }
.ds-select { padding-right: 30px; appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235E6878' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; }
.ds-input:focus, .ds-select:focus { border-color: var(--ds-focus); box-shadow: 0 0 0 3px rgba(36, 87, 197, .15); }
.ds-search { position: relative; flex: 1 1 260px; min-width: 200px; }
.ds-search .ds-input { width: 100%; padding-left: 34px; }
.ds-search svg { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--ds-subtle); pointer-events: none; }
.ds-check { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--ds-text); cursor: pointer; white-space: nowrap; user-select: none; }
.ds-check input { width: 16px; height: 16px; margin: 0; accent-color: var(--ds-ink); cursor: pointer; }
.ds-statusbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 10px 14px; font-size: 12.5px; color: var(--ds-muted); }
.ds-chip { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 4px 0 10px; border-radius: 999px;
  background: var(--ds-ink); color: #fff; font-size: 12px; font-weight: 600; }
.ds-chip button { all: unset; cursor: pointer; width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.18); }
.ds-chip button:focus-visible { outline: 2px solid #fff; }

/* ---------- tabela ---------- */
.ds-table-wrap { overflow-x: auto; }
.ds-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13.5px; }
.ds-table thead th { position: sticky; top: 0; z-index: 2; background: var(--ds-surface-2); color: var(--ds-muted);
  font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; text-align: left;
  padding: 10px 12px; border-bottom: 1px solid var(--ds-line); white-space: nowrap; }
.ds-table thead th.num, .ds-table td.num { text-align: right; }
.ds-table thead th.center, .ds-table td.center { text-align: center; }
.ds-table th.sort { cursor: pointer; user-select: none; }
.ds-table th.sort:hover { color: var(--ds-ink); }
.ds-table tbody td { padding: 14px 12px; border-bottom: 1px solid var(--ds-line); vertical-align: top; color: var(--ds-text); }
.ds-table tbody tr:hover td { background: #FAFBFC; }
.ds-table tbody tr:last-child td { border-bottom: 0; }
.ds-table tbody tr.focada td { background: #FFF8E6; }
.ds-table tbody tr.focada td:first-child { box-shadow: inset 3px 0 0 var(--ds-brand); }
.ds-table .vazio { text-align: center; color: var(--ds-muted); padding: 48px 16px; }

/* ---------- selos ---------- */
.ds-pill { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px; border-radius: 999px;
  font-size: 12px; font-weight: 600; white-space: nowrap; }
.ds-pill.ok { background: var(--ds-ok-bg); color: var(--ds-ok); }
.ds-pill.warn { background: var(--ds-warn-bg); color: var(--ds-warn); }
.ds-pill.bad { background: var(--ds-bad-bg); color: var(--ds-bad); }
.ds-pill.info { background: var(--ds-info-bg); color: var(--ds-info); }
.ds-pill.muted { background: #EEF0F3; color: var(--ds-muted); }
.ds-score { display: inline-grid; place-items: center; min-width: 30px; height: 20px; padding: 0 6px; border-radius: 6px;
  font-size: 12px; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
.ds-score.alta { background: var(--ds-ok); }
.ds-score.media { background: #C98A0B; }
.ds-score.baixa { background: #9AA3B2; }
.ds-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; vertical-align: 1px; }

/* ---------- paginação ---------- */
.ds-pager { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 14px;
  border-top: 1px solid var(--ds-line); font-size: 13px; color: var(--ds-muted); }
.ds-kbd { display: inline-block; min-width: 18px; padding: 0 5px; border: 1px solid var(--ds-line-strong); border-bottom-width: 2px;
  border-radius: 4px; font-size: 12px; line-height: 17px; text-align: center; color: var(--ds-muted); background: var(--ds-surface); }
.ds-hint { font-size: 12px; color: var(--ds-subtle); display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }

[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) { .ds * { transition: none !important; } }


/* ===== Cor com significado (09/11/2026) =====
   A mesma cor de status em todas as telas (era a das páginas antigas,
   licitacoes-shared.css .bs-*). Fundo suave + texto forte; a cor nunca vem
   sozinha — sempre acompanha texto. */
.ds {
  --st-analise: #B45309;  --st-analise-bg: #FEF3C7;   /* em análise — amarelo  */
  --st-envio: #C2410C;    --st-envio-bg: #FFEDD5;     /* envio de doc. — laranja */
  --st-amanha: #6D28D9;   --st-amanha-bg: #EDE9FE;    /* pregão amanhã — roxo  */
  --st-hoje: #C0322B;     --st-hoje-bg: #FDECEA;      /* disputa hoje — vermelho */
  --st-aguard: #C2410C;   --st-aguard-bg: #FFEDD5;    /* aguardando resultado — laranja */
  --st-ganha: #15803D;    --st-ganha-bg: #DCFCE7;     /* ganha — verde */
  --st-perdida: #B91C1C;  --st-perdida-bg: #FEE2E2;   /* perdida — vermelho */
  --st-adiada: #4338CA;   --st-adiada-bg: #E0E7FF;    /* adiada — índigo */
  --st-neutro: #475569;   --st-neutro-bg: #E2E8F0;    /* não participamos / outros */
}
.ds-status { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; }
.ds-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ds-status.em_analise { color: var(--st-analise); background: var(--st-analise-bg); }
.ds-status.participando { color: var(--st-envio); background: var(--st-envio-bg); }
.ds-status.pregao_andamento { color: var(--st-amanha); background: var(--st-amanha-bg); }
.ds-status.ganha { color: var(--st-ganha); background: var(--st-ganha-bg); }
.ds-status.perdida { color: var(--st-perdida); background: var(--st-perdida-bg); }
.ds-status.adiada { color: var(--st-adiada); background: var(--st-adiada-bg); }
.ds-status.nao_participamos, .ds-status.outro { color: var(--st-neutro); background: var(--st-neutro-bg); }
.ds-portal { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 999px; font-size: 12px; font-weight: 700; color: #fff; white-space: nowrap; text-decoration: none; }
a.ds-portal:hover { filter: brightness(.92); }

/* 13/11/2026: etapas das licitações — mesma barra, mesmo lugar nas 4 telas (Triagem, Preparação, Em andamento, Resultados) */
.lic-etapas { display: flex; flex-wrap: wrap; gap: 3px; align-items: center; margin: 0 0 10px; font-size: 12px; font-weight: 600; line-height: 1.4; }
.lic-etapas a, .lic-etapas span { padding: 3px 9px; border-radius: 999px; border: 1px solid var(--ds-line); background: var(--ds-surface); color: var(--ds-muted); text-decoration: none; }
.lic-etapas a:hover { color: var(--ds-ink); border-color: var(--ds-line-strong); }
.lic-etapas .on { background: var(--ds-ink); color: #fff; border-color: var(--ds-ink); }
.lic-etapas i { font-style: normal; color: var(--ds-line-strong); }
.lic-etapas-tri { margin: 0; padding: 30px 40px 0; flex: none; }