:root {
  color-scheme: light;
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-muted: #f8fafc;
  --panel-soft: #f7fbff;
  --panel-tint: #eef6fd;
  --panel-tint-strong: #d9eaf8;
  --panel-board: #d2e2f4;
  --panel-line: #9eb7d1;
  --panel-line-soft: #c2d3e5;
  --line: #d9e0e7;
  --text: #18212f;
  --muted: #617083;
  --accent: #0f766e;
  --accent-strong: #115e59;
  --blue: #2563eb;
  --amber: #b45309;
  --danger: #b91c1c;
  --shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

* {
  box-sizing: border-box;
}

.visually-hidden {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Arial, Helvetica, sans-serif;
  letter-spacing: 0;
  overflow: hidden;
}

[hidden] {
  display: none !important;
}

.app-shell {
  display: grid;
  grid-template-columns: 260px 1fr;
  height: 100vh;
  min-height: 0;
  overflow: hidden;
}

.sidebar {
  background: #111827;
  color: #f9fafb;
  max-height: 100vh;
  overflow-y: auto;
  padding: 24px 18px;
  position: sticky;
  top: 0;
}

.brand {
  align-items: center;
  display: flex;
  gap: 12px;
  margin-bottom: 32px;
}

.brand-mark {
  align-items: center;
  background: #f59e0b;
  border-radius: 6px;
  color: #111827;
  display: inline-flex;
  font-size: 14px;
  font-weight: 700;
  height: 42px;
  justify-content: center;
  width: 42px;
}

.brand strong,
.brand small {
  display: block;
}

.brand small {
  color: #cbd5e1;
  font-size: 12px;
  margin-top: 3px;
}

.session-card {
  background: #0f172a;
  border: 1px solid #263244;
  border-radius: 8px;
  margin-bottom: 18px;
  padding: 12px;
}

.session-card span,
.session-card strong,
.session-card small {
  display: block;
}

.session-card span {
  color: #94a3b8;
  font-size: 12px;
  margin-bottom: 8px;
}

.session-card strong {
  color: #ffffff;
  font-size: 14px;
  margin-bottom: 5px;
}

.session-card small {
  color: #cbd5e1;
  font-size: 12px;
  line-height: 1.4;
}

.session-card.active {
  border-color: #2dd4bf;
}

.nav-list {
  display: grid;
  gap: 15px;
}

.nav-group {
  display: grid;
  gap: 5px;
}

.nav-group-label {
  color: #94a3b8;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  padding: 0 12px;
  text-transform: uppercase;
}

.nav-list a {
  border-radius: 6px;
  color: #d1d5db;
  padding: 11px 12px;
  text-decoration: none;
}

.nav-list a.active,
.nav-list a:hover {
  background: #1f2937;
  color: #ffffff;
}

.content {
  display: flex;
  flex-direction: column;
  height: 100vh;
  min-width: 0;
  overflow: hidden;
  padding: 28px;
}

.topbar {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 18px;
  justify-content: space-between;
  margin-bottom: 24px;
}

.topbar-summary {
  color: var(--muted);
  line-height: 1.4;
  margin: 8px 0 0;
  max-width: 680px;
}

.eyebrow {
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
  margin: 0 0 6px;
  text-transform: uppercase;
}

h1,
h2,
p {
  margin-top: 0;
}

h1 {
  font-size: 28px;
  margin-bottom: 0;
}

h2 {
  font-size: 17px;
  margin-bottom: 0;
}

.status-pill {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 999px;
  color: var(--amber);
  font-size: 13px;
  font-weight: 700;
  padding: 8px 12px;
}

.status-pill.online {
  background: #ecfdf5;
  border-color: #99f6e4;
  color: var(--accent-strong);
}

.status-pill.offline {
  background: #fef2f2;
  border-color: #fecaca;
  color: var(--danger);
}

.access-panel {
  margin-bottom: 20px;
}

.module-view[hidden] {
  display: none !important;
}

.module-view {
  display: block;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: auto;
}

.module-view.panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

#reportes.module-view.active,
#administracion.module-view.active {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

#reportes.module-view.active > .panel,
#administracion.module-view.active > .access-panel,
#administracion.module-view.active > .module-tabs {
  flex: 0 0 auto;
}

#administracion.module-view.active > [data-module-tab-panel] {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.module-launcher {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 20px;
}

.module-card,
.operation-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  display: grid;
  gap: 8px;
  min-height: 118px;
  padding: 16px;
  text-decoration: none;
}

.module-card:hover {
  border-color: #99f6e4;
}

.module-card.primary {
  border-color: #99f6e4;
}

.module-card span,
.operation-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.module-card strong,
.operation-card strong {
  font-size: 17px;
}

.module-card small,
.operation-card small {
  color: var(--muted);
  line-height: 1.4;
}

.operation-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 18px;
}

