/* kyc-review: estilos próprios (o CSS compilado do Filament não tem utilitários arbitrários). Cores de destaque: rgb(var(--primary-500)). */

.kyc-r, .fi-header, .kyc-r-modal {
  --kyc-text: #f3f5f8;
  --kyc-muted: #999fa6;
  --kyc-card: #15181f;
  --kyc-card-alt: #111419;
  --kyc-border: rgba(255, 255, 255, 0.08);
  --kyc-orange: #ff7f3b;
  --kyc-accent: rgb(var(--primary-500));
  --kyc-accent-soft: rgba(var(--primary-500), 0.15);
  --kyc-green: #3fc168;
  --kyc-red: #ef5350;
}

/* ---------- Cabeçalho (título, selos, linha de apoio) ---------- */
.kyc-r-title { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.kyc-r-title__name { font-weight: 700; }
.kyc-r-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 4px; font-size: 11px; font-weight: 700; line-height: 1; letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap; }
.kyc-r-badge svg { width: 12px; height: 12px; flex-shrink: 0; }
.kyc-r-badge--pending { background: rgba(255, 127, 59, 0.15); color: var(--kyc-orange); }
.kyc-r-badge--review { background: rgba(255, 255, 255, 0.06); color: var(--kyc-muted); }
.kyc-r-badge--approved { background: rgba(63, 193, 104, 0.15); color: var(--kyc-green); }
.kyc-r-badge--rejected { background: rgba(239, 83, 80, 0.15); color: var(--kyc-red); }
.kyc-r-badge--attempt { background: #0b0d11; color: var(--kyc-text); border: 1px solid var(--kyc-border); }

.fi-header-subheading { display: flex; flex-direction: column; gap: 6px; }
.kyc-r-sub { font-size: 14px; color: var(--kyc-muted); }
.kyc-r-sub i { font-style: normal; margin: 0 4px; }
.kyc-r-hint { font-size: 12px; color: var(--kyc-muted); }

/* ---------- Corpo ---------- */
.kyc-r { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 24px; align-items: start; font-family: Inter, system-ui, sans-serif; color: var(--kyc-text); min-width: 0; }
.kyc-r svg { width: 16px; height: 16px; flex-shrink: 0; }
.kyc-r-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.kyc-r-card { background: var(--kyc-card); border-radius: 8px; padding: 24px; min-width: 0; }
.kyc-r-card h2 { margin: 0; font-size: 16px; font-weight: 700; line-height: 24px; color: var(--kyc-text); }
.kyc-r-card__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.kyc-r-muted { color: var(--kyc-muted); }
.kyc-r-small { font-size: 12px; }
.kyc-r-orange { color: var(--kyc-orange); }

/* Ícones de status (pendente / aprovado / recusado / atenção) */
.kyc-r .kyc-r-st { width: 16px; height: 16px; flex-shrink: 0; }
.kyc-r .kyc-r-st--ok { color: var(--kyc-green); }
.kyc-r .kyc-r-st--no { color: var(--kyc-red); }
.kyc-r .kyc-r-st--warn { color: var(--kyc-orange); }
.kyc-r .kyc-r-st--wait { display: inline-block; width: 14px; height: 14px; border: 1.5px dashed var(--kyc-muted); border-radius: 50%; }

/* Abas dos arquivos */
.kyc-r-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.kyc-r-tab { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; height: 96px; padding: 8px; background: var(--kyc-card-alt); border: 1px solid var(--kyc-border); border-radius: 8px; font: inherit; color: var(--kyc-text); cursor: pointer; }
.kyc-r-tab:hover { border-color: rgba(255, 255, 255, 0.25); }
.kyc-r-tab.is-active { border-color: var(--kyc-accent); }
.kyc-r .kyc-r-tab__type { width: 24px; height: 24px; color: var(--kyc-muted); }
.kyc-r-tab__label { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; white-space: nowrap; }

/* Visualizador */
.kyc-r-viewer { position: relative; display: flex; height: 460px; background: #0b0d11; border-radius: 8px; overflow: hidden; }
.kyc-r-viewer:fullscreen { height: 100vh; border-radius: 0; }
.kyc-r-stage { flex: 1; display: flex; align-items: center; justify-content: center; min-width: 0; overflow: auto; padding: 24px; }
.kyc-r-stage img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 4px; transition: transform 0.15s ease; transform-origin: center; }
.kyc-r-tools { position: absolute; top: 12px; left: 12px; z-index: 2; display: flex; gap: 4px; padding: 4px; background: rgba(11, 13, 17, 0.85); border-radius: 8px; }
.kyc-r-tools button, .kyc-r-tools a { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: none; border: 1px solid var(--kyc-border); border-radius: 8px; color: var(--kyc-text); cursor: pointer; }
.kyc-r-tools button:hover, .kyc-r-tools a:hover { border-color: var(--kyc-accent); color: var(--kyc-accent); }
.kyc-r-tools svg { width: 20px; height: 20px; }
.kyc-r-zoom { position: absolute; right: 12px; bottom: 12px; padding: 4px 8px; background: #000; border-radius: 4px; font-size: 12px; font-weight: 600; }
.kyc-r-pdf { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--kyc-accent); text-decoration: underline; }

.kyc-r-fileinfo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; }
.kyc-r-fileinfo p { margin: 0; }
.kyc-r-filetitle { font-size: 14px; font-weight: 600; }
.kyc-r-fileactions { display: flex; flex-wrap: wrap; gap: 8px; }

