/*
 * Tema visual oficial de Vitrion.
 *
 * Esta capa se carga después de los estilos funcionales de cada módulo. Su única
 * responsabilidad es aplicar el contrato cromático global sin mezclar colores
 * con reglas de distribución, comportamiento o lógica de negocio.
 */

:root {
  --dash-ink: var(--text);
  --dash-muted: var(--text-muted);
  --dash-teal: #2bc4b2;
  --dash-teal-soft: #113c42;
  --dash-green: #68d99f;
  --dash-green-soft: #173d31;
  --dash-blue: #73b8ff;
  --dash-blue-soft: #173554;
  --dash-violet: #b3a3ff;
  --dash-violet-soft: #302a55;
  --dash-amber: #f4c96f;
  --dash-amber-soft: #44371f;
  --dash-rose: #ff9aaa;
  --dash-rose-soft: #492832;
  --dash-cyan: #69d4ea;
  --dash-cyan-soft: #163e4b;
  --dash-border: var(--border);
  --dash-shadow: var(--shadow-md);
}

/* Navegación -------------------------------------------------------------- */
.primary-nav-link,
.navigation-summary {
  color: var(--text-secondary);
}

.primary-nav-link:hover,
.navigation-summary:hover,
.primary-nav-link.is-active,
.navigation-summary.is-active,
.primary-nav-link[aria-current="page"] {
  background: var(--brand-soft);
  color: var(--brand-dark);
}

.navigation-dropdown-panel,
.mobile-navigation-drawer {
  border-color: var(--border);
  background: var(--surface-raised);
  box-shadow: var(--shadow-md);
}

.navigation-group + .navigation-group,
.mobile-drawer-header,
.mobile-navigation-accordion,
.mobile-drawer-account {
  border-color: var(--border);
}

.navigation-group-title,
.mobile-drawer-header small,
.mobile-account-identity small {
  color: var(--text-muted);
}

.navigation-group a,
.mobile-primary-links > a,
.mobile-accordion-links > a {
  color: var(--text-secondary);
}

.navigation-group a:hover,
.navigation-group a[aria-current="page"],
.mobile-primary-links > a:hover,
.mobile-accordion-links > a:hover,
.mobile-primary-links > a[aria-current="page"],
.mobile-accordion-links > a[aria-current="page"] {
  background: var(--brand-soft);
  color: var(--brand-dark);
}

.navigation-group a small { color: var(--text-muted); }

.mobile-navigation-trigger {
  border-color: var(--border-strong);
  background: var(--surface-soft);
  color: var(--brand-dark);
}

.mobile-navigation-backdrop { background: rgb(2 10 17 / 72%); }

.mobile-drawer-close {
  border-color: var(--border);
  background: var(--surface-soft);
  color: var(--text-secondary);
}

.mobile-navigation-accordion summary {
  color: var(--text-secondary);
}

.mobile-navigation-accordion summary:hover,
.mobile-drawer-account > a:hover,
.mobile-logout-button:hover {
  background: var(--surface-hover);
}

