/* ============================================================================
   Licitar MG — Distribuidora Alves
   Fundação visual da fatia 1. Tokens portados de DESIGN_SYSTEM/ (linguagem
   Claude/Anthropic: parchment quente, terracota, serifada nos títulos).
   Fonte da verdade visual: DESIGN_SYSTEM/_ds/.../tokens/*.css + UI Kit.
   ============================================================================ */

:root {
  /* Paleta Claude */
  --near-black: #141413;
  --terracotta: #c96442;
  --coral: #d97757;
  --error-crimson: #b53333;
  --focus-blue: #3898ec;
  --parchment: #f5f4ed;
  --ivory: #faf9f5;
  --white: #ffffff;
  --warm-sand: #e8e6dc;
  --olive-gray: #5e5d59;
  --stone-gray: #87867f;
  --warm-silver: #b0aea5;
  --border-cream: #f0eee6;
  --border-warm: #e8e6dc;
  --ring-warm: #d1cfc5;

  /* Semânticos */
  --bg-app: var(--parchment);
  --surface-well: #f1efe6;
  --surface-card: var(--ivory);
  --surface-raised: var(--white);
  --surface-selected: #efe8dd;
  --surface-hover: #efece2;

  --text-primary: var(--near-black);
  --text-secondary: var(--olive-gray);
  --text-tertiary: var(--stone-gray);
  --text-brand: #9e4a2b;

  --border-subtle: var(--border-cream);
  --border-default: var(--border-warm);
  --border-strong: var(--ring-warm);

  --brand: var(--terracotta);
  --brand-hover: #b3583a;
  --brand-active: #9e4a2b;
  --brand-soft: rgba(201, 100, 66, 0.10);
  --on-brand: var(--ivory);

  /* Tons dos selos de plataforma (Licitar Digital, Compras.gov.br, …). Seis tons quentes
     reaproveitados entre as plataformas — o nome vem ao lado, a cor só ajuda a escanear. */
  --tone-terracota: #9e4a2b;
  --tone-verde:     #1b6e3f;
  --tone-ocre:      #8f6410;
  --tone-crimson:   #a33a3a;
  --tone-sepia:     #7a4a1e;
  --tone-pedra:     #5e5d59;

  /* Semáforo (prazo/estado) — cor + ícone + texto sempre */
  --win: #1b6e3f;   --win-bg: rgba(31, 122, 69, 0.12);
  --warn: #8f6410;  --warn-bg: rgba(185, 130, 31, 0.14);
  --lose: #b53333;  --lose-bg: rgba(181, 51, 51, 0.10);
  --neutral: #87867f; --neutral-bg: rgba(135, 134, 127, 0.12);

  /* Tipografia */
  --font-serif: Georgia, 'Times New Roman', Times, serif;
  --font-sans: system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-mono: 'SFMono-Regular', Menlo, Consolas, 'Courier New', monospace;

  --sidebar-w: 244px;
  --topbar-h: 60px;
  --radius: 12px;
  --radius-sm: 8px;
  --shadow-ring: 0 0 0 1px var(--border-strong);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg-app);
  color: var(--text-primary);
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }

h1, h2, h3 { font-family: var(--font-serif); font-weight: 500; letter-spacing: -0.01em; margin: 0; }

/* ---------------------------------------------------------------- App frame */
.app { display: grid; grid-template-columns: var(--sidebar-w) 1fr; min-height: 100vh; }

/* -------------------------------------------------------------------- Sidebar */
.sidebar {
  background: var(--ivory);
  border-right: 1px solid var(--border-default);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
}
.brand { display: flex; align-items: center; gap: 10px; padding: 18px 18px 16px; }
.brand__mark {
  width: 34px; height: 34px; border-radius: 9px;
  background: var(--brand); color: var(--on-brand);
  display: grid; place-items: center; font-size: 18px; flex: none;
}
.brand__name { font-family: var(--font-serif); font-weight: 500; font-size: 17px; line-height: 1.1; }
.brand__sub { color: var(--text-tertiary); font-size: 11px; }

.nav { flex: 1; overflow-y: auto; padding: 6px 12px; }
.nav__section { color: var(--text-tertiary); font-size: 10px; font-weight: 600; letter-spacing: 0.09em; text-transform: uppercase; padding: 14px 10px 6px; }
.nav__item {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 10px; border-radius: var(--radius-sm);
  color: var(--text-secondary); font-size: 13px; margin-bottom: 1px;
  cursor: pointer;
}
.nav__item:hover { background: var(--surface-hover); color: var(--text-primary); }
.nav__item.is-active { background: var(--brand-soft); color: var(--text-brand); font-weight: 600; }
.nav__item.is-disabled { color: var(--warm-silver); cursor: not-allowed; }
.nav__item .ico { width: 18px; height: 18px; flex: none; }
.nav__badge {
  margin-left: auto; background: var(--lose); color: #fff;
  font-size: 10px; font-weight: 700; min-width: 18px; height: 18px;
  border-radius: 9px; display: grid; place-items: center; padding: 0 5px;
}
.nav__soon { margin-left: auto; font-size: 9px; color: var(--warm-silver); text-transform: uppercase; letter-spacing: 0.06em; }

.userbox { border-top: 1px solid var(--border-default); padding: 12px 14px; display: flex; align-items: center; gap: 10px; }
.userbox__avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--warm-sand); color: var(--text-secondary); display: grid; place-items: center; font-weight: 600; font-size: 12px; flex: none; }
.userbox__name { font-weight: 600; font-size: 12px; }
.userbox__role { color: var(--text-tertiary); font-size: 11px; }
.userbox__logout { margin-left: auto; color: var(--text-tertiary); font-size: 16px; }
.userbox__logout:hover { color: var(--brand); }

