:root {
  --bg-obsidian: #f8f9fa;
  --bg-surface: #ffffff;
  --bg-elevated: #f8fafc;
  --bg-glass: #ffffff;
  --gold-light: #9a6f0b;
  --gold-main: #d4a017;
  --gold-dark: #8a6108;
  --gold-border: rgba(212, 160, 23, 0.35);
  --gold-glow: rgba(212, 160, 23, 0.16);
  --silver-bright: #1e293b;
  --silver-main: #334155;
  --silver-muted: #64748b;
  --text-primary: #1e293b;
  --text-secondary: #475569;
  --danger: #dc2626;
  --danger-bg: rgba(220, 38, 38, 0.08);
  --success: #15803d;
  --success-bg: rgba(21, 128, 61, 0.1);
  --radius-lg: 14px;
  --radius-md: 12px;
  --radius-sm: 8px;
  --shadow-card: 0 10px 30px rgba(15, 23, 42, 0.06), 0 1px 3px rgba(15, 23, 42, 0.04);
  --font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: var(--font-sans);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

input,
select,
textarea,
button,
code,
kbd,
pre,
samp {
  font-family: var(--font-sans);
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100dvh;
  background-color: var(--bg-obsidian);
  color: var(--silver-bright);
  font-family: var(--font-sans);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

body {
  background-color: #f8f9fa;
  background-image: none;
}

/* Canonical visually-hidden utility from modern-web-guidance */
.visually-hidden {
  position: absolute;
  clip-path: inset(50%);
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  white-space: nowrap;
}

[hidden] {
  display: none !important;
}

input:focus-visible,
select:focus-visible,
button:focus-visible,
a:focus-visible,
.table-wrapper:focus-visible {
  outline: 3px solid rgba(212, 160, 23, 0.45);
  outline-offset: 2px;
}

/* ==========================================================================
   LOGIN VIEW
   ========================================================================== */
.auth-wrapper {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 1.5rem 1rem 3rem;
}

@media (min-height: 760px) {
  .auth-wrapper {
    justify-content: center;
  }
}

.auth-card {
  width: 100%;
  max-width: 410px;
  background: #ffffff;
  border: 1px solid #eef0f4;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06), 0 1px 3px rgba(15, 23, 42, 0.04);
  padding: 2.2rem 2rem;
  position: relative;
  overflow: hidden;
}

.auth-card::before {
  display: none;
}

.brand-header {
  text-align: center;
  margin-block-end: 1.5rem;
}

.brand-emblem-wrap {
  width: 96px;
  height: 96px;
  margin: 0 auto 0.85rem;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.brand-emblem {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 0;
  display: block;
  background-color: transparent;
  filter: drop-shadow(0 6px 14px rgba(15, 23, 42, 0.12));
}

.brand-title {
  margin: 0;
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #1e293b;
}

.brand-subtitle {
  margin: 0.25rem 0 0;
  font-size: 0.85rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #64748b;
}

.auth-form {
  margin: 0;
}

.form-group {
  margin-block-end: 1.15rem;
}

.form-label,
.toolbar-label {
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--silver-main);
  margin-block-end: 0.35rem;
}

.required-mark {
  color: var(--gold-main);
  margin-inline-start: 0.2rem;
}

.input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.form-input,
.form-select {
  width: 100%;
  font-size: 0.96rem;
  min-height: 44px;
  padding: 0.6rem 0.9rem;
  border-radius: var(--radius-sm);
  border: 1px solid #cbd5e1;
  background-color: #eef2ff;
  color: var(--silver-bright);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.form-select {
  background-color: #f8fafc;
}

.form-input--password {
  padding-inline-end: 3.25rem;
}

.form-input--compact {
  min-height: 36px;
  padding: 0.35rem 0.65rem;
  font-size: 0.9rem;
}

.form-input:hover,
.form-select:hover {
  border-color: rgba(212, 160, 23, 0.55);
}

.form-input:focus,
.form-select:focus {
  background-color: #ffffff;
  border-color: var(--gold-main);
  box-shadow: 0 0 0 3px var(--gold-glow);
}

.form-input:invalid:user-invalid,
.form-input.is-invalid {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px var(--danger-bg);
}

@media (pointer: coarse) {
  .form-input,
  .form-select,
  .btn-primary,
  .btn-secondary {
    min-height: 50px;
  }
}

.password-toggle {
  position: absolute;
  inset-inline-end: 0.35rem;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  color: var(--silver-muted);
  border-radius: var(--radius-sm);
  cursor: pointer;
}

.password-toggle:hover {
  color: var(--gold-dark);
  background-color: rgba(212, 160, 23, 0.12);
}

.field-hint {
  display: block;
  margin-block-start: 0.3rem;
  font-size: 0.78rem;
  color: var(--silver-muted);
}

.field-error {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-block-start: 0.35rem;
  font-size: 0.82rem;
  color: var(--danger);
  font-weight: 500;
}

.form-alert {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.85rem 1rem;
  border-radius: var(--radius-md);
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  font-size: 0.9rem;
  margin-block-end: 1.15rem;
}

.btn-primary {
  width: 100%;
  min-height: 44px;
  padding: 0.65rem 1.2rem;
  border: 1px solid #c29112;
  border-radius: var(--radius-sm);
  background: #d4a017;
  color: #ffffff;
  font-size: 0.94rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  box-shadow: 0 2px 6px rgba(212, 160, 23, 0.22);
  transition: background-color 0.15s ease, transform 0.15s ease;
}

.btn-primary:hover:not(:disabled) {
  background: #c29112;
}

.btn-primary:disabled {
  opacity: 0.6;
  cursor: wait;
}

.btn-secondary {
  min-height: 44px;
  padding: 0.55rem 0.95rem;
  border-radius: var(--radius-sm);
  border: 1px solid #e6dec8;
  background: #faf8f2;
  color: #334155;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.btn-secondary:hover {
  background: #f3eedf;
  border-color: var(--gold-main);
  color: #1e293b;
}

.btn-sm {
  min-height: 38px;
  padding: 0.4rem 0.75rem;
  font-size: 0.82rem;
}

.pwa-banner {
  margin-block-start: 1.35rem;
  padding-block-start: 1.1rem;
  border-block-start: 1px solid #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.82rem;
  color: var(--silver-muted);
}

.btn-pwa {
  background: #faf8f2;
  color: var(--gold-dark);
  border: 1px solid #e6dec8;
  border-radius: var(--radius-sm);
  padding: 0.45rem 0.85rem;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

/* ==========================================================================
   ERP SHELL & NAVIGATION
   ========================================================================== */
.erp-shell {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

.erp-topbar {
  position: sticky;
  inset-block-start: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.8rem 1.45rem;
  background: linear-gradient(90deg, #374151 0%, #4b5563 50%, #374151 100%);
  border-block-end: 2px solid rgba(212, 160, 23, 0.6);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.14), 0 1px 4px rgba(15, 23, 42, 0.08);
  flex-wrap: wrap;
}

.topbar-brand {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  cursor: pointer;
  padding: 0.25rem 0.55rem;
  margin-left: -0.5rem;
  border-radius: var(--radius-sm);
  transition: transform 0.15s ease, background 0.15s ease;
}

.topbar-brand:hover {
  background: rgba(255, 255, 255, 0.12);
  transform: scale(1.02);
}

.topbar-brand:hover .topbar-icon {
  filter: drop-shadow(0 4px 10px rgba(245, 197, 66, 0.45));
}

.topbar-icon {
  width: 44px;
  height: 44px;
  border-radius: 0;
  object-fit: contain;
  background: transparent;
}

.topbar-titles h1 {
  margin: 0;
  font-size: 1.04rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #ffffff;
}

.topbar-titles p {
  margin: 0;
  font-size: 0.72rem;
  color: #fde68a;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
}

.topbar-omnibox {
  position: relative;
  flex: 1;
  max-width: 520px;
  min-width: 240px;
  margin: 0 1rem;
}

.omnibox-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.omnibox-icon {
  position: absolute;
  left: 0.85rem;
  color: #b47d09;
  pointer-events: none;
}

.omnibox-input {
  width: 100%;
  min-height: 40px;
  padding: 0.45rem 4.2rem 0.45rem 2.55rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  background: #ffffff;
  color: #0f172a;
  font-size: 0.86rem;
  box-shadow: 0 2px 8px rgba(7, 34, 77, 0.18);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.omnibox-input::placeholder {
  color: #64748b;
}

.omnibox-input:focus {
  outline: none;
  border-color: #f5c542;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(245, 197, 66, 0.35);
}

.omnibox-kbd {
  position: absolute;
  right: 0.75rem;
  padding: 0.15rem 0.45rem;
  border-radius: 6px;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  color: #475569;
  font-size: 0.7rem;
  font-family: inherit;
  pointer-events: none;
}

.omnibox-dropdown {
  position: absolute;
  top: calc(100% + 0.45rem);
  left: 0;
  right: 0;
  max-height: 360px;
  overflow-y: auto;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.12);
  padding: 0.4rem;
  z-index: 200;
}

.omnibox-item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 0.85rem;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--silver-bright);
  text-align: left;
  cursor: pointer;
  transition: background 0.12s ease;
}

.omnibox-item:hover,
.omnibox-item.is-highlighted {
  background: #fef9e7;
}

.omnibox-item-title {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--silver-bright);
}

.omnibox-item-badge {
  font-size: 0.72rem;
  color: var(--gold-dark);
  background: #fef9e7;
  border: 1px solid rgba(212, 160, 23, 0.35);
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  white-space: nowrap;
}

.erp-nav {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.nav-tab {
  min-height: 40px;
  padding: 0.45rem 0.95rem;
  border-radius: var(--radius-sm);
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: var(--silver-main);
  font-size: 0.86rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s ease;
}

.nav-tab:hover {
  border-color: var(--gold-border);
  color: var(--silver-bright);
  background: #fdfaf0;
}

.nav-tab.is-active {
  background: #fef9e7;
  border-color: var(--gold-main);
  color: var(--gold-dark);
}

.topbar-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.user-pill {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.35rem 0.85rem;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.user-pill:hover {
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(253, 230, 138, 0.65);
}

.user-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--gold-main);
  color: #ffffff;
  font-weight: 800;
  font-size: 0.82rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.user-meta {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
}

.user-meta strong {
  font-size: 0.82rem;
  color: #ffffff;
}

.user-meta span {
  font-size: 0.7rem;
  color: #fde68a;
}

.btn-logout {
  min-height: 38px;
  padding: 0.4rem 0.85rem;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(254, 202, 202, 0.75);
  background: #ffffff;
  color: #dc2626;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.14);
  transition: background 0.15s ease, transform 0.15s ease;
}

.btn-logout:hover {
  background: #fef2f2;
  transform: translateY(-1px);
}

.erp-main {
  flex: 1;
  width: 100%;
  max-width: 1460px;
  margin: 0 auto;
  padding: 1.25rem 1.25rem 3rem;
}

/* ==========================================================================
   KPI STRIP & CATALOG TOOLBAR
   ========================================================================== */
.kpi-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.9rem;
  margin-block-end: 1.15rem;
}

.kpi-box {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  padding: 0.95rem 1.15rem;
  display: flex;
  flex-direction: column;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.kpi-box--gold {
  border-color: rgba(212, 160, 23, 0.45);
  background: linear-gradient(135deg, #fef9e7, #ffffff);
}

.kpi-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--silver-muted);
  font-weight: 600;
}

.kpi-value {
  font-size: 1.45rem;
  font-weight: 800;
  color: var(--silver-bright);
  margin: 0.15rem 0;
}

.kpi-box--gold .kpi-value {
  color: var(--gold-dark);
  font-family: var(--font-sans);
}

.kpi-sub {
  font-size: 0.76rem;
  color: var(--silver-muted);
}

.catalog-toolbar {
  display: grid;
  grid-template-columns: 2fr 1.1fr 1.1fr 1.1fr 0.9fr auto;
  gap: 0.85rem;
  align-items: end;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  padding: 1rem 1.15rem;
  margin-block-end: 0.9rem;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.catalog-toolbar--stacked {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  align-items: stretch;
}

.catalog-toolbar-row--top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.85rem;
  align-items: end;
}

.catalog-toolbar-row--bottom {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.85rem;
  align-items: end;
  padding-block-start: 0.75rem;
  border-block-start: 1px solid #e2e8f0;
}

@media (max-width: 1180px) {
  .catalog-toolbar {
    grid-template-columns: 1fr 1fr;
  }
  .catalog-toolbar-row--bottom {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 780px) {
  .catalog-toolbar-row--top {
    grid-template-columns: 1fr;
  }
  .catalog-toolbar-row--bottom {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .catalog-toolbar {
    grid-template-columns: 1fr;
  }
  .catalog-toolbar-row--bottom {
    grid-template-columns: 1fr;
  }
}

.search-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.btn-clear-search {
  position: absolute;
  inset-inline-end: 0.45rem;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background: #e2e8f0;
  color: var(--silver-bright);
  font-size: 1.1rem;
  cursor: pointer;
}

.btn-new-art {
  white-space: nowrap;
  padding-inline: 1.15rem;
}

.table-meta-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-block-end: 0.65rem;
}

.catalog-status-msg {
  font-size: 0.88rem;
  color: var(--silver-main);
  font-weight: 500;
}

.pagination-controls {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.btn-page {
  min-height: 36px;
  padding: 0.35rem 0.8rem;
  border-radius: var(--radius-sm);
  border: 1px solid #e6dec8;
  background: #faf8f2;
  color: var(--gold-dark);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}

.btn-page:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.page-indicator {
  font-size: 0.84rem;
  color: var(--silver-main);
  font-weight: 600;
}

/* ==========================================================================
   RESPONSIVE DATA TABLE (modern-web-guidance: responsive-table + containment)
   ========================================================================== */
.table-wrapper {
  overflow: auto;
  max-inline-size: 100%;
  max-block-size: min(680px, 76vh);
  container-type: inline-size;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
}

.catalog-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.86rem;
  --label-2: "Códigos de Barra";
  --label-3: "Rubro / Proveedor";
  --label-4: "IVA y Costo";
  --label-5: "Lista Minorista";
  --label-6: "Lista Mayorista";
  --label-7: "Inventario";
  --label-8: "Acción";
}

.catalog-table thead {
  position: sticky;
  inset-block-start: 0;
  z-index: 3;
}

.catalog-table thead th {
  background: #f8fafc;
  color: var(--gold-dark);
  font-weight: 700;
  text-align: left;
  padding: 0.8rem 0.85rem;
  border-block-end: 1px solid #e2e8f0;
  white-space: nowrap;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.catalog-table tbody tr {
  content-visibility: auto;
  contain-intrinsic-size: auto 72px;
}

@supports not (content-visibility: auto) {
  .catalog-table tbody tr {
    contain: layout style paint;
  }
}

.catalog-table tbody th,
.catalog-table tbody td {
  padding: 0.65rem 0.85rem;
  border-block-end: 1px solid #f1f5f9;
  vertical-align: middle;
}

/* Sticky row header on desktop */
.catalog-table tbody th {
  position: sticky;
  inset-inline-start: 0;
  z-index: 1;
  background: #ffffff;
  text-align: left;
  font-weight: 600;
  min-width: 280px;
  border-inline-end: 1px solid #f1f5f9;
}

.catalog-table tbody tr:hover th,
.catalog-table tbody tr:hover td {
  background-color: #fdfaf0;
}

.table-loading-cell {
  text-align: center;
  padding: 2.5rem !important;
  color: var(--gold-dark);
  font-size: 0.95rem;
}

/* Product Row Header cell with White-Background Image */
.art-row-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.thumb-white-box {
  width: 50px;
  height: 50px;
  min-width: 50px;
  border-radius: 8px;
  background-color: #ffffff;
  padding: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(212, 175, 55, 0.35);
  overflow: hidden;
}

.thumb-white-box img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.art-head-meta {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.art-code-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--font-sans);
  font-size: 0.76rem;
  color: var(--gold-light);
  font-weight: 700;
}

.art-title-text {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--silver-bright);
  line-height: 1.25;
}

.mini-tag {
  display: inline-block;
  padding: 0.1rem 0.45rem;
  border-radius: 4px;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
}

.mini-tag--frac {
  background: rgba(49, 196, 141, 0.15);
  color: var(--success);
}

.mini-tag--baja {
  background: var(--danger-bg);
  color: var(--danger);
}

.mini-tag--extra {
  background: rgba(212, 160, 23, 0.14);
  color: var(--gold-dark);
}

.price-cell-stack {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
}

.price-final-val {
  font-size: 0.94rem;
  font-weight: 800;
  color: var(--gold-dark);
}

.price-neto-val {
  font-size: 0.75rem;
  color: var(--silver-muted);
}

.stock-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 6px;
  font-weight: 700;
  font-size: 0.84rem;
  background: rgba(21, 128, 61, 0.12);
  color: var(--success);
}

.stock-badge--zero {
  background: rgba(220, 38, 38, 0.1);
  color: var(--danger);
}

/* Container query stacked layout for mobile/narrow viewports */
@container (width < 760px) {
  .catalog-table,
  .catalog-table thead,
  .catalog-table tbody,
  .catalog-table tr,
  .catalog-table th,
  .catalog-table td {
    display: block;
  }

  .catalog-table thead {
    display: none;
  }

  .catalog-table tbody tr {
    margin: 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: var(--radius-md);
    overflow: hidden;
  }

  .catalog-table tbody th {
    position: sticky;
    inset-block-start: 0;
    z-index: 2;
    background: #f8fafc;
    border-inline-end: none;
  }

  .catalog-table td:nth-child(2)::before {
    content: var(--label-2) ": ";
    font-weight: 700;
    color: var(--gold-dark);
  }
  .catalog-table td:nth-child(3)::before {
    content: var(--label-3) ": ";
    font-weight: 700;
    color: var(--gold-dark);
  }
  .catalog-table td:nth-child(4)::before {
    content: var(--label-4) ": ";
    font-weight: 700;
    color: var(--gold-dark);
  }
  .catalog-table td:nth-child(5)::before {
    content: var(--label-5) ": ";
    font-weight: 700;
    color: var(--gold-dark);
  }
  .catalog-table td:nth-child(6)::before {
    content: var(--label-6) ": ";
    font-weight: 700;
    color: var(--gold-dark);
  }
  .catalog-table td:nth-child(7)::before {
    content: var(--label-7) ": ";
    font-weight: 700;
    color: var(--gold-dark);
  }
  .catalog-table td:nth-child(8)::before {
    content: var(--label-8) ": ";
    font-weight: 700;
    color: var(--gold-dark);
  }
}

/* ==========================================================================
   MODAL DIALOG (modern-web-guidance: dialog & light-dismiss-a-dialog)
   ========================================================================== */
dialog:modal {
  overscroll-behavior: contain;
}

dialog::backdrop {
  overflow: hidden;
  overscroll-behavior: contain;
  background-color: rgba(15, 23, 42, 0.45);
  backdrop-filter: blur(4px);
}

.erp-dialog {
  width: min(1140px, 96vw);
  max-height: 92dvh;
  margin: auto;
  padding: 0;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-lg);
  background: #ffffff;
  color: var(--silver-bright);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
}

.dialog-form {
  display: flex;
  flex-direction: column;
  max-height: 92dvh;
}

.dialog-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.35rem;
  background: #f8fafc;
  border-block-end: 1px solid #e2e8f0;
}

.dialog-title-wrap {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.dialog-title-wrap h2 {
  margin: 0;
  font-size: 1.15rem;
  color: #1e293b;
}

.btn-icon-close {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: var(--silver-bright);
  font-size: 1rem;
  cursor: pointer;
}

.dialog-body {
  padding: 1.25rem 1.35rem;
  overflow-y: auto;
  flex: 1;
}

.dialog-grid-layout {
  display: grid;
  grid-template-columns: 1fr 310px;
  gap: 1.25rem;
  align-items: start;
}

@media (max-width: 960px) {
  .dialog-grid-layout {
    grid-template-columns: 1fr;
  }
}

.erp-fieldset {
  margin: 0 0 1.15rem;
  padding: 1.1rem;
  border-radius: var(--radius-md);
  border: 1px solid #e2e8f0;
  background: #f8fafc;
}

.erp-legend {
  padding: 0 0.5rem;
  font-size: 0.86rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--gold-dark);
}

.form-row {
  display: grid;
  gap: 0.9rem;
}

.form-row--code-name {
  grid-template-columns: 220px 1fr;
}

.form-row--2col {
  grid-template-columns: 1fr 1fr;
}

.form-row--3col {
  grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 680px) {
  .form-row--code-name,
  .form-row--2col,
  .form-row--3col {
    grid-template-columns: 1fr;
  }
}

.code-input-group {
  display: flex;
  gap: 0.45rem;
}

.code-mono-input {
  font-family: var(--font-sans);
  font-weight: 700;
  letter-spacing: normal;
  color: var(--silver-bright);
}

.toggles-stack {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.checkbox-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  accent-color: var(--gold-main);
}

.checkbox-pill input[type="checkbox"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.checkbox-pill--danger {
  color: var(--danger);
}

.baja-logica-box {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.baja-fecha-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.baja-fecha-label {
  font-size: 0.78rem;
  color: var(--danger);
}

.sub-panel {
  margin-block-start: 0.85rem;
  padding: 0.85rem;
  border-radius: var(--radius-sm);
  background: #ffffff;
  border: 1px solid #e2e8f0;
}

.sub-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-block-end: 0.65rem;
  flex-wrap: wrap;
}

.sub-panel-header h4 {
  margin: 0;
  font-size: 0.88rem;
  color: var(--gold-dark);
}

.sub-panel-header p {
  margin: 0.1rem 0 0;
  font-size: 0.76rem;
  color: var(--silver-muted);
}

.dynamic-rows {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.dyn-row {
  display: grid;
  grid-template-columns: 1.4fr 1fr auto;
  gap: 0.55rem;
  align-items: center;
}

.btn-remove-row {
  min-height: 38px;
  padding: 0 0.65rem;
  border-radius: var(--radius-sm);
  border: 1px solid #fecaca;
  background: #fef2f2;
  color: var(--danger);
  cursor: pointer;
  font-weight: 700;
}

/* Price Lists Section */
.config-precios-bar {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.75rem 0.9rem;
  border-radius: var(--radius-sm);
  background: #fef9e7;
  border: 1px solid var(--gold-border);
  margin-block-end: 1rem;
  flex-wrap: wrap;
}

.price-lists-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.95rem;
}

@media (max-width: 760px) {
  .price-lists-grid {
    grid-template-columns: 1fr;
  }
}

.price-list-card {
  padding: 0.9rem;
  border-radius: var(--radius-sm);
  background: #ffffff;
  border: 1px solid #e2e8f0;
}

.price-list-card--minorista {
  border-color: var(--gold-border);
}

.price-list-card--mayorista {
  border-color: rgba(21, 128, 61, 0.35);
}

.price-list-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-block-end: 0.75rem;
}