.operation-grid.compact {
  border-bottom: 1px solid var(--line);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.operation-card {
  background: var(--surface-muted);
  min-height: 104px;
}

.catalog-panel,
.customers-panel,
.inventory-panel,
.purchase-panel,
.sales-panel,
.loans-panel,
.suppliers-panel {
  margin-bottom: 20px;
}

.catalog-filters,
.cash-open-form,
.cash-close-form,
.cash-filters,
.customer-filters,
.inline-create-form,
.inventory-filters,
.pos-form,
.pos-quick-customer-form,
.purchase-filters,
.report-filters,
.loan-form,
.sales-filters,
.supplier-filters {
  align-items: end;
  background: var(--panel-tint);
  border-bottom: 1px solid var(--panel-line);
  display: grid;
  gap: 10px;
  padding: 10px 14px;
}

.inline-create-form {
  border-bottom: 1px solid var(--panel-line);
  grid-template-columns: repeat(5, minmax(130px, 1fr)) auto auto minmax(180px, 1fr);
}

.inline-create-form[hidden] {
  display: none;
}

.inline-create-form .inline-form-wide {
  grid-column: span 2;
}

.inline-form-message {
  align-self: center;
  color: var(--accent-strong);
  font-size: 12px;
  font-weight: 700;
  margin: 0;
  min-height: 18px;
}

.catalog-filters {
  grid-template-columns: minmax(220px, 1fr) 170px 160px 120px auto;
}

.compact-grid-container {
  --grid-header-height: 28px;
  --grid-row-height: 24px;
  background: #ffffff;
  box-sizing: border-box;
  display: block;
  height: 100%;
  inline-size: 100%;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: auto;
  scrollbar-width: none;
}

.compact-grid-container::-webkit-scrollbar {
  height: 10px;
  width: 0;
}

.compact-grid-container::-webkit-scrollbar-thumb {
  background: #9eb7d1;
  border-radius: 999px;
}

.compact-grid-container::-webkit-scrollbar-track {
  background: #eef6fd;
}

.compact-grid {
  border-collapse: collapse;
  font-size: 12px;
  min-width: 100%;
  table-layout: fixed;
  width: 100%;
}

.compact-grid th,
.compact-grid td {
  border-bottom: 1px solid var(--line);
  height: var(--grid-row-height);
  line-height: var(--grid-row-height);
  max-height: var(--grid-row-height);
  overflow: hidden;
  padding: 0 10px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}

.compact-grid th {
  background: var(--panel-tint);
  color: var(--muted);
  font-size: 11px;
  height: var(--grid-header-height);
  line-height: var(--grid-header-height);
  max-height: var(--grid-header-height);
  position: sticky;
  text-transform: uppercase;
  top: 0;
  z-index: 1;
}

.product-table {
  min-width: max(100%, 1290px);
  width: max(100%, 1290px);
}

.customer-table,
.supplier-table {
  min-width: max(100%, 1120px);
  width: max(100%, 1120px);
}

.product-table th:nth-child(1),
.product-table td:nth-child(1) {
  width: 150px;
}

.product-table th:nth-child(2),
.product-table td:nth-child(2) {
  width: 330px;
}

.product-table th:nth-child(3),
.product-table td:nth-child(3),
.product-table th:nth-child(4),
.product-table td:nth-child(4),
.product-table th:nth-child(5),
.product-table td:nth-child(5),
.product-table th:nth-child(8),
.product-table td:nth-child(8) {
  width: 130px;
}

.product-table th:nth-child(6),
.product-table td:nth-child(6),
.product-table th:nth-child(7),
.product-table td:nth-child(7) {
  width: 145px;
}

.customer-table th:nth-child(1),
.customer-table td:nth-child(1),
.supplier-table th:nth-child(1),
.supplier-table td:nth-child(1) {
  width: 260px;
}

.customer-table th:nth-child(2),
.customer-table td:nth-child(2),
.supplier-table th:nth-child(2),
.supplier-table td:nth-child(2) {
  width: 150px;
}

.customer-table th:nth-child(3),
.customer-table td:nth-child(3),
.supplier-table th:nth-child(3),
.supplier-table td:nth-child(3) {
  width: 160px;
}

.customer-table th:nth-child(4),
.customer-table td:nth-child(4),
.supplier-table th:nth-child(4),
.supplier-table td:nth-child(4) {
  width: 240px;
}

.customer-table th:nth-child(5),
.customer-table td:nth-child(5),
.supplier-table th:nth-child(5),
.supplier-table td:nth-child(5) {
  width: 160px;
}

.customer-table th:nth-child(6),
.customer-table td:nth-child(6),
.supplier-table th:nth-child(6),
.supplier-table td:nth-child(6) {
  width: 150px;
}

.compact-grid .grid-row {
  cursor: default;
  display: table-row;
  height: var(--grid-row-height);
  min-height: 0;
  min-width: 0;
  padding: 0;
}

.compact-grid tbody tr:nth-child(even) td {
  background: #f8fbfd;
}

.compact-grid .grid-row:not(.grid-row-empty):hover td {
  background: #e8f3fb;
}

.product-table .product-row.selected td {
  background: #d7ebfb;
  box-shadow: inset 0 1px 0 #8fbde2, inset 0 -1px 0 #8fbde2;
}

.compact-grid .grid-row-empty {
  cursor: default;
  pointer-events: none;
}

.compact-grid .tag {
  border-radius: 8px;
  display: inline-block;
  font-size: 11px;
  line-height: 16px;
  max-height: 18px;
  max-width: 100%;
  overflow: hidden;
  padding: 0 6px;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

.compact-grid td strong,
.compact-grid td small {
  display: inline;
}

.cash-filters {
  grid-template-columns: 170px 160px minmax(220px, 1fr) auto;
}

.cash-close-form {
  grid-template-columns: minmax(210px, 1fr) 150px minmax(240px, 1fr) auto minmax(180px, 0.8fr);
}

.cash-open-form {
  background: var(--panel-tint);
  grid-template-columns: minmax(210px, 1fr) 150px minmax(240px, 1fr) auto;
}

.cash-close-form {
  background: var(--panel-tint);
}

.cash-open-notes,
.cash-close-notes {
  min-width: 0;
}

.customer-filters {
  grid-template-columns: minmax(220px, 1fr) 170px 160px auto;
}

.supplier-filters {
  grid-template-columns: minmax(220px, 1fr) 170px 160px auto;
}

.supplier-create-form {
  grid-template-columns: minmax(220px, 1.2fr) 150px 140px minmax(170px, 1fr) 140px 130px 110px auto minmax(190px, 1fr);
}

.inventory-filters {
  grid-template-columns: 170px minmax(220px, 1fr) 180px minmax(220px, 1fr) auto;
}

.purchase-filters {
  grid-template-columns: 170px minmax(220px, 1fr) 160px minmax(220px, 1fr) auto;
}

.report-filters {
  grid-template-columns: minmax(190px, 1fr) 170px 170px minmax(260px, auto);
}

.module-tabs {
  align-items: center;
  background: var(--panel-tint);
  border-bottom: 1px solid var(--panel-line);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 14px;
}

.module-tabs button {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  min-height: 34px;
  padding: 7px 11px;
}

.module-tabs button:hover {
  border-color: var(--accent);
  color: var(--ink);
}

.module-tabs button.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #ffffff;
  font-weight: 700;
}

.loan-form {
  grid-template-columns: 170px 170px minmax(260px, 1fr) 120px minmax(180px, 1fr) auto;
}

.pos-terminal-panel {
  background: var(--panel-tint);
}

.module-view.active > .panel > .pos-terminal-header,
.module-view.active > .panel > .pos-product-line {
  flex: 0 0 auto;
}

.pos-terminal-header {
  align-items: center;
  background: linear-gradient(var(--panel-soft), var(--panel-tint-strong));
  border-bottom: 1px solid var(--panel-line);
  display: flex;
  justify-content: space-between;
  min-height: 54px;
  padding: 10px 14px;
}

.pos-terminal-header span,
.pos-terminal-header small {
  color: var(--muted);
  display: block;
  font-size: 12px;
  font-weight: 700;
}

.pos-terminal-header h2 {
  font-size: 18px;
  margin: 2px 0 0;
}

.pos-terminal-header strong {
  color: var(--text);
  display: block;
  font-size: 13px;
  margin-bottom: 4px;
  text-align: right;
}

.pos-form {
  background: var(--panel-tint-strong);
  border-bottom: 1px solid var(--panel-line);
  grid-template-columns: 150px 210px minmax(320px, 1fr) 280px 145px 140px 130px minmax(170px, 0.7fr);
  padding: 10px 12px;
}

.pos-quantity-action {
  align-items: end;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(92px, 1fr) minmax(74px, 0.8fr) 82px;
  min-width: 0;
}

.pos-quantity-action label,
.pos-quantity-action input,
.pos-quantity-action select {
  min-width: 0;
  width: 100%;
}

.pos-quantity-action button {
  padding-left: 10px;
  padding-right: 10px;
  width: 100%;
}

.pos-search-strip {
  background: var(--panel-tint-strong);
  border-bottom: 1px solid var(--panel-line);
  border-top: 0;
  padding: 0 12px 10px;
}

.pos-hidden-tpv-controls {
  display: none;
}

.pos-form-wide {
  min-width: 0;
}

.sales-filters {
  grid-template-columns: 150px minmax(180px, 1fr) 140px 160px minmax(190px, 1fr) auto;
}

.catalog-filters label,
.cash-open-form label,
.cash-close-form label,
.cash-filters label,
.customer-filters label,
.inline-create-form label,
.inventory-filters label,
.pos-form label,
.pos-quick-customer-form label,
.purchase-filters label,
.report-filters label,
.loan-form label,
.sales-filters label,
.supplier-filters label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 5px;
}

