/* PedidoCheck — Estilo industrial/utilitário */
:root {
  --bg:         #0f1117;
  --bg2:        #181c26;
  --bg3:        #1e2332;
  --border:     #2a3045;
  --border2:    #3a4560;
  --text:       #e2e8f0;
  --text2:      #8892a4;
  --text3:      #5a6478;
  --ok:         #22c55e;
  --ok-bg:      #052e16;
  --ok-border:  #166534;
  --erro:       #ef4444;
  --erro-bg:    #2d0a0a;
  --erro-border:#7f1d1d;
  --warn:       #f59e0b;
  --warn-bg:    #2d1a00;
  --warn-border:#92400e;
  --blue:       #60a5fa;
  --blue-bg:    #0a1628;
  --mono:       'IBM Plex Mono', monospace;
  --sans:       'IBM Plex Sans', sans-serif;
  --radius:     6px;
  --radius-lg:  10px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.6;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* ── Header ── */
.site-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 32px;
  border-bottom: 1px solid var(--border);
  background: var(--bg2);
}
.logo { display: flex; align-items: center; gap: 8px; text-decoration: none; color: var(--text); }
.logo-mark { color: var(--blue); font-size: 16px; }
.logo-text { font-family: var(--mono); font-weight: 600; font-size: 15px; letter-spacing: 0.02em; }
.logo-badge {
  font-family: var(--mono); font-size: 10px; color: var(--text3);
  border: 1px solid var(--border2); border-radius: 3px; padding: 1px 5px;
}

/* ── Layout ── */
.main-content { flex: 1; padding: 40px 32px; max-width: 720px; margin: 0 auto; width: 100%; }

.site-footer {
  padding: 12px 32px;
  border-top: 1px solid var(--border);
  font-size: 12px;
  color: var(--text3);
  font-family: var(--mono);
}

/* ── Tela de busca ── */
.page-busca { display: flex; justify-content: center; padding-top: 40px; }
.busca-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px;
  width: 100%;
  max-width: 520px;
}
.busca-card__header { margin-bottom: 28px; }
.busca-card__title { font-family: var(--mono); font-size: 20px; font-weight: 600; margin-bottom: 6px; }
.busca-card__subtitle { color: var(--text2); font-size: 13px; }

.field-group { display: flex; flex-direction: column; gap: 8px; margin-bottom: 24px; }
.field-label { font-family: var(--mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text2); }
.input-row { display: flex; gap: 8px; }
.field-input {
  flex: 1;
  background: var(--bg3);
  border: 1px solid var(--border2);
  border-radius: var(--radius);
  color: var(--text);
  font-family: var(--mono);
  font-size: 15px;
  padding: 10px 14px;
  outline: none;
  transition: border-color 0.15s;
}
.field-input:focus { border-color: var(--blue); }
.field-hint { font-size: 12px; color: var(--text3); }

.busca-info { border-top: 1px solid var(--border); padding-top: 20px; display: flex; flex-direction: column; gap: 8px; }
.info-item { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--text2); }
.info-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.info-dot--blue { background: var(--blue); }

/* ── Buttons ── */
.btn-primary {
  background: var(--blue);
  color: #0a1628;
  border: none;
  border-radius: var(--radius);
  padding: 10px 20px;
  font-family: var(--mono);
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  transition: opacity 0.15s;
  white-space: nowrap;
  text-decoration: none;
  display: inline-block;
}
.btn-primary:hover:not(:disabled) { opacity: 0.85; }
.btn-primary:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-primary--large { padding: 13px 28px; font-size: 14px; }

.btn-secondary {
  background: transparent;
  color: var(--text2);
  border: 1px solid var(--border2);
  border-radius: var(--radius);
  padding: 10px 18px;
  font-family: var(--mono);
  font-size: 13px;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: border-color 0.15s, color 0.15s;
}
.btn-secondary:hover { border-color: var(--text2); color: var(--text); }