/* Decisões por arquivo */
.kyc-r-decisions { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--kyc-border); }
.kyc-r-decisions__title { margin: 0 0 4px; font-size: 12px; font-weight: 600; color: var(--kyc-muted); }
.kyc-r-decision { display: grid; grid-template-columns: 16px 200px minmax(0, 1fr) auto; align-items: center; gap: 12px; font-size: 14px; }
.kyc-r-decision__name { font-weight: 600; }
.kyc-r-decision__why em { font-style: normal; color: var(--kyc-muted); }
.kyc-r-undo { background: none; border: 0; padding: 0; font: inherit; font-size: 14px; font-weight: 600; color: var(--kyc-red); cursor: pointer; }
.kyc-r-undo:hover { text-decoration: underline; }
.kyc-r-expire { margin: 16px 0 0; }

/* Dados informados × cadastro */
.kyc-r-data { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 12px 12px; margin: 16px 0 0; font-size: 14px; }
.kyc-r-data dt { color: var(--kyc-muted); line-height: 20px; }
.kyc-r-data dd { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin: 0; font-weight: 600; line-height: 20px; }
.kyc-r-data__value { min-width: 0; overflow-wrap: anywhere; }
.kyc-r-data__value small { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; line-height: 16px; }
.kyc-r-data dd .kyc-r-st { margin-top: 2px; }

.kyc-r-why { margin: 12px 0 0; font-size: 14px; line-height: 20px; color: var(--kyc-muted); }

/* Tentativas anteriores */
.kyc-r-prev { display: flex; flex-direction: column; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; font-size: 14px; }
.kyc-r-prev li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 8px; }
.kyc-r-prev a { font-weight: 600; color: var(--kyc-text); text-decoration: underline; }
.kyc-r-prev small { flex-basis: 100%; font-size: 12px; }