.catalog-filters input[type="search"],
.catalog-filters select,
.cash-open-form input,
.cash-open-form select,
.cash-close-form input,
.cash-close-form select,
.cash-filters input[type="search"],
.cash-filters select,
.customer-filters input[type="search"],
.customer-filters select,
.inline-create-form input,
.inline-create-form select,
.inventory-filters input[type="search"],
.inventory-filters select,
.pos-form input,
.pos-form select,
.pos-quick-customer-form input,
.pos-quick-customer-form select,
.purchase-filters input[type="search"],
.purchase-filters select,
.report-filters input,
.report-filters select,
.loan-form input,
.loan-form select,
.sales-filters input[type="search"],
.sales-filters select,
.supplier-filters input[type="search"],
.supplier-filters select {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  font: inherit;
  min-height: 36px;
  padding: 7px 9px;
}

.catalog-filters .checkbox-label {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  display: flex;
  gap: 8px;
  min-height: 40px;
  padding: 8px 10px;
}

.catalog-filters input[type="checkbox"] {
  height: 16px;
  margin: 0;
  width: 16px;
}

.login-form {
  align-items: end;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto auto;
  padding: 18px;
}

.login-form label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 7px;
}

.login-form select {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  font: inherit;
  min-height: 42px;
  padding: 8px 10px;
}

.catalog-filters button,
.cash-open-form button,
.cash-close-form button,
.cash-filters button,
.customer-filters button,
.inline-create-form button,
.inventory-filters button,
.pos-form button,
.pos-quick-customer-form button,
.purchase-filters button,
.report-filters button,
.loan-form button,
.sales-filters button,
.supplier-filters button,
.login-form button {
  background: var(--accent);
  border: 1px solid var(--accent-strong);
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  min-height: 38px;
  padding: 7px 12px;
}

.catalog-filters button:disabled,
.cash-open-form button:disabled,
.cash-close-form button:disabled,
.cash-filters button:disabled,
.customer-filters button:disabled,
.inline-create-form button:disabled,
.inventory-filters button:disabled,
.pos-form button:disabled,
.purchase-filters button:disabled,
.report-filters button:disabled,
.loan-form button:disabled,
.sales-filters button:disabled,
.supplier-filters button:disabled,
.login-form button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.catalog-filters .secondary-button,
.cash-open-form .secondary-button,
.cash-close-form .secondary-button,
.cash-filters .secondary-button,
.customer-filters .secondary-button,
.inline-create-form .secondary-button,
.inventory-filters .secondary-button,
.pos-form .secondary-button,
.purchase-filters .secondary-button,
.report-filters .secondary-button,
.loan-form .secondary-button,
.sales-filters .secondary-button,
.supplier-filters .secondary-button,
.login-form .secondary-button {
  background: #ffffff;
  border-color: var(--line);
  color: var(--text);
}

.form-message {
  color: var(--accent-strong);
  font-size: 13px;
  margin: 0;
  min-height: 20px;
  padding: 0 18px 16px;
}

.cash-message {
  align-self: center;
  color: var(--accent-strong);
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.pos-message {
  align-self: center;
  color: var(--accent-strong);
  font-size: 13px;
  grid-column: 1 / -1;
  line-height: 1.4;
  margin: 0;
  min-height: 18px;
}

.pos-product-results {
  border-top: 1px solid var(--panel-line-soft);
  display: grid;
  gap: 8px;
  grid-column: 1 / -1;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-top: 10px;
}

.pos-product-results[hidden] {
  display: none;
}

.pos-search-strip .empty-state {
  min-height: 48px;
}

.pos-product-result {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 72px;
  padding: 10px;
  text-align: left;
}

.pos-product-result.selected {
  background: #f0fdfa;
  border-color: var(--accent);
}

.pos-product-result strong,
.pos-product-result small,
.pos-product-result span {
  display: block;
}

.pos-product-result strong {
  font-size: 13px;
  margin-bottom: 4px;
}

.pos-product-result small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.pos-change {
  align-self: end;
  background: var(--panel-soft);
  border: 1px solid var(--panel-line-soft);
  border-radius: 6px;
  padding: 9px 10px;
}

.pos-change.attention {
  border-color: #f59e0b;
}

.pos-change span,
.pos-change strong {
  display: block;
}

.pos-change span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 5px;
}

.pos-change strong {
  font-size: 15px;
}

.pos-workspace {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 0;
  min-height: 0;
  overflow: hidden;
}

.pos-panel {
  border-top: 1px solid var(--panel-line);
}

.pos-sale-board {
  background: var(--panel-board);
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

.pos-cart-heading {
  background: var(--panel-tint);
  border-bottom: 1px solid var(--panel-line);
  color: #1f354d;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  grid-template-columns: minmax(260px, 1fr) 120px 130px 120px 130px 86px;
  min-height: 28px;
}

.pos-cart-heading span {
  border-right: 1px solid var(--panel-line-soft);
  padding: 7px 9px;
}

.pos-product-detail {
  align-items: center;
  display: flex;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding: 0;
}

.pos-product-detail div {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--panel-line-soft);
  border-radius: 6px;
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
  min-height: 30px;
  padding: 5px 8px;
  white-space: nowrap;
}

.pos-product-detail span,
.pos-product-detail strong,
.pos-ticket span,
.pos-ticket strong,
.pos-ticket small {
  display: block;
}

.pos-product-detail span,
.pos-ticket span,
.pos-ticket small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.pos-product-detail span,
.pos-ticket span {
  margin-bottom: 5px;
}

.pos-product-line {
  align-items: center;
  background: var(--panel-tint);
  border-top: 1px solid var(--panel-line);
  display: grid;
  gap: 10px;
  grid-template-columns: auto auto minmax(0, 1fr);
  min-height: 44px;
  padding: 7px 12px;
}

.pos-product-line > strong {
  font-size: 12px;
  white-space: nowrap;
}

.pos-product-line > span {
  background: #ffffff;
  border: 1px solid var(--panel-line-soft);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  padding: 4px 8px;
  white-space: nowrap;
}

.pos-product-line .empty-state {
  background: transparent;
  border: 0;
  color: var(--muted);
  min-height: 0;
  padding: 0;
}

.pos-product-line .pos-product-detail span,
.pos-product-line .pos-product-detail strong {
  display: inline;
  font-size: 11px;
  line-height: 1.2;
  margin: 0;
}

.pos-product-line .pos-product-detail strong {
  color: var(--text);
  font-size: 12px;
}

.pos-last-ticket {
  padding: 16px 18px;
}

.pos-cart {
  display: grid;
  align-content: start;
  background: var(--panel-board);
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  scrollbar-gutter: stable;
}

.pos-cart-row {
  align-items: center;
  background: var(--panel-tint);
  border-bottom: 1px solid var(--panel-line-soft);
  display: grid;
  gap: 0;
  grid-template-columns: minmax(260px, 1fr) 120px 130px 120px 130px 86px;
  min-height: 54px;
  padding: 0;
}

.pos-cart-row:last-child {
  border-bottom: 0;
}

.pos-cart-row > * {
  min-width: 0;
  padding: 8px 9px;
}

.pos-cart-row strong,
.pos-cart-row small,
.pos-cart-row span {
  display: block;
}

.pos-cart-row strong {
  font-size: 14px;
  margin-bottom: 4px;
}

.pos-cart-row small,
.pos-cart-row span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.pos-cart-quantity {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 7px;
}