.btn-link { font-size: 13px; color: var(--text2); text-decoration: none; }
.btn-link:hover { color: var(--text); }

/* ── Alerta de erro ── */
.alert {
  display: flex; gap: 14px; align-items: flex-start;
  border-radius: var(--radius-lg); padding: 16px 20px;
  margin-bottom: 20px;
}
.alert--erro { background: var(--erro-bg); border: 1px solid var(--erro-border); }
.alert__icon { font-size: 16px; color: var(--erro); flex-shrink: 0; margin-top: 2px; }
.alert strong { color: var(--erro); font-family: var(--mono); font-size: 13px; display: block; margin-bottom: 4px; }
.alert p { font-size: 13px; color: var(--text2); }

/* ── Resumo do pedido ── */
.resumo-header {
  display: flex; justify-content: space-between; align-items: flex-start;
  margin-bottom: 24px;
}
.resumo-numero { font-family: var(--mono); font-size: 22px; font-weight: 600; }
.status-badge {
  display: inline-block; margin-top: 6px;
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  padding: 2px 8px; border-radius: 3px;
  background: var(--bg3); border: 1px solid var(--border2); color: var(--text2);
}

.resumo-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 28px;
}
.resumo-card {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 14px 16px;
  display: flex; flex-direction: column; gap: 4px;
}
.resumo-card--wide { grid-column: 1 / -1; }
.resumo-card__label { font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text3); }
.resumo-card__value { font-size: 14px; color: var(--text); }
.resumo-card__value.mono { font-family: var(--mono); }

.produtos-list { padding-left: 16px; margin-top: 4px; }
.produtos-list li { font-size: 13px; color: var(--text2); padding: 2px 0; }

.resumo-actions { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.resumo-hint { font-size: 12px; color: var(--text3); font-family: var(--mono); }

/* ── Checklist ── */
.checklist-header {
  display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 20px;
}
.checklist-razao { font-size: 13px; color: var(--text2); margin-top: 4px; }

.resumo-contagem {
  display: flex; align-items: center; gap: 16px;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 14px 20px;
  margin-bottom: 20px;
}
.contagem-item { display: flex; flex-direction: column; align-items: center; min-width: 48px; }
.contagem-num { font-family: var(--mono); font-size: 22px; font-weight: 600; line-height: 1; }
.contagem-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; margin-top: 2px; }
.contagem-item--ok .contagem-num { color: var(--ok); }
.contagem-item--ok .contagem-label { color: var(--ok); }
.contagem-item--erro .contagem-num { color: var(--erro); }
.contagem-item--erro .contagem-label { color: var(--erro); }
.contagem-item--warning .contagem-num { color: var(--warn); }
.contagem-item--warning .contagem-label { color: var(--warn); }
.contagem-separator { flex: 1; height: 1px; background: var(--border); }
.contagem-veredicto {
  font-family: var(--mono); font-weight: 600; font-size: 14px;
  padding: 6px 14px; border-radius: var(--radius);
}
.contagem-veredicto--aprovado  { background: var(--ok-bg);   color: var(--ok);   border: 1px solid var(--ok-border); }
.contagem-veredicto--reprovado { background: var(--erro-bg);  color: var(--erro);  border: 1px solid var(--erro-border); }
.contagem-veredicto--atencao   { background: var(--warn-bg);  color: var(--warn);  border: 1px solid var(--warn-border); }

.checklist-lista { display: flex; flex-direction: column; gap: 8px; margin-bottom: 24px; }

.checklist-item {
  display: flex; align-items: flex-start; gap: 14px;
  border-radius: var(--radius); padding: 14px 16px;
  border-left: 3px solid transparent;
}
.checklist-item--ok      { background: var(--ok-bg);   border-color: var(--ok);   }
.checklist-item--erro    { background: var(--erro-bg);  border-color: var(--erro);  }
.checklist-item--warning { background: var(--warn-bg);  border-color: var(--warn);  }