.price-list-header h4 {
  margin: 0;
  font-size: 0.9rem;
}

.price-input--highlight {
  border-color: var(--gold-main);
  font-weight: 800;
  color: var(--gold-dark);
}

/* Inventory Formula */
.inventory-formula-grid {
  display: grid;
  grid-template-columns: 1fr auto 1.3fr auto 1fr;
  gap: 0.65rem;
  align-items: center;
}

@media (max-width: 680px) {
  .inventory-formula-grid {
    grid-template-columns: 1fr;
  }
  .formula-op {
    display: none;
  }
}

.formula-op {
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--gold-dark);
  padding-block-start: 0.8rem;
}

.stock-final-input {
  font-weight: 800;
  color: var(--success);
  border-color: rgba(21, 128, 61, 0.45);
}

/* White-Background Product Image Column */
.product-photo-stage {
  width: 100%;
  aspect-ratio: 1 / 1;
  background-color: #ffffff;
  border-radius: var(--radius-md);
  border: 2px solid var(--gold-main);
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-block-end: 0.65rem;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
}

.product-photo-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.img-source-badge {
  display: block;
  text-align: center;
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--gold-dark);
  margin-block-end: 0.85rem;
}

.image-actions-stack {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.file-upload-label {
  text-align: center;
}

.smart-candidates-panel {
  margin-block-start: 0.85rem;
  padding-block-start: 0.75rem;
  border-block-start: 1px solid #e2e8f0;
}

.smart-candidates-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  margin-block-start: 0.45rem;
}

.candidate-thumb-btn {
  background: #ffffff;
  border: 2px solid #e2e8f0;
  border-radius: 8px;
  padding: 4px;
  aspect-ratio: 1 / 1;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.candidate-thumb-btn:hover {
  border-color: var(--gold-main);
}

.candidate-thumb-btn img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.dialog-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.85rem;
  padding: 0.9rem 1.35rem;
  background: #f8fafc;
  border-block-start: 1px solid #e2e8f0;
}

/* ==========================================================================
   PRICE CONFIGURATIONS SECTION & SUMMARY
   ========================================================================== */
.section-header-card,
.welcome-hero {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 1.35rem 1.5rem;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, #fef9e7 0%, #ffffff 65%);
  border: 1px solid var(--gold-border);
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
  margin-block-end: 1.25rem;
}

.section-header-card h2,
.welcome-hero h2 {
  margin: 0 0 0.25rem;
  font-size: 1.3rem;
  color: #1e293b;
}

.section-header-card p,
.welcome-hero p {
  margin: 0;
  color: var(--silver-muted);
  font-size: 0.9rem;
}

.price-configs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 1rem;
}

.price-config-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  padding: 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.price-config-card h3 {
  margin: 0;
  font-size: 1rem;
  color: var(--gold-dark);
}

.price-config-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.price-config-iva-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  white-space: nowrap;
  background: #fef9e7;
  color: var(--gold-dark);
  border: 1px solid var(--gold-border);
}

.price-config-iva-pill--reduced {
  background: #eff6ff;
  color: #1d4ed8;
  border-color: #93c5fd;
}

.form-label-inline-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.iva-lock-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.1rem 0.48rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  background: #fef9e7;
  color: var(--gold-dark);
  border: 1px solid var(--gold-border);
}

.iva-lock-hint {
  font-size: 0.73rem;
  color: var(--gold-dark);
  font-weight: 600;
}

#art-alicuota:disabled {
  background-color: #f1f5f9;
  color: #475569;
  border-color: #cbd5e1;
  cursor: not-allowed;
  opacity: 0.92;
  font-weight: 700;
}

html[data-theme="dark"] .price-config-iva-pill {
  background: rgba(212, 175, 55, 0.15);
  color: var(--gold-light);
  border-color: var(--gold-border);
}

html[data-theme="dark"] .price-config-iva-pill--reduced {
  background: rgba(59, 130, 246, 0.18);
  color: #93c5fd;
  border-color: rgba(147, 197, 253, 0.4);
}

html[data-theme="dark"] .iva-lock-badge {
  background: rgba(212, 175, 55, 0.16);
  color: var(--gold-light);
  border-color: var(--gold-border);
}

html[data-theme="dark"] .iva-lock-hint {
  color: var(--gold-light);
}

html[data-theme="dark"] #art-alicuota:disabled {
  background-color: rgba(15, 23, 42, 0.75);
  color: #cbd5e1;
  border-color: rgba(212, 175, 55, 0.35);
  opacity: 0.9;
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.3rem 0.7rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
}

.badge--gold {
  background: #fef9e7;
  color: var(--gold-dark);
  border: 1px solid var(--gold-border);
}

.badge--green {
  background: var(--success-bg);
  color: var(--success);
  border: 1px solid rgba(21, 128, 61, 0.35);
}

.modules-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 1.35rem;
  margin-block-end: 2rem;
}

.module-card {
  position: relative;
  background: #ffffff;
  border: 1px solid #dbe3ee;
  border-radius: 14px;
  padding: 1.55rem 1.4rem;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  cursor: pointer;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.11), 0 3px 8px rgba(15, 23, 42, 0.06);
  transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.module-card:hover {
  border-color: var(--gold-main);
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16), 0 5px 14px rgba(212, 160, 23, 0.16);
}

.module-icon {
  width: 44px;
  height: 44px;
  border-radius: 11px;
  background: #fef9e7;
  border: 1px solid var(--gold-border);
  color: var(--gold-dark);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(212, 160, 23, 0.12);
}

.module-card h3 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--silver-bright);
}

.module-back-bar {
  display: none !important;
}

.btn-back-home {
  min-height: 38px;
  padding: 0.4rem 0.9rem;
  border-radius: var(--radius-sm);
  border: 1px solid #e6dec8;
  background: #faf8f2;
  color: var(--gold-dark);
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  transition: background 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
}

.erp-topbar .btn-back-home {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.38);
  color: #ffffff;
}

.erp-topbar .btn-back-home:hover {
  background: rgba(255, 255, 255, 0.26);
  border-color: #fde68a;
  color: #ffffff;
}

.btn-back-home[hidden],
.topbar-caja-badge[hidden] {
  display: none !important;
}

.btn-back-home:hover {
  background: #f3eedf;
  border-color: var(--gold-main);
  transform: translateX(-2px);
}

.module-breadcrumb {
  font-size: 0.86rem;
  color: var(--silver-muted);
}

.module-breadcrumb strong {
  color: var(--silver-bright);
}

/* ==========================================================================
   CLIENTES Y CUENTAS CORRIENTES + REGISTRACIÓN EN LÍNEA
   ========================================================================== */
.auth-client-reg-box {
  margin-block-start: 0.65rem;
  padding-block-start: 0.85rem;
  border-top: 1px solid #e2e8f0;
}

.uppercase-input {
  text-transform: uppercase;
}

.uppercase-input::placeholder {
  text-transform: uppercase;
}

/* Sinergial-style 3-tab bar inside client dialog */
.erp-tabs-bar {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.55rem 1.35rem 0;
  background: #f1f5f9;
  border-bottom: 1px solid #e2e8f0;
  flex-wrap: wrap;
}

.erp-tab-btn {
  min-height: 40px;
  padding: 0.5rem 1.15rem;
  border-radius: 10px 10px 0 0;
  border: 1px solid #cbd5e1;
  border-bottom: none;
  background: #f8fafc;
  color: var(--silver-muted);
  font-size: 0.86rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.erp-tab-btn:hover {
  color: var(--silver-bright);
  background: #fef9e7;
}

.erp-tab-btn.is-active {
  background: #ffffff;
  color: var(--gold-dark);
  border-color: var(--gold-main);
  box-shadow: 0 -2px 8px rgba(212, 160, 23, 0.12);
}

.tabs-uppercase-badge {
  margin-inline-start: auto;
  margin-block-end: 0.4rem;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  background: #fef9e7;
  color: var(--gold-dark);
  border: 1px solid var(--gold-border);
}

.erp-tab-panel[hidden] {
  display: none !important;
}

.client-generales-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 1.25rem;
  align-items: start;
}

@media (max-width: 960px) {
  .client-generales-grid {
    grid-template-columns: 1fr;
  }
}

.client-side-col {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: sticky;
  top: 0;
}

.client-address-row-1 {
  grid-template-columns: 2.2fr 0.9fr 0.65fr 0.65fr 0.65fr 1.4fr;
}

.client-geo-row {
  grid-template-columns: 1.1fr 1.3fr 1.6fr 0.75fr;
}

.form-row--4col {
  grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 900px) {
  .client-address-row-1,
  .client-geo-row,
  .form-row--4col {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 560px) {
  .client-address-row-1,
  .client-geo-row,
  .form-row--4col {
    grid-template-columns: 1fr;
  }
}

.geo-select-group {
  display: flex;
  gap: 0.35rem;
  align-items: stretch;
}

.geo-select-group .form-select {
  flex: 1;
  min-width: 0;
}

.btn-geo-plus {
  min-width: 38px;
  min-height: 42px;
  padding: 0 0.55rem;
  border-radius: var(--radius-sm);
  border: 1px solid #e6dec8;
  background: #faf8f2;
  color: var(--gold-dark);
  font-size: 1.1rem;
  font-weight: 800;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-geo-plus:hover {
  background: #f3eedf;
  border-color: var(--gold-main);
}

.phone-intl-group {
  display: flex;
  align-items: stretch;
  gap: 0.5rem;
  inline-size: 100%;
}

.phone-intl-group .phone-country-select {
  flex: 0 0 auto;
  inline-size: clamp(152px, 34%, 205px);
  font-weight: 600;
  padding-inline-end: 1.9rem;
}

.phone-intl-group .phone-local-input {
  flex: 1 1 0%;
  min-inline-size: 0;
}

@media (max-width: 520px) {
  .phone-intl-group {
    gap: 0.35rem;
  }

  .phone-intl-group .phone-country-select {
    inline-size: 144px;
    font-size: 0.84rem;
  }
}

/* Balance badges in Clientes & Cuentas Corrientes tables */
.saldo-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.65rem;
  border-radius: 8px;
  font-size: 0.84rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.saldo-badge--deudor {
  background: #fef2f2;
  color: var(--danger);
  border: 1px solid #fecaca;
}

.saldo-badge--cero {
  background: #f1f5f9;
  color: var(--silver-muted);
  border: 1px solid #e2e8f0;
}

.saldo-badge--favor {
  background: var(--success-bg);
  color: var(--success);
  border: 1px solid rgba(21, 128, 61, 0.35);
}

/* Responsive stacked labels for Clientes & Cuentas Corrientes tables
   (modern-web-guidance: responsive-table) */
.clientes-table {
  --label-doc: "Doc. / IVA";
  --label-dom: "Domicilio / Loc.";
  --label-tel: "Teléfono / Email";
  --label-lista: "Lista / Pago";
  --label-web: "Acceso Web";
  --label-saldo: "Saldo Cta. Cte.";
  --label-acc: "Acciones";
}

.ctacte-summary-table {
  --label-cuit: "CUIT / IVA";
  --label-cond: "Condición Cta. Cte.";
  --label-debe: "Total Debe";
  --label-haber: "Total Haber";
  --label-saldo: "Saldo Actual";
  --label-ult: "Último Mov.";
  --label-acc: "Acciones";
}

@container (max-width: 820px) {
  .clientes-table td:nth-of-type(1)::before { content: var(--label-doc); }
  .clientes-table td:nth-of-type(2)::before { content: var(--label-dom); }
  .clientes-table td:nth-of-type(3)::before { content: var(--label-tel); }
  .clientes-table td:nth-of-type(4)::before { content: var(--label-lista); }
  .clientes-table td:nth-of-type(5)::before { content: var(--label-web); }
  .clientes-table td:nth-of-type(6)::before { content: var(--label-saldo); }
  .clientes-table td:nth-of-type(7)::before { content: var(--label-acc); }

  .ctacte-summary-table td:nth-of-type(1)::before { content: var(--label-cuit); }
  .ctacte-summary-table td:nth-of-type(2)::before { content: var(--label-cond); }
  .ctacte-summary-table td:nth-of-type(3)::before { content: var(--label-debe); }
  .ctacte-summary-table td:nth-of-type(4)::before { content: var(--label-haber); }
  .ctacte-summary-table td:nth-of-type(5)::before { content: var(--label-saldo); }
  .ctacte-summary-table td:nth-of-type(6)::before { content: var(--label-ult); }
  .ctacte-summary-table td:nth-of-type(7)::before { content: var(--label-acc); }
}

/* ==========================================================================
   MÓDULO DE FACTURACIÓN: COMPROBANTE DE VENTA - NUEVO/A
   ========================================================================== */
.fact-window {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  overflow: visible;
}

.fact-header-panel {
  display: grid;
  grid-template-columns: 1.35fr 92px 1.05fr 1.35fr;
  gap: 0.75rem;
  padding: 0.85rem 1rem;
  background: #f8fafc;
  border-block-end: 1px solid #e2e8f0;
  align-items: stretch;
}

@media (max-width: 1180px) {
  .fact-header-panel {
    grid-template-columns: 1fr 92px;
  }
}

@media (max-width: 680px) {
  .fact-header-panel {
    grid-template-columns: 1fr;
  }
}

.fact-fieldset {
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-sm);
  padding: 0.55rem 0.65rem;
  margin: 0;
  background: #ffffff;
  display: flex;
  flex-direction: column;
  gap: 0.42rem;
}

.fact-field-row {
  display: grid;
  grid-template-columns: 92px 1fr;
  align-items: center;
  gap: 0.45rem;
}

.fact-lbl {
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--silver-main);
  white-space: nowrap;
}

.fact-lbl-inline {
  font-size: 0.74rem;
  font-weight: 700;
  color: var(--silver-muted);
  white-space: nowrap;
}

.fact-control {
  min-height: 34px;
  padding: 0.3rem 0.55rem;
  font-size: 0.83rem;
}

.fact-readonly-box {
  background: #f1f5f9;
  color: var(--silver-muted);
}

.fact-cli-picker {
  display: grid;
  grid-template-columns: 68px 1fr;
  gap: 0.35rem;
}

.fact-cli-code-inp {
  text-align: center;
  font-weight: 800;
  color: var(--gold-dark);
}

.fact-cli-search-wrap {
  position: relative;
}

.fact-doc-strip {
  display: grid;
  grid-template-columns: 62px 120px 1fr;
  gap: 0.35rem;
  align-items: center;
}

.fact-cli-actions-strip {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.fact-cli-actions-strip .btn-geo-plus {
  min-height: 34px;
  padding: 0.25rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 700;
  gap: 0.35rem;
}

.fact-calle-strip {
  display: grid;
  grid-template-columns: 1fr auto 74px;
  gap: 0.35rem;
  align-items: center;
}

.fact-letra-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #fef9e7;
  border: 2px solid var(--gold-border);
  border-radius: var(--radius-sm);
  padding: 0.4rem;
}

.fact-letra-box {
  font-size: 3.1rem;
  font-weight: 900;
  line-height: 1;
  color: var(--gold-dark);
}

.fact-letra-sub {
  font-size: 0.66rem;
  font-weight: 700;
  color: var(--silver-muted);
  margin-block-start: 0.25rem;
  text-transform: uppercase;
}

.fact-numero-strip {
  display: grid;
  grid-template-columns: 64px 108px auto 96px;
  gap: 0.32rem;
  align-items: center;
}

.fact-pv-box,
.fact-correlativo-box {
  font-weight: 800;
  text-align: center;
  color: var(--gold-dark);
  font-variant-numeric: tabular-nums;
}

.fact-field-row[hidden] {
  display: none !important;
}

.fact-fieldset--total-cliente {
  justify-content: center;
  align-items: stretch;
  background: linear-gradient(135deg, #fefce8 0%, #fde68a 100%);
  border: 2.5px solid var(--gold-main);
  padding: 0.85rem 1.35rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 6px 18px rgba(180, 130, 15, 0.14);
}

[data-theme="dark"] .fact-fieldset--total-cliente {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.18) 0%, rgba(180, 83, 9, 0.28) 100%);
  border-color: rgba(212, 175, 55, 0.68);
}

.fact-header-total-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 0.35rem;
  height: 100%;
  text-align: right;
}

.fact-header-total-label {
  font-size: clamp(1.08rem, 1.35vw, 1.32rem);
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #92400e;
}

[data-theme="dark"] .fact-header-total-label {
  color: #fde68a;
}

.fact-header-total-amount {
  display: inline-flex;
  align-items: baseline;
  gap: 0.38rem;
  font-size: clamp(2.85rem, 4.3vw, 4.15rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}

[data-theme="dark"] .fact-header-total-amount {
  color: #ffffff;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

.fact-header-total-currency {
  font-size: 0.8em;
  font-weight: 900;
  color: #b45309;
}

[data-theme="dark"] .fact-header-total-currency {
  color: #fbbf24;
}

.fact-deposito-banner {
  background: #fef9e7;
  border: 1px solid var(--gold-border);
  color: var(--gold-dark);
  font-size: 0.74rem;
  font-weight: 800;
  text-align: center;
  padding: 0.22rem 0.5rem;
  border-radius: 5px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.fact-deposito-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 0.35rem;
}

/* Banda "Facturación con despacho" */
.fact-section-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.6rem;
  padding: 0.42rem 1rem;
  background: linear-gradient(90deg, rgba(21, 128, 61, 0.08), rgba(212, 160, 23, 0.14));
  border-block-end: 1px solid #e2e8f0;
}

.fact-band-title {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.85rem;
  font-weight: 800;
  color: var(--silver-bright);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.fact-mult-pill {
  background: var(--gold-main);
  color: #ffffff;
  font-weight: 900;
  font-size: 0.76rem;
  padding: 0.14rem 0.55rem;
  border-radius: 999px;
}

.fact-quick-mults {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.fact-mult-hint {
  font-size: 0.74rem;
  color: var(--silver-main);
}

.fact-mult-hint code {
  color: var(--gold-dark);
  font-weight: 800;
}

.btn-mult-chip {
  background: #faf8f2;
  border: 1px solid #e6dec8;
  color: var(--gold-dark);
  border-radius: 6px;
  padding: 0.18rem 0.52rem;
  font-size: 0.75rem;
  font-weight: 800;
  cursor: pointer;
  transition: background 0.15s, transform 0.1s;
}

.btn-mult-chip:hover,
.btn-mult-chip.is-active {
  background: var(--gold-main);
  border-color: var(--gold-main);
  color: #ffffff;
}

/* Grilla de Facturación */
.fact-grid-container {
  position: relative;
  min-height: 250px;
  background: #ffffff;
}

.fact-table-wrapper {
  min-height: 250px;
  max-height: 360px;
  border: none;
  border-radius: 0;
}

.fact-items-table th,
.fact-items-table td {
  padding: 0.4rem 0.55rem;
  font-size: 0.84rem;
}

.fact-entry-row {
  background: #fef9e7 !important;
}

.fact-code-input-wrap {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  background: #eff6ff;
  border: 2px solid var(--gold-main);
  border-radius: 6px;
  padding: 0.1rem 0.35rem;
}

.fact-inline-mult-badge {
  background: var(--gold-main);
  color: #ffffff;
  font-weight: 900;
  font-size: 0.75rem;
  padding: 0.1rem 0.38rem;
  border-radius: 4px;
  cursor: pointer;
  user-select: none;
}

.fact-code-entry-input {
  border: none !important;
  background: transparent !important;
  color: #1e293b !important;
  font-weight: 800;
  font-size: 0.9rem;
  min-height: 30px;
  padding: 0.15rem 0.2rem;
  width: 100%;
  outline: none !important;
}

.fact-code-entry-input::placeholder {
  color: #64748b;
  font-weight: 600;
}

.fact-art-entry-input {
  min-height: 32px;
  padding: 0.25rem 0.55rem;
  font-size: 0.83rem;
}

.fact-generic-name-input {
  min-height: 32px;
  padding: 0.25rem 0.55rem;
  font-size: 0.84rem;
  font-weight: 800;
  text-transform: uppercase;
  border: 1.5px solid var(--gold-main);
  background: #fffbeb;
  color: #0f172a;
}

[data-theme="dark"] .fact-generic-name-input {
  background: rgba(212, 175, 55, 0.14);
  color: #ffffff;
  border-color: var(--gold-main);
}

.fact-num-input {
  min-height: 32px;
  padding: 0.2rem 0.45rem;
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* Autocompletado de artículos (Ventana Emergente Flotante) y clientes en Facturación */
.fact-autocomplete-list {
  position: absolute;
  inset-inline: 0;
  top: calc(100% + 4px);
  z-index: 60;
  max-height: 260px;
  overflow-y: auto;
  background: #ffffff;
  border: 1px solid var(--gold-main);
  border-radius: var(--radius-sm);
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.15);
}

.fact-suggestions-popover {
  position: fixed;
  top: 76px;
  left: 50%;
  transform: translateX(-50%);
  width: min(920px, 95vw);
  max-height: min(460px, calc(100vh - 100px));
  z-index: 9500;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #ffffff;
  border: 2px solid var(--gold-main);
  border-radius: 12px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.38), 0 0 0 100vmax rgba(15, 23, 42, 0.18);
}

.fact-suggestions-popover[hidden] {
  display: none !important;
}

.fact-sug-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding: 0.55rem 0.9rem;
  background: linear-gradient(135deg, #fef9e7 0%, #f8fafc 100%);
  border-block-end: 1px solid var(--gold-border);
  flex-shrink: 0;
}

.fact-sug-modal-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.84rem;
  font-weight: 800;
  color: var(--gold-dark);
}

.fact-sug-modal-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  color: var(--silver-muted);
}

.fact-sug-modal-close {
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: var(--silver-bright);
  border-radius: 6px;
  padding: 0.18rem 0.55rem;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
}

.fact-sug-modal-close:hover {
  border-color: var(--danger);
  color: var(--danger);
}

.fact-sug-modal-list {
  overflow-y: auto;
  max-height: min(395px, calc(100vh - 160px));
  overscroll-behavior: contain;
}

.fact-sug-item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.55rem 0.9rem;
  border: none;
  border-block-end: 1px solid #f1f5f9;
  background: transparent;
  color: var(--silver-bright);
  text-align: left;
  cursor: pointer;
  font-size: 0.85rem;
}

.fact-sug-item:hover,
.fact-sug-item.is-highlighted {
  background: #fef9e7;
}

.fact-stock-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 900;
}