.pos-cart-quantity input {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  font: inherit;
  min-height: 38px;
  padding: 7px 9px;
  width: 100%;
}

.pos-cart-row button {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  min-height: 38px;
  padding: 7px 12px;
}

.pos-checkout-bar {
  align-items: stretch;
  background: var(--panel-tint);
  border-top: 1px solid var(--panel-line);
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(360px, 1fr) auto;
  padding: 10px 12px;
}

.pos-cart-summary {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0;
}

.pos-cart-summary div {
  background: var(--panel-soft);
  border: 1px solid var(--panel-line-soft);
  border-radius: 6px;
  padding: 10px;
}

.pos-cart-summary span,
.pos-cart-summary strong {
  display: block;
}

.pos-cart-summary span {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 5px;
}

.pos-cart-summary div:last-child {
  background: #ffffff;
  border-color: var(--panel-line);
}

.pos-cart-summary div:last-child strong {
  font-size: 28px;
  line-height: 1;
}

.pos-final-actions {
  align-items: stretch;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: end;
}

.pos-final-actions button {
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  min-height: 46px;
  min-width: 112px;
  padding: 9px 14px;
}

.pos-final-actions .secondary-button {
  background: #ffffff;
  border: 1px solid var(--panel-line);
  color: var(--text);
}

.pos-final-actions #pos-submit {
  background: var(--accent);
  border: 1px solid var(--accent-strong);
  color: #ffffff;
  min-width: 140px;
}

.pos-ticket {
  border: 1px solid var(--line);
  border-radius: 6px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) 120px 150px minmax(180px, 1fr) auto;
  padding: 12px;
}

.pos-ticket button,
.sales-document-actions button,
.sales-ticket-actions button {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  min-height: 38px;
  padding: 7px 12px;
}

.cash-summary,
.inventory-summary,
.purchase-order-summary,
.purchase-payable-summary,
.purchase-record-summary,
.purchase-receipt-summary,
.purchase-supplier-payment-summary,
.purchase-summary,
.loan-summary,
.sales-summary {
  border-bottom: 1px solid var(--panel-line);
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding: 10px 14px;
}

.cash-summary div,
.inventory-summary div,
.purchase-order-summary div,
.purchase-payable-summary div,
.purchase-record-summary div,
.purchase-receipt-summary div,
.purchase-supplier-payment-summary div,
.purchase-summary div,
.loan-summary div,
.sales-summary div {
  background: var(--panel-soft);
  border: 1px solid var(--panel-line-soft);
  border-radius: 6px;
  padding: 8px 10px;
}

.cash-summary span,
.cash-summary strong,
.inventory-summary span,
.inventory-summary strong,
.purchase-order-summary span,
.purchase-order-summary strong,
.purchase-payable-summary span,
.purchase-payable-summary strong,
.purchase-record-summary span,
.purchase-record-summary strong,
.purchase-receipt-summary span,
.purchase-receipt-summary strong,
.purchase-supplier-payment-summary span,
.purchase-supplier-payment-summary strong,
.purchase-summary span,
.purchase-summary strong,
.sales-summary span,
.sales-summary strong {
  display: block;
}

.cash-summary span,
.inventory-summary span,
.purchase-order-summary span,
.purchase-payable-summary span,
.purchase-record-summary span,
.purchase-receipt-summary span,
.purchase-supplier-payment-summary span,
.purchase-summary span,
.loan-summary span,
.sales-summary span {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 4px;
}

.cash-summary strong,
.inventory-summary strong,
.purchase-order-summary strong,
.purchase-payable-summary strong,
.purchase-record-summary strong,
.purchase-receipt-summary strong,
.purchase-supplier-payment-summary strong,
.purchase-summary strong,
.loan-summary strong,
.sales-summary strong {
  font-size: 18px;
}

.purchase-summary strong,
.sales-summary strong {
  font-size: 16px;
}

.purchase-order-summary,
.purchase-payable-summary,
.purchase-record-summary,
.purchase-receipt-summary,
.purchase-supplier-payment-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sales-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.product-detail {
  border-bottom: 1px solid var(--line);
  padding: 16px 18px;
}

.detail-header {
  align-items: start;
  display: flex;
  justify-content: space-between;
  margin-bottom: 14px;
}

.detail-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: end;
}

.detail-header strong,
.detail-header small {
  display: block;
}

.detail-header strong {
  font-size: 16px;
  margin-bottom: 4px;
}

.detail-header small {
  color: var(--muted);
  line-height: 1.4;
}

.detail-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 14px;
}

.detail-grid div {
  background: var(--surface-muted);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
}

.detail-grid span,
.detail-grid strong {
  display: block;
}

.detail-grid span {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 5px;
}

.detail-grid strong {
  font-size: 13px;
}

.product-detail h3 {
  font-size: 14px;
  margin-bottom: 10px;
}

.branch-detail-list {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.branch-detail-row {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
}

.branch-detail-row strong,
.branch-detail-row span,
.branch-detail-row small {
  display: block;
}

.branch-detail-row strong {
  font-size: 13px;
  margin-bottom: 5px;
}

.branch-detail-row span {
  color: var(--accent-strong);
  font-weight: 700;
  margin-bottom: 4px;
}

.branch-detail-row small {
  color: var(--muted);
  line-height: 1.4;
}

.summary-strip {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 20px;
}

.metric-card {
  min-height: 108px;
  padding: 16px;
}

.metric-card span,
.metric-card strong,
.metric-card small {
  display: block;
}

.metric-card span {
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 12px;
}

.metric-card strong {
  font-size: 30px;
  line-height: 1;
  margin-bottom: 10px;
}

.metric-card small {
  color: var(--muted);
  line-height: 1.4;
}

.section-block {
  margin-bottom: 20px;
}

.section-heading {
  align-items: end;
  display: flex;
  justify-content: space-between;
  margin-bottom: 12px;
}

.section-heading span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.branch-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.branch-card,
.metric-card,
.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.branch-card {
  min-height: 116px;
  padding: 16px;
}

.branch-card span,
.branch-card strong,
.branch-card small {
  display: block;
}

.branch-card span {
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 16px;
}

.branch-card strong {
  font-size: 16px;
  margin-bottom: 6px;
}

.branch-card small {
  color: var(--muted);
}

.branch-card em {
  color: var(--accent-strong);
  display: block;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  margin-top: 14px;
}

.workspace {
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, 1.6fr) minmax(320px, 0.8fr);
  margin-bottom: 20px;
  min-width: 0;
}

.secondary-workspace {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.8fr);
}

.panel {
  min-width: 0;
  overflow: hidden;
}

.module-view.active > .panel,
.module-view.panel.active {
  height: 100%;
  margin-bottom: 0;
  max-height: 100%;
  min-height: 0;
}

.module-view.active > .panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.module-view.panel.active > .panel-header,
.module-view.panel.active > form,
.module-view.panel.active > .module-tabs,
.module-view.panel.active > .product-detail,
.module-view.panel.active > .inventory-summary,
.module-view.panel.active > .purchase-summary,
.module-view.panel.active > .loan-summary,
.module-view.panel.active > .sales-summary,
.module-view.active > .panel > .panel-header,
.module-view.active > .panel > form,
.module-view.active > .panel > .module-tabs,
.module-view.active > .panel > .cash-summary,
.module-view.active > .panel > .purchase-summary,
.module-view.active > .panel > .inventory-summary,
.module-view.active > .panel > .sales-message {
  flex: 0 0 auto;
}