.checklist-item__icon {
  font-size: 16px; width: 20px; flex-shrink: 0; margin-top: 1px;
}
.checklist-item--ok      .checklist-item__icon { color: var(--ok); }
.checklist-item--erro    .checklist-item__icon { color: var(--erro); }
.checklist-item--warning .checklist-item__icon { color: var(--warn); }

.checklist-item__body { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.checklist-item__titulo  { font-family: var(--mono); font-size: 12px; font-weight: 600; color: var(--text2); text-transform: uppercase; letter-spacing: 0.05em; }
.checklist-item__mensagem { font-size: 14px; color: var(--text); }
.checklist-item__detalhe  { font-size: 12px; color: var(--text2); margin-top: 2px; }

.checklist-item__badge {
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  padding: 2px 7px; border-radius: 3px; flex-shrink: 0; margin-top: 2px;
}
.badge--ok      { background: var(--ok-bg);   color: var(--ok);   border: 1px solid var(--ok-border); }
.badge--erro    { background: var(--erro-bg);  color: var(--erro);  border: 1px solid var(--erro-border); }
.badge--warning { background: var(--warn-bg);  color: var(--warn);  border: 1px solid var(--warn-border); }

/* ── Detalhes colapsáveis ── */
.pedido-detalhes {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius); margin-bottom: 24px;
}
.pedido-detalhes summary {
  padding: 12px 16px; cursor: pointer;
  font-family: var(--mono); font-size: 12px; color: var(--text2);
  text-transform: uppercase; letter-spacing: 0.06em;
  list-style: none;
}
.pedido-detalhes summary::-webkit-details-marker { display: none; }
.pedido-detalhes__grid {
  padding: 12px 16px 16px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
  border-top: 1px solid var(--border);
}
.pedido-detalhes__grid div { display: flex; flex-direction: column; gap: 3px; }
.pedido-detalhes__grid span { font-size: 11px; color: var(--text3); text-transform: uppercase; }
.pedido-detalhes__grid code { font-family: var(--mono); font-size: 13px; color: var(--text); }

/* ── Ações finais ── */
.checklist-actions { display: flex; gap: 10px; align-items: center; }

.mono { font-family: var(--mono); }

.resumo-subject { font-size: 13px; color: var(--text2); margin-top: 2px; margin-bottom: 4px; }

/* ── Checklist reestruturado ── */
.cl-summary {
  display: flex; justify-content: space-between; align-items: flex-start;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 20px 24px;
  margin-bottom: 20px; gap: 16px;
}
.cl-summary__left  { display: flex; flex-direction: column; gap: 12px; }
.cl-summary__right { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.cl-summary__pedido { display: flex; flex-direction: column; gap: 3px; }
.cl-summary__numero { font-family: var(--mono); font-size: 22px; font-weight: 600; }
.cl-summary__org    { font-size: 13px; color: var(--text2); }

.cl-summary__contadores { display: flex; gap: 12px; }
.cl-counter {
  display: flex; flex-direction: column; align-items: center;
  padding: 8px 14px; border-radius: var(--radius); border: 1px solid var(--border2);
  min-width: 56px;
}
.cl-counter__num   { font-family: var(--mono); font-size: 20px; font-weight: 600; line-height: 1; }
.cl-counter__label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; margin-top: 3px; }
.cl-counter--erro    .cl-counter__num,
.cl-counter--erro    .cl-counter__label    { color: var(--erro); }
.cl-counter--warning .cl-counter__num,
.cl-counter--warning .cl-counter__label   { color: var(--warn); }
.cl-counter--ok      .cl-counter__num,
.cl-counter--ok      .cl-counter__label   { color: var(--ok); }

