.ai-admin-workspace {
  --ai-line: var(--color-border, #c7ccd4);
  --ai-muted: var(--color-text-muted, #5d6878);
  --ai-ink: var(--color-text, #1f2937);
  padding-top: 22px;
}

.ai-admin-callout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 28px;
  align-items: end;
  padding: 28px 30px;
  border: 1px solid var(--ai-line);
  border-left: 5px solid var(--tenant-primary, #ffd300);
  background:
    linear-gradient(115deg, color-mix(in srgb, var(--tenant-primary, #ffd300) 10%, transparent), transparent 42%),
    var(--color-surface, #fff);
}

.ai-admin-callout h3 {
  margin: 5px 0 8px;
  color: var(--ai-ink);
  font-size: clamp(1.35rem, 2vw, 2rem);
  letter-spacing: -.025em;
}

.ai-admin-callout p {
  max-width: 820px;
  margin: 0;
  color: var(--ai-muted);
  line-height: 1.6;
}

.ai-admin-health {
  padding-left: 22px;
  border-left: 1px solid var(--ai-line);
}

.ai-admin-health span,
.ai-admin-health small,
.ai-admin-metric span,
.ai-admin-metric small {
  display: block;
  color: var(--ai-muted);
  font-size: var(--type-xs, .78rem);
}

.ai-admin-health strong {
  display: block;
  margin: 3px 0;
  color: var(--ai-ink);
  font-size: 2.2rem;
}

.ai-admin-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-top: 18px;
  border-block: 1px solid var(--ai-line);
}

.ai-admin-metric {
  min-width: 0;
  padding: 18px;
  border-right: 1px solid var(--ai-line);
}

.ai-admin-metric:last-child { border-right: 0; }
.ai-admin-metric strong { display: block; margin: 8px 0 5px; color: var(--ai-ink); font-size: 1.65rem; }
.ai-admin-metric.is-success strong { color: var(--color-success, #14804a); }
.ai-admin-metric.is-warning strong { color: var(--color-warning, #a66500); }
.ai-admin-metric.is-danger strong { color: var(--color-danger, #b42318); }

.ai-admin-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 12px;
  padding: 20px 0;
  border-bottom: 1px solid var(--ai-line);
}

.ai-admin-filters label {
  min-width: 0;
  color: var(--ai-muted);
  font-size: var(--type-xs, .78rem);
  font-weight: 700;
}

.ai-admin-filters input,
.ai-admin-filters select {
  width: 100%;
  height: 42px;
  margin-top: 5px;
}

.ai-admin-search { grid-column: span 2; }
.ai-admin-filter-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; grid-column: span 2; }

.ai-admin-table-head,
.ai-admin-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.ai-admin-table-head { padding: 18px 0 12px; }
.ai-admin-table-head h3 { margin: 0 0 4px; color: var(--ai-ink); }
.ai-admin-table-head p,
.ai-admin-table-head > span,
.ai-admin-pagination { margin: 0; color: var(--ai-muted); font-size: var(--type-xs, .78rem); }

.ai-admin-table-wrap { border-block: 1px solid var(--ai-line); }
.ai-admin-table { min-width: 1420px; }
.ai-admin-table td { vertical-align: top; }
.ai-admin-table td small { display: block; max-width: 240px; margin-top: 5px; color: var(--ai-muted); line-height: 1.4; }
.ai-admin-error { color: var(--color-danger, #b42318) !important; }
.ai-admin-row-actions { display: flex; flex-wrap: wrap; gap: 6px; min-width: 210px; }
.ai-admin-row-actions .btn { min-height: 34px; padding: 7px 10px; }

.ai-admin-status {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 5px 9px;
  border-radius: 999px;
  color: var(--ai-ink);
  background: var(--color-surface-muted, #eef0f3);
  font-size: .72rem;
  font-weight: 800;
  line-height: 1.15;
}

.ai-admin-status.is-completado,
.ai-admin-status.is-ia_generada,
.ai-admin-status.is-validado { color: #0d6a3b; background: #e5f4eb; }
.ai-admin-status.is-pendiente,
.ai-admin-status.is-procesando,
.ai-admin-status.is-revision_requerida { color: #875500; background: #fbf0dc; }
.ai-admin-status.is-fallido,
.ai-admin-status.is-rechazado { color: #9f241c; background: #fbe9e7; }

.ai-admin-pagination { padding-top: 14px; }
.ai-admin-pagination > div { display: flex; gap: 8px; }

.ai-admin-dialog { width: min(960px, calc(100vw - 36px)); max-height: min(820px, calc(100vh - 36px)); overflow: auto; }
.ai-admin-dialog-body { display: grid; gap: 0; }
.ai-admin-detail-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-block: 1px solid var(--ai-line); }
.ai-admin-detail-meta > div { padding: 14px; border-right: 1px solid var(--ai-line); }
.ai-admin-detail-meta > div:last-child { border-right: 0; }
.ai-admin-detail-meta span,
.ai-admin-detail-meta strong { display: block; }
.ai-admin-detail-meta span { margin-bottom: 6px; color: var(--ai-muted); font-size: var(--type-xs, .78rem); }
.ai-admin-dialog-body > section { padding: 18px 2px; border-bottom: 1px solid var(--ai-line); }
.ai-admin-dialog-body h3 { margin: 0 0 8px; color: var(--ai-ink); font-size: 1rem; }
.ai-admin-dialog-body p,
.ai-admin-dialog-body li { color: var(--ai-muted); line-height: 1.65; }
.ai-admin-dialog-body p { margin: 0; }
.ai-admin-dialog-body ul { margin: 0; padding-left: 22px; }
.ai-admin-detail-error { margin-top: 16px; padding: 16px; border-left: 4px solid var(--color-danger, #b42318); background: #fff4f2; }
.ai-admin-detail-error p { margin: 5px 0; }

@media (max-width: 1180px) {
  .ai-admin-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ai-admin-metric:nth-child(3n) { border-right: 0; }
}

@media (max-width: 760px) {
  .ai-admin-callout { grid-template-columns: 1fr; padding: 22px 18px; }
  .ai-admin-health { padding: 14px 0 0; border-left: 0; border-top: 1px solid var(--ai-line); }
  .ai-admin-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ai-admin-metric:nth-child(3n) { border-right: 1px solid var(--ai-line); }
  .ai-admin-metric:nth-child(2n) { border-right: 0; }
  .ai-admin-filters { grid-template-columns: 1fr; }
  .ai-admin-search,
  .ai-admin-filter-actions { grid-column: auto; }
  .ai-admin-table-head,
  .ai-admin-pagination { align-items: flex-start; flex-direction: column; }
  .ai-admin-detail-meta { grid-template-columns: 1fr 1fr; }
  .ai-admin-detail-meta > div:nth-child(2n) { border-right: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .ai-admin-workspace * { scroll-behavior: auto !important; }
}