#catalogo.module-view.active > [data-module-tab-panel] {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
}

#catalogo.module-view.active > [data-module-tab-panel][hidden] {
  display: none;
}

#catalogo.module-view.active .subpanel-header,
#catalogo.module-view.active .catalog-filters {
  flex: 0 0 auto;
}

#catalogo.module-view.active .compact-grid-container {
  flex: 1 1 auto;
  min-height: 0;
}

.panel-header {
  align-items: center;
  background: linear-gradient(var(--panel-soft), var(--panel-tint));
  border-bottom: 1px solid var(--panel-line);
  display: flex;
  justify-content: space-between;
  padding: 16px 18px;
}

.panel-header span {
  color: var(--muted);
  font-size: 13px;
}

.panel-header-actions {
  align-items: center;
  display: flex;
  gap: 10px;
}

.panel-header-actions button,
.panel-link-action {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  min-height: 34px;
  padding: 6px 10px;
  text-decoration: none;
}

.panel-header-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.module-list,
.cash-movement-list,
.cash-session-list,
.customer-list,
.inventory-balance-list,
.inventory-movement-list,
.product-list,
.purchase-order-list,
.purchase-payable-list,
.purchase-record-list,
.purchase-receipt-list,
.purchase-supplier-payment-list,
.purchase-suggestion-list,
.loan-list,
.role-list,
.sales-order-list,
.sales-payment-list,
.sales-quote-list,
.sales-ticket-list,
.supplier-product-link-list,
.supplier-list,
.user-list {
  align-content: start;
  display: grid;
  grid-auto-rows: max-content;
}

.product-list.compact-grid-container,
.customer-list.compact-grid-container,
.supplier-list.compact-grid-container {
  align-content: stretch;
  display: block;
  grid-auto-rows: initial;
}

.module-list,
.cash-movement-list,
.cash-session-list,
.inventory-balance-list,
.inventory-movement-list,
.purchase-order-list,
.purchase-payable-list,
.purchase-record-list,
.purchase-receipt-list,
.purchase-supplier-payment-list,
.purchase-suggestion-list,
.loan-list,
.role-list,
.sales-order-list,
.sales-payment-list,
.sales-quote-list,
.sales-ticket-list,
.supplier-product-link-list,
.user-list,
.branch-grid,
.cash-workspace,
.inventory-workspace,
.report-workspace {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.module-view.panel.active > .compact-grid-container,
.module-view.panel.active > .inventory-workspace,
.module-view.panel.active > .purchase-workspace,
.module-view.active > .panel > .cash-workspace,
.module-view.active > .panel > .sales-ticket-list,
.module-view.active > .panel > .sales-quote-list,
.module-view.active > .panel > .sales-order-list,
.module-view.active > .panel > .sales-payment-list,
.module-view.active > .panel > .sales-workspace,
.module-view.active > .panel > .loan-list,
.module-view.active > .report-workspace {
  flex: 1 1 auto;
}

.module-row,
.cash-movement-row,
.cash-session-row,
.customer-row,
.inventory-balance-row,
.inventory-movement-row,
.product-row,
.purchase-order-row,
.purchase-payable-row,
.purchase-record-row,
.purchase-receipt-row,
.purchase-supplier-payment-row,
.purchase-suggestion-row,
.loan-row,
.role-row,
.sales-order-row,
.sales-payment-row,
.sales-quote-row,
.sales-ticket-row,
.supplier-row,
.user-row {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 10px;
  min-height: 56px;
  padding: 10px 14px;
}

.cash-movement-row,
.cash-session-row,
.customer-row,
.inventory-balance-row,
.inventory-movement-row,
.product-row,
.purchase-order-row,
.purchase-payable-row,
.purchase-record-row,
.purchase-receipt-row,
.purchase-supplier-payment-row,
.purchase-suggestion-row,
.loan-row,
.sales-order-row,
.sales-payment-row,
.sales-quote-row,
.sales-ticket-row,
.supplier-row {
  min-width: 920px;
}

.purchase-suggestion-row {
  min-width: 1040px;
}

.product-row {
  min-width: 980px;
}

.product-suppliers-form {
  gap: 12px;
  overflow-x: hidden;
  max-width: 100%;
  width: 100%;
}

.product-supplier-panel {
  border: 1px solid var(--line);
  border-radius: 6px;
  display: grid;
  gap: 0;
  min-width: 0;
  overflow: hidden;
}

.supplier-product-table-wrap {
  max-width: 100%;
  max-height: 48vh;
  overflow-x: hidden;
  overflow-y: auto;
  width: 100%;
}

.supplier-product-table {
  max-width: 100%;
  table-layout: fixed;
  width: 100%;
}

.supplier-product-table th:nth-child(1),
.supplier-product-table td:nth-child(1) {
  width: 34%;
}

.supplier-product-table th:nth-child(2),
.supplier-product-table td:nth-child(2) {
  width: 20%;
}

.supplier-product-table th:nth-child(3),
.supplier-product-table td:nth-child(3) {
  width: 18%;
}

.supplier-product-table th:nth-child(4),
.supplier-product-table td:nth-child(4) {
  width: 12%;
}

.supplier-product-table th:nth-child(5),
.supplier-product-table td:nth-child(5) {
  text-align: right;
  width: 16%;
}

.supplier-product-table th,
.supplier-product-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.supplier-product-table th {
  height: 28px;
  line-height: 28px;
  padding-bottom: 0;
  padding-top: 0;
}

.product-supplier-form-grid {
  align-items: end;
  background: var(--panel-tint);
  border-bottom: 1px solid var(--panel-line);
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(170px, 1fr) minmax(130px, 0.8fr) 110px 100px auto minmax(140px, 0.8fr);
  padding: 10px 14px;
}

.product-supplier-form-grid > * {
  min-width: 0;
}

.compact-row-button {
  min-height: 28px;
  padding: 4px 8px;
}

@media (max-width: 920px) {
  .product-supplier-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-supplier-form-grid .inline-form-message,
  .product-supplier-form-grid button {
    grid-column: span 2;
  }
}

.module-row {
  grid-template-columns: 1fr 88px 110px;
}

.cash-workspace {
  display: grid;
  grid-template-columns: 1fr;
}

.cash-block {
  border-bottom: 1px solid var(--line);
}

.cash-block:last-child {
  border-bottom: 0;
}

.cash-session-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) 130px 130px 130px 150px;
}

.cash-movement-row {
  align-items: start;
  grid-template-columns: minmax(220px, 1.2fr) 120px minmax(180px, 0.9fr) minmax(260px, 1.2fr);
}

.customer-row {
  align-items: start;
  grid-template-columns: minmax(240px, 1fr) minmax(260px, 1fr) 190px 160px;
}

.inventory-workspace {
  display: grid;
  grid-template-columns: 1fr;
}

.purchase-workspace {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 0;
  overflow: hidden;
}

.sales-workspace {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 0;
  overflow: hidden;
}

.report-summary {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  padding: 0 18px 18px;
}

.report-summary div {
  background: var(--panel-soft);
  border: 1px solid var(--panel-line-soft);
  border-radius: 6px;
  padding: 10px;
}

.report-summary span,
.report-summary strong {
  display: block;
}