.cl-veredicto {
  font-family: var(--mono); font-weight: 600; font-size: 14px;
  padding: 7px 16px; border-radius: var(--radius);
}
.cl-veredicto--aprovado  { background: var(--ok-bg);   color: var(--ok);   border: 1px solid var(--ok-border); }
.cl-veredicto--reprovado { background: var(--erro-bg);  color: var(--erro);  border: 1px solid var(--erro-border); }
.cl-veredicto--atencao   { background: var(--warn-bg);  color: var(--warn);  border: 1px solid var(--warn-border); }

.cl-section-label {
  font-family: var(--mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--text3);
  margin-bottom: 8px; margin-top: 4px;
}
.cl-section-label--toggle {
  cursor: pointer; display: flex; align-items: center; gap: 8px; list-style: none;
}
.cl-section-label--toggle::-webkit-details-marker { display: none; }
.cl-ok-count {
  background: var(--ok-bg); color: var(--ok); border: 1px solid var(--ok-border);
  font-size: 10px; padding: 1px 6px; border-radius: 3px;
}
.cl-ok-details { margin-bottom: 16px; }
.cl-ok-details > summary { margin-bottom: 8px; }

.checklist-lista--compact { gap: 4px; }
.checklist-item--compact  { padding: 8px 14px; }
.checklist-item--compact .checklist-item__mensagem { font-size: 13px; color: var(--text2); }

/* ── Botão Telegram ── */
.btn-telegram {
  background: #0088cc; color: #fff;
  border: none; border-radius: var(--radius);
  padding: 10px 18px; font-family: var(--mono);
  font-weight: 600; font-size: 13px;
  cursor: pointer; transition: opacity 0.15s;
}
.btn-telegram:hover:not(:disabled) { opacity: 0.85; }
.btn-telegram:disabled { opacity: 0.5; cursor: not-allowed; }

.tg-feedback {
  margin-top: 10px; padding: 10px 16px;
  border-radius: var(--radius); font-size: 13px; font-family: var(--mono);
}
.tg-feedback--ok   { background: var(--ok-bg);  color: var(--ok);  border: 1px solid var(--ok-border); }
.tg-feedback--erro { background: var(--erro-bg); color: var(--erro); border: 1px solid var(--erro-border); }

/* ── Tela de busca — grupos de validações ── */
.busca-info__titulo {
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--text2); margin-bottom: 14px;
  padding-bottom: 8px; border-bottom: 1px solid var(--border);
}
.busca-info__grupo { margin-bottom: 14px; }
.busca-info__grupo-label {
  font-family: var(--mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--text3); margin-bottom: 6px;
}
.busca-info__grupo .info-item { margin-left: 4px; }

/* ── Botão API Docs ── */
.btn-docs {
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.06em;
  padding: 5px 12px; border-radius: var(--radius);
  border: 1px solid var(--border2); color: var(--text2);
  text-decoration: none; white-space: nowrap;
  transition: border-color 0.15s, color 0.15s;
}
.btn-docs:hover { border-color: var(--blue); color: var(--blue); }

/* ── Página de documentação ── */
.page-docs { max-width: 860px; }

.docs-header {
  display: flex; justify-content: space-between; align-items: flex-start;
  margin-bottom: 28px;
}
.docs-title    { font-family: var(--mono); font-size: 22px; font-weight: 600; }
.docs-subtitle { font-size: 13px; color: var(--text2); margin-top: 4px; }

.docs-section  { margin-bottom: 36px; }
.docs-section-title {
  font-family: var(--mono); font-size: 13px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--text2); margin-bottom: 16px;
  padding-bottom: 8px; border-bottom: 1px solid var(--border);
}
.docs-intro { font-size: 14px; color: var(--text2); line-height: 1.7; }
.docs-text  { font-size: 13px; color: var(--text2); line-height: 1.7; margin-bottom: 12px; }
.docs-label {
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--text3); margin: 20px 0 8px;
}
.docs-link { color: var(--blue); text-decoration: none; }
.docs-link:hover { text-decoration: underline; }