/* --------------------------------------------------------------------- Topbar */
.main { display: flex; flex-direction: column; min-width: 0; }
.topbar {
  height: var(--topbar-h); flex: none;
  display: flex; align-items: center; gap: 14px;
  padding: 0 28px; border-bottom: 1px solid var(--border-default);
  background: color-mix(in srgb, var(--parchment) 88%, #fff);
}
.topbar__right { margin-left: auto; display: flex; align-items: center; gap: 16px; color: var(--text-secondary); font-size: 12px; }
.sync-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--win); margin-right: 6px; }

.content { padding: 30px 34px; max-width: 1180px; }

/* --------------------------------------------------------------- Page header */
.page-title { font-size: 26px; margin-bottom: 6px; }
.page-lead { color: var(--text-secondary); max-width: 640px; margin-bottom: 22px; }

/* ------------------------------------------------------------------ Primitives */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 16px; border-radius: var(--radius-sm);
  font-size: 13px; font-weight: 600; border: 1px solid transparent; cursor: pointer;
  font-family: inherit;
}
.btn--primary { background: var(--brand); color: var(--on-brand); }
.btn--primary:hover { background: var(--brand-hover); }
.btn--ghost { background: var(--surface-raised); color: var(--text-primary); border-color: var(--border-default); box-shadow: var(--shadow-ring); }
.btn--ghost:hover { background: var(--surface-hover); }
/* F35b: "Exportar proposta" e "Conferir preço agora" ficam desligados enquanto a conferência roda. */
.btn:disabled { opacity: 0.55; cursor: not-allowed; }
.btn--primary:disabled:hover { background: var(--brand); }
.btn--ghost:disabled:hover { background: var(--surface-raised); }

.input {
  width: 100%; padding: 11px 14px; border-radius: var(--radius-sm);
  border: 1px solid var(--border-default); background: var(--surface-raised);
  font-size: 13px; font-family: inherit; color: var(--text-primary);
}
.input:focus { outline: 2px solid var(--focus-blue); outline-offset: 1px; }

.card { background: var(--surface-card); border: 1px solid var(--border-default); border-radius: var(--radius); padding: 18px; }

.tag {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 9px; border-radius: 6px; font-size: 11px; font-weight: 600;
  background: var(--surface-well); color: var(--text-secondary);
}
.badge-src { background: var(--brand-soft); color: var(--text-brand); }
.tag--monit { background: var(--win-bg); color: var(--win); }

/* Modalidade em destaque: é a primeira coisa que define se vale abrir o edital. */
.tag--modalidade {
  background: var(--surface-raised); color: var(--text-primary);
  border: 1px solid var(--border-default);
  font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 4px 9px;
}

/* Nicho da empresa (só o Radar tem). Terracota = "isso é nosso". */
.tag--nicho {
  background: var(--brand-soft); color: var(--text-brand);
  border: 1px solid rgba(201, 100, 66, 0.24);
  font-size: 12px; font-weight: 700; padding: 4px 10px;
}

