/**
 * Hotfix visual — componentes legacy claros en admin dark (Obsidian Lux).
 * Carga al final del head; solo overrides puntuales, sin tocar layouts.
 */

/* =========================================================
   Bootstrap utilities — fondos claros residuales
========================================================= */
html[data-theme="obsidian-lux"] .card-header.bg-white,
html[data-theme="obsidian-lux"] .card-footer.bg-white,
html[data-theme="obsidian-lux"] .card-body.bg-white,
html[data-theme="obsidian-lux"] .bg-white:not(.cfg-theme-card__mini):not(.cfg-theme-mini):not(.cfg-preview-box) {
  background-color: var(--olx-surface) !important;
  color: var(--olx-text);
  border-color: var(--olx-border);
}

html[data-theme="obsidian-lux"] .bg-light {
  background-color: var(--olx-surface) !important;
  color: var(--olx-text-secondary);
}

/* =========================================================
   admin-unified-saas — tablas / empty states (sin skin-light)
========================================================= */
html[data-theme="obsidian-lux"] .empty-state,
html[data-theme="obsidian-lux"] .empty-state-cell .empty-state {
  background: var(--olx-surface);
  border-color: var(--olx-border);
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] .empty-state-text {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] .table-standard thead th,
html[data-theme="obsidian-lux"] .table-admin-standard thead th,
html[data-theme="obsidian-lux"] .card-standard .table thead th {
  background: var(--olx-surface);
  color: var(--olx-text);
  border-bottom-color: var(--olx-border);
}

html[data-theme="obsidian-lux"] .table-standard tbody tr:hover td,
html[data-theme="obsidian-lux"] .table-admin-standard tbody tr:hover td,
html[data-theme="obsidian-lux"] .card-standard .table tbody tr:hover td {
  background: color-mix(in srgb, var(--olx-text) 4%, var(--olx-card));
}

/* =========================================================
   Productos — KPI excluidos de obsidian-lux.css (:not productos)
========================================================= */
html[data-theme="obsidian-lux"] body.productos-admin-saas .reportes-kpi-card {
  background: var(--olx-card);
  background-image: none;
  border: 1px solid var(--olx-border);
  box-shadow: var(--shadow-soft);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.productos-admin-saas .reportes-kpi-label,
html[data-theme="obsidian-lux"] body.productos-admin-saas .reportes-kpi-sub {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] body.productos-admin-saas .reportes-kpi-value,
html[data-theme="obsidian-lux"] body.productos-admin-saas .reportes-kpi-value--blue,
html[data-theme="obsidian-lux"] body.productos-admin-saas .reportes-kpi-value--green {
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] body.productos-admin-saas .reportes-kpi-ico {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] body.productos-admin-saas .productos-preview-wrap,
html[data-theme="obsidian-lux"] body.productos-admin-saas .saas-surface-inset {
  background: var(--olx-surface);
  border: 1px solid var(--olx-border);
  color: var(--olx-text-secondary);
}

/* =========================================================
   Configuración general — títulos / theme cards (configuracion-general.css)
========================================================= */
html[data-theme="obsidian-lux"] body.cfg-admin-page .cfg-section-title {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] body.cfg-admin-page .cfg-theme-card {
  background: var(--olx-card);
  background-image: none;
  border-color: var(--olx-border);
  box-shadow: var(--shadow-soft);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.cfg-admin-page .cfg-theme-card--custom {
  background: color-mix(in srgb, var(--olx-surface) 88%, var(--olx-card));
  border-color: color-mix(in srgb, var(--accent-primary) 28%, var(--olx-border));
  border-style: dashed;
}

html[data-theme="obsidian-lux"] body.cfg-admin-page .cfg-theme-card:hover {
  border-color: color-mix(in srgb, var(--accent-primary) 35%, var(--olx-border));
  box-shadow: var(--shadow-soft);
  filter: none;
}

html[data-theme="obsidian-lux"] body.cfg-admin-page .cfg-theme-card__name {
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] body.cfg-admin-page .cfg-theme-card__font {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] body.cfg-admin-page .cfg-upload-zone,
html[data-theme="obsidian-lux"] body.cfg-admin-page .cfg-preview-box {
  background: var(--olx-surface);
  border-color: var(--olx-border);
  color: var(--olx-text-secondary);
}

/* =========================================================
   Popup promocional / config factura — cards legacy
========================================================= */
html[data-theme="obsidian-lux"] body.reportes-dashboard-saas .card-header-standard {
  background: var(--olx-surface);
  border-bottom-color: var(--olx-border);
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] body.reportes-dashboard-saas .card-footer.bg-white {
  background: var(--olx-surface);
  border-top-color: var(--olx-border);
}

/* =========================================================
   Pagos empleados — estilos inline legacy (body sin clase tema)
========================================================= */
html[data-theme="obsidian-lux"] body:has(.pay-wrap) {
  background-color: var(--bg-main);
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] body:has(.pay-wrap) h1,
html[data-theme="obsidian-lux"] body:has(.pay-wrap) h2,
html[data-theme="obsidian-lux"] body:has(.pay-wrap) .h6 {
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] .pay-card {
  background: var(--olx-card);
  border: 1px solid var(--olx-border);
  box-shadow: var(--shadow-soft);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] .pay-kpi {
  border: 1px solid var(--olx-border);
  box-shadow: var(--shadow-soft);
}

html[data-theme="obsidian-lux"] .pay-kpi.pendiente {
  background: color-mix(in srgb, var(--danger) 16%, var(--olx-card));
}

html[data-theme="obsidian-lux"] .pay-kpi.pagado {
  background: color-mix(in srgb, var(--success) 14%, var(--olx-card));
}

html[data-theme="obsidian-lux"] .pay-kpi.generado {
  background: color-mix(in srgb, var(--accent-primary) 12%, var(--olx-card));
}

html[data-theme="obsidian-lux"] .pay-kpi.ultimo {
  background: var(--olx-surface);
}

html[data-theme="obsidian-lux"] .pay-kpi small {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] .pay-kpi .value {
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] .pay-kpi.is-disabled small,
html[data-theme="obsidian-lux"] .pay-kpi.is-disabled .value {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] .pay-empty-banner {
  border: 1px dashed var(--olx-border);
  background: var(--olx-surface);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] .pay-table-wrap {
  border: 1px solid var(--olx-border);
  background: var(--olx-card);
}

html[data-theme="obsidian-lux"] .pay-table thead th {
  background: var(--olx-surface);
  border-bottom-color: var(--olx-border);
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] .pay-table tbody tr:hover {
  background: color-mix(in srgb, var(--olx-text) 4%, var(--olx-card));
}

html[data-theme="obsidian-lux"] .pay-empty,
html[data-theme="obsidian-lux"] .pay-detail-empty {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] .cut-status.abierto {
  background: color-mix(in srgb, var(--success) 18%, var(--olx-card));
  color: color-mix(in srgb, var(--success) 70%, var(--olx-text));
}

html[data-theme="obsidian-lux"] .cut-status.cerrado {
  background: var(--olx-surface);
  color: var(--olx-text-secondary);
  border: 1px solid var(--olx-border);
}

/* Bloques informativos Bootstrap sin override previo */
html[data-theme="obsidian-lux"] .alert-light {
  background: var(--olx-surface);
  border-color: var(--olx-border);
  color: var(--olx-text-secondary);
}