.fact-stock-dot--ok {
  background: rgba(21, 128, 61, 0.14);
  color: #15803d;
  border: 1px solid rgba(21, 128, 61, 0.35);
}

.fact-stock-dot--low {
  background: rgba(234, 88, 12, 0.14);
  color: #c2410c;
  border: 1px solid rgba(234, 88, 12, 0.35);
}

/* Pie de Facturación (Totales y Observación) */
.fact-footer-panel {
  border-block-start: 1px solid #e2e8f0;
  background: #f8fafc;
  padding: 0.75rem 1rem 0.65rem;
}

.fact-footer-tabs {
  display: flex;
  gap: 0.35rem;
  margin-block-end: 0.65rem;
  border-block-end: 1px solid #e2e8f0;
  padding-block-end: 0.35rem;
}

.fact-tab-btn {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  color: var(--silver-muted);
  padding: 0.3rem 0.85rem;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
}

.fact-tab-btn.is-active {
  background: #fef9e7;
  border-color: var(--gold-main);
  color: var(--gold-dark);
}

.fact-footer-body {
  display: grid;
  grid-template-columns: 1fr 250px;
  gap: 1rem;
  align-items: center;
}

@media (max-width: 960px) {
  .fact-footer-body {
    grid-template-columns: 1fr;
  }
}

.fact-totals-matrix {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0.5rem;
}

@media (max-width: 960px) {
  .fact-totals-matrix {
    grid-template-columns: repeat(3, 1fr);
  }
  .fact-tot-spacer {
    display: none;
  }
}

@media (max-width: 540px) {
  .fact-totals-matrix {
    grid-template-columns: repeat(2, 1fr);
  }
}

.fact-tot-box {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.fact-tot-lbl {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--silver-main);
  text-align: center;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  padding: 0.15rem 0.35rem;
}

.fact-tot-val {
  min-height: 32px;
  padding: 0.2rem 0.45rem;
  text-align: right;
  font-weight: 800;
  font-size: 0.85rem;
  font-variant-numeric: tabular-nums;
  background: #ffffff;
}

.fact-tot-val--editable {
  border-color: var(--gold-border);
  color: var(--gold-dark);
}

.fact-dto-pair {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 0.25rem;
}

.fact-grand-total-box {
  border: 2px solid var(--gold-main);
  border-radius: var(--radius-sm);
  background: #fef9e7;
  overflow: hidden;
  text-align: right;
}

.fact-grand-total-lbl {
  background: rgba(212, 160, 23, 0.18);
  color: var(--gold-dark);
  font-size: 0.82rem;
  font-weight: 900;
  text-align: center;
  padding: 0.28rem 0.5rem;
  border-block-end: 1px solid var(--gold-border);
  letter-spacing: 0.06em;
}

.fact-grand-total-val {
  font-size: 1.85rem;
  font-weight: 900;
  color: #1e293b;
  padding: 0.55rem 0.85rem;
  font-variant-numeric: tabular-nums;
}

.fact-actions-bar {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  margin-block-start: 0.85rem;
  padding-block-top: 0.65rem;
  border-block-start: 1px solid #e2e8f0;
}

.fact-btn-accept,
.fact-btn-cancel {
  width: auto;
  min-width: 170px;
  min-height: 40px;
  font-size: 0.88rem;
}

.fact-status-strip {
  display: grid;
  grid-template-columns: 130px 1.2fr 1.5fr 1.5fr;
  gap: 0.5rem;
  margin-block-start: 0.65rem;
  padding: 0.32rem 0.65rem;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 5px;
  font-size: 0.73rem;
  font-weight: 700;
  color: var(--silver-muted);
}

@media (max-width: 760px) {
  .fact-status-strip {
    grid-template-columns: 1fr 1fr;
  }
}

/* ==========================================================================
   SECTOR FIDELIZACIÓN DE CLIENTES (PUNTOS + CATÁLOGO DE CANJE + WHATSAPP)
   ========================================================================== */
.pos-fid-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 2.25rem;
  margin-block-top: 0.65rem;
  padding: 0.5rem 1rem;
  background: linear-gradient(90deg, rgba(212, 160, 23, 0.14) 0%, rgba(21, 128, 61, 0.08) 100%);
  border: 1px solid rgba(212, 160, 23, 0.35);
  border-radius: 6px;
  font-size: 0.92rem;
}

.pos-fid-strip-left,
.pos-fid-strip-right {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.fid-client-banner {
  background: linear-gradient(135deg, #ffffff 0%, #fef9e7 100%);
  border: 1px solid rgba(212, 160, 23, 0.45);
  border-radius: var(--radius-md);
  padding: 1.15rem 1.25rem;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
}

.fid-client-summary-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 1.25rem;
  align-items: center;
  padding-block-end: 1rem;
  border-block-end: 1px solid #e2e8f0;
}

@media (max-width: 900px) {
  .fid-client-summary-grid {
    grid-template-columns: 1fr;
  }
}

.fid-points-pill-box {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.65rem;
}

@media (max-width: 600px) {
  .fid-points-pill-box {
    grid-template-columns: 1fr;
  }
}

.fid-points-stat {
  background: #ffffff;
  border: 1px solid rgba(212, 160, 23, 0.35);
  border-radius: 8px;
  padding: 0.65rem 0.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0.15rem;
}

.fid-points-stat--muted {
  border-color: #e2e8f0;
}

.fid-points-stat-lbl {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: var(--silver-muted);
}

.fid-big-points {
  font-size: 1.65rem;
  font-weight: 900;
  color: var(--gold-dark);
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}

.fid-mid-points {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}

.fid-points-stat-sub {
  font-size: 0.72rem;
  color: var(--text-secondary);
}

.fid-contact-config-bar {
  margin-block-top: 0.9rem;
}

.fid-channel-radios {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding-block-top: 0.25rem;
}

.fid-radio-row {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  padding: 0.55rem 0.75rem;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: 0.85rem;
  cursor: pointer;
}

.fid-radio-row:hover {
  border-color: var(--gold-main);
}

.fid-ops-2col {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 1.25rem;
  align-items: start;
}

@media (max-width: 1024px) {
  .fid-ops-2col {
    grid-template-columns: 1fr;
  }
}

.fid-calc-preview-box {
  background: #f8fafc;
  border: 1px solid rgba(212, 160, 23, 0.35);
  border-radius: 8px;
  padding: 0.85rem 1rem;
  margin-block: 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.fid-calc-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.85rem;
  color: var(--text-secondary);
}

.fid-calc-row--highlight {
  padding-block: 0.4rem;
  border-block: 1px solid #e2e8f0;
  color: var(--text-primary);
  font-weight: 700;
}

.fid-calc-points {
  font-size: 1.35rem;
  font-weight: 900;
  color: var(--success);
  font-variant-numeric: tabular-nums;
}

.fid-canje-cards-scroll {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  max-height: 360px;
  overflow-y: auto;
  padding-inline-end: 0.25rem;
}

.fid-canje-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.65rem 0.85rem;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.fid-canje-card:hover {
  border-color: var(--gold-main);
  background: #fdfaf0;
}

.fid-canje-card--disabled {
  opacity: 0.58;
}

.fid-canje-card-title {
  font-size: 0.88rem;
  font-weight: 800;
  color: var(--text-primary);
}

.fid-canje-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  font-size: 0.76rem;
  color: var(--silver-muted);
  margin-block-top: 0.2rem;
}

.fid-canje-card-right {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.fid-pts-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  background: #fef9e7;
  border: 1px solid rgba(212, 160, 23, 0.45);
  color: var(--gold-dark);
  font-weight: 800;
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* ==========================================================================
   MODO FONDO OSCURO (POR USUARIO: html[data-theme="dark"])
   ========================================================================== */
html[data-theme="dark"] {
  --bg-obsidian: #090a0d;
  --bg-surface: #12141b;
  --bg-elevated: #181b24;
  --bg-glass: rgba(18, 20, 27, 0.9);
  --gold-light: #f5d77f;
  --gold-main: #d4af37;
  --gold-dark: #f5d77f;
  --gold-border: rgba(212, 175, 55, 0.35);
  --gold-glow: rgba(212, 175, 55, 0.18);
  --silver-bright: #f2f4f8;
  --silver-main: #d0d5dd;
  --silver-muted: #8e96a4;
  --text-primary: #f2f4f8;
  --text-secondary: #d0d5dd;
  --danger: #fca5a5;
  --danger-bg: rgba(240, 82, 82, 0.12);
  --success: #31c48d;
  --success-bg: rgba(49, 196, 141, 0.12);
  --shadow-card: 0 24px 60px rgba(0, 0, 0, 0.65), 0 0 0 1px var(--gold-border);
}

html[data-theme="dark"] body {
  background-color: var(--bg-obsidian);
  background-image:
    radial-gradient(circle at 50% 0%, rgba(212, 175, 55, 0.14) 0%, transparent 55%),
    radial-gradient(circle at 85% 90%, rgba(212, 175, 55, 0.08) 0%, transparent 45%),
    linear-gradient(180deg, #0c0d12 0%, #07080b 100%);
  background-attachment: fixed;
}

html[data-theme="dark"] .auth-card {
  background: var(--bg-glass);
  backdrop-filter: blur(16px);
  border-color: var(--gold-border);
  box-shadow: var(--shadow-card);
}

html[data-theme="dark"] .auth-card::before {
  display: block;
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold-light), var(--gold-main), transparent);
}

html[data-theme="dark"] .brand-title {
  color: #ffffff;
}

html[data-theme="dark"] .brand-subtitle {
  color: var(--gold-main);
}

html[data-theme="dark"] .form-input,
html[data-theme="dark"] .form-select {
  border-color: rgba(208, 213, 221, 0.22);
  background-color: rgba(9, 10, 13, 0.9);
  color: var(--silver-bright);
}

html[data-theme="dark"] .form-input:focus,
html[data-theme="dark"] .form-select:focus {
  background-color: #141720;
  border-color: var(--gold-main);
  box-shadow: 0 0 0 3px var(--gold-glow);
}

html[data-theme="dark"] .form-alert {
  background: var(--danger-bg);
  border-color: rgba(240, 82, 82, 0.45);
  color: #ffb4b4;
}

html[data-theme="dark"] .btn-primary {
  border: 1px solid var(--gold-light);
  background: linear-gradient(135deg, #f5d77f 0%, #d4af37 50%, #997419 100%);
  color: #090a0d;
  font-weight: 800;
  box-shadow: 0 6px 18px rgba(212, 175, 55, 0.24);
}

html[data-theme="dark"] .btn-primary:hover:not(:disabled) {
  background: linear-gradient(135deg, #f5d77f 0%, #d4af37 50%, #997419 100%);
  filter: brightness(1.07);
}

html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-pwa,
html[data-theme="dark"] .btn-page,
html[data-theme="dark"] .btn-back-home,
html[data-theme="dark"] .btn-geo-plus {
  border-color: var(--gold-border);
  background: rgba(212, 175, 55, 0.12);
  color: var(--gold-light);
}

html[data-theme="dark"] .btn-secondary:hover,
html[data-theme="dark"] .btn-back-home:hover,
html[data-theme="dark"] .btn-geo-plus:hover {
  background: rgba(212, 175, 55, 0.22);
  color: var(--gold-light);
}

html[data-theme="dark"] .pwa-banner,
html[data-theme="dark"] .auth-client-reg-box,
html[data-theme="dark"] .module-back-bar,
html[data-theme="dark"] .catalog-toolbar-row--bottom,
html[data-theme="dark"] .smart-candidates-panel,
html[data-theme="dark"] .fact-actions-bar,
html[data-theme="dark"] .fid-client-summary-grid,
html[data-theme="dark"] .fid-calc-row--highlight {
  border-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .erp-topbar {
  background: linear-gradient(90deg, #2b303c 0%, #374151 50%, #2b303c 100%);
  border-block-end: 2px solid rgba(212, 175, 55, 0.5);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] .topbar-brand:hover {
  background: rgba(212, 175, 55, 0.1);
}

html[data-theme="dark"] .topbar-titles h1 {
  color: var(--silver-bright);
}

html[data-theme="dark"] .omnibox-input {
  border-color: rgba(212, 175, 55, 0.32);
  background: rgba(18, 20, 27, 0.92);
  color: var(--silver-bright);
}

html[data-theme="dark"] .omnibox-input:focus {
  border-color: var(--gold-light);
  background: var(--bg-elevated);
}

html[data-theme="dark"] .omnibox-kbd {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  color: var(--silver-muted);
}

html[data-theme="dark"] .omnibox-dropdown {
  background: #12141c;
  border-color: var(--gold-border);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.65);
}

html[data-theme="dark"] .omnibox-item:hover,
html[data-theme="dark"] .omnibox-item.is-highlighted {
  background: rgba(212, 175, 55, 0.16);
}

html[data-theme="dark"] .omnibox-item-badge,
html[data-theme="dark"] .badge--gold,
html[data-theme="dark"] .tabs-uppercase-badge,
html[data-theme="dark"] .fid-pts-badge {
  background: rgba(212, 175, 55, 0.16);
  color: var(--gold-light);
  border-color: var(--gold-border);
}

html[data-theme="dark"] .nav-tab {
  border-color: rgba(255, 255, 255, 0.08);
  background: var(--bg-surface);
  color: var(--silver-main);
}

html[data-theme="dark"] .nav-tab:hover {
  border-color: var(--gold-border);
  color: var(--silver-bright);
  background: var(--bg-elevated);
}

html[data-theme="dark"] .nav-tab.is-active {
  background: linear-gradient(135deg, rgba(245, 215, 127, 0.22), rgba(212, 175, 55, 0.12));
  border-color: var(--gold-main);
  color: var(--gold-light);
}

html[data-theme="dark"] .user-pill {
  background: var(--bg-elevated);
  border-color: rgba(212, 175, 55, 0.28);
}

html[data-theme="dark"] .user-avatar {
  background: linear-gradient(135deg, var(--gold-light), #997419);
  color: #090a0d;
}

html[data-theme="dark"] .user-meta strong {
  color: var(--silver-bright);
}

html[data-theme="dark"] .btn-logout,
html[data-theme="dark"] .btn-remove-row,
html[data-theme="dark"] .saldo-badge--deudor {
  border-color: rgba(240, 82, 82, 0.4);
  background: rgba(240, 82, 82, 0.14);
  color: #fca5a5;
}

html[data-theme="dark"] .kpi-box,
html[data-theme="dark"] .price-config-card,
html[data-theme="dark"] .sub-panel,
html[data-theme="dark"] .price-list-card,
html[data-theme="dark"] .fid-canje-card {
  background: var(--bg-surface);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: none;
}

html[data-theme="dark"] .module-card {
  background: var(--bg-surface);
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.48), 0 3px 8px rgba(0, 0, 0, 0.32);
}

html[data-theme="dark"] .module-card:hover {
  border-color: var(--gold-border);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.65), 0 4px 12px rgba(212, 175, 55, 0.18);
}

html[data-theme="dark"] .module-icon {
  background: rgba(212, 175, 55, 0.14);
  border-color: var(--gold-border);
  color: var(--gold-light);
}

html[data-theme="dark"] .kpi-box--gold {
  border-color: var(--gold-border);
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.14), var(--bg-surface));
}

html[data-theme="dark"] .catalog-toolbar {
  background: var(--bg-surface);
  border-color: var(--gold-border);
  box-shadow: none;
}

html[data-theme="dark"] .btn-clear-search {
  background: rgba(255, 255, 255, 0.1);
  color: var(--silver-bright);
}

html[data-theme="dark"] .table-wrapper {
  background: var(--bg-surface);
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] .catalog-table thead th {
  background: #171a24;
  color: var(--gold-light);
  border-block-end: 1px solid var(--gold-border);
}

html[data-theme="dark"] .catalog-table tbody th,
html[data-theme="dark"] .catalog-table tbody td {
  border-block-end: 1px solid rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .catalog-table tbody th {
  background: var(--bg-surface);
  border-inline-end: 1px solid rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .catalog-table tbody tr:hover th,
html[data-theme="dark"] .catalog-table tbody tr:hover td {
  background-color: #1a1e29;
}

html[data-theme="dark"] .erp-dialog {
  border-color: var(--gold-main);
  background: var(--bg-surface);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.85);
}

html[data-theme="dark"] .dialog-header,
html[data-theme="dark"] .dialog-footer {
  background: #161922;
  border-color: var(--gold-border);
}

html[data-theme="dark"] .dialog-title-wrap h2,
html[data-theme="dark"] .section-header-card h2,
html[data-theme="dark"] .welcome-hero h2 {
  color: var(--silver-bright);
}

html[data-theme="dark"] .btn-icon-close {
  border-color: rgba(255, 255, 255, 0.14);
  background: transparent;
  color: var(--silver-bright);
}

html[data-theme="dark"] .erp-fieldset,
html[data-theme="dark"] .fact-fieldset {
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(9, 10, 13, 0.45);
}

html[data-theme="dark"] .config-precios-bar {
  background: rgba(212, 175, 55, 0.08);
  border-color: var(--gold-border);
}

html[data-theme="dark"] .section-header-card,
html[data-theme="dark"] .welcome-hero {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.14) 0%, var(--bg-surface) 65%);
  border-color: var(--gold-border);
  box-shadow: none;
}

html[data-theme="dark"] .erp-tabs-bar {
  background: #141720;
  border-bottom-color: var(--gold-border);
}

html[data-theme="dark"] .erp-tab-btn {
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.03);
  color: var(--silver-muted);
}

html[data-theme="dark"] .erp-tab-btn.is-active {
  background: var(--bg-elevated);
  color: var(--gold-light);
  border-color: var(--gold-main);
}

html[data-theme="dark"] .phone-intl-group .phone-country-select {
  background-color: var(--bg-input);
  color: var(--silver-bright);
  border-color: var(--border-input);
}

html[data-theme="dark"] .saldo-badge--cero {
  background: rgba(255, 255, 255, 0.05);
  color: var(--silver-muted);
  border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .fact-window {
  background: var(--bg-surface);
  border-color: var(--gold-border);
}

html[data-theme="dark"] .fact-header-panel {
  background: linear-gradient(180deg, rgba(24, 27, 36, 0.96), rgba(16, 18, 25, 0.96));
  border-block-end-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .fact-readonly-box {
  background: rgba(255, 255, 255, 0.04);
  color: var(--silver-muted);
}

html[data-theme="dark"] .fact-letra-column {
  background: rgba(9, 10, 13, 0.75);
  border-color: var(--gold-border);
}

html[data-theme="dark"] .fact-deposito-banner,
html[data-theme="dark"] .btn-mult-chip {
  background: rgba(212, 175, 55, 0.14);
  border-color: var(--gold-border);
  color: var(--gold-light);
}

html[data-theme="dark"] .fact-grid-container {
  background: #0b0d13;
}

html[data-theme="dark"] .fact-entry-row {
  background: rgba(212, 175, 55, 0.09) !important;
}

html[data-theme="dark"] .fact-code-input-wrap {
  background: #0d47a1;
  border-color: var(--gold-light);
}

html[data-theme="dark"] .fact-inline-mult-badge {
  background: var(--gold-light);
  color: #090a0d;
}

html[data-theme="dark"] .fact-code-entry-input {
  color: #ffffff !important;
}

html[data-theme="dark"] .fact-code-entry-input::placeholder {
  color: rgba(255, 255, 255, 0.65);
}

html[data-theme="dark"] .fact-suggestions-popover,
html[data-theme="dark"] .fact-autocomplete-list {
  background: #141822;
  border-color: var(--gold-main);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.85), 0 0 0 100vmax rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] .fact-sug-modal-header {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.16) 0%, #141822 100%);
  border-block-end-color: var(--gold-border);
}

html[data-theme="dark"] .fact-sug-modal-title {
  color: var(--gold-light);
}

html[data-theme="dark"] .fact-sug-modal-close {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.15);
  color: var(--silver-bright);
}

