/**
 * Obsidian Lux — cards / KPI / empty states (Fase 2)
 */

html[data-theme="obsidian-lux"] .card,
html[data-theme="obsidian-lux"] .saas-card,
html[data-theme="obsidian-lux"] .saas-card-premium,
html[data-theme="obsidian-lux"] .table-card,
html[data-theme="obsidian-lux"] .card-panel,
html[data-theme="obsidian-lux"] .crud-admin-saas .card-panel.saas-card {
  background-color: var(--bg-card);
  border: 1px solid var(--border-primary);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] .card:hover,
html[data-theme="obsidian-lux"] .saas-card:hover,
html[data-theme="obsidian-lux"] .saas-card-premium:hover,
html[data-theme="obsidian-lux"] .table-card:hover {
  background-color: var(--bg-card-hover);
}

html[data-theme="obsidian-lux"] .card-header,
html[data-theme="obsidian-lux"] .saas-card-header {
  background-color: var(--bg-elevated);
  border-bottom: 1px solid var(--border-primary);
  color: var(--text-primary);
}

html[data-theme="obsidian-lux"] .card-body,
html[data-theme="obsidian-lux"] .saas-card-body {
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] .card-title {
  color: var(--text-primary);
}

/* KPI — shell finanzas en obsidian-lux.css; aquí solo acentos de texto */
html[data-theme="obsidian-lux"] .saas-kpi-card-base {
  background-color: var(--bg-card);
  border: 1px solid var(--border-primary);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

html[data-theme="obsidian-lux"] .saas-kpi-card-base:hover {
  box-shadow: 0 12px 32px color-mix(in srgb, #000 38%, transparent);
}

html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-info {
  border-top-color: var(--border-strong);
}

html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-success {
  border-top-color: color-mix(in srgb, var(--accent-primary) 55%, var(--border-primary));
}

html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-danger {
  border-top-color: color-mix(in srgb, var(--danger) 65%, var(--border-primary));
}

html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-distribution {
  border-top-color: var(--border-strong);
}

html[data-theme="obsidian-lux"] .reportes-kpi-value,
html[data-theme="obsidian-lux"] .reportes-kpi-value--blue,
html[data-theme="obsidian-lux"] .reportes-kpi-value--violet {
  color: var(--text-primary);
}

html[data-theme="obsidian-lux"] .reportes-kpi-value--green {
  color: color-mix(in srgb, var(--accent-hover) 50%, var(--text-primary));
}

html[data-theme="obsidian-lux"] .reportes-kpi-value--red {
  color: color-mix(in srgb, var(--danger) 55%, var(--text-primary));
}

html[data-theme="obsidian-lux"] .reportes-kpi-label,
html[data-theme="obsidian-lux"] .reportes-kpi-sub,
html[data-theme="obsidian-lux"] .dashboard-cards-hint {
  color: var(--text-muted);
}

html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-distribution .reportes-kpi-label,
html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-distribution .reportes-kpi-sub {
  color: var(--text-muted);
}

html[data-theme="obsidian-lux"] .reportes-kpi-ico {
  color: var(--text-muted);
}

html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-success .reportes-kpi-ico {
  color: color-mix(in srgb, var(--accent-primary) 65%, var(--text-muted));
}

html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-danger .reportes-kpi-ico {
  color: color-mix(in srgb, var(--danger) 70%, var(--text-muted));
}

html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-info .reportes-kpi-ico,
html[data-theme="obsidian-lux"] .reportes-kpi-card--accent-distribution .reportes-kpi-ico {
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] .dashboard-card-label,
html[data-theme="obsidian-lux"] .dashboard-card-meta {
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] .dashboard-card-money {
  color: var(--text-primary);
}

/* Empty states */
html[data-theme="obsidian-lux"] .saas-empty-state,
html[data-theme="obsidian-lux"] .empty-state {
  background-color: color-mix(in srgb, var(--bg-elevated) 55%, var(--bg-card));
  border: 1px dashed var(--border-primary);
  color: var(--text-muted);
  border-radius: var(--radius-md);
}

html[data-theme="obsidian-lux"] .saas-empty-state > p,
html[data-theme="obsidian-lux"] .saas-empty-state > .saas-empty-state__text,
html[data-theme="obsidian-lux"] .empty-state-text {
  color: var(--text-muted);
}

html[data-theme="obsidian-lux"] .saas-empty-state > i,
html[data-theme="obsidian-lux"] .saas-empty-state > svg,
html[data-theme="obsidian-lux"] .empty-state-ico {
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] .list-group-item {
  background-color: var(--bg-card);
  color: var(--text-secondary);
  border-color: var(--border-primary);
}

html[data-theme="obsidian-lux"] .list-group-item.active {
  background-color: color-mix(in srgb, var(--accent-primary) 22%, var(--bg-elevated));
  border-color: var(--border-primary);
  color: var(--text-primary);
}

/* —— CRUD legacy (clientes, empleados, servicios, productos) —— */
html[data-theme="obsidian-lux"] body.crud-admin-saas,
html[data-theme="obsidian-lux"] body.clientes-admin-saas,
html[data-theme="obsidian-lux"] body.empleados-admin-saas,
html[data-theme="obsidian-lux"] body.servicios-admin-saas,
html[data-theme="obsidian-lux"] body.productos-admin-saas {
  background-color: var(--olx-bg);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] .card-panel,
html[data-theme="obsidian-lux"] .card-standard,
html[data-theme="obsidian-lux"] .card.shadow-sm.border-0,
html[data-theme="obsidian-lux"] .crud-admin-saas .card-panel.saas-card,
html[data-theme="obsidian-lux"] .productos-admin-saas .reportes-filter-card,
html[data-theme="obsidian-lux"] .productos-admin-saas .productos-form-card,
html[data-theme="obsidian-lux"] .productos-admin-saas .productos-list-card {
  background: var(--olx-card) !important;
  background-image: none !important;
  border-color: var(--olx-border) !important;
  box-shadow: var(--shadow-soft) !important;
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] .crud-admin-saas .card-panel.saas-card:hover,
html[data-theme="obsidian-lux"] .card-standard:hover,
html[data-theme="obsidian-lux"] .card-panel:hover {
  transform: none;
  box-shadow: var(--shadow-soft) !important;
}

html[data-theme="obsidian-lux"] .card-header-standard {
  background: var(--olx-surface) !important;
  border-bottom-color: var(--olx-border) !important;
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] .crud-admin-saas .saas-section-title,
html[data-theme="obsidian-lux"] .crud-admin-saas .crud-legacy-section-title,
html[data-theme="obsidian-lux"] .productos-admin-saas .productos-section-title,
html[data-theme="obsidian-lux"] .productos-admin-saas .saas-subtitle {
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] .crud-admin-saas .saas-page-title,
html[data-theme="obsidian-lux"] .clientes-admin-saas .saas-page-title,
html[data-theme="obsidian-lux"] .empleados-admin-saas .saas-page-title,
html[data-theme="obsidian-lux"] .servicios-admin-saas .saas-page-title,
html[data-theme="obsidian-lux"] .productos-admin-saas .reportes-page-title {
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] .productos-admin-saas .thumb,
html[data-theme="obsidian-lux"] .productos-admin-saas .productos-thumb {
  background: var(--olx-surface);
  border-color: var(--olx-border);
  box-shadow: none;
}

html[data-theme="obsidian-lux"] .productos-admin-saas .productos-thumb-empty {
  background: var(--olx-surface);
  border-color: var(--olx-border);
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] .empleados-admin-saas .color-dot {
  border-color: var(--olx-border);
}

/* —— Usuarios —— */
html[data-theme="obsidian-lux"] body.usuarios-admin-saas .usuarios-wrap {
  /* Ancho: admin-content-shell.css */
  padding: 0;
}

html[data-theme="obsidian-lux"] body.usuarios-admin-saas .usuarios-top-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

html[data-theme="obsidian-lux"] body.usuarios-admin-saas .table-usuarios th,
html[data-theme="obsidian-lux"] body.usuarios-admin-saas .table-usuarios td {
  vertical-align: middle;
}

/* —— Historial pagos (premium shell → obsidian-lux.css) —— */
html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-kpi-hero.reportes-kpi-card {
  padding: clamp(24px, 3vw, 36px) clamp(22px, 3vw, 32px);
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-kpi-hero .reportes-kpi-value {
  font-size: clamp(2rem, 4.2vw, 2.85rem);
  font-weight: 800;
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-kpi-sub {
  font-size: 0.82rem;
  color: var(--olx-muted);
  margin-top: 0.45rem;
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-section-title {
  font-weight: 800;
  font-size: 0.95rem;
  letter-spacing: -0.02em;
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-pagos-sec-head {
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--olx-border);
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .chart-card > h2.chart-card-title + .historial-pagos-sec-head {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-emp-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 0.72rem 0;
  border-bottom: 1px solid var(--olx-border);
  font-size: 0.92rem;
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-emp-row:last-child {
  border-bottom: 0;
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-emp-row strong,
html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-emp-name {
  color: var(--olx-text);
  font-weight: 600;
  min-width: 170px;
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-emp-amount {
  min-width: 138px;
  text-align: right;
  font-weight: 700;
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-emp-progress {
  height: 8px;
  border-radius: 999px;
  background: var(--olx-surface);
  overflow: hidden;
  flex: 1;
}

html[data-theme="obsidian-lux"] body.historial-pagos-saas .historial-emp-progress > span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent-primary) 55%, var(--olx-surface));
}

/* —— Facturación (bloques claros en facturar.css) —— */
html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-card,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-line,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-empty,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-srv-line--legacy,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-producto-picker .multi-select-header,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-producto-picker .multi-select-body {
  background: var(--olx-card);
  background-image: none;
  border-color: var(--olx-border);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-header {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-header::before {
  background: color-mix(in srgb, var(--accent-primary) 50%, var(--olx-surface));
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-empty,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-empty small {
  color: var(--olx-muted);
  border-color: var(--olx-border);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-srv-line {
  border-bottom-color: var(--olx-border);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-srv-nom,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-srv-pre,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .detalle-servicio-linea,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-producto-picker .multi-select-header-text {
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-producto-picker .multi-item:hover {
  background: color-mix(in srgb, var(--olx-text) 4%, var(--olx-surface));
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-line-name,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-line-price {
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-line-meta {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-line-badge--srv {
  background: color-mix(in srgb, var(--accent-primary) 20%, var(--olx-card));
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-line-badge--prod {
  background: var(--olx-surface);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-total-hero {
  background: var(--olx-surface);
  border: 1px solid var(--olx-border);
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-total-label {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-producto-picker .multi-item {
  border-bottom-color: var(--olx-border);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-producto-picker .multi-item--sin-stock {
  background: color-mix(in srgb, var(--olx-muted) 12%, var(--olx-card));
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-producto-picker .multi-item .servicio-texto,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-producto-picker .multi-item .precio {
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .card,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .card-body {
  background: var(--olx-card);
  border-color: var(--olx-border);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-card,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-line {
  background: var(--olx-card) !important;
  background-image: none !important;
  border-color: var(--olx-border) !important;
  box-shadow: var(--shadow-soft);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .pos-cart-empty {
  background: var(--olx-surface) !important;
  background-image: none !important;
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-srv-line--legacy {
  background: var(--olx-surface) !important;
  background-image: none !important;
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-cart-item {
  border-bottom-color: var(--olx-border);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-cart-item--servicio {
  background: color-mix(in srgb, var(--accent-primary) 10%, transparent);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-cart-item .fc-nombre {
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-cart-item .fc-meta {
  color: var(--olx-muted);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .detalle-servicio-linea + .detalle-servicio-linea {
  border-top-color: var(--olx-border);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .detalle-srv-nom,
html[data-theme="obsidian-lux"] body.facturar-admin-saas .detalle-srv-pre {
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-producto-picker .multi-select-header {
  background: var(--olx-surface);
  border-color: var(--olx-border);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-cliente-sugerencias {
  background: var(--olx-card);
  border-color: var(--olx-border);
  box-shadow: var(--shadow-soft);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-cliente-sugerencias .fc-sug-btn {
  background: var(--olx-card);
  border-bottom-color: var(--olx-border);
  color: var(--olx-text-secondary);
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-cliente-sugerencias .fc-sug-btn:hover {
  background: color-mix(in srgb, var(--olx-text) 4%, var(--olx-surface));
}

html[data-theme="obsidian-lux"] body.facturar-admin-saas .facturar-cliente-chip {
  color: var(--olx-muted);
}