/* ------------------------------------------------ Selo da plataforma do pregão */
.plat { display: inline-flex; align-items: center; gap: 7px; }
.plat__mark {
  width: 22px; height: 22px; border-radius: 6px; flex: none;
  display: grid; place-items: center;
  background: var(--tone-pedra); color: var(--ivory);
  font-size: 9px; font-weight: 700; letter-spacing: 0.02em;
}
/* Fornecedor sem mapa vira o nome do domínio, que às vezes é longo — trunca em vez de quebrar o card. */
.plat__nome { font-size: 12px; font-weight: 600; color: var(--text-secondary); max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plat--terracota .plat__mark { background: var(--tone-terracota); }
.plat--verde     .plat__mark { background: var(--tone-verde); }
.plat--ocre      .plat__mark { background: var(--tone-ocre); }
.plat--crimson   .plat__mark { background: var(--tone-crimson); }
.plat--sepia     .plat__mark { background: var(--tone-sepia); }
.plat--pedra     .plat__mark { background: var(--tone-pedra); }

/* Semáforo de prazo — contagem por extenso + data. Cor + ícone + texto, nunca só cor. */
.prazo { display: inline-flex; align-items: center; gap: 7px; padding: 5px 10px; border-radius: var(--radius-sm); }
.prazo__ico { font-size: 12px; line-height: 1; flex: none; }
.prazo__txt { display: flex; flex-direction: column; line-height: 1.25; }
.prazo__label { font-size: 12px; font-weight: 700; white-space: nowrap; }
.prazo__data { font-size: 10px; font-weight: 600; font-family: var(--font-mono); opacity: 0.75; }
.prazo--ok { background: var(--win-bg); color: var(--win); }
.prazo--warn { background: var(--warn-bg); color: var(--warn); }
.prazo--danger { background: var(--lose-bg); color: var(--lose); }
.prazo--closed { background: var(--neutral-bg); color: var(--neutral); }

/* Empty / placeholder */
.placeholder { border: 1px dashed var(--border-strong); border-radius: var(--radius); padding: 40px; text-align: center; color: var(--text-tertiary); background: var(--surface-well); }

/* ------------------------------------------------------------------ Login (dev) */
.login-wrap { min-height: 100vh; display: grid; place-items: center; background: var(--bg-app); padding: 24px; }
.login-card { width: 100%; max-width: 380px; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: 16px; padding: 30px; box-shadow: 0 1px 2px rgba(20,20,19,0.04); }
.login-card h1 { font-size: 24px; margin-bottom: 4px; }
.login-card p { color: var(--text-secondary); margin: 0 0 20px; }
.login-devnote { margin-top: 18px; font-size: 11px; color: var(--text-tertiary); border-top: 1px solid var(--border-subtle); padding-top: 14px; }
.login-roles { display: flex; flex-direction: column; gap: 8px; }
.login-role { display: flex; align-items: center; justify-content: space-between; width: 100%; text-align: left; }

/* ------------------------------------------------------------- Pesquisar / Radar */
.tabs { display: flex; gap: 20px; border-bottom: 1px solid var(--border-default); margin-bottom: 18px; }
/* min-height/inline-flex (2026-09-08): a classe existia mas nunca tinha sido usada num
   controle real — a Sala de Monitoramento é o primeiro. Com padding 8px e fonte 14px o alvo
   ficava em ~36px, abaixo dos 44px que a regra de acessibilidade do projeto exige. min-height
   garante o alvo sem depender da métrica da fonte; o padding fica para o respiro lateral. */
.tab { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 2px; font-size: 14px; color: var(--text-tertiary); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tab.is-active { color: var(--text-primary); border-bottom-color: var(--brand); font-weight: 600; }
.tab.is-disabled { color: var(--warm-silver); }

.search-big { display: flex; align-items: center; gap: 10px; background: var(--surface-raised); border: 1px solid var(--border-default); border-radius: var(--radius); padding: 8px 8px 8px 16px; box-shadow: var(--shadow-ring); }
.search-big__ico { font-size: 20px; color: var(--text-tertiary); }
.search-big__input { flex: 1; border: 0; outline: 0; background: transparent; font-size: 15px; font-family: inherit; color: var(--text-primary); padding: 8px 0; }

.meta-row { display: flex; align-items: center; gap: 18px; margin: 14px 2px; color: var(--text-secondary); font-size: 13px; }
.meta-row__sort { margin-left: auto; color: var(--text-tertiary); }
.switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.switch input { accent-color: var(--win); width: 16px; height: 16px; }

.hint { background: var(--warn-bg); color: var(--warn); border-radius: var(--radius-sm); padding: 9px 14px; font-size: 12px; margin-bottom: 18px; }

.search-grid { display: grid; grid-template-columns: 1fr 300px; gap: 22px; align-items: start; }
@media (max-width: 900px) { .search-grid { grid-template-columns: 1fr; } }

.results { display: flex; flex-direction: column; gap: 14px; }
.result-card { background: var(--surface-card); border: 1px solid var(--border-default); border-radius: var(--radius); padding: 18px; }
.result-card:hover { border-color: var(--border-strong); }
.result-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.result-card__top-left { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.result-card__title { font-size: 17px; line-height: 1.3; margin-bottom: 8px; }
.result-card__org { color: var(--text-secondary); font-size: 13px; margin-bottom: 12px; }
.result-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--text-tertiary); border-top: 1px solid var(--border-subtle); padding-top: 12px; }
.result-card__foot strong { color: var(--text-primary); font-family: var(--font-mono); font-size: 14px; }

/* Município em destaque: filtro mental nº1 de "dá pra entregar?". */
.result-card__local { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: var(--text-primary); }
.result-card__local .ico-pin { color: var(--brand); flex: none; }
.result-card__local.is-vazio { font-weight: 500; color: var(--text-tertiary); }

.filters { position: sticky; top: 20px; }
.filters__title { font-size: 16px; margin-bottom: 14px; }
.field-label { display: block; font-size: 12px; font-weight: 600; color: var(--text-secondary); margin: 12px 0 5px; }
/* Estado (várias caixas de marcar) e o interruptor do sigiloso: o fieldset sem a moldura padrão do navegador. */
.filter-group { border: 0; padding: 0; margin: 0; min-width: 0; }
.filter-group legend { padding: 0; }
.filter-group .switch { display: flex; padding: 4px 0; }
.filter-group__sigiloso { display: flex; margin-top: 10px; }
.filters__apply { width: 100%; justify-content: center; margin-top: 18px; }

.pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; }
.pagination__info { color: var(--text-tertiary); font-size: 13px; }

/* Radar */
.radar-count { color: var(--text-secondary); font-size: 14px; margin-bottom: 18px; }
.radar-count strong { color: var(--text-primary); }
/* Medidor de score — 5 barras crescentes + número + rótulo. A cor repete a banda. */
.score {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 11px; border-radius: 999px;
  background: var(--surface-raised); border: 1px solid var(--border-default);
}
.score__bars { display: inline-flex; align-items: flex-end; gap: 2px; height: 13px; }
.score__bar { width: 3px; border-radius: 1px; background: var(--border-default); }
.score__bar:nth-child(1) { height: 5px; }
.score__bar:nth-child(2) { height: 7px; }
.score__bar:nth-child(3) { height: 9px; }
.score__bar:nth-child(4) { height: 11px; }
.score__bar:nth-child(5) { height: 13px; }
.score__val { font-family: var(--font-mono); font-size: 13px; font-weight: 700; line-height: 1; }
.score__lbl { font-size: 11px; font-weight: 600; line-height: 1; }
.score--bom   .score__bar.is-on { background: var(--win); }
.score--bom   .score__val, .score--bom   .score__lbl { color: var(--win); }
.score--medio .score__bar.is-on { background: var(--warn); }
.score--medio .score__val, .score--medio .score__lbl { color: var(--warn); }
.score--baixo .score__bar.is-on { background: var(--neutral); }
.score--baixo .score__val, .score--baixo .score__lbl { color: var(--neutral); }