.mobile-drawer-account { background: #0b1d2b; }
.mobile-account-identity strong { color: var(--text); }
.mobile-account-avatar {
  background: var(--brand-soft-strong);
  color: var(--brand-dark);
}
.mobile-drawer-account > a { color: var(--brand-dark); }
.mobile-logout-button { color: var(--danger); }

/* Superficies comunes de módulos ----------------------------------------- */
.more-options,
.expense-more-options,
.checkout-advanced,
.combined-payment-options,
.inventory-disclosure,
.price-tier-disclosure,
.report-more-filters,
.mobile-navigation-accordion,
.sale-quote,
.inventory-lot-card,
.inventory-movement-card,
.receipt-line-card,
.sale-line-card,
.expense-item,
.expense-movement-item,
.dashboard-row,
.report-ranked-row {
  border-color: var(--border);
  background: var(--surface-muted);
}

.more-options summary,
.expense-more-options summary,
.checkout-advanced > summary,
.combined-payment-options > summary,
.inventory-disclosure > summary,
.price-tier-disclosure > summary,
.report-more-filters summary,
.sale-location-stock summary,
.sale-line-actions summary {
  color: var(--brand-dark);
}

textarea,
.product-form textarea,
.sale-form textarea,
.expense-form textarea,
.expense-edit-form textarea,
.expense-void-card textarea {
  border-color: var(--border-strong);
  background: var(--surface-raised);
  color: var(--text);
}

.money-input span,
.presentation-conversion,
.receipt-document-note,
.checkout-total-panel,
.payment-change-preview,
.financial-note {
  border-color: var(--border-strong);
  background: var(--brand-soft);
  color: var(--brand-dark);
}

/* Productos --------------------------------------------------------------- */
.product-thumb,
.product-detail-image,
.inventory-product-placeholder {
  background: var(--surface-soft);
  color: var(--brand-dark);
}

.product-code,
.price-value,
.sale-total-mobile,
.expense-item-amount {
  color: var(--brand-dark);
}

.danger-zone,
.expense-void-card { border-color: var(--danger-border); }

/* Inventario y entradas --------------------------------------------------- */
.inventory-summary > div,
.inventory-location-grid > div,
.inventory-cost-grid > div,
.inventory-lot-metrics > div,
.price-tier-row,
.receipt-line-card,
.inventory-summary-card {
  border-color: var(--border);
  background: var(--surface-muted);
}

.inventory-location-grid span,
.inventory-cost-grid span,
.inventory-lot-metrics span,
.inventory-summary-card span,
.inventory-cost-grid small,
.inventory-summary-card small,
.inventory-location-grid small,
.price-tier-row small,
.receipt-line-meta,
.movement-meta {
  color: var(--text-muted);
}

.inventory-product-card,
.inventory-summary-card { border-left-color: var(--brand); }
.inventory-product-card.stock-low,
.inventory-summary-card.stock-low { border-left-color: var(--warning); }
.inventory-product-card.stock-empty,
.inventory-summary-card.stock-empty { border-left-color: var(--danger); }
.inventory-sale-price-card { border-left-color: var(--info); }

.inventory-help summary {
  background: var(--brand-soft-strong);
  color: var(--brand-dark);
}
.inventory-help p {
  background: #020c14;
  color: var(--text);
  box-shadow: var(--shadow-md);
}

.price-tier-disclosure > summary,
.price-tier-row { background: var(--surface-muted); }
.price-tier-row.price-tier-inactive {
  background: #172734;
  opacity: .72;
}
.price-tier-status-inactive,
.status-inactive {
  background: #263a48;
  color: #b4c3cc;
}

.receipt-document-current,
.receipt-document-preview {
  border-color: var(--success-border);
  background: var(--success-soft);
}
.receipt-document-preview img {
  border-color: var(--border);
  background: var(--surface-raised);
}
.receipt-card-voided {
  border-color: var(--danger-border);
  background: linear-gradient(90deg, var(--danger-soft), var(--surface) 40%);
  box-shadow: 0 12px 35px rgb(0 0 0 / 18%);
}
.receipt-status-note { color: #ffc1bb; }
.presentation-conversion strong { color: var(--text); }

/* Ventas y cobros --------------------------------------------------------- */
.sale-choice,
.quick-payment-method span,
.expense-choice > span {
  border-color: var(--border-strong);
  background: var(--surface-raised);
  color: var(--text-secondary);
}

.sale-choice:has(input:checked),
.quick-payment-method input:checked + span,
.expense-choice input:checked + span {
  border-color: var(--brand);
  background: var(--brand-soft);
  color: var(--brand-dark);
  box-shadow: 0 0 0 2px rgb(43 196 178 / 16%);
}

.sale-list-summary > div,
.sale-quote-grid > div,
.checkout-summary > div,
.financial-summary-grid > div,
.profitability-panel > div,
.expense-detail-grid div {
  background: var(--surface-muted);
}

.sale-quote,
.sale-cart-checkout,
.inventory-disclosure,
.checkout-advanced,
.combined-payment-options,
.payment-slot,
.sale-payment-row {
  border-color: var(--border);
  background: var(--surface-muted);
}

.sale-location-stock-list > div {
  background: var(--surface-raised);
}

.sale-line-form .button:disabled,
.sale-line-form .button:disabled:hover {
  border-color: var(--border);
  background: #263a48;
  color: var(--text-muted);
}

.checkout-dialog,
.checkout-header,
.checkout-footer {
  border-color: var(--border);
  background: var(--surface);
  color: var(--text);
}
.checkout-dialog { box-shadow: 0 2rem 5rem rgb(0 0 0 / 52%); }
.checkout-dialog::backdrop { background: rgb(1 7 12 / 76%); }
.checkout-header h2 { color: var(--brand-dark); }
.checkout-close {
  background: var(--surface-soft);
  color: var(--text-secondary);
}
.checkout-close:hover { background: var(--surface-hover); }
.checkout-total-panel small { color: var(--text-muted); }
.checkout-status-message {
  background: var(--surface-soft);
  color: var(--text-secondary);
}
.checkout-status-warning { background: var(--warning-soft); color: var(--warning); }
.checkbox-card {
  border-color: var(--warning-border);
  background: var(--warning-soft);
}
.financial-summary-total { background: var(--brand-soft) !important; }
.sale-payment-reversed { background: #172734; }

/* Gastos ----------------------------------------------------------------- */
.expense-choice-group legend { color: var(--text-secondary); }
.expense-more-options { background: var(--surface-muted); }
.expense-item:hover {
  border-color: var(--brand);
  background: var(--surface-hover);
}
.expense-item.is-voided {
  background: #172734;
  opacity: .66;
}
.expense-total-card { background: var(--surface-raised); }

/* Reportes --------------------------------------------------------------- */
.report-period-tabs a,
.report-quick-periods a,
.report-custom-radio,
.report-tabs a {
  background: var(--surface-soft);
  color: var(--brand-dark);
}
.report-period-tabs a.is-active,
.report-quick-periods a.is-active,
.report-tabs a.is-active,
.report-custom-radio:has(input:checked) {
  background: var(--brand);
  color: #fff;
}
.report-custom-period label,
.report-filter-grid label,
.report-more-filters label { color: var(--text-secondary); }
.dashboard-metric-card span,
.dashboard-metric-card small,
.dashboard-row small,
.report-ranked-row small,
.report-ranked-values span,
.report-section-heading > p:last-child {
  color: var(--text-muted);
}
.dashboard-metric-card strong { color: var(--text); }
.metric-primary {
  border-color: #287d78;
  background: var(--dash-teal-soft);
}
.metric-profit {
  border-color: var(--success-border);
  background: var(--dash-green-soft);
}
.metric-warning {
  border-color: var(--warning-border);
  background: var(--warning-soft);
}
.dashboard-panel-heading a { color: var(--brand-dark); }
.dashboard-row,
.report-ranked-row { color: var(--text); }
.report-filter-card {
  background: rgb(14 34 50 / 94%);
  backdrop-filter: blur(12px);
}

/* Dashboard V2 ----------------------------------------------------------- */
.dashboard-hero {
  border-color: #285b69;
  background:
    radial-gradient(circle at 88% 15%, rgb(43 196 178 / 12%) 0 8%, transparent 30%),
    linear-gradient(135deg, #0e2c3d 0%, #102838 48%, #17304b 100%);
  box-shadow: var(--shadow-md);
}
.dashboard-hero h1,
.dashboard-section-heading h2,
.analytics-heading h2 { color: var(--text); }
.dashboard-hero p:last-child,
.dashboard-live-badge,
.chart-legend,
.trend-axis { color: var(--text-muted); }
.dashboard-live-badge {
  border-color: var(--border-strong);
  background: rgb(8 24 36 / 58%);
}
.dashboard-period-card,
.executive-metric,
.operational-metric,
.analytics-card {
  border-color: var(--dash-border);
  box-shadow: var(--shadow-sm);
}
.executive-metric,
.operational-metric { background: var(--surface-raised); }
.executive-metric > strong,
.operational-metric strong { color: var(--text); }
.metric-icon {
  background: rgb(255 255 255 / 7%);
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / 8%);
}
.metric-sales {
  border-color: #287d78;
  background: linear-gradient(145deg, #123f43, var(--surface-raised) 78%);
}
.metric-profit {
  border-color: var(--success-border);
  background: linear-gradient(145deg, #173d31, var(--surface-raised) 78%);
}
.metric-result {
  border-color: #335f88;
  background: linear-gradient(145deg, #173554, var(--surface-raised) 78%);
}
.metric-projection {
  border-color: #584d8a;
  background: linear-gradient(145deg, #302a55, var(--surface-raised) 78%);
}
.metric-collections {
  border-color: #326676;
  background: linear-gradient(145deg, #163e4b, var(--surface-raised) 78%);
}
.change-up { background: var(--success-soft); color: var(--success); }
.change-down { background: var(--danger-soft); color: var(--danger); }
.change-stable { background: #263a48; color: var(--text-secondary); }
.change-new { background: var(--dash-violet-soft); color: var(--dash-violet); }
.metric-receivable { border-top-color: var(--dash-amber); background: var(--dash-amber-soft); }
.metric-payable { border-top-color: var(--dash-rose); background: var(--dash-rose-soft); }
.metric-purchase { border-top-color: var(--dash-blue); background: var(--dash-blue-soft); }
.metric-expense { border-top-color: #ff9379; background: #492a28; }
.metric-inventory { border-top-color: var(--dash-violet); background: var(--dash-violet-soft); }
.analytics-card { background: var(--surface); }
.chart-grid-line { stroke: #315266; }
.chart-dot { stroke: var(--surface); }
.donut-track { stroke: #29485b; }
.stock-bar-track,
.product-bar-track { background: #263f50; }
.stock-bar-value,
.product-bar-value { background: linear-gradient(90deg, var(--brand), var(--brand-strong)); }

/* Estados semánticos ----------------------------------------------------- */
.stock-badge-available,
.price-tier-status-active,
.expense-status-confirmed,
.sale-status-confirmed {
  background: var(--success-soft);
  color: var(--success);
}
.stock-badge-low,
.sale-status-draft {
  background: var(--warning-soft);
  color: var(--warning);
}
.stock-badge-empty,
.expense-status-voided,
.sale-status-voided {
  background: var(--danger-soft);
  color: var(--danger);
}
.inventory-lot-card.lot-reversed,
.sale-quote-error { background: var(--danger-soft); border-color: var(--danger-border); }
.sale-quote-warning { background: var(--warning-soft); border-color: var(--warning-border); }
.sale-quote-success { background: var(--success-soft); border-color: var(--success-border); }

/* Documentos e impresión ------------------------------------------------ */
@media print {
  :root { color-scheme: light; }

  body,
  .card,
  .sale-line-card,
  .sale-payment-row,
  .inventory-summary > div,
  .inventory-location-grid > div,
  .inventory-cost-grid > div,
  .inventory-lot-metrics > div,
  .expense-detail-grid div {
    background: #fff !important;
    color: #111 !important;
  }

  h1,
  h2,
  h3,
  h4,
  strong,
  span,
  small,
  p,
  dt,
  dd {
    color: #111 !important;
  }
}