/* Endpoint card */
.docs-endpoint {
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  margin-bottom: 20px; overflow: hidden;
}
.docs-endpoint__header {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 20px; background: var(--bg2);
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.docs-endpoint__desc { font-size: 13px; color: var(--text2); }
.docs-endpoint__body { padding: 20px; }

.docs-method {
  font-family: var(--mono); font-size: 11px; font-weight: 700;
  padding: 3px 8px; border-radius: 3px; letter-spacing: 0.05em;
}
.docs-method--post { background: #1a2e1a; color: #4ade80; border: 1px solid #166534; }
.docs-method--get  { background: #0a1f35; color: #60a5fa; border: 1px solid #1d4ed8; }

.docs-path {
  font-family: var(--mono); font-size: 14px; font-weight: 600; color: var(--text);
}

/* Code blocks */
.docs-code-block {
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: var(--radius); margin-bottom: 12px; overflow: hidden;
}
.docs-code-label {
  display: block; font-family: var(--mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: 0.06em; color: var(--text3);
  padding: 6px 14px; border-bottom: 1px solid var(--border);
  background: var(--bg2);
}
.docs-code-block pre {
  margin: 0; padding: 14px 16px;
  font-family: var(--mono); font-size: 12px; color: var(--text);
  line-height: 1.6; overflow-x: auto; white-space: pre;
}
code.inline {
  font-family: var(--mono); font-size: 12px;
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: 3px; padding: 1px 5px; color: var(--text);
}

/* Tabelas */
.docs-table {
  width: 100%; border-collapse: collapse;
  font-size: 13px; margin-bottom: 12px;
}
.docs-table th {
  text-align: left; font-family: var(--mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: 0.06em; color: var(--text3);
  padding: 8px 12px; border-bottom: 1px solid var(--border);
}
.docs-table td {
  padding: 9px 12px; border-bottom: 1px solid var(--border);
  color: var(--text2); vertical-align: top;
}
.docs-table tr:last-child td { border-bottom: none; }
.docs-table code {
  font-family: var(--mono); font-size: 12px;
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: 3px; padding: 1px 5px; color: var(--text);
}

/* Notas */
.docs-notes { display: flex; flex-direction: column; gap: 12px; }
.docs-note {
  display: flex; gap: 14px; align-items: flex-start;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 14px 16px;
}
.docs-note__icon { font-size: 16px; flex-shrink: 0; margin-top: 1px; }
.docs-note strong { display: block; color: var(--text); font-size: 13px; margin-bottom: 3px; }
.docs-note div { font-size: 13px; color: var(--text2); line-height: 1.6; }

/* ── Checkbox de debug (toggle switch) ── */
.debug-toggle {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}
.toggle-label {
  display: flex; align-items: center; gap: 10px;
  cursor: pointer; user-select: none;
}
.toggle-label input[type="checkbox"] { display: none; }

.toggle-track {
  width: 36px; height: 20px; flex-shrink: 0;
  background: var(--bg3); border: 1px solid var(--border2);
  border-radius: 10px; position: relative;
  transition: background 0.2s, border-color 0.2s;
}
.toggle-thumb {
  position: absolute; top: 2px; left: 2px;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--text3);
  transition: transform 0.2s, background 0.2s;
}
.toggle-label input:checked + .toggle-track {
  background: var(--blue-bg);
  border-color: var(--blue);
}
.toggle-label input:checked + .toggle-track .toggle-thumb {
  transform: translateX(16px);
  background: var(--blue);
}
.toggle-text { font-size: 13px; color: var(--text2); }
.toggle-label:hover .toggle-text { color: var(--text); }
.toggle-hint {
  font-size: 11px; color: var(--text3); font-family: var(--mono);
  margin-top: 5px; margin-left: 46px;
}

/* ── Botão debug download ── */
.btn-debug {
  background: var(--bg3); color: var(--text2);
  border: 1px solid var(--border2); border-radius: var(--radius);
  padding: 10px 16px; font-family: var(--mono);
  font-size: 12px; font-weight: 600;
  cursor: pointer; text-decoration: none;
  display: inline-block;
  transition: border-color 0.15s, color 0.15s;
}
.btn-debug:hover { border-color: var(--blue); color: var(--blue); }

/* ── Alert info ── */
.alert--info { background: var(--blue-bg); border: 1px solid #1d4ed8; }
.alert--info .alert__icon { color: var(--blue); }

/* ── Header do usuário logado ── */
.site-header .user-info {
  margin-left: auto; display: flex; align-items: center; gap: 12px;
}
.user-badge {
  font-family: var(--mono); font-size: 11px; color: var(--text2);
  border: 1px solid var(--border2); border-radius: 3px;
  padding: 2px 8px;
}
.btn-logout {
  font-family: var(--mono); font-size: 11px; color: var(--text3);
  text-decoration: none; padding: 2px 8px;
  border: 1px solid transparent; border-radius: 3px;
  transition: color 0.15s, border-color 0.15s;
}
.btn-logout:hover { color: var(--erro); border-color: var(--erro-border); }

/* ── Tela de validação em progresso ── */
.validando-box {
  display: flex; align-items: center; gap: 16px;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 24px 20px;
  margin-bottom: 16px;
}
.validando-spinner {
  width: 20px; height: 20px; flex-shrink: 0;
  border: 2px solid var(--border2);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.validando-texto { font-size: 14px; color: var(--text2); }

/* ── Log de retries ── */
.retry-log {
  display: flex; flex-direction: column; gap: 8px;
  margin-bottom: 16px;
}
.retry-item {
  display: flex; gap: 12px; align-items: flex-start;
  background: var(--warn-bg); border: 1px solid var(--warn-border);
  border-radius: var(--radius); padding: 12px 16px;
  animation: fadeIn 0.3s ease;
}
@keyframes fadeIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.retry-icon { color: var(--warn); font-size: 15px; flex-shrink: 0; margin-top: 1px; }
.retry-body { display: flex; flex-direction: column; gap: 2px; }
.retry-titulo { font-family: var(--mono); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.05em; color: var(--warn); }
.retry-msg { font-size: 13px; color: var(--text2); }

/* ── Tags de informação do pedido (segmento, equipe, aplicação) ── */
.pedido-info-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.info-tag {
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.05em;
  padding: 2px 8px; border-radius: 3px;
  background: var(--blue-bg); color: var(--blue);
  border: 1px solid #1d4ed8;
}
.info-tag--dim {
  background: var(--bg3); color: var(--text3); border-color: var(--border2);
}

/* ── Spinner inline no badge ── */
.validando-spinner-inline {
  display: inline-block; width: 12px; height: 12px;
  border: 2px solid currentColor; border-top-color: transparent;
  border-radius: 50%; animation: spin 0.8s linear infinite;
  vertical-align: middle; margin-right: 4px; opacity: 0.7;
}

/* ── Categorias colapsáveis ── */
.categorias-lista { display: flex; flex-direction: column; gap: 8px; margin-bottom: 20px; }

.cat-group {
  border-radius: var(--radius-lg); overflow: hidden;
  border: 1px solid var(--border);
}
.cat-group--ok      { border-color: var(--ok-border); }
.cat-group--erro    { border-color: var(--erro-border); }
.cat-group--warning { border-color: var(--warn-border); }

.cat-group__header {
  display: flex; align-items: center; gap: 10px;
  padding: 14px 16px; cursor: pointer; list-style: none;
  background: var(--bg2);
  transition: background 0.15s;
}
.cat-group__header::-webkit-details-marker { display: none; }
.cat-group__header:hover { background: var(--bg3); }

.cat-group--ok      .cat-group__header { background: var(--ok-bg); }
.cat-group--erro    .cat-group__header { background: var(--erro-bg); }
.cat-group--warning .cat-group__header { background: var(--warn-bg); }

.cat-group__icon {
  font-size: 15px; flex-shrink: 0; width: 20px; text-align: center;
}
.cat-group--ok      .cat-group__icon { color: var(--ok); }
.cat-group--erro    .cat-group__icon { color: var(--erro); }
.cat-group--warning .cat-group__icon { color: var(--warn); }

.cat-group__nome {
  font-family: var(--mono); font-size: 13px; font-weight: 600; color: var(--text);
}
.cat-group__resumo {
  font-size: 12px; color: var(--text3); margin-left: 4px;
}
.cat-group__badge {
  margin-left: auto; font-family: var(--mono); font-size: 10px;
  font-weight: 600; padding: 2px 8px; border-radius: 3px;
}

.cat-group__body {
  border-top: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 0;
}

/* Sub-checks dentro de categoria */
.cat-check {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--border);
}
.cat-check:last-child { border-bottom: none; }

.cat-check--ok      { background: transparent; }
.cat-check--erro    { background: color-mix(in srgb, var(--erro-bg) 60%, transparent); }
.cat-check--warning { background: color-mix(in srgb, var(--warn-bg) 60%, transparent); }

.cat-check__icon {
  font-size: 13px; flex-shrink: 0; width: 16px; margin-top: 2px;
}
.cat-check--ok      .cat-check__icon { color: var(--ok); }
.cat-check--erro    .cat-check__icon { color: var(--erro); }
.cat-check--warning .cat-check__icon { color: var(--warn); }

.cat-check__body { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.cat-check__titulo   { font-family: var(--mono); font-size: 11px; font-weight: 600;
  color: var(--text3); text-transform: uppercase; letter-spacing: 0.04em; }
.cat-check__mensagem { font-size: 13px; color: var(--text); }
.cat-check__detalhe  { font-size: 12px; color: var(--text2); }

/* Fix spinner: garantir que hidden funciona mesmo com display:flex */
.validando-box[hidden],
.retry-log[hidden] { display: none !important; }

/* ── Configurações ── */
.cfg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cfg-token-box { display: flex; gap: 16px; align-items: flex-end; }
@media (max-width: 600px) { .cfg-grid { grid-template-columns: 1fr; } }

/* ── Abas de configuração ── */
.cfg-tabs {
  display: flex; gap: 4px; margin-bottom: 20px;
  border-bottom: 1px solid var(--border); padding-bottom: 0;
}
.cfg-tab {
  font-family: var(--mono); font-size: 12px; font-weight: 600;
  padding: 8px 16px; background: transparent; border: none;
  border-bottom: 2px solid transparent; color: var(--text3);
  cursor: pointer; position: relative; transition: color 0.15s;
  margin-bottom: -1px;
}
.cfg-tab:hover { color: var(--text2); }
.cfg-tab.active { color: var(--blue); border-bottom-color: var(--blue); }
.cfg-tab-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--warn); color: #000; font-size: 9px; font-weight: 700;
  margin-left: 4px; vertical-align: middle;
}

/* ── Alertas de config faltante ── */
.cfg-alertas { display: flex; flex-direction: column; gap: 6px; margin-bottom: 20px; }
.cfg-alerta {
  display: flex; align-items: center; gap: 10px;
  background: var(--warn-bg); border: 1px solid var(--warn-border);
  border-radius: var(--radius); padding: 10px 14px;
  font-size: 13px; color: var(--text2);
}
.cfg-alerta__icon { color: var(--warn); flex-shrink: 0; }
.cfg-aviso {
  background: var(--warn-bg); border: 1px solid var(--warn-border);
  border-radius: var(--radius); padding: 10px 14px;
  font-size: 13px; color: var(--warn); margin-bottom: 16px;
}
.cfg-feedback { margin-bottom: 16px; padding: 10px 16px; }

/* ── Ações de configuração ── */
.cfg-actions { display: flex; gap: 10px; align-items: center; margin-top: 16px; flex-wrap: wrap; }
.cfg-test-result { font-family: var(--mono); font-size: 12px; }