html[data-theme="dark"] .fact-sug-item {
  border-block-end-color: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .fact-sug-item:hover,
html[data-theme="dark"] .fact-sug-item.is-highlighted {
  background: rgba(212, 175, 55, 0.2);
}

html[data-theme="dark"] .fact-footer-panel {
  border-block-start-color: var(--gold-border);
  background: linear-gradient(180deg, #141720 0%, #0e1017 100%);
}

html[data-theme="dark"] .fact-footer-tabs {
  border-block-end-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .fact-tab-btn {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .fact-tab-btn.is-active {
  background: rgba(212, 175, 55, 0.18);
  border-color: var(--gold-main);
  color: var(--gold-light);
}

html[data-theme="dark"] .fact-tot-lbl {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
  color: var(--silver-muted);
}

html[data-theme="dark"] .fact-tot-val {
  background: rgba(9, 10, 13, 0.65);
}

html[data-theme="dark"] .fact-grand-total-box {
  background: rgba(9, 10, 13, 0.85);
}

html[data-theme="dark"] .fact-grand-total-lbl {
  background: rgba(212, 175, 55, 0.2);
  color: var(--gold-light);
}

html[data-theme="dark"] .fact-grand-total-val {
  color: #ffffff;
}

html[data-theme="dark"] .fact-status-strip {
  background: rgba(0, 0, 0, 0.45);
  border-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .fid-client-banner {
  background: linear-gradient(135deg, rgba(19, 21, 28, 0.96) 0%, rgba(28, 25, 18, 0.92) 100%);
  border-color: rgba(212, 175, 55, 0.45);
}

html[data-theme="dark"] .fid-points-stat,
html[data-theme="dark"] .fid-radio-row,
html[data-theme="dark"] .fid-calc-preview-box {
  background: rgba(9, 10, 13, 0.72);
  border-color: rgba(212, 175, 55, 0.28);
}

/* ==========================================================================
   PASO PREVIO DE CAJA: ¿TENÉS CLUB CACHITA? & CREDENCIAL QR
   ========================================================================== */
.topbar-caja-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.42rem 0.9rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #1f1f1f 0%, #2c2c2c 100%);
  border: 1.5px solid #d99b1e;
  color: #f7c651;
  font-size: 0.86rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(217, 155, 30, 0.22);
}

.club-previo-hero {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.75rem;
  background: #f7ebdf;
  border: 2px solid #d99b1e;
  border-radius: var(--radius-lg);
  padding: 1rem 2rem;
  text-align: left;
  margin-block-end: 1.25rem;
  box-shadow: 0 8px 22px rgba(217, 155, 30, 0.14);
}

.club-previo-mascot-wrap {
  flex-shrink: 0;
  width: 160px;
  height: 160px;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.club-previo-mascot {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.club-previo-hero-copy {
  max-width: 680px;
}

@media (max-width: 720px) {
  .club-previo-hero {
    flex-direction: column;
    text-align: center;
    padding: 1.25rem;
  }
}

.club-previo-heading {
  margin: 0 0 0.4rem;
  font-size: clamp(1.8rem, 3.2vw, 2.45rem);
  font-weight: 900;
  color: #1a1a1a;
  letter-spacing: -0.02em;
}

.club-previo-sub {
  margin: 0;
  max-width: 680px;
  font-size: 1rem;
  color: #3d352b;
  line-height: 1.45;
}

.club-previo-grid {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 1.35rem;
  align-items: stretch;
}

@media (max-width: 960px) {
  .club-previo-grid {
    grid-template-columns: 1fr;
  }
}

.club-previo-card {
  background: #ffffff;
  border: 1.5px solid #e6dac8;
  border-radius: var(--radius-lg);
  padding: 1.5rem 1.65rem;
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  box-shadow: 0 8px 24px rgba(26, 26, 26, 0.06);
}

.club-previo-card--member {
  background: linear-gradient(180deg, #fffdf9 0%, #fbf5eb 100%);
  border: 2px solid #d99b1e;
  border-top: 6px solid #d99b1e;
  box-shadow: 0 12px 28px rgba(217, 155, 30, 0.16);
}

.club-previo-card--invite {
  background: linear-gradient(180deg, #ffffff 0%, #faf6f0 100%);
  border: 1.5px solid #d8cbb8;
  border-top: 6px solid #1f1f1f;
}

.club-card-header--primary {
  background: linear-gradient(135deg, #1f1f1f 0%, #2d261a 100%);
  border: 1.5px solid #d99b1e;
  border-radius: var(--radius-md);
  padding: 1rem 1.25rem;
}

.club-card-header--primary .club-card-main-title {
  margin: 0 0 0.3rem;
  font-size: 1.55rem;
  font-weight: 900;
  color: #f5b935;
  letter-spacing: -0.01em;
}

.club-card-header--primary p {
  margin: 0;
  font-size: 0.92rem;
  color: #f3eadc;
}

.club-card-header--secondary {
  background: #f6ebe0;
  border: 1px solid #e2d1bc;
  border-radius: var(--radius-md);
  padding: 0.95rem 1.2rem;
}

.club-card-header--secondary .club-card-main-title {
  margin: 0 0 0.25rem;
  font-size: 1.35rem;
  font-weight: 900;
  color: #1f1f1f;
}

.club-card-header--secondary p {
  margin: 0;
  font-size: 0.88rem;
  color: #4a4035;
}

.club-member-dni-input {
  font-size: 1.12rem !important;
  min-height: 54px !important;
  border: 2px solid #d99b1e !important;
  background: #ffffff !important;
  font-weight: 700 !important;
}

.club-member-dni-input::placeholder {
  text-transform: lowercase !important;
  font-weight: 500 !important;
}

.club-btn-member-confirm {
  width: 100%;
  min-height: 54px;
  font-size: 1.06rem;
  font-weight: 800;
  background: linear-gradient(135deg, #d99b1e 0%, #b87f0d 100%);
  color: #141414;
  border: 1.5px solid #a87208;
  box-shadow: 0 6px 16px rgba(217, 155, 30, 0.28);
}

.club-member-detected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.95rem 1.15rem;
  border-radius: var(--radius-md);
  background: rgba(217, 155, 30, 0.12);
  border: 1.5px solid #d99b1e;
}

.club-member-detected-pts {
  text-align: right;
  display: flex;
  flex-direction: column;
}

.club-camera-box {
  background: #fdf9f3;
  border: 1px solid #d99b1e;
  border-radius: var(--radius-md);
  padding: 0.85rem;
  text-align: center;
}

.club-camera-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.6rem;
  font-size: 0.85rem;
}

.club-camera-video {
  width: 100%;
  max-width: 340px;
  max-height: 240px;
  border-radius: var(--radius-sm);
  background: #000;
  object-fit: cover;
}

.club-invite-qr-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0.75rem;
  padding: 1.15rem;
  border-radius: var(--radius-md);
  background: #f6ebe0;
  border: 1px solid #e2d1bc;
}

@media (max-width: 600px) {
  .club-invite-qr-box {
    flex-direction: column;
    text-align: center;
  }
}

.club-invite-qr-frame {
  flex-shrink: 0;
  background: #ffffff;
  padding: 0.6rem;
  border-radius: var(--radius-md);
  border: 2px solid #d99b1e;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.club-invite-qr-frame img {
  display: block;
  width: 170px;
  height: 170px;
}

.club-invite-qr-details {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.88rem;
}

.club-invite-link {
  color: var(--gold-dark);
  font-weight: 700;
  word-break: break-all;
}

.club-btn-skip {
  width: 100%;
  min-height: 54px;
  font-size: 1rem;
  font-weight: 800;
  border: 2px solid #1f1f1f;
  background: #1f1f1f;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
}

.club-btn-skip:hover {
  background: #2f2f2f;
  border-color: #d99b1e;
  color: #f7c651;
}

.club-skip-kbd {
  display: inline-block;
  padding: 0.18rem 0.5rem;
  border-radius: 6px;
  background: rgba(217, 155, 30, 0.22);
  border: 1px solid #d99b1e;
  color: #f7c651;
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 800;
}

.club-credential-card {
  background: linear-gradient(145deg, #fffdf7 0%, #f9f3df 100%);
  border: 2px solid var(--gold-main);
  border-radius: var(--radius-lg);
  padding: 1.25rem;
  max-width: 360px;
  margin: 0 auto;
  box-shadow: 0 10px 24px rgba(212, 160, 23, 0.16);
}

.club-credential-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.76rem;
  font-weight: 800;
  color: var(--gold-dark);
  border-bottom: 1px solid rgba(212, 160, 23, 0.3);
  padding-bottom: 0.55rem;
  margin-bottom: 0.85rem;
}

.club-credential-qr-wrap {
  background: #ffffff;
  padding: 0.65rem;
  border-radius: var(--radius-md);
  border: 1px solid #e6dec8;
  display: inline-block;
}

.club-credential-qr-wrap canvas {
  display: block;
  width: 220px;
  height: 220px;
}

.club-credential-meta h3 {
  margin: 0.75rem 0 0.2rem;
  font-size: 1.1rem;
  color: #1e293b;
}

.club-credential-meta p {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 0.88rem;
  color: #475569;
  font-weight: 700;
}

html[data-theme="dark"] .club-previo-hero {
  background: #f7ebdf;
  border-color: #d99b1e;
}

html[data-theme="dark"] .club-previo-heading {
  color: #1a1a1a;
}

html[data-theme="dark"] .club-previo-sub {
  color: #4a4035;
}

html[data-theme="dark"] .club-previo-card {
  background: rgba(18, 20, 26, 0.95);
  border-color: rgba(217, 155, 30, 0.32);
}

html[data-theme="dark"] .club-card-header--secondary {
  background: rgba(246, 235, 224, 0.08);
  border-color: rgba(217, 155, 30, 0.28);
}

html[data-theme="dark"] .club-card-header--secondary .club-card-main-title {
  color: #f8efe4;
}

html[data-theme="dark"] .club-card-header--secondary p {
  color: #cbd5e1;
}

html[data-theme="dark"] .club-member-dni-input {
  background: rgba(9, 10, 13, 0.9) !important;
  color: #f8fafc !important;
}

html[data-theme="dark"] .club-invite-qr-box,
html[data-theme="dark"] .club-camera-box {
  background: rgba(9, 10, 13, 0.75);
  border-color: rgba(217, 155, 30, 0.35);
}

html[data-theme="dark"] .club-invite-link {
  color: var(--gold-light);
}

/* ==========================================================================
   VERIFICADOR DE PRECIOS — MODO SALÓN PARA CLIENTES (PANTALLA GIGANTE)
   ========================================================================== */
#sec-verificador-precios {
  background: #f4eae0 !important;
}

#sec-verificador-precios[hidden],
#sec-verificador-precios[hidden] .verificador-salon-stage,
#sec-verificador-precios[hidden] .verificador-salon-stage.is-salon-fullscreen {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  position: static !important;
}

.verificador-salon-stage {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center !important;
  justify-content: center !important;
  padding: 2rem;
  border-radius: var(--radius-lg);
  border: none !important;
  background: #f4eae0 !important;
  box-shadow: none !important;
  gap: 1.75rem;
  min-height: calc(100dvh - 120px);
}

.verificador-salon-stage:fullscreen,
.verificador-salon-stage.is-salon-fullscreen {
  position: fixed;
  inset: 0;
  z-index: 9999;
  min-height: 100dvh;
  height: 100dvh;
  width: 100vw;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0;
  border: none !important;
  padding: 2rem 3rem;
  background: #f4eae0 !important;
  overflow-y: auto;
}

.verificador-exit-fs-btn {
  position: absolute;
  top: 1.25rem;
  right: 1.5rem;
  z-index: 20;
}

.verificador-search-bar {
  display: block !important;
  position: relative;
  width: min(100%, 780px);
  z-index: 25;
  margin-block-end: 0.25rem;
}

.verificador-input-wrap {
  position: relative;
  display: flex !important;
  align-items: center;
  width: 100%;
}

.verificador-scan-icon {
  position: absolute;
  left: 1.15rem;
  color: #b47b09;
  pointer-events: none;
  z-index: 2;
}

.verificador-input {
  display: block !important;
  width: 100% !important;
  min-height: 58px !important;
  padding-inline: 3.2rem 2.8rem !important;
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  border-radius: 999px !important;
  border: 3px solid var(--gold-main) !important;
  background: #ffffff !important;
  color: #0f172a !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12) !important;
}

.verificador-input::placeholder {
  color: #64748b !important;
  opacity: 1;
}

.verificador-standby-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1rem 1.5rem;
  max-width: 980px;
  gap: 1.5rem;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.verificador-standby-logo {
  width: 150px;
  height: 150px;
  object-fit: contain;
  border-radius: 50%;
  margin-block-end: 1.25rem;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22);
}

.verificador-standby-title {
  margin: 0;
  font-size: clamp(2.4rem, 4.8vw, 3.8rem);
  font-weight: 900;
  letter-spacing: 0.04em;
  color: #9a6b00 !important;
}

.verificador-cachita-hero {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(1.5rem, 3.5vw, 3rem);
  flex-wrap: wrap;
}

.verificador-cachita-avatar-wrap {
  flex-shrink: 0;
  width: clamp(220px, 25vw, 300px);
  border-radius: 0 !important;
  border: none !important;
  outline: none !important;
  background: #f4eae0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  overflow: visible !important;
}

.verificador-cachita-img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  border: none !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: #f4eae0 !important;
  mix-blend-mode: normal;
  -webkit-mask-image: radial-gradient(ellipse 95% 95% at 50% 50%, #000 84%, transparent 100%);
  mask-image: radial-gradient(ellipse 95% 95% at 50% 50%, #000 84%, transparent 100%);
}

.verificador-speech-bubble {
  position: relative;
  width: fit-content;
  max-width: 495px;
  padding: clamp(1.35rem, 2.6vw, 2rem) clamp(1.1rem, 1.8vw, 1.45rem) clamp(1.35rem, 2.6vw, 2rem) clamp(1.5rem, 2.6vw, 2.1rem);
  border-radius: 28px;
  background: #ffffff !important;
  border: 3px solid var(--gold-main);
  box-shadow: 0 18px 44px rgba(212, 160, 23, 0.2);
  text-align: left;
}

.verificador-speech-bubble::before {
  content: "";
  position: absolute;
  left: -22px;
  top: 50%;
  transform: translateY(-50%);
  border-width: 16px 22px 16px 0;
  border-style: solid;
  border-color: transparent var(--gold-main) transparent transparent;
}

.verificador-speech-bubble::after {
  content: "";
  position: absolute;
  left: -16px;
  top: 50%;
  transform: translateY(-50%);
  border-width: 13px 18px 13px 0;
  border-style: solid;
  border-color: transparent #ffffff transparent transparent !important;
}

.verificador-speech-bubble p {
  margin: 0;
  font-size: clamp(1.35rem, 2.4vw, 1.95rem);
  font-weight: 500 !important;
  line-height: 1.35;
  color: #1e293b !important;
}

.verificador-speech-bubble p strong {
  font-weight: 900 !important;
  color: #000000 !important;
}

html[data-theme="dark"] .verificador-speech-bubble {
  background: #ffffff !important;
  box-shadow: 0 18px 44px rgba(212, 160, 23, 0.2);
}

html[data-theme="dark"] .verificador-speech-bubble::after {
  border-color: transparent #ffffff transparent transparent !important;
}

html[data-theme="dark"] .verificador-speech-bubble p {
  color: #1e293b !important;
}

html[data-theme="dark"] .verificador-speech-bubble p strong {
  color: #000000 !important;
}

@media (max-width: 780px) {
  .verificador-cachita-hero {
    flex-direction: column;
  }
  .verificador-speech-bubble {
    text-align: center;
  }
  .verificador-speech-bubble::before,
  .verificador-speech-bubble::after {
    display: none;
  }
}

.verificador-standby-sub {
  margin: 0;
  font-size: clamp(1.1rem, 2vw, 1.45rem);
  font-weight: 600;
  color: var(--silver-muted);
}

.verificador-result-card {
  display: grid;
  grid-template-columns: minmax(280px, 420px) 1fr;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
  width: min(100%, 1240px);
  padding: clamp(1.75rem, 3.5vw, 3.25rem);
  border-radius: 24px;
  background: var(--bg-elevated);
  border: 2px solid var(--gold-main);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.14);
}

.verificador-photo-frame {
  width: 100%;
  aspect-ratio: 1 / 1;
  max-width: 420px;
  margin-inline: auto;
  background: #ffffff;
  border-radius: 20px;
  border: 2px solid #e2e8f0;
  padding: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

.verificador-product-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #ffffff;
}

.verificador-info-col {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.75rem;
}

.verificador-product-name {
  margin: 0;
  font-size: clamp(2rem, 4.2vw, 3.6rem);
  font-weight: 900;
  line-height: 1.12;
  color: var(--silver-bright);
  text-wrap: balance;
}

.verificador-price-giant-box {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 1.2rem 2.2rem;
  border-radius: 22px;
  background: linear-gradient(135deg, #11131a 0%, #1e2230 100%);
  border: 3px solid var(--gold-main);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.25);
  align-self: flex-start;
}

.verificador-currency-symbol {
  font-size: clamp(2.4rem, 5vw, 4.4rem);
  font-weight: 900;
  color: var(--gold-light);
}

.verificador-price-giant {
  font-size: clamp(3.6rem, 8.2vw, 7.2rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #ffffff;
  font-variant-numeric: tabular-nums;
}

.verificador-notfound-card {
  text-align: center;
  padding: 2.5rem 2rem;
  border-radius: 20px;
  border: 2px solid rgba(220, 38, 38, 0.45);
  background: rgba(220, 38, 38, 0.08);
  max-width: 640px;
}

.verificador-notfound-card h3 {
  margin: 0 0 0.5rem;
  font-size: 2rem;
  color: var(--danger);
}

.verificador-notfound-card p {
  margin: 0;
  font-size: 1.15rem;
  color: var(--silver-bright);
}

html[data-theme="dark"] .verificador-standby-title {
  color: var(--gold-light);
}

html[data-theme="dark"] .verificador-result-card {
  background: #141822;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.75);
}

@media (max-width: 860px) {
  .verificador-result-card {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .verificador-photo-frame {
    max-width: 280px;
  }
  .verificador-price-giant-box {
    align-self: center;
  }
}

/* ==========================================================================
   MÓDULO DE ATAJOS DE TECLADO (CTRL + TECLA X)
   ========================================================================== */
.shortcut-builder-group {
  display: flex;
  align-items: stretch;
  gap: 0.5rem;
}

.shortcut-ctrl-fixed {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-inline: 1rem;
  border-radius: var(--radius-sm);
  border: 2px solid var(--gold-main);
  background: rgba(212, 160, 23, 0.14);
  color: var(--gold-dark);
  font-family: var(--font-mono);
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  white-space: nowrap;
  user-select: none;
}

.shortcut-key-input {
  text-align: center;
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em;
  max-width: 130px;
  border-width: 2px;
  border-color: var(--gold-main);
}

.shortcut-fn-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.32rem;
  margin-block: 0.55rem 0.35rem;
}

.shortcut-fn-label {
  font-size: 0.75rem;
  font-weight: 800;
  color: var(--text-secondary);
  margin-inline-end: 0.15rem;
}

.shortcut-fn-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 28px;
  padding: 0 0.45rem;
  border-radius: 6px;
  border: 1.5px solid var(--border-strong);
  background: var(--bg-elevated);
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-size: 0.76rem;
  font-weight: 800;
  cursor: pointer;
  transition: all 0.15s ease;
}

.shortcut-fn-chip:hover {
  border-color: var(--gold-main);
  background: rgba(212, 160, 23, 0.14);
  color: var(--gold-dark);
}

.shortcut-fn-chip.is-active {
  border-color: var(--gold-main);
  background: var(--gold-main);
  color: #ffffff;
  box-shadow: 0 2px 6px rgba(212, 160, 23, 0.35);
}

.module-card-kbd {
  position: absolute;
  top: 0.85rem;
  right: 0.9rem;
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.5rem;
  border-radius: 6px;
  border: 1px solid rgba(212, 160, 23, 0.55);
  background: rgba(254, 249, 231, 0.95);
  color: #92400e;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  pointer-events: none;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

html[data-theme="dark"] .module-card-kbd {
  background: rgba(212, 175, 55, 0.16);
  border-color: rgba(212, 175, 55, 0.45);
  color: var(--gold-light);
}

html[data-theme="dark"] .shortcut-fn-chip.is-active {
  color: #0f172a;
}

.kbd-combo {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-family: var(--font-mono);
  font-weight: 800;
  white-space: nowrap;
}

.kbd-key {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  padding: 0.24rem 0.55rem;
  border-radius: 6px;
  border: 1.5px solid var(--gold-main);
  background: var(--bg-elevated);
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-size: 0.82rem;
  font-weight: 800;
  box-shadow: 0 2px 0 rgba(212, 160, 23, 0.35);
}

.kbd-plus {
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--gold-dark);
}

html[data-theme="dark"] .shortcut-ctrl-fixed {
  color: var(--gold-light);
  background: rgba(212, 175, 55, 0.18);
}

html[data-theme="dark"] .kbd-key {
  background: #1a1f2c;
  color: var(--gold-light);
}

/* ==========================================================================
   MÓDULO DE ESTADÍSTICAS — FILTROS MULTICELDA Y GRÁFICOS DE CONTROL
   ========================================================================== */
.est-filter-card {
  background: var(--bg-surface);
  border: 1.5px solid var(--gold-border);
  border-radius: var(--radius-lg);
  padding: 1rem 1.25rem;
  margin-block-end: 1.1rem;
  box-shadow: var(--shadow-card);
}

.est-filter-grid {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 1.25rem;
  align-items: start;
}

.est-filter-block {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.est-filter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.est-pv-checks-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.est-pv-pill {
  padding: 0.35rem 0.65rem;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  background: var(--bg-elevated);
  font-size: 0.8rem;
  font-weight: 700;
}

.est-date-rango-wrap {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.est-date-inputs {
  display: flex;
  gap: 0.65rem;
  align-items: flex-end;
  flex-wrap: wrap;
}

.est-quick-range-btns {
  display: flex;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.est-preset-btn {
  padding: 0.3rem 0.6rem;
  min-height: 32px;
  font-size: 0.76rem;
}

.est-meses-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
  gap: 0.38rem;
}

.est-mes-pill {
  padding: 0.3rem 0.55rem;
  border-radius: 7px;
  border: 1px solid #cbd5e1;
  background: var(--bg-elevated);
  font-size: 0.77rem;
  font-weight: 600;
}

.est-chart-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-block-end: 0.75rem;
}

.est-chart-type-pills {
  display: flex;
  gap: 0.35rem;
}

.est-chart-btn {
  padding: 0.25rem 0.65rem;
  min-height: 30px;
  font-size: 0.77rem;
}

.est-chart-btn.is-active {
  background: var(--gold-main);
  color: #111318;
  border-color: var(--gold-dark);
  font-weight: 800;
}

.est-canvas-wrap {
  width: 100%;
  background: var(--bg-elevated);
  border: 1px solid rgba(148, 163, 184, 0.25);
  border-radius: var(--radius-md);
  padding: 0.75rem;
  overflow-x: auto;
}

.est-canvas-wrap canvas {
  display: block;
  width: 100%;
  height: auto;
  max-height: 340px;
}

html[data-theme="dark"] .est-filter-card {
  background: #141822;
  border-color: var(--gold-border);
}

html[data-theme="dark"] .est-pv-pill,
html[data-theme="dark"] .est-mes-pill {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .est-canvas-wrap {
  background: #0d1017;
  border-color: rgba(255, 255, 255, 0.08);
}

@media (max-width: 960px) {
  .est-filter-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   PERFIL DE USUARIO: AVATARES / FOTOGRAFÍAS, WHATSAPP Y PANEL DE @danielg
   ========================================================================== */
.user-avatar {
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
}

.user-avatar img.avatar-img-fill {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 50%;
}

.perfil-avatar-picker-box {
  background: var(--bg-elevated);
  border: 1px solid var(--gold-border);
  border-radius: var(--radius-md);
  padding: 0.75rem 0.9rem;
}

.perfil-avatar-preview-wrap {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex-wrap: wrap;
}

.perfil-avatar-upload-actions {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.perfil-avatar-grid {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.perfil-avatar-opt {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 2px solid rgba(148, 163, 184, 0.35);
  background: var(--bg-surface);
  padding: 2px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
  overflow: hidden;
}

.perfil-avatar-opt:hover {
  transform: translateY(-2px);
  border-color: var(--gold-main);
}

.perfil-avatar-opt.is-selected {
  border-color: var(--gold-dark);
  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.35);
  transform: scale(1.05);
}

.perfil-avatar-opt img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}

.admin-edit-user-card {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.10) 0%, var(--bg-surface) 100%);
  border: 2px solid var(--gold-main);
  border-radius: var(--radius-lg);
  padding: 1.15rem 1.25rem;
  margin-block-start: 0.5rem;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

.admin-modules-checkbox-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 0.5rem;
}

.admin-module-chk-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.65rem;
  background: var(--bg-surface);
  border: 1px solid rgba(148, 163, 184, 0.32);
  border-radius: var(--radius-sm);
  font-size: 0.84rem;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.admin-module-chk-item:hover {
  border-color: var(--gold-main);
}

.admin-module-chk-item input[type="checkbox"] {
  accent-color: var(--gold-dark);
  width: 16px;
  height: 16px;
}

.admin-pass-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--font-mono);
  font-size: 0.85rem;
  font-weight: 700;
  padding: 0.22rem 0.55rem;
  border-radius: 6px;
  background: rgba(212, 175, 55, 0.16);
  border: 1px solid var(--gold-border);
  color: var(--text-primary);
}

.pos-web-dispatch-alert {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 0.85rem 1.1rem;
  margin-block-end: 0.85rem;
  border-radius: var(--radius-md);
  border: 2px solid #10b981;
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.16) 0%, rgba(212, 175, 55, 0.12) 100%);
  box-shadow: 0 8px 22px rgba(16, 185, 129, 0.15);
}

.pos-web-dispatch-alert-body {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.pos-web-dispatch-icon {
  font-size: 1.7rem;
  line-height: 1;
}

.pos-web-dispatch-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

html[data-theme="dark"] .perfil-avatar-picker-box,
html[data-theme="dark"] .admin-module-chk-item {
  background: #141822;
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--silver-bright);
}

html[data-theme="dark"] .admin-edit-user-card {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.14) 0%, #141822 100%);
}