/* Histórico */
.kyc-r-timeline { margin: 16px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 16px; }
.kyc-r-tl { position: relative; padding-left: 20px; }
.kyc-r-tl::before { content: ""; position: absolute; left: 0; top: 6px; width: 7px; height: 7px; border-radius: 50%; background: var(--kyc-muted); }
.kyc-r-tl--neutral:first-child::before { background: #fff; }
.kyc-r-tl--red::before { background: var(--kyc-red); }
.kyc-r-tl--green::before { background: var(--kyc-green); }
.kyc-r-tl p { margin: 0; }
.kyc-r-tl__title { font-size: 14px; font-weight: 600; line-height: 20px; }
.kyc-r-tl__note { margin-top: 2px; font-size: 12px; line-height: 16px; color: var(--kyc-muted); }
.kyc-r-tl__time { margin-top: 2px; font-size: 12px; line-height: 16px; color: var(--kyc-muted); }

/* Conta */
.kyc-r-account { display: grid; grid-template-columns: 1fr auto; gap: 12px 16px; margin: 16px 0 0; font-size: 14px; }
.kyc-r-account dt { color: var(--kyc-muted); }
.kyc-r-account dd { margin: 0; text-align: right; font-weight: 600; }

/* ---------- Modais ---------- */
.kyc-r-modal { background: var(--kyc-card) !important; border-radius: 12px; font-family: Inter, system-ui, sans-serif; --tw-ring-color: var(--kyc-border); }
.kyc-r-modal .fi-modal-header { padding: 20px 24px; border-bottom: 1px solid var(--kyc-border); }
.kyc-r-modal .fi-modal-heading { font-size: 20px; font-weight: 700; color: var(--kyc-text); }
.kyc-r-modal .fi-modal-description { margin-top: 0; font-size: 14px; line-height: 22px; color: var(--kyc-muted); }
.kyc-r-modal .fi-modal-content { padding: 24px; row-gap: 20px; }
.kyc-r-modal .fi-modal-footer { padding: 16px 24px; border-top: 1px solid var(--kyc-border); }
.kyc-r-modal .fi-modal-footer-actions { justify-content: flex-start; flex-direction: row-reverse; gap: 24px; }
.kyc-r-modal .fi-modal-close-btn { border: 1px solid var(--kyc-border); border-radius: 999px; }
.kyc-r-modal .fi-fo-field-wrp-label span { font-size: 13px; font-weight: 600; color: var(--kyc-text); }
.kyc-r-modal .fi-input-wrp, .kyc-r-modal .fi-fo-textarea { background: transparent; border-radius: 8px; --tw-ring-color: rgba(255, 255, 255, 0.2); }
.kyc-r-modal .fi-fo-field-wrp-hint, .kyc-r-modal .fi-fo-field-wrp-helper-text { font-size: 12px; color: var(--kyc-muted); }
.kyc-r-modal .kyc-r-intro { font-size: 14px; line-height: 22px; color: var(--kyc-muted); }
.kyc-r-modal .kyc-r-checks { margin-top: 8px; padding: 8px 16px; border: 1px solid var(--kyc-border); border-radius: 8px; background: var(--kyc-card-alt); }
.kyc-r-modal .kyc-r-checks label span { color: var(--kyc-muted); font-size: 13px; }
.kyc-r-modal .fi-checkbox-input:checked { background-color: var(--kyc-accent); }
.kyc-r-note { margin: 0; font-size: 12px; line-height: 18px; color: var(--kyc-muted); }

.kyc-r-preview { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--kyc-border); border-radius: 8px; margin-bottom: 20px; }
.kyc-r-preview__icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: var(--kyc-card-alt); border-radius: 8px; color: var(--kyc-muted); }
.kyc-r-preview__icon svg { width: 22px; height: 22px; }
.kyc-r-preview__text { display: flex; flex-direction: column; gap: 2px; }
.kyc-r-preview__title { font-size: 15px; font-weight: 600; color: var(--kyc-text); }
.kyc-r-preview__meta { font-size: 12px; color: var(--kyc-muted); }

/* ---------- Telas estreitas ---------- */
@media (max-width: 1100px) {
  .kyc-r { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .kyc-r-card { padding: 16px; }
  .kyc-r-viewer { height: 320px; }
  .kyc-r-decision { grid-template-columns: 16px minmax(0, 1fr); }
  .kyc-r-decision__why, .kyc-r-undo { grid-column: 2; }
  .kyc-r-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.kyc-r-modal .fi-modal-footer .fi-link { color: var(--kyc-muted); }