.report-summary span {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 6px;
}

.report-summary strong {
  font-size: 18px;
}

.report-workspace {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 20px;
}

.report-workspace > [data-module-tab-panel] {
  grid-column: 1 / -1;
}

.report-alert-panel {
  grid-column: 1 / -1;
}

.report-list {
  display: grid;
}

.report-row {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  min-height: 64px;
  padding: 12px 18px;
}

.report-row:last-child {
  border-bottom: 0;
}

.report-row strong,
.report-row small {
  display: block;
}

.report-row small {
  color: var(--muted);
  margin-top: 4px;
}

.report-row-amount {
  text-align: right;
}

.inventory-block:first-child {
  border-bottom: 1px solid var(--line);
}

.purchase-block {
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

.purchase-block:last-child {
  border-bottom: 0;
}

.sales-block {
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

.sales-block:last-child {
  border-bottom: 0;
}

.sales-block > .sales-message,
.sales-block > .subpanel-header {
  flex: 0 0 auto;
}

.sales-block > .sales-order-list,
.sales-block > .sales-quote-list,
.sales-block > .sales-ticket-list {
  flex: 1 1 auto;
  min-height: 0;
}

.purchase-block > .purchase-order-list,
.purchase-block > .purchase-payable-list,
.purchase-block > .purchase-record-list,
.purchase-block > .purchase-receipt-list,
.purchase-block > .purchase-supplier-payment-list,
.purchase-block > .purchase-suggestion-list {
  flex: 1 1 auto;
  min-height: 0;
}

.subpanel-header {
  align-items: center;
  background: var(--panel-tint);
  border-bottom: 1px solid var(--panel-line);
  display: flex;
  justify-content: space-between;
  min-height: 38px;
  padding: 8px 14px;
}

.subpanel-header h3 {
  font-size: 13px;
  margin: 0;
}

.subpanel-header span {
  color: var(--muted);
  font-size: 12px;
}

.inventory-balance-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) 100px 84px 120px 130px;
}

.inventory-movement-row {
  align-items: start;
  grid-template-columns: minmax(160px, 0.9fr) minmax(180px, 1fr) 100px 100px minmax(190px, 1fr);
}

.purchase-suggestion-row {
  align-items: start;
  grid-template-columns: minmax(240px, 1.2fr) 120px 110px minmax(260px, 1fr) 160px auto;
}

.purchase-order-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) minmax(190px, 1fr) 120px 150px 120px auto;
}

.purchase-receipt-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) minmax(190px, 1fr) 120px 150px 130px auto;
}

.purchase-record-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) minmax(190px, 1fr) 120px 150px 130px;
}

.purchase-payable-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) minmax(190px, 1fr) 120px 150px 130px auto;
}

.purchase-supplier-payment-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) minmax(190px, 1fr) 150px 120px 130px auto;
}

.loan-row {
  align-items: start;
  grid-template-columns: minmax(150px, 0.9fr) minmax(240px, 1.25fr) minmax(150px, 0.8fr) minmax(170px, 0.9fr) minmax(120px, auto);
}

.sales-ticket-row {
  align-items: start;
  grid-template-columns: minmax(150px, 0.8fr) minmax(170px, 1fr) 115px minmax(220px, 1fr) 130px auto;
}

.sales-payment-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) 120px minmax(180px, 1fr);
}

.sales-order-row,
.sales-quote-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 1fr) 120px 130px auto;
}

.supplier-row {
  align-items: start;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(150px, 0.8fr) minmax(120px, 0.6fr) minmax(130px, 0.7fr);
}

.product-row {
  align-items: start;
  grid-template-columns: minmax(240px, 1fr) 140px minmax(360px, 1.25fr) 70px;
}

.product-row.selected {
  background: #f0fdfa;
}

.role-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 150px) minmax(0, 108px);
}

.user-row {
  grid-template-columns: 1fr 170px;
}

.module-row:last-child,
.cash-movement-row:last-child,
.cash-session-row:last-child,
.customer-row:last-child,
.inventory-balance-row:last-child,
.inventory-movement-row:last-child,
.product-row:last-child,
.purchase-order-row:last-child,
.purchase-payable-row:last-child,
.purchase-record-row:last-child,
.purchase-receipt-row:last-child,
.purchase-supplier-payment-row:last-child,
.purchase-suggestion-row:last-child,
.loan-row:last-child,
.role-row:last-child,
.sales-order-row:last-child,
.sales-payment-row:last-child,
.sales-quote-row:last-child,
.sales-ticket-row:last-child,
.supplier-row:last-child,
.user-row:last-child {
  border-bottom: 0;
}

.module-row > *,
.cash-movement-row > *,
.cash-session-row > *,
.customer-row > *,
.inventory-balance-row > *,
.inventory-movement-row > *,
.product-row > *,
.purchase-order-row > *,
.purchase-payable-row > *,
.purchase-record-row > *,
.purchase-receipt-row > *,
.purchase-supplier-payment-row > *,
.purchase-suggestion-row > *,
.loan-row > *,
.role-row > *,
.sales-order-row > *,
.sales-payment-row > *,
.sales-quote-row > *,
.sales-ticket-row > *,
.supplier-row > *,
.user-row > * {
  min-width: 0;
}

.module-row strong,
.cash-movement-row strong,
.cash-session-row strong,
.customer-row strong,
.inventory-balance-row strong,
.inventory-movement-row strong,
.product-row strong,
.purchase-order-row strong,
.purchase-payable-row strong,
.purchase-record-row strong,
.purchase-receipt-row strong,
.purchase-supplier-payment-row strong,
.purchase-suggestion-row strong,
.loan-row strong,
.role-row strong,
.sales-order-row strong,
.sales-payment-row strong,
.sales-quote-row strong,
.sales-ticket-row strong,
.supplier-row strong,
.user-row strong {
  display: block;
  font-size: 14px;
  margin-bottom: 4px;
}

.module-row small,
.cash-movement-row small,
.cash-session-row small,
.customer-row small,
.inventory-balance-row small,
.inventory-movement-row small,
.product-row small,
.purchase-order-row small,
.purchase-payable-row small,
.purchase-record-row small,
.purchase-receipt-row small,
.purchase-supplier-payment-row small,
.purchase-suggestion-row small,
.loan-row small,
.role-row small,
.sales-order-row small,
.sales-payment-row small,
.sales-quote-row small,
.sales-ticket-row small,
.supplier-row small,
.user-row small {
  color: var(--muted);
  display: block;
  font-size: 12px;
  line-height: 1.4;
}

.customer-main p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  margin-bottom: 0;
}

.supplier-main p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  margin-bottom: 0;
}

.inventory-balance-row span,
.inventory-movement-row span,
.cash-movement-row span,
.cash-session-row span,
.purchase-order-row span,
.purchase-payable-row span,
.purchase-record-row span,
.purchase-receipt-row span,
.purchase-supplier-payment-row span,
.purchase-suggestion-row span,
.loan-row span,
.sales-order-row span,
.sales-payment-row span,
.sales-quote-row span,
.sales-ticket-row span {
  color: var(--muted);
  display: block;
  font-size: 12px;
  margin-bottom: 4px;
}

.cash-session-state,
.customer-fiscal,
.customer-contact,
.customer-status,
.purchase-priority,
.sales-ticket-state,
.supplier-contact,
.supplier-fiscal,
.supplier-status,
.supplier-terms {
  display: grid;
  gap: 5px;
}