.result-card__top-right { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.radar-card__cats { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 12px; }
.radar-card__cats-label { font-size: 10px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; color: var(--text-tertiary); }
.nicho-panel__lead { color: var(--text-secondary); font-size: 12px; margin-bottom: 14px; }
.nicho-panel__edit { width: 100%; justify-content: center; margin-top: 16px; }
.nicho-list { display: flex; flex-direction: column; gap: 8px; }
.nicho-item { display: flex; align-items: center; justify-content: space-between; padding: 11px 14px; border: 1px solid var(--border-default); border-radius: var(--radius-sm); background: var(--surface-raised); font-size: 13px; }
.nicho-item strong { font-family: var(--font-mono); }

/* Flash */
.flash { padding: 11px 15px; border-radius: var(--radius-sm); margin-bottom: 18px; font-size: 13px; background: var(--win-bg); color: var(--win); }
.flash--error { background: var(--lose-bg); color: var(--lose); }

/* Nicho — config (CRUD) */
.config-grid { display: grid; grid-template-columns: 1fr 320px; gap: 22px; align-items: start; }
.config-side { position: sticky; top: 20px; }
.config-list { display: flex; flex-direction: column; gap: 10px; }
.config-row { display: flex; align-items: center; gap: 14px; padding: 13px 15px; border: 1px solid var(--border-default); border-radius: var(--radius-sm); background: var(--surface-raised); }
.config-row.is-off { opacity: 0.6; }
.config-row__main { flex: 1; min-width: 0; }
.config-row__nome { font-weight: 600; margin-bottom: 7px; display: flex; align-items: center; gap: 8px; }
.config-row__termos { display: flex; flex-wrap: wrap; gap: 5px; }
.config-row__empty { color: var(--text-tertiary); font-size: 12px; font-style: italic; }
.config-row__actions { display: flex; gap: 8px; align-items: center; flex: none; }
.config-edit-card { max-width: 520px; }
.btn--sm { padding: 7px 12px; font-size: 12px; }
.btn--danger { color: var(--lose); }
.form-actions { display: flex; gap: 10px; margin-top: 20px; }
.field-hint { color: var(--text-tertiary); font-size: 12px; margin: 6px 0 0; }
.back-link { color: var(--text-brand); font-size: 14px; }

/* Título do card vira link para o detalhe (Pesquisar/Radar) */
.result-card__title a { color: var(--text-primary); text-decoration: none; }
.result-card__title a:hover { color: var(--text-brand); text-decoration: underline; }

/* Detalhe do edital (/licitacoes/:id) */
.detalhe { max-width: 960px; margin-top: 14px; }
.detalhe__head { border-bottom: 1px solid var(--border-default); padding-bottom: 18px; margin-bottom: 18px; }
.detalhe__badges { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.detalhe__title { font-size: 24px; line-height: 1.3; margin-bottom: 14px; }
.detalhe__valor { display: flex; align-items: baseline; gap: 10px; }
.detalhe__valor-label { color: var(--text-tertiary); font-size: 13px; }
.detalhe__valor strong { font-family: var(--font-mono); font-size: 20px; color: var(--text-primary); }
.detalhe__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 18px; }
.detalhe__section-title { font-size: 15px; margin-bottom: 12px; }
.detalhe__dl { display: flex; flex-direction: column; gap: 10px; }
.detalhe__dl dt { color: var(--text-tertiary); font-size: 12px; }
.detalhe__dl dd { color: var(--text-primary); font-size: 14px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.detalhe__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 22px; }
.detalhe__acoes form { margin: 0; }
.detalhe__itens { margin-top: 8px; }

/* Tabela de itens (Turbo Frame) */
/* Documentos da licitação (download direto do PNCP) */
.detalhe__docs { margin-top: 8px; margin-bottom: 26px; }
.docs { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.docs__item {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 12px 14px; border: 1px solid var(--border-default);
  border-radius: var(--radius-sm); background: var(--surface-raised);
}
.docs__item:hover { border-color: var(--border-strong); }
.docs__main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.docs__titulo { font-size: 14px; font-weight: 600; color: var(--text-primary); }
.docs__meta { font-size: 12px; color: var(--text-tertiary); }
.docs__indisponivel { font-size: 12px; color: var(--text-tertiary); font-style: italic; }

/* Sala de monitoramento (/monitoramento) */
.monit-meta {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border-subtle);
  font-size: 12px; color: var(--text-tertiary);
}
.monit-meta strong { color: var(--text-secondary); font-weight: 600; }
.monit-meta form { margin: 0; }

.itens-scroll { overflow-x: auto; }
.itens-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.itens-table th, .itens-table td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--border-subtle); vertical-align: top; }
.itens-table thead th { color: var(--text-tertiary); font-weight: 600; font-size: 12px; border-bottom-color: var(--border-default); }
.itens-table td { color: var(--text-primary); }
.itens-table .num { text-align: right; font-family: var(--font-mono); white-space: nowrap; }
.itens-table__compl { display: block; color: var(--text-tertiary); font-size: 12px; margin-top: 3px; }

/* 2026-10-28 (Luiz/dev): cotador F30 — painel do certame (Claude Design "Licitar MG Cotacoes"): cabeçalho,
   três totais, filtros com contagem e a tabela dos itens, que rola dentro do cartão como a da prévia. */