/* ==========================================================================
   SUBMÓDULO: FACTURA PROVEEDOR PDF/JPG (INTELIGENCIA ARTIFICIAL)
   ========================================================================== */
.fp-iva-mode-group {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
}

@media (max-width: 680px) {
  .fp-iva-mode-group {
    grid-template-columns: 1fr;
  }
}

.fp-iva-radio-card {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 44px;
  padding: 0.55rem 0.85rem;
  border-radius: var(--radius-sm);
  border: 1.5px solid #cbd5e1;
  background: #f8fafc;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.fp-iva-radio-card:hover {
  border-color: var(--gold-main);
}

.fp-iva-radio-card:has(input:checked) {
  border-color: var(--gold-main);
  background: rgba(212, 160, 23, 0.12);
  box-shadow: 0 0 0 2px var(--gold-glow);
}

.fp-iva-radio-card input[type="radio"] {
  accent-color: var(--gold-dark);
  width: 18px;
  height: 18px;
  margin: 0;
  flex-shrink: 0;
}

.fp-iva-radio-card strong {
  display: block;
  font-size: 0.88rem;
  color: var(--silver-bright);
  line-height: 1.25;
}

.fp-upload-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 1rem;
  align-items: stretch;
}

@media (max-width: 960px) {
  .fp-upload-grid {
    grid-template-columns: 1fr;
  }
}

.fp-dropzone {
  border: 2px dashed rgba(212, 160, 23, 0.55);
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, rgba(212, 160, 23, 0.06) 0%, rgba(255, 255, 255, 0.85) 100%);
  padding: 1.15rem 1.25rem;
  display: flex;
  align-items: center;
  transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.15s ease;
}

.fp-dropzone.is-dragover {
  border-color: var(--gold-dark);
  background: rgba(212, 160, 23, 0.16);
  transform: scale(1.005);
}

.fp-dropzone-content {
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 100%;
  flex-wrap: wrap;
}

.fp-dropzone-icon {
  width: 54px;
  height: 54px;
  border-radius: 12px;
  background: rgba(212, 160, 23, 0.16);
  color: var(--gold-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.fp-dropzone-text {
  flex: 1;
  min-width: 220px;
}

.fp-dropzone-text strong {
  display: block;
  font-size: 0.96rem;
  color: var(--silver-bright);
  margin-block-end: 0.2rem;
}

.fp-dropzone-text span {
  display: block;
  font-size: 0.8rem;
  color: var(--silver-muted);
}

.fp-ai-assistant-box {
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  background: #f8fafc;
  padding: 0.9rem 1rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.fp-doc-preview-details {
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  background: #ffffff;
  overflow: hidden;
}

.fp-doc-preview-summary {
  padding: 0.7rem 1rem;
  cursor: pointer;
  font-weight: 600;
  font-size: 0.86rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  background: #f8fafc;
}

.fp-doc-preview-body {
  padding: 0.95rem 1rem;
  border-block-start: 1px solid #e2e8f0;
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 1rem;
  align-items: start;
}

@media (max-width: 900px) {
  .fp-doc-preview-body {
    grid-template-columns: 1fr;
  }
}

.fp-visual-preview-wrap {
  border: 1px solid #cbd5e1;
  border-radius: var(--radius-sm);
  background: #f1f5f9;
  min-height: 170px;
  max-height: 320px;
  overflow: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem;
  text-align: center;
}

.fp-visual-preview-wrap img,
.fp-visual-preview-wrap canvas {
  max-width: 100%;
  max-height: 295px;
  object-fit: contain;
  border-radius: 6px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
}

.fp-smart-alert {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 0.9rem 1.1rem;
  border-radius: var(--radius-md);
  margin-block-end: 0.85rem;
}

.fp-smart-alert--warning {
  background: linear-gradient(90deg, rgba(212, 160, 23, 0.16) 0%, rgba(254, 243, 199, 0.65) 100%);
  border: 2px solid #d97706;
  color: #78350f;
}

.fp-smart-alert--resolved {
  background: linear-gradient(90deg, rgba(22, 163, 74, 0.14) 0%, rgba(220, 252, 231, 0.72) 100%);
  border: 2px solid #16a34a;
  color: #14532d;
}

.fp-smart-alert--danger {
  background: linear-gradient(90deg, rgba(220, 38, 38, 0.12) 0%, rgba(254, 226, 226, 0.65) 100%);
  border: 2px solid #dc2626;
  color: #7f1d1d;
}

.fp-smart-alert-main {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  flex: 1;
  min-width: 260px;
}

.fp-smart-alert-icon {
  font-size: 1.5rem;
  line-height: 1.1;
}

.fp-smart-alert-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
}

.fp-row--price-alert {
  background-color: rgba(245, 158, 11, 0.08) !important;
}

.fp-row--price-kept {
  background-color: rgba(22, 163, 74, 0.06) !important;
}

.fp-row--unmatched {
  background-color: rgba(220, 38, 38, 0.07) !important;
}

.fp-decision-group {
  display: flex;
  gap: 0.35rem;
  flex-wrap: wrap;
  margin-block-top: 0.35rem;
}

.fp-decision-btn {
  padding: 0.3rem 0.6rem;
  font-size: 0.76rem;
  font-weight: 700;
  border-radius: 6px;
  border: 1.5px solid #cbd5e1;
  background: #ffffff;
  color: var(--silver-main);
  cursor: pointer;
  transition: all 0.15s ease;
}

.fp-decision-btn.is-active-keep {
  border-color: #0284c7;
  background: rgba(2, 132, 199, 0.12);
  color: #0369a1;
}

.fp-decision-btn.is-active-lower {
  border-color: #d97706;
  background: rgba(217, 119, 6, 0.15);
  color: #b45309;
}

.fp-sys-row-banner {
  padding: 0.7rem 0.9rem;
  border-radius: var(--radius-sm);
  background: rgba(212, 160, 23, 0.12);
  border: 1px solid var(--gold-border);
  font-size: 0.86rem;
}

html[data-theme="dark"] .fp-iva-radio-card,
html[data-theme="dark"] .fp-ai-assistant-box,
html[data-theme="dark"] .fp-doc-preview-details,
html[data-theme="dark"] .fp-doc-preview-summary,
html[data-theme="dark"] .fp-visual-preview-wrap {
  background: #141822;
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--silver-bright);
}

html[data-theme="dark"] .fp-dropzone {
  background: rgba(212, 160, 23, 0.08);
  border-color: rgba(212, 160, 23, 0.45);
}

html[data-theme="dark"] .fp-smart-alert--warning {
  background: rgba(217, 119, 6, 0.18);
  color: #fde68a;
}

html[data-theme="dark"] .fp-smart-alert--danger {
  background: rgba(220, 38, 38, 0.18);
  color: #fecaca;
}

html[data-theme="dark"] .fp-decision-btn {
  background: #1e2433;
  border-color: rgba(255, 255, 255, 0.16);
  color: var(--silver-bright);
}

.fps-price-lock-box {
  border: 1px solid rgba(16, 185, 129, 0.4);
  background: rgba(16, 185, 129, 0.08);
  border-radius: var(--radius-sm);
  padding: 0.65rem 0.85rem;
  font-size: 0.83rem;
  line-height: 1.38;
  color: var(--silver-bright);
}

.fps-cod-input--missing {
  border-color: #dc2626 !important;
  background-color: rgba(220, 38, 38, 0.06) !important;
  box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.15);
}

.fps-mode-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-block-end: 0.85rem;
  padding: 0.65rem 0.95rem;
  border-radius: var(--radius-md);
  background: #ffffff;
  border: 1px solid #e2e8f0;
}

html[data-theme="dark"] .fps-price-lock-box {
  background: rgba(16, 185, 129, 0.14);
  border-color: rgba(16, 185, 129, 0.35);
}

html[data-theme="dark"] .fps-cod-input--missing {
  background-color: rgba(220, 38, 38, 0.18) !important;
}

html[data-theme="dark"] .fps-mode-topbar {
  background: #141822;
  border-color: rgba(255, 255, 255, 0.12);
}

/* ==========================================================================
   CONTROL DE STOCK EN GÓNDOLA (LECTOR CÓDIGO DE BARRAS / QR)
   ========================================================================== */
.cs-scanner-fieldset {
  background: linear-gradient(135deg, rgba(251, 246, 236, 0.9), rgba(255, 255, 255, 0.98));
  border: 2px solid #d4a338;
  box-shadow: 0 8px 24px rgba(180, 128, 24, 0.12);
}

.cs-scan-form {
  position: relative;
  width: 100%;
}

.cs-scan-input-wrap {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  background: #ffffff;
  border: 2px solid #c58f1e;
  border-radius: 14px;
  padding: 0.45rem 0.65rem 0.45rem 1rem;
  box-shadow: 0 4px 14px rgba(180, 128, 24, 0.12);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.cs-scan-input-wrap:focus-within {
  border-color: #9e6c08;
  box-shadow: 0 0 0 4px rgba(197, 143, 30, 0.22);
}

.cs-scan-icon {
  font-weight: 900;
  font-size: 1.2rem;
  letter-spacing: -1px;
  color: #a67311;
  user-select: none;
}

.cs-scan-input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 1.08rem;
  font-weight: 600;
  color: #1e293b;
  padding: 0.45rem 0.25rem;
  min-width: 0;
}

.cs-scan-input::placeholder {
  color: #64748b;
  font-weight: 500;
}

.cs-scan-clear-btn {
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  color: #475569;
  border-radius: 999px;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-weight: 700;
}

.cs-scan-submit-btn {
  width: auto !important;
  padding: 0.55rem 1.2rem !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
}

.cs-camera-panel {
  margin-block-start: 1rem;
  padding: 1rem;
  border-radius: 12px;
  background: #0f172a;
  color: #f8fafc;
  border: 1px solid rgba(212, 163, 56, 0.5);
}

.cs-camera-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-block-end: 0.75rem;
}

.cs-camera-video-wrap {
  position: relative;
  max-width: 460px;
  margin-inline: auto;
  border-radius: 10px;
  overflow: hidden;
  background: #000;
  aspect-ratio: 16 / 10;
}

.cs-camera-video-wrap video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.cs-camera-aim {
  position: absolute;
  inset: 18% 12%;
  border: 2px dashed rgba(250, 204, 21, 0.85);
  border-radius: 10px;
  box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.32);
  pointer-events: none;
}

.cs-idle-panel {
  text-align: center;
  padding: 2.6rem 1.5rem;
  background: #ffffff;
  border: 2px dashed rgba(197, 143, 30, 0.45);
  border-radius: 16px;
  margin-block-end: 1rem;
  color: #334155;
}

.cs-idle-icon {
  font-size: 2.8rem;
  margin-block-end: 0.5rem;
}

.cs-idle-panel h3 {
  margin: 0 0 0.35rem;
  font-size: 1.25rem;
  color: #1e293b;
}

.cs-idle-panel p {
  margin: 0 auto;
  max-width: 580px;
  color: #64748b;
  font-size: 0.96rem;
}

.cs-notfound-panel {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 1rem 1.25rem;
  border-radius: 12px;
  background: #fef2f2;
  border: 1.5px solid #f87171;
  color: #991b1b;
  margin-block-end: 1rem;
}

.cs-notfound-icon {
  font-size: 1.75rem;
}

.cs-product-panel {
  border: 2px solid rgba(197, 143, 30, 0.55);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
}

.cs-product-top {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  flex-wrap: wrap;
}

.cs-product-media {
  width: 88px;
  height: 88px;
  border-radius: 14px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.cs-product-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cs-product-placeholder {
  font-size: 2.2rem;
}

.cs-product-info {
  flex: 1;
  min-width: 240px;
}

.cs-product-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-block-end: 0.4rem;
}

.cs-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 700;
}

.cs-badge--code {
  background: rgba(212, 160, 23, 0.18);
  color: #92600a;
  border: 1px solid rgba(212, 160, 23, 0.4);
}

.cs-badge--ean {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid #bfdbfe;
  font-family: monospace;
  font-size: 0.8rem;
}

.cs-badge--meta {
  background: #f1f5f9;
  color: #475569;
  border: 1px solid #e2e8f0;
}

.cs-prod-name {
  margin: 0 0 0.35rem;
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.22;
}

.cs-prod-price-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  font-size: 0.94rem;
  color: #475569;
}

.cs-prod-price-row strong {
  color: #0f172a;
  font-size: 1.08rem;
}

.cs-prod-stock-breakdown {
  font-size: 0.84rem;
  color: #64748b;
  background: #f8fafc;
  padding: 0.2rem 0.55rem;
  border-radius: 6px;
  border: 1px solid #e2e8f0;
}

.cs-divider {
  border: none;
  border-top: 1px solid #e2e8f0;
  margin: 1rem 0;
}

.cs-stock-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}

.cs-stock-card {
  border-radius: 14px;
  padding: 1.1rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 1.5px solid #e2e8f0;
  background: #f8fafc;
}

.cs-stock-card--current {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border-color: #cbd5e1;
}

.cs-stock-card--diff {
  background: linear-gradient(180deg, #fffbeb 0%, #fef3c7 100%);
  border-color: #f59e0b;
}

.cs-stock-card--final {
  background: linear-gradient(180deg, #ecfdf5 0%, #d1fae5 100%);
  border-color: #10b981;
}

.cs-stock-card-label {
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #475569;
  margin-block-end: 0.5rem;
}

.cs-stock-big-value {
  font-size: 2.75rem;
  font-weight: 900;
  line-height: 1.05;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
}

.cs-stock-big-value.is-zero-or-neg {
  color: #dc2626;
}

.cs-stock-card-sub {
  margin-block-start: 0.45rem;
  font-size: 0.8rem;
  color: #64748b;
}

.cs-diff-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  max-width: 260px;
}

.cs-step-btn {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  border: 2px solid transparent;
  font-size: 1.2rem;
  font-weight: 900;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.1s ease, filter 0.15s ease;
  user-select: none;
}

.cs-step-btn:active {
  transform: scale(0.95);
}

.cs-step-btn--minus {
  background: #fee2e2;
  border-color: #ef4444;
  color: #b91c1c;
}

.cs-step-btn--plus {
  background: #dcfce7;
  border-color: #22c55e;
  color: #15803d;
}

.cs-diff-input {
  flex: 1;
  min-width: 0;
  height: 52px;
  text-align: center;
  font-size: 1.65rem;
  font-weight: 900;
  border-radius: 12px;
  border: 2px solid #d97706;
  background: #ffffff;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
}

.cs-quick-steps {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.35rem;
  margin-block-start: 0.6rem;
}

.cs-quick-chip {
  padding: 0.26rem 0.6rem;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 800;
  cursor: pointer;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #334155;
}

.cs-quick-chip--minus {
  border-color: #fca5a5;
  color: #b91c1c;
  background: #fff5f5;
}

.cs-quick-chip--plus {
  border-color: #86efac;
  color: #15803d;
  background: #f0fdf4;
}

.cs-diff-status-badge {
  margin-block-start: 0.55rem;
  padding: 0.28rem 0.75rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 800;
}

.cs-diff-status-badge--neutral {
  background: rgba(100, 116, 139, 0.14);
  color: #334155;
}

.cs-diff-status-badge--plus {
  background: #dcfce7;
  color: #166534;
  border: 1px solid #86efac;
}

.cs-diff-status-badge--minus {
  background: #fee2e2;
  color: #991b1b;
  border: 1px solid #fca5a5;
}

.cs-final-input-wrap {
  width: 100%;
  max-width: 200px;
}

.cs-final-stock-input {
  width: 100%;
  height: 58px;
  text-align: center;
  font-size: 2rem;
  font-weight: 900;
  border-radius: 12px;
  border: 2px solid #059669;
  background: #ffffff;
  color: #065f46;
  font-variant-numeric: tabular-nums;
}

.cs-confirm-bar {
  margin-block-start: 1.1rem;
  padding-block-start: 1rem;
  border-top: 1px solid #e2e8f0;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
}

.cs-confirm-notes {
  flex: 1;
  min-width: 280px;
}

.cs-notes-row {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 0.6rem;
}

.cs-confirm-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

.cs-btn-verify,
.cs-btn-save {
  width: auto !important;
  padding: 0.75rem 1.3rem !important;
  font-weight: 800 !important;
}

@media (max-width: 900px) {
  .cs-stock-grid {
    grid-template-columns: 1fr;
  }
  .cs-notes-row {
    grid-template-columns: 1fr;
  }
  .cs-confirm-actions {
    width: 100%;
  }
  .cs-btn-verify,
  .cs-btn-save {
    flex: 1;
    justify-content: center;
  }
}

html[data-theme="dark"] .cs-scanner-fieldset,
html[data-theme="dark"] .cs-idle-panel,
html[data-theme="dark"] .cs-product-panel {
  background: #141822;
  color: var(--silver-bright);
}

html[data-theme="dark"] .cs-scan-input-wrap {
  background: #0f131c;
}

html[data-theme="dark"] .cs-scan-input,
html[data-theme="dark"] .cs-prod-name,
html[data-theme="dark"] .cs-stock-big-value {
  color: #ffffff;
}

html[data-theme="dark"] .cs-stock-big-value.is-zero-or-neg {
  color: #f87171;
}

html[data-theme="dark"] .cs-product-media {
  background: #1e293b;
  border-color: #334155;
}

html[data-theme="dark"] .cs-badge--code {
  background: rgba(251, 191, 36, 0.14);
  color: #fbbf24;
  border-color: rgba(251, 191, 36, 0.38);
}

html[data-theme="dark"] .cs-badge--ean {
  background: rgba(59, 130, 246, 0.16);
  color: #93c5fd;
  border-color: rgba(96, 165, 250, 0.35);
}

html[data-theme="dark"] .cs-badge--meta {
  background: #1e293b;
  color: #cbd5e1;
  border-color: #334155;
}

html[data-theme="dark"] .cs-prod-price-row {
  color: #cbd5e1;
}

html[data-theme="dark"] .cs-prod-price-row strong {
  color: #fbbf24;
}

html[data-theme="dark"] .cs-prod-stock-breakdown {
  background: #1e293b;
  color: #e2e8f0;
  border-color: #334155;
}

html[data-theme="dark"] .cs-divider,
html[data-theme="dark"] .cs-confirm-bar {
  border-color: #283142;
}

html[data-theme="dark"] .cs-stock-card--current,
html[data-theme="dark"] .cs-stock-card--diff,
html[data-theme="dark"] .cs-stock-card--final {
  background: #1a2030;
}

html[data-theme="dark"] .cs-stock-card--current {
  border-color: #475569;
}

html[data-theme="dark"] .cs-stock-card-label {
  color: #e2e8f0;
}

html[data-theme="dark"] .cs-stock-card--diff .cs-stock-card-label {
  color: #fcd34d;
}

html[data-theme="dark"] .cs-stock-card--final .cs-stock-card-label {
  color: #6ee7b7;
}

html[data-theme="dark"] .cs-stock-card-sub {
  color: #94a3b8;
}

html[data-theme="dark"] .cs-diff-input {
  background: #0f172a;
  color: #ffffff;
  border-color: #f59e0b;
}

html[data-theme="dark"] .cs-final-stock-input {
  background: #0f172a;
  color: #6ee7b7;
  border-color: #10b981;
}

html[data-theme="dark"] .cs-diff-status-badge--neutral {
  background: rgba(148, 163, 184, 0.2);
  color: #e2e8f0;
}

/* ==========================================================================
   CAMPO CUIT CON BOTÓN LUPA PARA BUSCAR EN PADRÓN ARCA (COMO CAMPODIRECTO.AR)
   ========================================================================== */
.cuit-arca-input-group {
  display: flex;
  align-items: stretch;
  gap: 0.45rem;
  width: 100%;
}

.cuit-arca-input-group .form-input {
  flex: 1;
  min-width: 0;
}

.btn-arca-lupa {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  padding: 0 0.75rem;
  border-radius: 10px;
  border: 1.5px solid rgba(197, 143, 30, 0.55);
  background: rgba(212, 160, 23, 0.14);
  color: #8a5a00;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.1s ease, box-shadow 0.16s ease;
}

.btn-arca-lupa:hover:not(:disabled) {
  background: rgba(212, 160, 23, 0.26);
  border-color: #b47d0e;
  color: #6b4400;
  box-shadow: 0 3px 10px rgba(180, 128, 24, 0.18);
}

.btn-arca-lupa:active:not(:disabled) {
  transform: scale(0.96);
}

.btn-arca-lupa:disabled {
  opacity: 0.65;
  cursor: wait;
}

.btn-arca-lupa.is-loading svg {
  animation: arcaLupaPulse 0.9s infinite ease-in-out;
}

@keyframes arcaLupaPulse {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.18);
    opacity: 0.55;
  }
}

html[data-theme="dark"] .btn-arca-lupa {
  background: rgba(212, 160, 23, 0.2);
  border-color: rgba(212, 160, 23, 0.55);
  color: #facc15;
}

html[data-theme="dark"] .btn-arca-lupa:hover:not(:disabled) {
  background: rgba(212, 160, 23, 0.32);
  color: #fef08a;
}

/* ==========================================================================
   CIERRE DE VENTA PREDICTIVO Y SALIDA DE TICKET (78mm CAJA 1-2 / A4 CAJA 3)
   ========================================================================== */
dialog:modal {
  overscroll-behavior: contain;
}

dialog::backdrop {
  overflow: hidden;
  overscroll-behavior: contain;
}

.pos-payment-dialog {
  max-inline-size: 860px;
  inline-size: min(96vw, 860px);
}

.pos-pay-body {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  padding: 1rem 1.25rem;
}

.pos-pay-top-summary {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 0.9rem;
  align-items: stretch;
}