.cash-session-state small,
.customer-fiscal span,
.customer-status small,
.sales-ticket-state small,
.supplier-fiscal span,
.supplier-status small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.customer-contact strong,
.supplier-contact small {
  overflow-wrap: anywhere;
}

.cash-session-state,
.customer-status,
.purchase-priority,
.sales-ticket-state,
.supplier-status {
  justify-items: end;
}

.purchase-order-actions,
.loan-actions,
.sales-document-actions,
.sales-ticket-actions {
  display: flex;
  gap: 8px;
  justify-content: end;
}

.sales-message {
  color: var(--accent-strong);
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
  min-height: 20px;
  padding: 0 18px 12px;
}

.action-dialog {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-sizing: border-box;
  box-shadow: var(--shadow);
  color: var(--text);
  max-width: calc(100vw - 32px);
  padding: 0;
  width: 480px;
}

.product-dialog {
  width: min(1080px, calc(100vw - 32px));
}

dialog.product-suppliers-dialog {
  max-width: calc(100vw - 32px);
  overflow-x: hidden;
  width: min(1120px, calc(100vw - 32px));
}

dialog.product-branch-stock-dialog {
  max-width: calc(100vw - 32px);
  overflow-x: hidden;
  width: min(980px, calc(100vw - 32px));
}

dialog.product-loan-request-dialog {
  width: min(560px, calc(100vw - 32px));
}

dialog.product-suppliers-dialog .action-dialog-form,
dialog.product-suppliers-dialog .product-supplier-panel,
dialog.product-suppliers-dialog .supplier-product-table-wrap {
  box-sizing: border-box;
}

dialog.product-branch-stock-dialog .action-dialog-form,
dialog.product-branch-stock-dialog .branch-stock-table-wrap {
  box-sizing: border-box;
}

.loan-request-summary {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.loan-request-summary div {
  background: var(--surface-muted);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 8px 10px;
}

.loan-request-summary span,
.loan-request-summary strong {
  display: block;
}

.loan-request-summary span {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 3px;
}

#customer-dialog,
#supplier-dialog {
  width: min(760px, calc(100vw - 32px));
}

.action-dialog::backdrop {
  background: rgba(15, 23, 42, 0.45);
}

.action-dialog-form {
  box-sizing: border-box;
  display: grid;
  gap: 18px;
  max-height: calc(100vh - 48px);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 20px;
}

.product-dialog-form {
  gap: 14px;
}

.product-dialog-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#customer-dialog .product-dialog-grid,
#supplier-dialog .product-dialog-grid {
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.product-dialog-grid .inline-form-wide {
  grid-column: span 2;
}

.action-dialog-header {
  align-items: start;
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  padding-bottom: 14px;
}

.action-dialog-header span {
  color: var(--accent);
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.action-dialog-form > p {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
}

.action-dialog-form label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 7px;
  min-width: 0;
}

.action-dialog-form input,
.action-dialog-form select,
.action-dialog-form textarea {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  box-sizing: border-box;
  font: inherit;
  min-height: 42px;
  min-width: 0;
  padding: 9px 10px;
  resize: vertical;
  width: 100%;
}

.product-dialog .product-detail {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 12px;
}

.product-dialog .detail-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.catalog-entity-dialog {
  width: min(680px, calc(100vw - 32px));
}

.catalog-entity-panel {
  min-height: 0;
}

.catalog-entity-list {
  min-height: 0;
}

.catalog-entity-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.product-kardex-dialog {
  width: min(1040px, calc(100vw - 32px));
}

.kardex-summary {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.kardex-summary div {
  background: var(--surface-muted);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
}

.kardex-summary span,
.kardex-summary strong {
  display: block;
}

.kardex-summary span {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 4px;
}

.kardex-table-wrap {
  border: 1px solid var(--line);
  border-radius: 6px;
  max-height: 52vh;
  overflow: auto;
}

.branch-stock-table-wrap {
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
}

.kardex-table {
  min-width: 920px;
}

.branch-stock-table {
  min-width: 0;
  width: 100%;
}

.branch-stock-table th,
.branch-stock-table td {
  height: 32px;
  white-space: nowrap;
}

.branch-stock-table th:last-child,
.branch-stock-table td:last-child {
  text-align: right;
  width: 160px;
}

.branch-stock-table button {
  min-height: 28px;
  padding: 4px 9px;
}

.kardex-table td,
.kardex-table th {
  white-space: nowrap;
}

.kardex-table td:last-child {
  white-space: normal;
}

.action-dialog-actions {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: end;
}

.action-dialog-actions .inline-form-message {
  margin-right: auto;
  text-align: left;
}

.action-dialog button {
  border: 1px solid var(--accent-strong);
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  min-height: 40px;
  padding: 8px 13px;
}

.action-dialog button:not(.secondary-button):not(.danger-button):not(.dialog-close-button) {
  background: var(--accent);
  color: #ffffff;
}

.action-dialog .secondary-button,
.action-dialog .dialog-close-button {
  background: #ffffff;
  border-color: var(--line);
  color: var(--text);
}

.action-dialog .dialog-close-button {
  min-height: 34px;
  padding: 6px 9px;
}

.action-dialog .danger-button,
.sales-document-actions .danger-button {
  background: #ffffff;
  border-color: #fecaca;
  color: var(--danger);
}

.loan-actions input {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  font: inherit;
  min-height: 34px;
  padding: 6px 8px;
  width: 88px;
}

.action-dialog button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.purchase-suggestion-row p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  margin-bottom: 0;
}

.purchase-suppliers small,
.purchase-priority small,
.sales-ticket-state small {
  overflow-wrap: anywhere;
}

.state.attention {
  background: #fff7ed;
  color: var(--amber);
}

.product-main p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  margin-bottom: 0;
}

.product-total {
  background: var(--surface-muted);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
}

.product-total span,
.product-total strong {
  display: block;
}

.product-total span {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 6px;
}

.product-total strong {
  font-size: 16px;
}