.painel-cab { margin-bottom: 14px; }
.painel-cab__meta { display: flex; align-items: center; gap: 6px 14px; flex-wrap: wrap; color: var(--text-secondary); font-size: 14px; }
.painel-totais { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin: 16px 0 18px; }
.painel-total {
  display: flex; flex-direction: column; gap: 4px; padding: 14px 16px;
  background: var(--surface-card); border: 1px solid var(--border-default); border-radius: var(--radius);
}
.painel-total__rotulo { font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.painel-total__valor { font-size: 20px; font-weight: 600; color: var(--text-primary); }
.painel-total__nota { font-size: 12px; color: var(--text-secondary); }
.painel-total__valor.is-pos, .painel-tabela .is-pos { color: var(--win); }
.painel-total__valor.is-neg, .painel-tabela .is-neg { color: var(--lose); }
.tab__conta {
  margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 12px; font-weight: 600;
  background: var(--surface-hover); color: var(--text-secondary);
}
/* F53: "Para confirmar" com pendência, como no Claude Design. */
.tab__conta--pendente { background: #30302e; color: var(--ivory); }
.painel-filtros { flex-wrap: wrap; column-gap: 20px; row-gap: 0; }
.painel-filtros .tab { white-space: nowrap; }
.painel-rolagem { contain: inline-size; }
.painel-tabela th { white-space: nowrap; }
.painel-tabela__desc {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
  min-width: 260px; max-width: 420px; color: var(--text-primary); text-decoration: none;
}
.painel-tabela__desc:hover { text-decoration: underline; }
.painel-tabela__desc:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: 2px; border-radius: 2px; }
.painel-tabela__situacao { color: var(--text-secondary); }
.painel-tabela tr.is-fora td { color: var(--text-secondary); }
.painel-tabela tr.is-fora .painel-tabela__desc { color: var(--text-secondary); }

/* 2026-10-28 (Luiz/dev): cotador F31 — lista de cotações (Claude Design "Licitar MG Cotacoes"): "Nova cotação" ao
   lado do título, os filtros do painel por status e a tabela rolando dentro do cartão. Revisar ganha a barra ocre. */
.cotacoes-cab { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; margin-bottom: 18px; }
.cotacoes-cab .page-lead { margin-bottom: 0; }
.cotacoes-cab .btn, .cotacoes-vazio .btn { min-height: 44px; }
.cotacoes-table th { white-space: nowrap; }
.cotacoes-table__certame { min-width: 220px; max-width: 360px; }
.cotacoes-table__titulo { font-weight: 600; color: var(--text-primary); text-decoration: none; }
.cotacoes-table__titulo:hover { text-decoration: underline; }
.cotacoes-table__titulo:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: 2px; border-radius: 2px; }
.cotacoes-table tr.is-revisar td:first-child { box-shadow: inset 2px 0 0 var(--warn); }
.cotacoes-table__prazo { display: block; margin-top: 4px; }
.cotacoes-table__itens { white-space: nowrap; color: var(--text-secondary); }
.cotacoes-table .num .itens-table__compl { font-family: var(--font-sans); }
.cotacoes-table__progresso {
  display: block; width: 100%; max-width: 160px; height: 6px; margin-top: 7px;
  appearance: none; border: 0; border-radius: 999px; background: var(--border-default); overflow: hidden;
}
.cotacoes-table__progresso::-webkit-progress-bar { background: var(--border-default); }
.cotacoes-table__progresso::-webkit-progress-value { background: var(--olive-gray); }
.cotacoes-table__progresso::-moz-progress-bar { background: var(--olive-gray); }
.cotacoes-table__abrir { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--text-tertiary); }
.cotacoes-table__abrir:hover { color: var(--text-primary); }

/* 2026-10-28 (Luiz/dev): cotador F35 — exportar no painel: os dois botões ao lado do título e o bloco da exportação
   (o que a conferência mudou, o que não deu para conferir, os avisos da proposta e os arquivos). */