@media (max-width: 740px) {
  .pos-pay-top-summary {
    grid-template-columns: 1fr;
  }
}

.pos-pay-total-hero {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0.85rem 1.1rem;
  border-radius: var(--radius-md);
  border: 2px solid var(--gold-main);
  background: linear-gradient(135deg, rgba(212, 160, 23, 0.16) 0%, rgba(255, 255, 255, 0.95) 100%);
}

.pos-pay-total-lbl {
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: var(--gold-dark);
}

.pos-pay-total-val {
  font-size: clamp(1.75rem, 3vw, 2.35rem);
  font-weight: 900;
  line-height: 1.1;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
  margin-block: 0.15rem;
}

.pos-pay-client-lbl {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--silver-muted);
}

.pos-pay-emision-fieldset,
.pos-pay-fieldset {
  border: 1px solid #cbd5e1;
  border-radius: var(--radius-md);
  padding: 0.75rem 0.95rem;
  margin: 0;
  background: #f8fafc;
}

.pos-pay-mini-legend,
.pos-pay-section-title {
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--gold-dark);
  padding-inline: 0.35rem;
}

.pos-pay-emision-radios {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
}

@media (max-width: 560px) {
  .pos-pay-emision-radios {
    grid-template-columns: 1fr;
  }
}

.pos-pay-emision-card {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.75rem;
  border-radius: var(--radius-sm);
  border: 1.5px solid #cbd5e1;
  background: #ffffff;
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

.pos-pay-emision-card:has(input:checked) {
  border-color: var(--gold-main);
  background: rgba(212, 160, 23, 0.14);
  box-shadow: 0 0 0 2px var(--gold-glow);
}

.pos-pay-emision-card input[type="radio"] {
  accent-color: var(--gold-dark);
  width: 17px;
  height: 17px;
  margin: 0;
  flex-shrink: 0;
}

.pos-pay-emision-card strong {
  display: block;
  font-size: 0.82rem;
  color: var(--silver-bright);
}

.pos-pay-emision-card span {
  display: block;
  font-size: 0.72rem;
  color: var(--silver-muted);
}

.pos-pay-methods-grid,
.pos-pay-method-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.6rem;
}

@media (max-width: 640px) {
  .pos-pay-methods-grid,
  .pos-pay-method-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.pos-pay-method-card {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  min-block-size: 48px;
  padding: 0.55rem 0.75rem;
  border-radius: var(--radius-sm);
  border: 1.5px solid #cbd5e1;
  background: #ffffff;
  cursor: pointer;
  font-weight: 700;
  font-size: 0.85rem;
  color: var(--silver-bright);
  transition: all 0.15s ease;
  box-sizing: border-box;
  overflow: hidden;
}

.pos-pay-method-card[hidden] {
  display: none !important;
}

.pos-pay-method-name {
  min-width: 0;
  line-height: 1.2;
  overflow-wrap: break-word;
}

.pos-pay-method-card:hover {
  border-color: var(--gold-main);
}

.pos-pay-method-card:has(input:checked) {
  border-color: var(--gold-dark);
  background: rgba(212, 160, 23, 0.18);
  box-shadow: 0 0 0 2px var(--gold-glow);
}

.pos-pay-method-card input[type="radio"] {
  accent-color: var(--gold-dark);
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
}

.pos-pay-method-icon {
  font-size: 1.15rem;
  line-height: 1;
}

.pos-pay-cash-grid {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 0.9rem;
  align-items: stretch;
}

@media (max-width: 680px) {
  .pos-pay-cash-grid {
    grid-template-columns: 1fr;
  }
}

.pos-pay-big-input {
  font-size: 1.45rem !important;
  font-weight: 800 !important;
  min-block-size: 52px !important;
  font-variant-numeric: tabular-nums;
  border: 2px solid var(--gold-main) !important;
}

.pos-pay-quick-bills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-block-top: 0.55rem;
}

.pos-pay-bill-chip {
  padding: 0.35rem 0.65rem;
  min-block-size: 36px;
  border-radius: 999px;
  border: 1.5px solid #cbd5e1;
  background: #ffffff;
  color: #0f172a;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  font-variant-numeric: tabular-nums;
  transition: all 0.15s ease;
}

.pos-pay-bill-chip:hover {
  border-color: var(--gold-main);
  background: rgba(212, 160, 23, 0.14);
}

.pos-pay-bill-chip.is-active {
  border-color: var(--gold-dark);
  background: var(--gold-main);
  color: #ffffff;
}

.pos-pay-vuelto-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 0.85rem 1rem;
  border-radius: var(--radius-md);
  border: 2px solid #10b981;
  background: rgba(16, 185, 129, 0.1);
}

.pos-pay-vuelto-card.is-pending {
  border-color: #f59e0b;
  background: rgba(245, 158, 11, 0.12);
}

.pos-pay-vuelto-title {
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: #047857;
}

.pos-pay-vuelto-card.is-pending .pos-pay-vuelto-title {
  color: #b45309;
}

.pos-pay-vuelto-amount {
  font-size: clamp(1.6rem, 2.6vw, 2.15rem);
  font-weight: 900;
  color: #065f46;
  font-variant-numeric: tabular-nums;
  margin-block: 0.15rem;
}

.pos-pay-vuelto-card.is-pending .pos-pay-vuelto-amount {
  color: #b45309;
}

.pos-pay-vuelto-hint {
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--silver-muted);
}

.pos-pay-split-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-block-top: 0.65rem;
  padding: 0.6rem 0.85rem;
  border-radius: var(--radius-sm);
  border: 1.5px solid #d97706;
  background: rgba(245, 158, 11, 0.14);
  font-size: 0.83rem;
}

.pos-pay-split-btns {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.pos-pay-posnet-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.65rem;
}

@media (max-width: 640px) {
  .pos-pay-posnet-grid {
    grid-template-columns: 1fr;
  }
}

.pos-pay-posnet-card {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  min-block-size: 54px;
  padding: 0.65rem 0.85rem;
  border-radius: var(--radius-sm);
  border: 2px solid #cbd5e1;
  background: #ffffff;
  cursor: pointer;
  transition: all 0.15s ease;
}

.pos-pay-posnet-card:hover {
  border-color: var(--gold-main);
}

.pos-pay-posnet-card:has(input:checked) {
  border-color: var(--gold-dark);
  background: rgba(212, 160, 23, 0.16);
  box-shadow: 0 0 0 2px var(--gold-glow);
}

.pos-pay-posnet-card input[type="radio"] {
  accent-color: var(--gold-dark);
  width: 18px;
  height: 18px;
  margin: 0;
  flex-shrink: 0;
}

.pos-pay-posnet-card strong {
  display: block;
  font-size: 0.92rem;
  color: var(--silver-bright);
}

.pos-pay-posnet-card span {
  display: block;
  font-size: 0.74rem;
  color: var(--silver-muted);
}

.pos-pay-posnet-summary {
  margin-block-top: 0.55rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-sm);
  background: rgba(16, 185, 129, 0.12);
  border: 1px solid rgba(16, 185, 129, 0.4);
  font-size: 0.83rem;
  font-weight: 700;
  color: #065f46;
}

.pos-pay-footer {
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.pos-pay-confirm-btn {
  flex: 1;
  min-inline-size: 260px;
  min-block-size: 48px;
  font-size: 0.98rem;
  font-weight: 800;
}

/* Dark mode overrides for pos-payment-dialog */
html[data-theme="dark"] .pos-pay-total-hero {
  background: linear-gradient(135deg, rgba(212, 160, 23, 0.22) 0%, #141822 100%);
}

html[data-theme="dark"] .pos-pay-total-val {
  color: #f8fafc;
}

html[data-theme="dark"] .pos-pay-emision-fieldset,
html[data-theme="dark"] .pos-pay-fieldset {
  background: #141822;
  border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .pos-pay-emision-card,
html[data-theme="dark"] .pos-pay-method-card,
html[data-theme="dark"] .pos-pay-posnet-card,
html[data-theme="dark"] .pos-pay-bill-chip {
  background: #1e2433;
  border-color: rgba(255, 255, 255, 0.15);
  color: #f1f5f9;
}

html[data-theme="dark"] .pos-pay-vuelto-amount,
html[data-theme="dark"] .pos-pay-vuelto-title,
html[data-theme="dark"] .pos-pay-posnet-summary {
  color: #6ee7b7;
}

/* ==========================================================================
   MODAL Y PLANTILLAS DE TICKET (78mm ROLLO CONTINUO CAJA 1-2 / A4 CAJA 3)
   ========================================================================== */
.pos-ticket-dialog {
  max-inline-size: 940px;
  inline-size: min(96vw, 940px);
}

.pos-ticket-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.pos-ticket-format-switcher {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  border: none;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
}

.pos-ticket-fmt-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.42rem 0.75rem;
  border-radius: 999px;
  border: 1.5px solid #cbd5e1;
  background: #f8fafc;
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  color: var(--silver-bright);
}

.pos-ticket-fmt-pill:has(input:checked) {
  border-color: var(--gold-dark);
  background: rgba(212, 160, 23, 0.2);
}

.pos-ticket-fmt-pill input[type="radio"] {
  accent-color: var(--gold-dark);
  margin: 0;
}

html[data-theme="dark"] .pos-ticket-fmt-pill {
  background: #1e2433;
  border-color: rgba(255, 255, 255, 0.16);
}

.pos-ticket-preview-body {
  background: #475569;
  padding: 1.25rem;
  max-block-size: 72vh;
  overflow: auto;
}

.pos-ticket-preview-stage {
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

/* --- FORMATO 1: PAPEL CONTINUO 78mm (CAJA 1 Y CAJA 2) --- */
.ticket-78mm-sheet {
  width: 78mm;
  max-width: 100%;
  background: #ffffff;
  color: #000000;
  font-family: 'Courier New', Courier, monospace;
  font-size: 11.5px;
  line-height: 1.32;
  padding: 4mm 3.5mm;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  box-sizing: border-box;
}

.ticket-78mm-sheet * {
  color: #000000;
  box-sizing: border-box;
}

.t78-center {
  text-align: center;
}

.t78-bold {
  font-weight: 700;
}

.t78-logo {
  display: block;
  max-width: 44mm;
  height: auto;
  margin: 0 auto 2mm;
}

.t78-divider {
  border-top: 1px dashed #000000;
  margin: 2.2mm 0;
}

.t78-row {
  display: flex;
  justify-content: space-between;
  gap: 2mm;
}

.t78-item {
  margin-bottom: 1.6mm;
}

.t78-item-desc {
  font-weight: 700;
  word-break: break-word;
}

.t78-total-box {
  font-size: 14px;
  font-weight: 900;
  padding: 1.5mm 0;
  border-top: 1.5px solid #000000;
  border-bottom: 1.5px solid #000000;
  margin: 2mm 0;
}

.t78-qr-box {
  text-align: center;
  margin-top: 2.5mm;
  page-break-inside: avoid;
  break-inside: avoid;
}

.t78-qr-box img {
  width: 30mm;
  height: 30mm;
  min-width: 30mm;
  min-height: 30mm;
  display: block;
  margin: 1.5mm auto;
}

.t78-cutter-feed {
  display: block;
  width: 100%;
  padding-top: 18mm;
  margin-top: 2mm;
  text-align: center;
  font-size: 9px;
  line-height: 1;
  color: #000000;
  letter-spacing: 2px;
  user-select: none;
  page-break-inside: avoid;
  break-inside: avoid;
}

/* --- FORMATO 2: REPORTE HOJA A4 (CAJA 3 - IDÉNTICO AL PDF DE PRUEBA) --- */
.invoice-a4-sheet {
  width: 210mm;
  min-height: 282mm;
  max-width: 100%;
  background: #ffffff;
  color: #000000;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  line-height: 1.3;
  padding: 9mm 10mm;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.38);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.invoice-a4-sheet * {
  color: #000000;
  box-sizing: border-box;
}

.a4-header-grid {
  display: grid;
  grid-template-columns: 1fr 48px 1fr;
  border-bottom: 1px solid #000000;
  position: relative;
  padding-bottom: 6px;
}

.a4-header-left {
  padding-right: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.a4-logo-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 92px;
  border-bottom: none;
  padding-bottom: 4px;
}

.a4-logo-img {
  max-height: 88px;
  max-width: 220px;
  object-fit: contain;
}

.a4-emisor-info {
  text-align: center;
  padding-top: 4px;
  font-size: 11px;
  line-height: 1.35;
}

.a4-emisor-info strong {
  display: block;
  font-size: 11.5px;
  font-weight: 800;
  margin-top: 2px;
}

.a4-header-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.a4-letra-square {
  width: 46px;
  height: 52px;
  border: 1px solid #000000;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  font-weight: 800;
  background: #ffffff;
}

.a4-letra-cod {
  width: 46px;
  background: #000000;
  color: #ffffff !important;
  font-size: 9.5px;
  font-weight: 700;
  text-align: center;
  padding: 2px 0;
}

.a4-center-vline {
  flex: 1;
  width: 1px;
  background: #000000;
}

.a4-header-right {
  padding-left: 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.a4-comp-top {
  min-height: 68px;
  border-bottom: 1px solid #000000;
  padding-bottom: 6px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.a4-comp-title {
  font-size: 15px;
  font-weight: 800;
  margin-bottom: 4px;
}

.a4-comp-nro,
.a4-comp-fecha {
  font-size: 13.5px;
  margin-bottom: 2px;
}

.a4-comp-nro strong,
.a4-comp-fecha strong {
  display: inline-block;
  width: 58px;
}

.a4-fiscal-meta {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-top: 5px;
  font-size: 9.5px;
  line-height: 1.35;
}

.a4-page-badge {
  text-align: left;
  font-size: 11px;
  padding-right: 12px;
}

.a4-client-box {
  margin-top: 5px;
  border-top: 1px solid #000000;
}

.a4-client-row {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  border: 1px solid #000000;
  padding: 3px 6px;
  margin-bottom: 3px;
  font-size: 11.5px;
}

.a4-client-row--full {
  grid-template-columns: 1fr;
}

.a4-lbl {
  font-weight: 700;
  margin-right: 8px;
}

.a4-items-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 4px;
}

.a4-items-table thead th {
  background: #bfbfbf;
  border-top: 1px solid #000000;
  border-bottom: 1px solid #000000;
  padding: 4px 6px;
  font-size: 10.5px;
  font-weight: 700;
  text-align: left;
}

.a4-items-table tbody td {
  padding: 3px 6px;
  font-size: 11.5px;
  vertical-align: top;
}

.a4-num {
  text-align: right !important;
  font-variant-numeric: tabular-nums;
}

.a4-center {
  text-align: center !important;
}

.a4-bottom-block {
  margin-top: auto;
  padding-top: 10px;
}

.a4-total-qty-line {
  font-size: 9.5px;
  margin-bottom: 2px;
}

.a4-totals-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #000000;
  margin-bottom: 4px;
}

.a4-totals-table thead th {
  background: #bfbfbf;
  border-bottom: 1px solid #000000;
  padding: 3px 6px;
  font-size: 10px;
  font-weight: 700;
  text-align: center;
}

.a4-totals-table tbody td {
  padding: 6px 6px 12px;
  font-size: 13px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.a4-totals-table tbody td.a4-grand-total-cell {
  font-weight: 800;
  font-size: 14px;
}

.a4-arca-row {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  margin-bottom: 4px;
}

.a4-arca-box {
  grid-column: 2;
  border: 1px solid #000000;
  padding: 6px 10px;
}

.a4-arca-inner {
  display: flex;
  align-items: center;
  gap: 14px;
}

.a4-arca-qr {
  width: 86px;
  height: 86px;
  flex-shrink: 0;
}

.a4-arca-brand {
  font-size: 24px;
  font-weight: 900;
  letter-spacing: 0.04em;
  color: #333333 !important;
  line-height: 1;
}

.a4-arca-sub {
  font-size: 6.5px;
  letter-spacing: 0.04em;
  color: #444444 !important;
  margin-bottom: 4px;
}

.a4-arca-auth {
  font-size: 9.5px;
  font-weight: 700;
  margin-bottom: 5px;
}

.a4-arca-cae {
  font-size: 9px;
}

.a4-arca-disclaimer {
  font-size: 7.5px;
  margin-top: 4px;
}

.a4-caja-footer-box {
  border: 1px solid #000000;
  padding: 5px 7px;
  min-height: 44px;
  font-size: 10.5px;
}

/* ==========================================================================
   SUBMÓDULO: PRECIOS EN GÓNDOLA Y REPORTE DE ETIQUETAS A4 (3 × 9 = 27/HOJA)
   ========================================================================== */
.pg-actions-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding: 0.75rem 1rem;
  margin-block-end: 1rem;
  background: var(--bg-surface);
  border: 1.5px solid var(--gold-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
}

.pg-actions-left,
.pg-actions-right {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.pg-btn-print-main {
  width: auto !important;
  min-inline-size: 220px;
  font-weight: 800;
}

.pg-btn-danger-outline {
  border-color: rgba(220, 38, 38, 0.45) !important;
  color: var(--danger) !important;
}

.pg-filters-fieldset,
.pg-manual-fieldset {
  margin-block-end: 0.95rem;
}

.pg-filters-grid-top {
  display: grid;
  grid-template-columns: 1.5fr 1.15fr 1.15fr 1.15fr;
  gap: 0.75rem;
  margin-block-end: 0.75rem;
}

.pg-filters-grid-bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  align-items: end;
}

.pg-list-radio-fieldset {
  border: none;
  margin: 0;
  padding: 0;
  min-inline-size: 0;
}

.pg-list-radio-group {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.pg-radio-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 42px;
  padding: 0.4rem 0.85rem;
  border-radius: var(--radius-sm);
  border: 1.5px solid #cbd5e1;
  background: var(--bg-elevated);
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.pg-radio-pill:has(input:checked) {
  border-color: var(--gold-main);
  background: rgba(212, 160, 23, 0.14);
  color: var(--gold-dark);
}

.pg-radio-pill input[type="radio"] {
  accent-color: var(--gold-dark);
  margin: 0;
}

.pg-manual-grid {
  display: grid;
  grid-template-columns: 1fr 120px auto;
  gap: 0.75rem;
  align-items: end;
}

.pg-manual-btns {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
}

.pg-copies-input {
  width: 68px !important;
  min-height: 34px !important;
  padding: 0.25rem 0.4rem !important;
  text-align: center;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.pg-diff-up {
  color: #b45309;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.pg-diff-down {
  color: #0369a1;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.pg-diff-zero {
  color: var(--silver-muted);
  font-variant-numeric: tabular-nums;
}

.pg-gondola-table {
  --pg-lbl-1: "Actualizar";
  --pg-lbl-3: "Artículo";
  --pg-lbl-4: "Fecha Act.";
  --pg-lbl-5: "Copias";
  --pg-lbl-6: "En Góndola";
  --pg-lbl-7: "Actual";
  --pg-lbl-8: "Diferencia";
  --pg-lbl-9: "Porcentaje";
  --pg-lbl-10: "Acción";
}

@container (width < 600px) {
  .pg-gondola-table,
  .pg-gondola-table thead,
  .pg-gondola-table tbody,
  .pg-gondola-table tr,
  .pg-gondola-table th,
  .pg-gondola-table td {
    display: block;
  }

  .pg-gondola-table thead {
    display: none;
  }

  .pg-gondola-table tr {
    margin-block-end: 1rem;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    overflow: hidden;
  }

  .pg-gondola-table tbody th {
    position: sticky;
    inset-block-start: 0;
    z-index: 2;
    background: var(--bg-elevated);
  }

  .pg-gondola-table td:nth-child(1)::before { content: var(--pg-lbl-1) ": "; font-weight: 700; }
  .pg-gondola-table td:nth-child(3)::before { content: var(--pg-lbl-3) ": "; font-weight: 700; }
  .pg-gondola-table td:nth-child(4)::before { content: var(--pg-lbl-4) ": "; font-weight: 700; }
  .pg-gondola-table td:nth-child(5)::before { content: var(--pg-lbl-5) ": "; font-weight: 700; }
  .pg-gondola-table td:nth-child(6)::before { content: var(--pg-lbl-6) ": "; font-weight: 700; }
  .pg-gondola-table td:nth-child(7)::before { content: var(--pg-lbl-7) ": "; font-weight: 700; }
  .pg-gondola-table td:nth-child(8)::before { content: var(--pg-lbl-8) ": "; font-weight: 700; }
  .pg-gondola-table td:nth-child(9)::before { content: var(--pg-lbl-9) ": "; font-weight: 700; }
  .pg-gondola-table td:nth-child(10)::before { content: var(--pg-lbl-10) ": "; font-weight: 700; }
}

@media (max-width: 980px) {
  .pg-filters-grid-top,
  .pg-filters-grid-bottom {
    grid-template-columns: 1fr 1fr;
  }
  .pg-manual-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .pg-filters-grid-top,
  .pg-filters-grid-bottom {
    grid-template-columns: 1fr;
  }
}

/* Modal Vista Previa A4 Precios en Góndola */
.pg-preview-dialog {
  max-inline-size: min(96vw, 940px) !important;
  width: 100%;
}

.pg-preview-dialog-body {
  background: #334155;
  padding: 1.25rem;
  max-block-size: 74vh;
  overflow-y: auto;
}

.pg-a4-preview-stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

/* Hoja A4 exacta (210mm x 297mm -> 3 columnas x 9 filas = 27 etiquetas) */
.pg-a4-sheet {
  width: 210mm;
  min-height: 297mm;
  max-width: 100%;
  background: #ffffff !important;
  color: #000000 !important;
  padding: 7.5mm 8mm;
  box-sizing: border-box;
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.42);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(9, 29.55mm);
  column-gap: 2mm;
  row-gap: 2mm;
  font-family: Arial, Helvetica, sans-serif;
}

.pg-label-box {
  border: 1px solid #222222;
  background: #ffffff !important;
  color: #000000 !important;
  padding: 1.6mm 2.2mm 1.3mm;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}

.pg-label-name {
  font-size: 8.3pt;
  font-weight: 400;
  line-height: 1.12;
  text-align: center;
  color: #000000 !important;
  max-height: 7.2mm;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.pg-label-price {
  font-size: 24.5pt;
  font-weight: 800;
  line-height: 1;
  text-align: center;
  color: #000000 !important;
  letter-spacing: -0.02em;
  white-space: nowrap;
  margin-block: auto;
}

.pg-label-footer {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: baseline;
  gap: 1.2mm;
  font-size: 7.2pt;
  font-weight: 400;
  line-height: 1;
  color: #000000 !important;
}

.pg-label-code {
  text-align: left;
  white-space: nowrap;
}

.pg-label-date {
  text-align: center;
  font-size: 6.7pt;
  color: #111111 !important;
  white-space: nowrap;
}

.pg-label-ean {
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

html[data-theme="dark"] .pg-actions-bar {
  background: #141822;
  border-color: var(--gold-border);
}

html[data-theme="dark"] .pg-radio-pill {
  background: #141822;
  border-color: rgba(255, 255, 255, 0.14);
  color: var(--silver-bright);
}

html[data-theme="dark"] .pg-radio-pill:has(input:checked) {
  border-color: var(--gold-main);
  background: rgba(212, 175, 55, 0.18);
  color: var(--gold-light);
}

html[data-theme="dark"] .pg-diff-up {
  color: #fbbf24;
}

html[data-theme="dark"] .pg-diff-down {
  color: #38bdf8;
}

/* ==========================================================================
   INDICADOR VISUAL DE PUNTO DE VENTA ACTIVO (CTRL + F12: ARCA vs INTERNO)
   ========================================================================== */
.fact-correlativo-wrap {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  cursor: pointer;
}

.fact-correlativo-wrap .fact-correlativo-box {
  width: 100%;
  padding-inline-end: 4.5rem !important;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

/* Modo Fiscal ARCA (0002 / 0003 / 0004) -> Verde Esmeralda Fiscal */
.fact-correlativo-box.is-pv-fiscal {
  background: #dcfce7 !important;
  border: 2px solid #16a34a !important;
  color: #14532d !important;
}

/* Modo Comprobante Interno (0099 / 0100 / 0101) -> Naranja Intenso / Ámbar Vivo */
.fact-correlativo-box.is-pv-interno {
  background: #ffedd5 !important;
  border: 2px solid #ea580c !important;
  color: #9a3412 !important;
}

.fact-pv-mode-pill {
  position: absolute;
  inset-inline-end: 0.4rem;
  padding: 0.16rem 0.45rem;
  border-radius: 999px;
  font-size: 0.65rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  pointer-events: none;
  line-height: 1.1;
}

.fact-pv-mode-pill.is-pv-fiscal {
  background: #16a34a;
  color: #ffffff;
}

.fact-pv-mode-pill.is-pv-interno {
  background: #ea580c;
  color: #ffffff;
}

/* Sincronización de color en el recuadro central de Letra (A / B) y barra de estado */
.fact-letra-column.is-pv-fiscal {
  background: #ecfdf5 !important;
  border-color: #16a34a !important;
}

.fact-letra-column.is-pv-fiscal .fact-letra-box {
  color: #15803d !important;
}

.fact-letra-column.is-pv-fiscal .fact-letra-sub {
  color: #166534 !important;
}

.fact-letra-column.is-pv-interno {
  background: #fff7ed !important;
  border-color: #ea580c !important;
}

.fact-letra-column.is-pv-interno .fact-letra-box {
  color: #c2410c !important;
}

.fact-letra-column.is-pv-interno .fact-letra-sub {
  color: #9a3412 !important;
}

#fact-status-modo.is-pv-fiscal {
  color: #15803d;
  font-weight: 800;
}

#fact-status-modo.is-pv-interno {
  color: #ea580c;
  font-weight: 800;
}

@keyframes pvSwitchFlashAnim {
  0% {
    transform: scale(1);
  }
  45% {
    transform: scale(1.035);
    box-shadow: 0 0 0 5px rgba(234, 88, 12, 0.28);
  }
  100% {
    transform: scale(1);
  }
}

.fact-correlativo-wrap.is-pv-flash .fact-correlativo-box,
.fact-letra-column.is-pv-flash {
  animation: pvSwitchFlashAnim 0.36s ease;
}

/* Soporte Modo Oscuro */
html[data-theme="dark"] .fact-correlativo-box.is-pv-fiscal {
  background: rgba(22, 163, 74, 0.22) !important;
  border-color: #22c55e !important;
  color: #86efac !important;
}

html[data-theme="dark"] .fact-correlativo-box.is-pv-interno {
  background: rgba(234, 88, 12, 0.26) !important;
  border-color: #f97316 !important;
  color: #fdba74 !important;
}

html[data-theme="dark"] .fact-letra-column.is-pv-fiscal {
  background: rgba(22, 163, 74, 0.18) !important;
  border-color: #22c55e !important;
}

html[data-theme="dark"] .fact-letra-column.is-pv-fiscal .fact-letra-box,
html[data-theme="dark"] .fact-letra-column.is-pv-fiscal .fact-letra-sub,
html[data-theme="dark"] #fact-status-modo.is-pv-fiscal {
  color: #86efac !important;
}

html[data-theme="dark"] .fact-letra-column.is-pv-interno {
  background: rgba(234, 88, 12, 0.2) !important;
  border-color: #f97316 !important;
}

html[data-theme="dark"] .fact-letra-column.is-pv-interno .fact-letra-box,
html[data-theme="dark"] .fact-letra-column.is-pv-interno .fact-letra-sub,
html[data-theme="dark"] #fact-status-modo.is-pv-interno {
  color: #fdba74 !important;
}

















/* ==========================================================================
   SUBMÓDULO: ADMINISTRACIÓN DE COMPROBANTES ELECTRÓNICOS (ARCA / WSFEv1)
   ========================================================================== */
.ace-top-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
  padding: 0.55rem 0.75rem;
  background: var(--bg-card);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  margin-block-end: 0.85rem;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.ace-toolbar-group {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.ace-toolbar-divider {
  width: 1px;
  height: 36px;
  background: var(--border-subtle);
  margin-inline: 0.25rem;
}

.ace-tool-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  min-width: 78px;
  min-height: 54px;
  padding: 0.35rem 0.65rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
  color: var(--silver-bright);
  font-size: 0.76rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.12s ease;
}

.ace-tool-btn:hover:not(:disabled) {
  background: rgba(212, 175, 55, 0.12);
  border-color: var(--gold-main);
}

.ace-tool-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.ace-tool-btn--primary {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.22), rgba(183, 139, 30, 0.14));
  border-color: var(--gold-main);
  font-weight: 800;
}

.ace-tool-icon {
  font-size: 1.15rem;
  line-height: 1;
}

.ace-toolbar-status {
  margin-inline-start: auto;
  display: flex;
  align-items: center;
}

.ace-service-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  border: 1.5px solid #22c55e;
  background: rgba(34, 197, 94, 0.12);
  color: #15803d;
  transition: all 0.15s ease;
}

html[data-theme="dark"] .ace-service-pill.is-online {
  color: #86efac;
}

.ace-service-pill.is-contingencia {
  border-color: #f97316;
  background: rgba(249, 115, 22, 0.15);
  color: #c2410c;
}

html[data-theme="dark"] .ace-service-pill.is-contingencia {
  color: #fdba74;
}

.ace-service-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #22c55e;
}