.product-branches {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.branch-setting {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 9px;
}

.branch-setting span,
.branch-setting strong,
.branch-setting small {
  display: block;
}

.branch-setting span {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 5px;
}

.branch-setting strong {
  color: var(--accent-strong);
  margin-bottom: 3px;
}

.product-actions {
  display: flex;
  justify-content: end;
}

.detail-button {
  background: var(--accent);
  border: 1px solid var(--accent-strong);
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  min-height: 36px;
  padding: 7px 12px;
}

.tag {
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 700;
  justify-self: start;
  padding: 6px 9px;
}

.state {
  background: #f1f5f9;
  border-radius: 999px;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  justify-self: end;
  padding: 6px 9px;
}

.decision-list {
  display: grid;
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 18px;
}

.decision-list li {
  background: var(--surface-muted);
  border: 1px solid var(--line);
  border-radius: 6px;
  line-height: 1.4;
  padding: 12px;
}

.empty-state {
  color: var(--muted);
  margin: 0;
  padding: 18px;
}

.ticket-print-root {
  display: none;
}

.ticket-print-document {
  background: #ffffff;
  color: #111827;
  font-family: Arial, Helvetica, sans-serif;
  margin: 0;
  width: 72mm;
}

.ticket-print-document header {
  border-bottom: 1px solid #111827;
  display: grid;
  gap: 3px;
  padding-bottom: 8px;
  text-align: center;
}

.ticket-print-document header strong,
.ticket-print-document header span,
.ticket-print-document header em {
  display: block;
}

.ticket-print-document header strong {
  font-size: 15px;
}

.ticket-print-document header span,
.ticket-print-document header em {
  font-size: 11px;
  font-style: normal;
}

.ticket-print-meta,
.ticket-print-totals {
  border-bottom: 1px dashed #111827;
  display: grid;
  gap: 5px;
  padding: 8px 0;
}

.ticket-print-meta div,
.ticket-print-totals div {
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.ticket-print-meta span,
.ticket-print-meta strong,
.ticket-print-totals span,
.ticket-print-totals strong {
  font-size: 10px;
}

.ticket-print-items {
  border-bottom: 1px dashed #111827;
  display: grid;
  gap: 7px;
  padding: 8px 0;
}

.ticket-print-items div {
  display: grid;
  gap: 2px;
  grid-template-columns: 1fr auto;
}

.ticket-print-items strong {
  grid-column: 1 / -1;
}

.ticket-print-items strong,
.ticket-print-items span {
  font-size: 10px;
}

.ticket-print-document footer {
  display: grid;
  gap: 5px;
  padding-top: 8px;
  text-align: center;
}

.ticket-print-document footer span,
.ticket-print-document footer small {
  font-size: 10px;
}

@media (max-width: 1100px) {
  .summary-strip,
  .module-launcher,
  .branch-grid,
  .workspace,
  .catalog-filters,
  .cash-open-form,
  .cash-close-form,
  .cash-filters,
  .customer-filters,
  .inventory-filters,
  .pos-form,
  .pos-quick-customer-form,
  .purchase-filters,
  .report-filters,
  .sales-filters,
  .supplier-filters,
  .login-form {
    grid-template-columns: 1fr 1fr;
  }

  .secondary-workspace {
    grid-template-columns: 1fr;
  }

  .branch-detail-list,
  .detail-grid,
  .cash-summary,
  .inventory-summary,
  .pos-cart-summary,
  .pos-product-results,
  .pos-product-detail,
  .purchase-order-summary,
  .purchase-payable-summary,
  .purchase-record-summary,
  .purchase-receipt-summary,
  .purchase-supplier-payment-summary,
.purchase-summary,
.loan-summary,
.sales-summary,
.report-summary {
    grid-template-columns: 1fr 1fr;
  }

  .report-workspace {
    grid-template-columns: 1fr;
  }

  .inventory-balance-row,
  .inventory-movement-row,
  .cash-movement-row,
  .cash-session-row,
  .purchase-order-row,
  .purchase-payable-row,
  .purchase-record-row,
  .purchase-receipt-row,
  .purchase-supplier-payment-row,
  .purchase-suggestion-row,
  .loan-row,
  .pos-cart-heading,
  .pos-cart-row,
  .pos-ticket,
  .sales-order-row,
  .sales-payment-row,
  .sales-quote-row,
  .sales-ticket-row {
    grid-template-columns: 1fr 1fr;
  }

  .report-row {
    grid-template-columns: 1fr auto;
  }

  .report-row .state {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .supplier-row {
    grid-template-columns: 1fr 1fr;
  }

  .pos-checkout-bar,
  .pos-support-grid {
    grid-template-columns: 1fr;
  }

  .pos-support-grid .pos-panel {
    border-right: 0;
    border-top: 1px solid var(--line);
  }

  .cash-session-state,
  .purchase-priority,
  .purchase-order-actions,
  .loan-actions,
  .sales-document-actions,
  .sales-ticket-actions,
  .sales-ticket-state,
  .supplier-status {
    justify-items: start;
    justify-content: start;
  }
}

@media (max-width: 760px) {
  body {
    overflow: auto;
  }

  .app-shell {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 100vh;
    overflow: visible;
  }

  .sidebar {
    max-height: none;
    padding: 18px;
    position: static;
  }

  .nav-list {
    grid-template-columns: repeat(2, 1fr);
  }

  .content {
    height: auto;
    min-height: 100vh;
    overflow: visible;
    padding: 18px;
  }

  .module-view,
  .module-view.panel,
  #reportes.module-view.active,
  #administracion.module-view.active {
    overflow: visible;
  }

  .topbar,
  .section-heading,
  .workspace,
  .module-launcher,
  .operation-grid,
  .operation-grid.compact,
  .catalog-filters,
  .cash-open-form,
  .cash-close-form,
  .cash-filters,
  .customer-filters,
  .inventory-filters,
  .pos-form,
  .pos-quick-customer-form,
  .purchase-filters,
  .report-filters,
  .sales-filters,
  .supplier-filters,
  .login-form,
  .summary-strip,
  .branch-grid {
    display: grid;
    grid-template-columns: 1fr;
  }

  .module-row,
  .cash-movement-row,
  .cash-session-row,
  .customer-row,
  .inventory-balance-row,
  .inventory-movement-row,
  .product-row,
  .purchase-order-row,
  .purchase-payable-row,
  .purchase-record-row,
  .purchase-receipt-row,
  .purchase-supplier-payment-row,
  .purchase-suggestion-row,
  .loan-row,
  .pos-cart-heading,
  .pos-cart-row,
  .pos-ticket,
  .role-row,
  .sales-order-row,
  .sales-payment-row,
  .sales-quote-row,
  .sales-ticket-row,
  .supplier-row,
  .user-row {
    grid-template-columns: 1fr;
    min-width: 0;
  }

  .pos-terminal-header {
    align-items: start;
    display: grid;
    gap: 10px;
  }

  .pos-terminal-header strong,
  .pos-terminal-header small {
    text-align: left;
  }

  .product-branches {
    grid-template-columns: 1fr;
  }

  .branch-detail-list,
  .detail-grid,
  .cash-summary,
  .inventory-summary,
  .pos-cart-summary,
  .pos-product-results,
  .pos-product-detail,
  .purchase-summary,
  .purchase-order-summary,
  .purchase-payable-summary,
  .purchase-record-summary,
  .purchase-receipt-summary,
  .purchase-supplier-payment-summary,
  .sales-summary {
    grid-template-columns: 1fr;
  }

  .report-summary,
  .report-workspace {
    grid-template-columns: 1fr;
  }

  .report-row {
    grid-template-columns: 1fr;
  }

  .report-row-amount {
    text-align: left;
  }

  .action-dialog-form {
    padding: 16px;
  }

  .product-dialog-grid,
  #customer-dialog .product-dialog-grid,
  #supplier-dialog .product-dialog-grid {
    grid-template-columns: 1fr;
  }

  .product-dialog-grid .inline-form-wide {
    grid-column: auto;
  }

  .action-dialog-actions {
    flex-wrap: wrap;
  }

  .product-actions {
    justify-content: start;
  }

  .state {
    justify-self: start;
  }

  .cash-session-state,
  .customer-status,
  .purchase-priority,
  .purchase-order-actions,
  .loan-actions,
  .sales-document-actions,
  .sales-ticket-actions,
  .sales-ticket-state,
  .supplier-status {
    justify-items: start;
    justify-content: start;
  }
}

@media print {
  body {
    background: #ffffff;
  }

  .app-shell {
    display: none;
  }

  .ticket-print-root {
    display: block;
  }
}