.painel-cab__acoes { margin-top: 0; flex-wrap: wrap; }
.exportacao { display: flex; flex-direction: column; gap: 12px; margin-bottom: 18px; }
.exportacao .filters__title { margin-bottom: 0; }
.exportacao .form-actions { margin-top: 4px; flex-wrap: wrap; }
.exportacao .btn { min-height: 44px; }
.exportacao__lista { margin: 0; padding-left: 20px; font-size: 13.5px; line-height: 1.6; color: #4d4c48; }
.aviso .exportacao__lista { color: inherit; }

/* 2026-10-29 (Luiz/dev): cotador F36c — configurações da cotação do Claude Design: um campo por linha, rótulo e
   explicação à esquerda, o número à direita com a unidade. Em tela estreita o número desce para baixo do texto. */
.config-campos { max-width: 820px; padding: 0; }
.config-campo {
  display: grid; grid-template-columns: minmax(0, 1fr) 180px; gap: 16px; align-items: center;
  padding: 14px 18px; border-bottom: 1px solid var(--border-subtle);
}
.config-campo .field-label { margin: 0; font-size: 14px; color: var(--text-primary); }
.config-campo .field-hint { margin-top: 3px; font-size: 12.5px; line-height: 1.45; color: var(--text-secondary); }
.config-campo__valor { display: flex; align-items: center; gap: 8px; }
.config-campo__valor .input { min-height: 44px; text-align: right; font-size: 14px; }
.config-campo__unidade { min-width: 36px; font-size: 13px; color: #4d4c48; }
.config-campos .form-actions { margin-top: 0; padding: 14px 18px; flex-wrap: wrap; }
.config-campos .btn { min-height: 44px; }
@media (max-width: 640px) { .config-campo { grid-template-columns: 1fr; gap: 8px; } }

/* 2026-10-28 (Luiz/dev): cotador F27b — prévia da importação. Cada coluna mostra o seletor inteiro
   ("Valor de referência" e "Ignorar coluna" legíveis) e a tabela rola dentro do cartão em vez de
   espremer: com 12 colunas os seletores ficavam com 35–60 px. Texto longo da descrição em até 3 linhas. */
.previa-colunas { width: max-content; min-width: 100%; }
/* Sem isto a tabela larga entra na largura mínima da coluna do grid do layout e a página inteira rola. */
.previa-colunas__rolagem { contain: inline-size; }
.previa-colunas th { min-width: 168px; vertical-align: bottom; }
.previa-colunas th .field-label { margin-top: 0; white-space: nowrap; }
.previa-colunas th .input { min-height: 44px; }
.previa-colunas td { max-width: 360px; }
.previa-colunas__texto { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }

/* 2026-10-23 (Luiz/dev): cotador F17 — selos (cor + ícone + texto) e a tela /lojas, na tela
   "Licitar MG Cotacoes" do Claude Design. Texto de atenção e neutro um tom mais escuro que o do
   semáforo de prazo, como no protótipo, para passar no contraste do WCAG em 12px. */
.selo {
  display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 99px;
  font-size: 12px; font-weight: 600; line-height: 1.4; white-space: nowrap;
}
.selo__ico { flex: none; }
.selo--win { background: var(--win-bg); color: var(--win); }
.selo--warn { background: var(--warn-bg); color: #7a5510; }
.selo--lose { background: var(--lose-bg); color: var(--lose); }
.selo--neu { background: var(--neutral-bg); color: var(--olive-gray); }

.mono { font-family: var(--font-mono); white-space: nowrap; }
.card--tabela { padding: 0; overflow-x: auto; }

.aviso-critico {
  display: flex; gap: 10px; align-items: center; padding: 12px 14px; margin-bottom: 14px;
  border-radius: 10px; background: rgba(181, 51, 51, 0.08); box-shadow: inset 0 0 0 1px rgba(181, 51, 51, 0.35);
  color: #5c1d1d; font-size: 13.5px;
}
.aviso-critico b { color: var(--lose); font-weight: 600; }

.lojas-table { width: 100%; min-width: 860px; border-collapse: collapse; font-size: 13px; }
.lojas-table thead tr { background: var(--surface-well); }
.lojas-table th {
  text-align: left; padding: 10px 12px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--text-secondary);
}
.lojas-table td { padding: 10px 12px; border-top: 1px solid var(--border-subtle); vertical-align: middle; }
.lojas-table th:first-child, .lojas-table td:first-child { padding-left: 14px; }
.lojas-table .num { text-align: right; font-family: var(--font-mono); }
.lojas-table__linha.is-off { background: var(--surface-well); color: var(--text-secondary); }
.lojas-table__linha.is-critica td:first-child { box-shadow: inset 2px 0 0 var(--lose); }
.lojas-table__alerta { font-size: 12.5px; max-width: 240px; color: #4d4c48; }
.lojas-table__linha.is-critica .lojas-table__alerta { color: var(--lose); font-weight: 600; }

.loja-saude__nome { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.loja-saude__ponto { width: 9px; height: 9px; border-radius: 99px; flex: none; }
.loja-saude__nota { font-size: 12px; margin-top: 2px; font-weight: 500; }
.loja-saude--ok .loja-saude__ponto { background: #1f7a45; }
.loja-saude--ok .loja-saude__nota { color: var(--win); }
.loja-saude--instavel .loja-saude__ponto { background: #b9821f; }
.loja-saude--instavel .loja-saude__nota { color: #7a5510; }
.loja-saude--fora .loja-saude__ponto { background: var(--lose); }
.loja-saude--fora .loja-saude__nota { color: var(--lose); }
.loja-saude--desligada .loja-saude__ponto { background: var(--warm-silver); }
.loja-saude--desligada .loja-saude__nota { color: var(--text-secondary); }

/* Chave liga/desliga: botão de formulário (sem JS), alvo de 44px. */
.chave__form { margin: 0; }
.chave {
  min-height: 44px; display: inline-flex; align-items: center; gap: 8px; padding: 0;
  background: none; border: 0; cursor: pointer; font: inherit; font-size: 12.5px; color: #4d4c48;
}
.chave:disabled { cursor: not-allowed; opacity: 0.6; }
.chave:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: 2px; border-radius: var(--radius-sm); }
.chave__trilho {
  position: relative; width: 36px; height: 20px; border-radius: 99px; flex: none;
  background: var(--warm-sand); box-shadow: inset 0 0 0 1px var(--border-strong);
}
.chave__bola {
  position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 99px;
  background: var(--stone-gray); transition: left 0.15s ease;
}
.chave--on .chave__trilho { background: var(--brand); box-shadow: none; }
.chave--on .chave__bola { left: 19px; background: var(--on-brand); }

/* 2026-10-23 (Luiz/dev): cotador F18 — tela do item (Claude Design "Licitar MG Cotacoes", tela Item). */
.item-cab { margin-bottom: 16px; }
.item-cab__meta { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; font-size: 13px; color: var(--text-secondary); }
.item-cab__categoria {
  display: inline-flex; align-items: center; height: 22px; padding: 0 7px; border-radius: 5px;
  font-size: 11.5px; font-weight: 500; color: #4d4c48; background: var(--surface-raised); border: 1px solid #c2c0b6;
}
.item-cab__titulo { font-size: 24px; }

.item-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 20px; align-items: start; }
.item-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }

/* F23: o lance ganha coluna própria à direita quando a área de conteúdo comporta três colunas (a
   conta é pela largura do conteúdo, então vale com ou sem o menu lateral). Sem espaço, ele desce
   para baixo do resultado e não cobre oferta nenhuma. */
.content:has(.item-tela) { max-width: 1560px; }
.item-tela { container-type: inline-size; }
.item-grid--com-lance { grid-template-columns: minmax(0, 1fr); grid-template-areas: "edital" "resultado" "lance"; }
.item-grid--com-lance > .item-col--edital { grid-area: edital; }
.item-grid--com-lance > .item-col--resultado { grid-area: resultado; }
.item-grid--com-lance > .lance-painel { grid-area: lance; }
@container (min-width: 900px) {
  .item-grid--com-lance {
    grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto 1fr;
    grid-template-areas: "edital resultado" "edital lance";
  }
}
@container (min-width: 1240px) {
  .item-grid--com-lance { grid-template-columns: repeat(2, minmax(0, 1fr)) 300px; grid-template-rows: auto; grid-template-areas: "edital resultado lance"; }
  .item-grid--com-lance > .lance-painel { position: sticky; top: 20px; max-height: calc(100vh - 40px); overflow-y: auto; }
  .item-grid--com-lance > .lance-painel .lance-painel__nums { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .item-grid--com-lance > .lance-painel .is-destaque { grid-column: 1 / -1; }
}

.item-card { background: var(--surface-card); border-radius: var(--radius); box-shadow: 0 0 0 1px var(--border-default); }
.item-card__cab {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 14px 16px; border-bottom: 1px solid var(--border-subtle);
}
.item-card__cab h2, .item-card__titulo h2 { font-size: 17px; }
.item-card__titulo { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.item-card__corpo { padding: 14px 16px; display: flex; flex-direction: column; gap: 12px; }
.item-card__texto { margin: 0; font-size: 13.5px; line-height: 1.5; color: #4d4c48; }

.edital-cab__nums { display: flex; gap: 16px; font-size: 13px; color: #4d4c48; }
.edital-cab__rot { font-family: var(--font-sans); color: var(--text-secondary); }
.edital-texto { margin: 0; font-size: 13.5px; line-height: 2; letter-spacing: 0.01em; overflow-wrap: anywhere; }
.trecho { border-radius: 4px; }
.trecho--lido { text-decoration: underline; text-decoration-color: var(--warm-silver); text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.trecho--nao-lido { background: rgba(185, 130, 31, 0.22); color: #4d3a0c; padding: 2px 4px; }
.trecho--contraditorio { box-shadow: inset 0 0 0 1.5px var(--lose); padding: 2px 4px; }
.edital-legenda { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--text-secondary); line-height: 1.6; }
.edital-legenda .trecho { color: var(--text-primary); padding: 0 4px; }
.edital-legenda .trecho--nao-lido { color: #4d3a0c; }
.edital-aviso {
  display: flex; gap: 10px; padding: 10px 12px; border-radius: var(--radius-sm);
  background: rgba(185, 130, 31, 0.10); font-size: 13px; color: #4d3a0c; line-height: 1.5;
}
.edital-aviso .selo__ico, .aviso .selo__ico { color: var(--warn); margin-top: 2px; }

.ficha-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ficha-table thead tr { background: var(--surface-well); }
.ficha-table th {
  text-align: left; padding: 8px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--text-secondary);
}
.ficha-table td { padding: 8px; border-top: 1px solid var(--border-subtle); vertical-align: middle; }
.ficha-table th:first-child, .ficha-table td:first-child { padding-left: 16px; }
.ficha-table__atributo { color: #4d4c48; }
.ficha-table__pedido { font-weight: 600; }
.ficha-table__trecho { font-size: 11.5px; color: var(--text-secondary); margin-top: 1px; }
.ficha-table__nota { font-size: 11.5px; font-weight: 600; color: #7a5510; margin-top: 2px; }
.ficha-table__nota--lose { color: var(--lose); }
.ficha-table__nota--info { font-weight: 500; color: var(--text-secondary); }
.ficha-table__vazia { color: var(--text-secondary); padding: 14px 16px; }
.origem-chip {
  display: inline-flex; align-items: center; height: 20px; padding: 0 6px; border-radius: 4px;
  font-size: 11px; font-weight: 500; color: #4d4c48; background: var(--surface-well); border: 1px solid var(--border-default);
}

.aviso {
  display: flex; gap: 10px; padding: 12px 14px; border-radius: 10px; font-size: 13.5px; line-height: 1.5;
  background: rgba(185, 130, 31, 0.12); box-shadow: inset 0 0 0 1px rgba(185, 130, 31, 0.35); color: #4d3a0c;
}
.aviso b { font-weight: 600; color: #7a5510; }
.aviso--compacto { padding: 8px 10px; font-size: 13px; box-shadow: none; }
/* F35b: o "conferido agora" da tela do item; o aviso amarelo fica para o que pede atenção. */
.aviso--win { background: var(--win-bg); color: var(--win); }
.aviso--win b { color: inherit; }

.resultado-cab { display: flex; flex-direction: column; gap: 2px; }
.resultado-cab__titulo { font-size: 19px; }
.resultado-cab__resumo { font-size: 12.5px; color: var(--text-secondary); }

.resultado-grupo__cab { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; min-height: 44px; }
summary.resultado-grupo__cab { cursor: pointer; list-style: none; }
summary.resultado-grupo__cab::-webkit-details-marker { display: none; }
summary.resultado-grupo__cab:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: -2px; border-radius: var(--radius); }
.resultado-grupo__conta { font-size: 12.5px; color: var(--text-secondary); }
.resultado-grupo__mostrar, .resultado-grupo__esconder { margin-left: auto; font-size: 13px; color: var(--text-brand); }
.resultado-grupo__esconder, details[open] .resultado-grupo__mostrar { display: none; }
details[open] .resultado-grupo__esconder { display: inline; }
.resultado-grupo__vazio { margin: 0; padding: 12px 14px; border-top: 1px solid var(--border-subtle); font-size: 13.5px; color: #4d4c48; }
.resultado-grupo__falta {
  margin: 0; padding: 10px 14px; border-top: 1px solid var(--border-subtle); font-size: 13px; line-height: 1.5;
  background: var(--warn-bg); color: #4d3a0c;
}
.resultado-grupo__falta b { font-weight: 600; color: #7a5510; }
.resultado-grupo__falta a { color: #7a5510; text-decoration: underline; }

.ofertas { list-style: none; margin: 0; padding: 0; }

.paginacao {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap;
  padding: 6px 10px 6px 14px; border-top: 1px solid var(--border-subtle);
}
.paginacao__conta { font-size: 12.5px; color: var(--text-secondary); }
.paginacao__paginas { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
.paginacao__numero, .paginacao__seta, .paginacao__pulo {
  min-width: 44px; min-height: 44px; padding: 0 8px; border-radius: var(--radius-sm);
  display: inline-flex; align-items: center; justify-content: center; font-size: 13px;
}
.paginacao a { color: var(--text-brand); font-weight: 500; }
.paginacao a:hover { background: var(--surface-hover); }
.paginacao a:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: 1px; }
.paginacao__numero[aria-current="page"] { background: #30302e; color: var(--ivory); font-weight: 600; }
.paginacao__pulo { min-width: 24px; padding: 0; color: var(--text-secondary); }
.oferta-linha {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center;
  padding: 10px 14px; border-top: 1px solid var(--border-subtle);
}
.oferta-linha.is-escolhida { background: var(--surface-selected); box-shadow: inset 3px 0 0 var(--near-black); }
.oferta-linha__info { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.oferta-linha__topo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.oferta-linha__modelo { font-size: 13.5px; font-weight: 600; }
.oferta-linha__loja { font-size: 12.5px; font-weight: 500; white-space: nowrap; }
.oferta-linha__vendedor { font-size: 11.5px; font-weight: 400; color: var(--text-secondary); }
.oferta-linha__titulo { font-size: 12px; color: var(--text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oferta-linha__motivo { font-size: 13px; font-weight: 600; }
.oferta-linha__motivo--atende { color: var(--win); }
.oferta-linha__motivo--com_ressalva { color: #7a5510; }
.oferta-linha__motivo--pendente { color: var(--olive-gray); }
.oferta-linha__motivo--nao_atende { color: var(--lose); }
.oferta-linha__sinais { display: flex; gap: 6px; flex-wrap: wrap; }
.oferta-linha__precos { text-align: right; white-space: nowrap; font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.oferta-linha__vista { font-size: 15px; font-weight: 600; }
.oferta-linha__cheio { font-size: 12px; color: var(--text-secondary); }
.oferta-linha__acoes { display: flex; align-items: center; gap: 4px; }
.oferta-linha__ver {
  width: 44px; height: 44px; border-radius: var(--radius-sm); display: inline-flex; align-items: center;
  justify-content: center; color: var(--text-secondary);
}
.oferta-linha__ver:hover { background: var(--surface-hover); color: var(--text-brand); }
.oferta-linha__ver:focus-visible { outline: 2px solid var(--focus-blue); outline-offset: 1px; }
.oferta-linha__escolhida {
  min-height: 44px; min-width: 96px; padding: 0 12px; border-radius: var(--radius-sm); display: inline-flex;
  align-items: center; justify-content: center; gap: 6px; background: #30302e; color: var(--ivory); font-size: 13px; font-weight: 600;
}

.lance-painel {
  display: flex; flex-direction: column; gap: 12px; padding: 14px 16px;
  background: var(--surface-raised); border-radius: var(--radius); box-shadow: 0 0 0 1px var(--border-strong);
}
.lance-painel summary.btn { white-space: normal; text-align: left; }
.lance-painel .btn { min-height: 44px; }
.lance-painel__cab { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.lance-painel__titulo { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; min-width: 0; }
.lance-painel__titulo h2 { font-size: 17px; }
.lance-painel__escolha { font-size: 12.5px; color: var(--text-secondary); }
.lance-painel__nums { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 0; }
.lance-painel__nums dt { font-size: 11px; color: var(--text-secondary); }
.lance-painel__nums dd { margin: 2px 0 0; font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 15px; }
.lance-painel__nums .is-destaque dd { font-size: 19px; font-weight: 600; margin-top: 0; }
.lance-painel__nums dd.is-pos { color: var(--win); }
.lance-painel__nums dd.is-neg { color: var(--lose); }
.lance-painel__formula { margin: 0; padding-top: 10px; border-top: 1px solid var(--border-subtle); font-size: 12px; color: var(--text-secondary); white-space: normal; }

/* F42b: kit do item — descrição, custo e remover numa linha (bloco "Itens do kit" do Claude Design). */
.kit-soma { font-size: 13px; color: #4d4c48; }
.kit-form { display: flex; flex-direction: column; gap: 8px; }
.kit-form .field-label { margin-bottom: 0; }
.kit-form .btn { min-height: 44px; }
.kit-linha { display: grid; grid-template-columns: minmax(0, 1fr) 130px 44px; gap: 8px; align-items: center; }
.kit-linha .input { min-height: 44px; }
.kit-linha__custo { font-family: var(--font-mono); font-variant-numeric: tabular-nums; text-align: right; }
.kit-linha__remover { width: 44px; height: 44px; padding: 0; justify-content: center; }
.kit-linha__trecho { margin-top: -4px; }
.kit-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; }
.kit-lista li { display: flex; justify-content: space-between; gap: 12px; }
/* F45: catálogo — categoria, status e busca numa linha; a busca ocupa o resto. */
.catalogo-filtros { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 12px; margin-bottom: 16px; }
.catalogo-filtros .field-label { margin-top: 0; }
.catalogo-filtros .input, .catalogo-filtros .btn { min-height: 44px; }
.catalogo-filtros__busca { flex: 1 1 260px; }
.catalogo-table__nome { font-weight: 600; }
.catalogo-table__acoes { display: flex; flex-wrap: wrap; gap: 8px; } /* F53: Editar e Confirmar, um embaixo do outro se faltar espaço */

/* F42c: "Confirmar ficha" desligado enquanto o kit tem linha sem custo, com o motivo embaixo. */
.ficha-trava { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; max-width: 280px; }
.ficha-trava__motivo { font-size: 12px; line-height: 1.4; color: var(--text-secondary); text-align: right; }

@media (max-width: 860px) {
  .config-grid { grid-template-columns: 1fr; }
  .config-side { position: static; }
  .detalhe__grid { grid-template-columns: 1fr; }
}