.ace-service-pill.is-contingencia .ace-service-dot {
  background: #f97316;
}

.ace-workspace {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 0.9rem;
  align-items: start;
}

@media (max-width: 980px) {
  .ace-workspace {
    grid-template-columns: 1fr;
  }
}

.ace-sidebar {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.ace-panel {
  margin: 0;
  padding: 0.8rem 0.85rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  background: var(--bg-card);
}

.ace-panel-title {
  padding-inline: 0.4rem;
  font-size: 0.8rem;
  font-weight: 800;
  color: var(--gold-dark);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

html[data-theme="dark"] .ace-panel-title {
  color: var(--gold-light);
}

.ace-filter-row {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-items: center;
  gap: 0.45rem;
  margin-block-end: 0.5rem;
}

.ace-chk-label,
.ace-plain-label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--silver-bright);
  cursor: pointer;
}

.ace-chk-label input[type="checkbox"],
.ace-radio-row input[type="radio"] {
  accent-color: var(--gold-main);
}

.ace-divider {
  border: 0;
  border-top: 1px solid var(--border-subtle);
  margin: 0.55rem 0;
}

.ace-filter-stack {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-block-end: 0.65rem;
}

.ace-cli-inputs {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 0.35rem;
}

.ace-estado-box {
  margin: 0.35rem 0 0;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  background: var(--bg-elevated);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.ace-estado-box legend {
  padding-inline: 0.3rem;
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--silver-muted);
}

.ace-radio-row {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.81rem;
  font-weight: 600;
  color: var(--silver-bright);
  cursor: pointer;
}

.ace-cert-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  margin-block-end: 0.55rem;
}

.ace-cert-field label,
.ace-cert-days-row label {
  display: block;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--silver-muted);
  margin-block-end: 0.2rem;
}

.ace-cert-days-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.ace-cert-days-input {
  width: 84px !important;
  text-align: right;
  font-weight: 800;
}

.ace-main-area {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  min-width: 0;
}

.ace-success-banner {
  padding: 0.7rem 0.95rem;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(34, 197, 94, 0.45);
  background: rgba(34, 197, 94, 0.12);
  color: var(--silver-bright);
  font-size: 0.86rem;
}

.ace-grid-statusbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
  font-size: 0.82rem;
  color: var(--silver-muted);
  padding-inline: 0.15rem;
}

.ace-selected-pill {
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  font-weight: 700;
  color: var(--silver-bright);
}

.ace-table-wrapper {
  min-height: 430px;
  background: var(--bg-card);
}

.ace-empty-cell {
  text-align: center !important;
  padding: 6.5rem 1rem !important;
  color: var(--silver-muted);
  font-size: 0.9rem;
}

.ace-row-selected {
  background: rgba(212, 175, 55, 0.1) !important;
}

.pos-pay-contingencia-bar {
  margin-block-start: 0.55rem;
  padding: 0.45rem 0.7rem;
  border-radius: var(--radius-sm);
  border: 1px dashed rgba(249, 115, 22, 0.55);
  background: rgba(249, 115, 22, 0.08);
}

/* ==========================================================================
   PLANILLA DE RENDICIÓN DIARIA / CIERRE DE CAJA Y PASO A CAJA CENTRAL
   ========================================================================== */
dialog:modal {
  overscroll-behavior: contain;
}

dialog::backdrop {
  overflow: hidden;
  overscroll-behavior: contain;
}

.cierre-caja-dialog {
  max-inline-size: min(96vw, 940px) !important;
  width: 100%;
}

.cierre-sub-dialog {
  max-inline-size: min(94vw, 640px) !important;
  width: 100%;
}

.cierre-billetes-dialog {
  max-inline-size: min(96vw, 840px) !important;
  width: 100%;
}

.cierre-tarjetas-dialog {
  max-inline-size: min(96vw, 820px) !important;
  width: 100%;
}

/* Tabla clásica estilo Sinergial / Oliver (nunca colapsa a tarjetas con "Rubro / Proveedor") */
.cierre-classic-table-wrap {
  border: 1px solid #94a3b8;
  background: #ffffff;
  overflow: auto;
  max-block-size: min(56vh, 420px);
}

.cierre-classic-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Segoe UI', Tahoma, sans-serif;
  font-size: 0.86rem;
  color: #0f172a;
  background: #dce6f2;
}

.cierre-classic-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #ffffff;
  color: #0f172a;
  font-weight: 600;
  font-size: 0.82rem;
  padding: 0.35rem 0.55rem;
  border: 1px solid #cbd5e1;
  text-align: center;
  white-space: nowrap;
}

.cierre-classic-table thead th.col-group-rendicion {
  background: #eff6ff;
  color: #1e3a8a;
  border-bottom: 2px solid #2563eb;
}

.cierre-classic-table thead th.col-group-cambio {
  background: #f0fdf4;
  color: #14532d;
  border-bottom: 2px solid #16a34a;
}

.cierre-classic-table tbody td {
  padding: 0.22rem 0.55rem;
  border: 1px solid #cbd5e1;
  background: #dce6f2;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.cierre-classic-table tbody td.cierre-cell-readonly-num {
  text-align: right;
  font-weight: 500;
}

.cierre-classic-table tbody td.cierre-cell-subtotal {
  text-align: right;
  font-weight: 700;
}

.cierre-classic-table tbody td.cierre-cell-input {
  padding: 0;
  background: #ffffff;
}

.cierre-billete-qty-input {
  width: 100%;
  min-width: 72px;
  height: 26px;
  border: 1px solid transparent;
  border-radius: 0;
  background: #ffffff;
  color: #0f172a;
  padding: 0.1rem 0.45rem;
  text-align: right;
  font-family: 'Segoe UI', Tahoma, sans-serif;
  font-size: 0.88rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  outline: none;
  box-sizing: border-box;
}

.cierre-billete-qty-input:focus,
.cierre-billete-qty-input:focus-visible {
  background: #0078d7;
  color: #ffffff;
  border: 1px dotted #f59e0b;
}

.cierre-billete-qty-input::selection {
  background: #0078d7;
  color: #ffffff;
}

.cierre-billetes-totals-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
  margin-block-start: 0.65rem;
}

@media (max-width: 680px) {
  .cierre-billetes-totals-grid {
    grid-template-columns: 1fr;
  }
}

.cierre-main-grid {
  display: grid;
  grid-template-columns: 1fr 1.08fr;
  gap: 1.15rem;
  align-items: stretch;
}

.cierre-left-panel,
.cierre-right-panel {
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.cierre-form-row {
  display: grid;
  grid-template-columns: 105px minmax(0, 1fr);
  align-items: center;
  gap: 0.5rem;
}

.cierre-form-row--split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
}

.cierre-inline-pair {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  align-items: center;
  gap: 0.4rem;
}

.cierre-lbl {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--silver-bright);
  white-space: nowrap;
}

.cierre-readonly {
  background: rgba(148, 163, 184, 0.14) !important;
  color: var(--silver-bright) !important;
  font-weight: 600;
}

.cierre-destino-box {
  background: rgba(212, 160, 23, 0.14) !important;
  border-color: var(--gold-main) !important;
  font-weight: 800 !important;
  color: var(--gold-dark) !important;
}

.cierre-divider {
  border: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.35);
  margin: 0.3rem 0;
}

.cierre-val-block {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.cierre-val-row {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.45rem;
}

.cierre-val-row--no-btn {
  grid-template-columns: 132px minmax(0, 1fr);
}

.cierre-val-tag {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0.3rem 0.65rem;
  border-radius: var(--radius-sm);
  background: var(--bg-elevated);
  border: 1px solid rgba(148, 163, 184, 0.38);
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--silver-bright);
}

.cierre-val-tag--strong {
  border-color: var(--gold-main);
  background: rgba(212, 160, 23, 0.14);
  color: var(--gold-dark);
}

.cierre-amount-box {
  min-height: 36px !important;
  padding: 0.3rem 0.65rem !important;
  text-align: right !important;
  font-family: var(--font-mono);
  font-size: 0.96rem !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums;
}

.cierre-amount-box--highlight {
  border-color: var(--gold-main) !important;
  background: rgba(212, 160, 23, 0.12) !important;
  color: var(--gold-dark) !important;
}

.cierre-detail-btn {
  width: auto !important;
  min-height: 36px !important;
  padding: 0.3rem 0.7rem !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  white-space: nowrap;
  border-color: var(--gold-border) !important;
}

.cierre-sub-hint {
  font-size: 0.73rem;
  color: var(--silver-muted);
  padding-inline-start: 0.25rem;
}

.cierre-grand-total-row {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  align-items: stretch;
  gap: 0.45rem;
  margin-block-start: auto;
}

.cierre-grand-total-lbl {
  display: flex;
  align-items: center;
  padding: 0.55rem 0.75rem;
  border-radius: var(--radius-sm);
  background: var(--bg-elevated);
  border: 1.5px solid var(--gold-main);
  font-size: 1.2rem;
  font-weight: 900;
  color: var(--silver-bright);
}

.cierre-grand-total-val {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0.55rem 0.95rem;
  border-radius: var(--radius-sm);
  background: linear-gradient(135deg, rgba(212, 160, 23, 0.18), rgba(254, 243, 199, 0.55));
  border: 2px solid var(--gold-main);
  font-family: var(--font-mono);
  font-size: 1.55rem;
  font-weight: 900;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
}

.cierre-submodal-total-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-block-top: 0.85rem;
  padding: 0.65rem 0.9rem;
  border-radius: var(--radius-sm);
  background: var(--bg-elevated);
  border: 1.5px solid var(--gold-border);
}

.cierre-submodal-total-box {
  display: inline-flex;
  align-items: baseline;
  gap: 0.6rem;
  font-size: 0.92rem;
  font-weight: 700;
}

.cierre-submodal-total-box strong {
  font-family: var(--font-mono);
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--gold-dark);
  font-variant-numeric: tabular-nums;
}

.cierre-bill-qty-input,
.cierre-plat-input {
  min-height: 34px !important;
  padding: 0.25rem 0.5rem !important;
  text-align: right !important;
  font-family: var(--font-mono);
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums;
}

.cierre-bill-qty-input {
  width: 96px !important;
  margin-inline-start: auto;
}

.cierre-plat-input {
  width: 118px !important;
  margin-inline-start: auto;
}

.cierre-tarjetas-tfoot-row th,
.cierre-tarjetas-tfoot-row td {
  background: rgba(212, 160, 23, 0.12);
  border-top: 2px solid var(--gold-main);
  font-weight: 800;
  padding: 0.6rem 0.75rem;
  font-variant-numeric: tabular-nums;
}

.cierre-ticket-add-grid {
  display: grid;
  grid-template-columns: 1.2fr 1.2fr 120px auto;
  gap: 0.55rem;
  align-items: end;
}

.cierre-audit-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
  gap: 0.65rem;
  margin-block-end: 1rem;
}

.cierre-audit-card {
  padding: 0.65rem 0.85rem;
  border-radius: var(--radius-sm);
  background: var(--bg-elevated);
  border: 1px solid rgba(148, 163, 184, 0.35);
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.cierre-audit-card strong {
  font-size: 1.08rem;
  font-variant-numeric: tabular-nums;
}

.cierre-audit-bottom-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(0, 1fr);
  gap: 0.9rem;
  margin-block-start: 0.85rem;
  align-items: start;
}

.cierre-audit-col {
  min-width: 0;
  overflow-x: auto;
}

@media (max-width: 1040px) {
  .cierre-audit-bottom-grid {
    grid-template-columns: 1fr;
  }
}

html[data-theme="dark"] .cierre-destino-box,
html[data-theme="dark"] .cierre-val-tag--strong,
html[data-theme="dark"] .cierre-amount-box--highlight,
html[data-theme="dark"] .cierre-submodal-total-box strong {
  color: var(--gold-light) !important;
}

html[data-theme="dark"] .cierre-grand-total-val {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.22), rgba(180, 83, 9, 0.28));
  color: #ffffff;
}

@media (max-width: 840px) {
  .cierre-main-grid {
    grid-template-columns: 1fr;
  }
  .cierre-ticket-add-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 540px) {
  .cierre-form-row,
  .cierre-form-row--split,
  .cierre-val-row,
  .cierre-val-row--no-btn,
  .cierre-grand-total-row,
  .cierre-ticket-add-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   MÓDULO: ADMINISTRACIÓN DE OFERTAS Y 7 SUBMÓDULOS (ESTILO SINERGIAL + ERP)
   ========================================================================== */
.oferta-type-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.45rem;
}

.oferta-card-desc {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.38;
  color: var(--silver-muted);
}

.oferta-card-count {
  margin-block-start: auto;
  font-size: 0.72rem;
}

.oferta-abm-dialog {
  max-inline-size: min(96vw, 1140px) !important;
  width: 100%;
}

.oferta-dialog-layout {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: 1.15rem;
  align-items: start;
}

.oferta-steps-sidebar {
  background: var(--bg-elevated);
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  padding: 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  position: sticky;
  top: 0;
}

.oferta-step-nav-btn {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  padding: 0.6rem 0.75rem;
  border-radius: 8px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--silver-main);
  font-size: 0.86rem;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
  transition: all 0.15s ease;
}

.oferta-step-nav-btn:hover {
  background: rgba(212, 160, 23, 0.09);
}

.oferta-step-nav-btn.is-active {
  background: rgba(212, 160, 23, 0.16);
  border-color: var(--gold-border);
  color: var(--gold-dark);
}

.oferta-step-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.oferta-step-dot--red {
  background: #ef4444;
}

.oferta-step-dot--blue {
  background: #0284c7;
}

.oferta-sidebar-preview {
  margin-block-start: 0.75rem;
  padding-block-start: 0.75rem;
  border-top: 1px dashed #cbd5e1;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.oferta-sidebar-preview-lbl {
  font-size: 0.72rem;
  color: var(--silver-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
}

.oferta-sidebar-preview strong {
  font-size: 0.84rem;
  color: var(--gold-dark);
  line-height: 1.35;
  word-break: break-word;
}

.oferta-def-banner {
  background: rgba(212, 160, 23, 0.14);
  border: 1px solid var(--gold-border);
  border-radius: 8px;
  padding: 0.45rem 0.85rem;
  font-size: 0.88rem;
  font-weight: 800;
  text-align: center;
  color: var(--gold-dark);
  margin-block-end: 0.9rem;
}

.oferta-top-grid {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  gap: 1rem;
  align-items: start;
}

.oferta-code-flags-row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.85rem;
  flex-wrap: wrap;
  margin-block-end: 0.65rem;
}

.oferta-flags-inline {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  flex-wrap: wrap;
  padding-block-end: 0.45rem;
}

.oferta-top-right {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
}

.oferta-mini-box {
  padding: 0.65rem 0.75rem !important;
  margin: 0 !important;
}

.oferta-mini-box legend {
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--silver-muted);
  padding: 0 0.3rem;
}

.oferta-mini-box--item {
  grid-column: 1 / -1;
}

.oferta-item-hint {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.35;
  color: var(--silver-muted);
}

.oferta-article-picker-bar {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  gap: 0.85rem;
  align-items: end;
  margin-block: 0.75rem;
}

.oferta-explanation-box {
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 0.75rem 0.95rem;
  font-size: 0.81rem;
  line-height: 1.44;
  color: #1e293b;
  margin-block-end: 0.85rem;
}

.oferta-explanation-box strong {
  display: block;
  margin-block-end: 0.25rem;
  color: #0f172a;
}

.oferta-subtabs-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  border-bottom: 1.5px solid #cbd5e1;
  margin-block-end: 0.75rem;
}

.oferta-subtab-btn {
  padding: 0.45rem 0.85rem;
  border: 1px solid #cbd5e1;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  background: #f8fafc;
  color: var(--silver-main);
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
}

.oferta-subtab-btn.is-active {
  background: #ffffff;
  color: var(--gold-dark);
  border-color: var(--gold-main);
  box-shadow: 0 2px 0 #ffffff;
}

.oferta-subtab-panel {
  padding: 0.75rem;
  border: 1px solid #e2e8f0;
  border-radius: 0 8px 8px 8px;
  background: #ffffff;
}

