/* Fila de verificação KYC (protótipo "Fila"): classes próprias, o CSS compilado do Filament não tem utilitários arbitrários. */

.kyc-q {
  --kyc-text: #f3f5f8;
  --kyc-muted: #999fa6;
  --kyc-card: #15181f;
  --kyc-card-alt: #111419;
  --kyc-border: rgba(255, 255, 255, 0.08);
  --kyc-orange: #ff7f3b;
  /* Destaque = cor principal do painel (config.primary_color), via variável do Filament ("r, g, b"). */
  --kyc-accent: rgb(var(--primary-500));
  --kyc-accent-soft: rgba(var(--primary-500), 0.15);
  --kyc-green: #3fc168;
  --kyc-red: #ef5350;
  display: flex;
  flex-direction: column;
  gap: 24px;
  font-family: Inter, system-ui, sans-serif;
  color: var(--kyc-text);
  min-width: 0;
}

.kyc-q svg { width: 16px; height: 16px; flex-shrink: 0; }

/* Cartões de números */
.kyc-q-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.kyc-q-stat { display: flex; flex-direction: column; gap: 4px; padding: 16px; background: var(--kyc-card); border-radius: 8px; min-width: 0; }
.kyc-q-stat__label { font-size: 12px; font-weight: 600; color: var(--kyc-muted); }
.kyc-q-stat__value { font-size: 28px; font-weight: 700; line-height: 1.2; }
.kyc-q-stat__detail { font-size: 12px; color: var(--kyc-muted); }
.kyc-q-stat__detail--orange { color: var(--kyc-orange); }

/* Cartão da tabela */
.kyc-q-card { background: var(--kyc-card); border-radius: 8px; overflow: hidden; min-width: 0; }
.kyc-q-setup { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 56px 24px; text-align: center; }
.kyc-q-setup__icon { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background: var(--kyc-accent-soft); color: var(--kyc-accent); }
.kyc-q-setup__icon svg { width: 28px; height: 28px; }
.kyc-q-setup__title { font-size: 18px; font-weight: 700; color: var(--kyc-text); }
.kyc-q-setup__text { max-width: 420px; margin-bottom: 8px; font-size: 14px; color: var(--kyc-muted); }
.kyc-q-error { padding: 16px; color: var(--kyc-text); font-size: 14px; }

.kyc-q-tabs { display: flex; gap: 8px; padding: 0 24px; border-bottom: 1px solid var(--kyc-border); overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
.kyc-q-tabs::-webkit-scrollbar { display: none; }
.kyc-q-tab { display: inline-flex; align-items: center; gap: 8px; padding: 16px 8px 14px; margin-bottom: -1px; background: none; border: 0; border-bottom: 2px solid transparent; font: inherit; font-size: 14px; font-weight: 600; color: var(--kyc-muted); cursor: pointer; white-space: nowrap; }
.kyc-q-tab:hover { color: var(--kyc-text); }
.kyc-q-tab.is-active { color: var(--kyc-text); border-bottom-color: var(--kyc-accent); }
.kyc-q-pill { padding: 1px 8px; border-radius: 6px; background: rgba(255, 255, 255, 0.06); font-size: 11px; font-weight: 600; color: var(--kyc-muted); }
.kyc-q-tab.is-active .kyc-q-pill { background: var(--kyc-accent-soft); color: var(--kyc-accent); }

.kyc-q-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 16px; border-bottom: 1px solid var(--kyc-border); }
.kyc-q-search { display: flex; align-items: center; gap: 8px; flex: 0 1 280px; min-width: 200px; height: 40px; padding: 0 12px; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 8px; color: var(--kyc-muted); }
.kyc-q-search:focus-within { border-color: var(--kyc-accent); }
.kyc-q-search input { flex: 1; min-width: 0; background: none; border: 0; outline: 0; box-shadow: none; padding: 0; font: inherit; font-size: 14px; color: var(--kyc-text); }
.kyc-q-search input::placeholder { color: var(--kyc-muted); }
.kyc-q-chip { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 12px; background: none; border: 1px solid var(--kyc-border); border-radius: 8px; font: inherit; font-size: 12px; font-weight: 600; color: var(--kyc-text); }
.kyc-q-chip:disabled { opacity: 0.6; cursor: not-allowed; }

/* Tabela */
.kyc-q-scroll { overflow-x: auto; }
.kyc-q-table { width: 100%; min-width: 960px; border-collapse: collapse; text-align: left; font-size: 14px; }
.kyc-q-table th { padding: 14px 16px; background: var(--kyc-card-alt); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--kyc-muted); border-bottom: 1px solid var(--kyc-border); }
.kyc-q-table td { padding: 12px 16px; height: 64px; border-bottom: 1px solid var(--kyc-border); vertical-align: middle; }
.kyc-q-table tbody tr:nth-child(even) { background: var(--kyc-card-alt); }
.kyc-q-name { display: block; font-weight: 600; }
.kyc-q-email { display: block; margin-top: 2px; font-size: 12px; color: var(--kyc-muted); }
.kyc-q-muted { color: var(--kyc-muted); }
.kyc-q-attempt--warn { color: var(--kyc-orange); }
.kyc-q-actions { text-align: right; }
.kyc-q-table .kyc-q-empty { background: none; }
.kyc-q-empty td { height: auto; padding: 40px 16px; text-align: center; color: var(--kyc-muted); }

.kyc-q-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border-radius: 4px; font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap; }
.kyc-q-badge svg { width: 12px; height: 12px; }
.kyc-q-badge--pending { background: rgba(255, 127, 59, 0.15); color: var(--kyc-orange); }
.kyc-q-badge--review { background: rgba(255, 255, 255, 0.06); color: var(--kyc-muted); }
.kyc-q-badge--approved { background: rgba(63, 193, 104, 0.15); color: var(--kyc-green); }
.kyc-q-badge--rejected { background: rgba(239, 83, 80, 0.15); color: var(--kyc-red); }

.kyc-q-open { display: inline-flex; align-items: center; justify-content: center; height: 36px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 8px; font-size: 14px; font-weight: 600; color: var(--kyc-text); text-decoration: none; }
.kyc-q-open:hover { border-color: var(--kyc-accent); color: var(--kyc-accent); }

/* Rodapé / paginação */
.kyc-q-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; font-size: 12px; }
.kyc-q-pager { display: flex; align-items: center; gap: 8px; }
.kyc-q-page { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 8px; background: none; border: 1px solid transparent; border-radius: 8px; font: inherit; font-size: 14px; font-weight: 600; color: var(--kyc-muted); cursor: pointer; }
.kyc-q-page:hover:not(:disabled) { color: var(--kyc-text); }
.kyc-q-page:disabled { opacity: 0.4; cursor: not-allowed; }
.kyc-q-page.is-active { border-color: var(--kyc-accent); background: var(--kyc-accent-soft); color: var(--kyc-text); }


@media (max-width: 1023px) {
  .kyc-q-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 639px) {
  .kyc-q-stats { grid-template-columns: minmax(0, 1fr); }
  .kyc-q-tabs { padding: 0 12px; }
  .kyc-q-search { flex: 1 1 100%; }
}