.oferta-checks-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 0.5rem;
}

html[data-theme="dark"] .oferta-steps-sidebar,
html[data-theme="dark"] .oferta-explanation-box,
html[data-theme="dark"] .oferta-subtab-panel,
html[data-theme="dark"] .oferta-subtab-btn {
  background: #141822;
  border-color: rgba(255, 255, 255, 0.14);
  color: var(--silver-bright);
}

html[data-theme="dark"] .oferta-explanation-box strong,
html[data-theme="dark"] .oferta-sidebar-preview strong,
html[data-theme="dark"] .oferta-def-banner {
  color: #facc15;
}

@media (max-width: 960px) {
  .oferta-dialog-layout,
  .oferta-top-grid,
  .oferta-article-picker-bar {
    grid-template-columns: 1fr;
  }
  .oferta-steps-sidebar {
    position: static;
  }
  .oferta-top-right {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   VENTANA EMERGENTE DE ACTUALIZACIÓN DE NUEVA VERSIÓN (ESTILO REIKI ONLINE)
   ========================================================================== */
.pwa-update-toast {
  position: fixed;
  bottom: 1.25rem;
  top: auto;
  left: 1rem;
  right: 1rem;
  z-index: 9999;
  max-width: 28rem;
  margin-inline: auto;
  pointer-events: auto;
  animation: pwaToastSlideIn 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}

.pwa-update-toast[hidden] {
  display: none !important;
}

.pwa-update-toast__card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  border-radius: 1rem;
  border: 2px solid #F3D791;
  background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
  padding: 0.85rem 1rem;
  color: #ffffff;
  box-shadow: 0 20px 35px -10px rgba(15, 23, 42, 0.55);
}

.pwa-update-toast__left {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
}

.pwa-update-toast__actions {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-shrink: 0;
}

.pwa-update-toast__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 0.55rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.pwa-update-toast__close:hover {
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
}

.pwa-update-toast__icon {
  display: flex;
  width: 2.1rem;
  height: 2.1rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 0.75rem;
  background: rgba(243, 215, 145, 0.2);
  color: #F3D791;
}

.pwa-update-toast__title {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.25;
  color: #ffffff;
}

.pwa-update-toast__sub {
  margin: 0.1rem 0 0;
  font-size: 0.72rem;
  color: rgba(255, 255, 255, 0.85);
}

.pwa-update-toast__btn {
  display: inline-flex;
  flex-shrink: 0;
  cursor: pointer;
  align-items: center;
  gap: 0.38rem;
  border: none;
  border-radius: 0.75rem;
  background: #F3D791;
  padding: 0.45rem 0.85rem;
  font-size: 0.76rem;
  font-weight: 800;
  color: #1e293b;
  transition: background-color 0.15s ease, transform 0.12s ease;
}

.pwa-update-toast__btn:hover {
  background: #ffffff;
  transform: translateY(-1px);
}

@keyframes pwaToastSlideIn {
  from {
    opacity: 0;
    transform: translateY(-12px) scale(0.97);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* ==========================================================================
   RECIBO DE PAGO (COBRO DE CUENTA CORRIENTE) · BUSCADOR Y BARRA DE COBRO
   ========================================================================== */
.recibo-panel-card {
  background: var(--bg-panel, #ffffff);
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-md);
  padding: 1rem 1.2rem;
  margin-block-end: 0.85rem;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
}

[data-theme="dark"] .recibo-panel-card {
  background: var(--bg-panel);
  border-color: rgba(255, 255, 255, 0.12);
}

.recibo-search-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1.35fr) minmax(260px, 1.35fr) auto;
  gap: 1rem;
  align-items: end;
  width: 100%;
}

.recibo-search-actions {
  display: flex;
  align-items: flex-end;
}

.recibo-btn-clear {
  width: auto !important;
  min-height: 42px;
  padding-inline: 1.1rem;
  font-weight: 700;
  white-space: nowrap;
}

.recibo-payment-grid {
  display: grid;
  grid-template-columns: auto minmax(210px, 0.9fr) minmax(240px, 1.35fr) auto;
  gap: 0.95rem;
  align-items: end;
  width: 100%;
}

.recibo-payment-grid > [hidden] {
  display: none !important;
}

.recibo-check-btns {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: nowrap;
}

.recibo-action-chip {
  width: auto !important;
  min-height: 42px;
  padding: 0 0.85rem;
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
}

.recibo-monto-label {
  font-weight: 800;
  color: var(--gold-dark);
}

.recibo-monto-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.recibo-monto-prefix {
  position: absolute;
  inset-inline-start: 0.75rem;
  font-weight: 800;
  font-size: 1.05rem;
  color: var(--gold-dark);
  pointer-events: none;
}

.recibo-monto-input {
  padding-inline-start: 1.75rem !important;
  font-size: 1.12rem !important;
  font-weight: 800 !important;
  border: 1.5px solid var(--gold-main) !important;
  min-height: 42px;
}

.recibo-submit-group {
  display: flex;
  align-items: flex-end;
}

.recibo-btn-submit {
  width: auto !important;
  min-height: 42px;
  padding-inline: 1.35rem;
  font-weight: 800;
  white-space: nowrap;
}

@media (max-width: 1240px) {
  .recibo-payment-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .recibo-btn-submit {
    width: 100% !important;
  }
}

@media (max-width: 900px) {
  .recibo-search-grid {
    grid-template-columns: 1fr 1fr;
  }
  .recibo-search-actions {
    grid-column: 1 / -1;
  }
  .recibo-btn-clear {
    width: 100% !important;
  }
  .recibo-payment-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 600px) {
  .recibo-search-grid,
  .recibo-payment-grid {
    grid-template-columns: 1fr;
  }
  .recibo-check-btns {
    width: 100%;
  }
  .recibo-action-chip {
    flex: 1;
  }
}

/* ==========================================================================
   SUBMÓDULO CARRITO WEB: ELECCIÓN DE BANNER HOMEPAGE (1530x370 / 1920x370)
   ========================================================================== */
.cw-banner-preview-card,
.cw-banner-form-card {
  background: var(--bg-card);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1rem 1.15rem;
  margin-block-start: 0.9rem;
}

.cw-banner-preview-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  flex-wrap: wrap;
  margin-block-end: 0.7rem;
  font-size: 0.88rem;
  color: var(--silver-bright);
}

.cw-banner-dim-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.22rem 0.65rem;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 800;
  background: rgba(212, 164, 30, 0.15);
  border: 1px solid var(--gold-border);
  color: var(--gold-dark);
}

html[data-theme="dark"] .cw-banner-dim-pill {
  color: var(--gold-light);
}

.cw-banner-live-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 1530 / 370;
  border-radius: 12px;
  overflow: hidden;
  background: #141821;
  border: 1px solid var(--border-subtle);
}

.cw-banner-live-track {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.cw-banner-live-slide {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
}

.cw-banner-live-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.cw-banner-stage-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: rgba(15, 23, 42, 0.62);
  color: #ffffff;
  font-size: 1.35rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 3;
}

.cw-banner-stage-nav[hidden],
.cw-banner-stage-dots[hidden] {
  display: none !important;
}

.cw-banner-stage-prev {
  left: 0.65rem;
}

.cw-banner-stage-next {
  right: 0.65rem;
}

.cw-banner-stage-dots {
  position: absolute;
  left: 50%;
  bottom: 0.55rem;
  transform: translateX(-50%);
  display: inline-flex;
  gap: 0.38rem;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.55);
  z-index: 3;
}

.cw-banner-stage-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: 0;
  padding: 0;
  background: rgba(255, 255, 255, 0.55);
  cursor: pointer;
}

.cw-banner-stage-dot.is-active {
  width: 22px;
  background: #f5c542;
}

.cw-banner-dropzone {
  border: 2px dashed var(--gold-border);
  border-radius: 12px;
  padding: 1.1rem;
  background: var(--bg-elevated);
  text-align: center;
  cursor: pointer;
  transition: border-color 0.16s ease, background 0.16s ease;
}

.cw-banner-dropzone.is-dragover,
.cw-banner-dropzone:hover {
  border-color: var(--gold-main);
  background: rgba(212, 164, 30, 0.08);
}

.cw-banner-upload-prompt {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3rem;
  color: var(--silver-bright);
  font-size: 0.88rem;
}

.cw-banner-upload-prompt span {
  font-size: 0.8rem;
  color: var(--silver-muted);
}

.cw-banner-upload-thumb-wrap img {
  display: block;
  width: 100%;
  aspect-ratio: 1530 / 370;
  object-fit: cover;
  object-position: center;
  border-radius: 8px;
  border: 1px solid var(--border-subtle);
  background: #141821;
}

.cw-banner-row-thumb {
  width: 220px;
  aspect-ratio: 1530 / 370;
  object-fit: cover;
  object-position: center;
  border-radius: 6px;
  border: 1px solid var(--border-subtle);
  background: #141821;
  display: block;
}

/* ==========================================================================
   PEDIDOS A PROVEEDORES Y STOCK MÍNIMO SUGERIDO
   ========================================================================== */
.pp-art-stock-min-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  align-items: center;
  margin-block-start: 0.85rem;
  padding-block-start: 0.85rem;
  border-block-start: 1px dashed var(--border-subtle);
}

.pp-card-panel {
  margin-block-end: 1.15rem;
  padding: 1.05rem 1.15rem;
}

.pp-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.85rem;
  flex-wrap: wrap;
  margin-block-end: 0.9rem;
}

.pp-panel-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  color: var(--silver-bright);
}

.pp-panel-sub {
  margin: 0.22rem 0 0;
  font-size: 0.82rem;
  color: var(--silver-muted);
}

.pp-panel-head-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
}

.pp-filters-grid {
  display: grid;
  grid-template-columns: minmax(210px, 1fr) minmax(280px, 1.8fr) minmax(190px, 0.95fr);
  gap: 0.75rem;
  align-items: end;
}

.pp-subfilters-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(190px, 0.9fr) minmax(260px, 1.6fr);
  gap: 0.75rem;
  align-items: end;
  margin-block-start: 0.75rem;
}

.pp-extra-search-row {
  display: flex;
  gap: 0.75rem;
  align-items: flex-end;
  flex-wrap: wrap;
}

.pp-extra-search-col {
  flex: 1 1 360px;
}

.pp-extra-dropdown {
  max-height: 310px;
  overflow-y: auto;
  z-index: 45;
}

.pp-table-scroll {
  max-height: 480px;
  overflow-y: auto;
}

.pp-order-top-controls {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  flex-wrap: wrap;
}

.pp-order-footer-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0.9rem;
  margin-block-top: 0.95rem;
  padding-block-top: 0.9rem;
  border-block-start: 1px solid var(--border-subtle);
}

.pp-order-footer-grid > .form-group {
  flex: 1 1 320px;
}

.pp-order-actions-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
}

.pp-history-filters {
  display: flex;
  gap: 0.55rem;
  flex-wrap: wrap;
  align-items: center;
}

.pp-low-stock-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.16rem 0.5rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 800;
  background: rgba(239, 68, 68, 0.14);
  color: #dc2626;
  border: 1px solid rgba(239, 68, 68, 0.35);
}

[data-theme="dark"] .pp-low-stock-pill {
  color: #f87171;
}

.pp-ok-stock-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.16rem 0.5rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  background: rgba(16, 185, 129, 0.14);
  color: #059669;
  border: 1px solid rgba(16, 185, 129, 0.35);
}

[data-theme="dark"] .pp-ok-stock-pill {
  color: #34d399;
}

.pp-extra-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.45rem;
  border-radius: 6px;
  font-size: 0.7rem;
  font-weight: 800;
  background: rgba(212, 164, 30, 0.16);
  color: var(--gold-main);
  border: 1px solid var(--gold-border);
  margin-inline-start: 0.35rem;
}

.pp-inline-sm-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
}

.pp-inline-sm-input {
  width: 72px;
  text-align: right;
  padding: 0.28rem 0.38rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.pp-inline-qty-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
}

.pp-inline-qty-input {
  width: 78px;
  text-align: right;
  padding: 0.3rem 0.4rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.pp-estado-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  font-size: 0.73rem;
  font-weight: 800;
}

.pp-estado-badge--pendiente {
  background: rgba(245, 158, 11, 0.16);
  color: #d97706;
  border: 1px solid rgba(245, 158, 11, 0.35);
}

.pp-estado-badge--enviado {
  background: rgba(59, 130, 246, 0.16);
  color: #2563eb;
  border: 1px solid rgba(59, 130, 246, 0.35);
}

.pp-estado-badge--recibido {
  background: rgba(16, 185, 129, 0.16);
  color: #059669;
  border: 1px solid rgba(16, 185, 129, 0.35);
}

.pp-estado-badge--anulado {
  background: rgba(148, 163, 184, 0.18);
  color: var(--silver-muted);
  border: 1px solid var(--border-subtle);
}

@media (max-width: 920px) {
  .pp-filters-grid,
  .pp-subfilters-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   STOCK VALORIZADO (FONDOS)
   ========================================================================== */
.sv-top-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.85rem;
  flex-wrap: wrap;
  margin-block-end: 0.95rem;
}

.sv-mode-tabs {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  background: var(--bg-elevated);
  padding: 0.32rem;
  border-radius: 12px;
  border: 1px solid var(--border-subtle);
}

.sv-mode-btn {
  border: 1px solid transparent;
  background: transparent;
  color: var(--silver-muted);
  font-size: 0.84rem;
  font-weight: 700;
  padding: 0.45rem 0.85rem;
  border-radius: 9px;
  cursor: pointer;
  transition: all 0.16s ease;
}

.sv-mode-btn:hover {
  color: var(--silver-bright);
  background: rgba(212, 164, 30, 0.08);
}

.sv-mode-btn.is-active {
  background: var(--gold-main);
  color: #151515;
  border-color: var(--gold-main);
  font-weight: 800;
}

.sv-top-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
}

.sv-kpi-selectable {
  cursor: pointer;
  transition: transform 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
}

.sv-kpi-selectable:hover {
  transform: translateY(-1px);
  border-color: var(--gold-main);
}

.sv-kpi-selectable.is-selected-kpi {
  border-color: var(--gold-main);
  box-shadow: 0 0 0 2px rgba(212, 164, 30, 0.25);
}

.sv-filters-grid {
  display: grid;
  grid-template-columns: minmax(230px, 1.6fr) repeat(4, minmax(160px, 1fr));
  gap: 0.75rem;
  align-items: end;
}

.sv-tfoot-totals td,
.sv-tfoot-totals th {
  background: var(--bg-elevated);
  border-block-start: 2px solid var(--gold-border);
  font-weight: 800;
  padding: 0.75rem 0.85rem;
}

.sv-val-stack {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.12rem;
}

.sv-val-total {
  font-weight: 800;
  font-size: 0.92rem;
  font-variant-numeric: tabular-nums;
}

.sv-val-unit {
  font-size: 0.74rem;
  color: var(--silver-muted);
  font-variant-numeric: tabular-nums;
}

@media (max-width: 1080px) {
  .sv-filters-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
}


/* ==========================================================================
   ALINEACIÓN A LA DERECHA DE COLUMNAS, CELDAS Y CAMPOS NUMÉRICOS GLOBALES
   ========================================================================== */
.num-col,
.col-num,
.col-price,
.catalog-table thead th.num-col,
.catalog-table thead th.col-num,
.catalog-table thead th.col-price,
.catalog-table tbody td.num-col,
.catalog-table tbody td.col-num,
.catalog-table tbody td.col-price,
.catalog-table tfoot td.num-col,
.catalog-table tfoot th.num-col,
.cierre-classic-table th.num-col,
.cierre-classic-table td.num-col,
.cierre-billetes-table thead th:nth-child(n+2),
.cierre-billetes-table tbody td:nth-child(n+2),
.cierre-billetes-table tfoot td:nth-child(n+2),
.cierre-tarjetas-table thead th:nth-child(n+2),
.cierre-tarjetas-table tbody td:nth-child(n+2),
.cierre-tarjetas-table tfoot td:nth-child(n+2),
#sec-articulos .catalog-table thead th:nth-child(3),
#sec-articulos .catalog-table thead th:nth-child(4),
#sec-articulos .catalog-table thead th:nth-child(5),
#sec-articulos .catalog-table thead th:nth-child(6),
#sec-articulos .catalog-table thead th:nth-child(7),
#sec-articulos .catalog-table tbody td:nth-child(3),
#sec-articulos .catalog-table tbody td:nth-child(4),
#sec-articulos .catalog-table tbody td:nth-child(5),
#sec-articulos .catalog-table tbody td:nth-child(6),
#sec-articulos .catalog-table tbody td:nth-child(7),
#sec-comprobantes-emitidos .catalog-table thead th:nth-child(6),
#sec-comprobantes-emitidos .catalog-table tbody td:nth-child(6),
#sec-abm-marcas .catalog-table thead th:nth-child(3),
#sec-abm-marcas .catalog-table tbody td:nth-child(3),
#sec-abm-rubros .catalog-table thead th:nth-child(3),
#sec-abm-rubros .catalog-table tbody td:nth-child(3) {
  text-align: right !important;
  font-variant-numeric: tabular-nums;
}

.num-col .price-cell-stack,
.col-num .price-cell-stack,
.col-price .price-cell-stack,
td[style*="text-align:right"] .price-cell-stack,
td[style*="text-align: right"] .price-cell-stack,
#sec-articulos .catalog-table tbody td:nth-child(3) .price-cell-stack,
#sec-articulos .catalog-table tbody td:nth-child(4) .price-cell-stack,
#sec-articulos .catalog-table tbody td:nth-child(5) .price-cell-stack,
#sec-articulos .catalog-table tbody td:nth-child(6) .price-cell-stack {
  align-items: flex-end;
  text-align: right;
}

td.num-col > .form-input,
td.col-num > .form-input,
td.col-price > .form-input,
.cierre-billetes-table td > .form-input,
.cierre-tarjetas-table td > .form-input,
.cierre-classic-table td > input[type="number"] {
  margin-inline-start: auto;
  text-align: right !important;
  font-variant-numeric: tabular-nums;
}

input[type="number"],
input.price-input,
input[inputmode="decimal"],
input[inputmode="numeric"] {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* =========================================================================
   FACTURA CARGA RÁPIDA DE PROVEEDORES (#sec-factura-carga-rapida)
   ========================================================================= */
.fcr-main-card {
  padding: 1.25rem;
}
.fcr-header-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--border-color, rgba(148, 163, 184, 0.25));
}
.fcr-title {
  margin: 0;
  font-size: 1.18rem;
  font-weight: 800;
  color: var(--text-primary);
}
.fcr-subtitle {
  margin: 0.25rem 0 0;
  font-size: 0.85rem;
  color: var(--text-secondary);
}
.fcr-header-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.fcr-step-box {
  background: var(--surface-alt, rgba(148, 163, 184, 0.06));
  border: 1px solid var(--border-color, rgba(148, 163, 184, 0.22));
  border-radius: 12px;
  padding: 1rem;
  margin-bottom: 0.9rem;
}
.fcr-step-label {
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--gold-dark, #b4821e);
  margin-bottom: 0.65rem;
}
[data-theme="dark"] .fcr-step-label {
  color: #facc15;
}
.fcr-prov-search-wrap {
  position: relative;
}
.fcr-prov-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 60;
  max-height: 290px;
  overflow-y: auto;
  background: var(--card-bg, #ffffff);
  border: 1px solid var(--border-color, #cbd5e1);
  border-radius: 10px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.18);
}
[data-theme="dark"] .fcr-prov-dropdown {
  background: #1e293b;
  border-color: #334155;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
}
.fcr-prov-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.62rem 0.85rem;
  cursor: pointer;
  border-bottom: 1px solid var(--border-color, rgba(148, 163, 184, 0.15));
  transition: background 0.12s ease;
}
.fcr-prov-option:last-child {
  border-bottom: none;
}
.fcr-prov-option:hover,
.fcr-prov-option.is-active {
  background: rgba(202, 154, 44, 0.12);
}
.fcr-prov-opt-main {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}
.fcr-prov-opt-title {
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--text-primary);
}
.fcr-prov-opt-sub {
  font-size: 0.76rem;
  color: var(--text-secondary);
}
.fcr-prov-opt-saldo {
  font-size: 0.8rem;
  font-weight: 700;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.fcr-prov-selected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 0.65rem;
  padding: 0.8rem 1rem;
  border-radius: 10px;
  background: rgba(202, 154, 44, 0.1);
  border: 1.5px solid rgba(202, 154, 44, 0.45);
}
.fcr-prov-selected-top {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.fcr-sel-name {
  font-size: 1rem;
  color: var(--text-primary);
}
.fcr-sel-meta {
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin-top: 0.2rem;
}
.fcr-prov-selected-right {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  flex-wrap: wrap;
}
.fcr-saldo-box {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  font-variant-numeric: tabular-nums;
}
.fcr-saldo-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.fcr-saldo-val {
  font-size: 0.98rem;
  color: var(--text-primary);
}
.fcr-saldo-proj {
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--gold-dark, #b4821e);
}
[data-theme="dark"] .fcr-saldo-proj {
  color: #facc15;
}
.fcr-prov-selected-btns {
  display: flex;
  gap: 0.4rem;
}
.fcr-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
  gap: 0.85rem;
  align-items: start;
}
.fcr-nro-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.35rem;
}
.fcr-nro-label-row label {
  margin-bottom: 0 !important;
}
.fcr-nro-mode-switch {
  display: inline-flex;
  border: 1px solid var(--border-color, #cbd5e1);
  border-radius: 7px;
  overflow: hidden;
  background: var(--card-bg, #ffffff);
}
[data-theme="dark"] .fcr-nro-mode-switch {
  background: #0f172a;
  border-color: #334155;
}
.fcr-mode-btn {
  border: none;
  background: transparent;
  padding: 0.22rem 0.55rem;
  font-size: 0.73rem;
  font-weight: 700;
  color: var(--text-secondary);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.fcr-mode-btn.is-active {
  background: var(--gold-primary, #c8962c);
  color: #ffffff;
}
.fcr-nro-input {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-align: left !important;
}
.fcr-nro-input:disabled {
  opacity: 0.78;
  cursor: not-allowed;
}
.fcr-importe-input {
  font-size: 1.15rem !important;
  font-weight: 800 !important;
}
.fcr-field-hint {
  display: block;
  margin-top: 0.28rem;
  font-size: 0.75rem;
  color: var(--text-secondary);
}
.fcr-actions-bar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-top: 0.85rem;
}
.fcr-submit-btn {
  width: auto !important;
  min-width: 260px;
  font-weight: 800;
}
.fcr-hist-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  flex-wrap: wrap;
}
.fcr-hist-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
}
.fcr-hist-filters {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}