[hidden] { display: none !important; }

textarea {
  width: 100%;
  min-height: 7rem;
  padding: .75rem .8rem;
  border: 1px solid #bdccca;
  border-radius: .7rem;
  background: #fff;
  color: #17202a;
  font: inherit;
  resize: vertical;
}

.customer-grid,
.sale-list,
.sale-line-list,
.presentation-grid {
  display: grid;
  gap: 1rem;
}

.customer-filters {
  grid-template-columns: minmax(14rem, 2fr) minmax(10rem, 1fr) auto auto;
}

.customer-card h2,
.sale-list-card h2 { margin-top: .65rem; }

.sale-status-draft { background: var(--warning-soft); color: var(--warning); }
.sale-status-confirmed { background: var(--success-soft); color: var(--success); }
.sale-status-voided { background: var(--danger-soft); color: var(--danger); }

.customer-form-grid,
.sale-header-grid,
.sale-occasional-grid,
.sale-line-fields,
.sale-product-filters {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-form-wide { grid-column: 1 / -1; }
.customer-detail-list div { grid-template-columns: 10rem 1fr; }

.sales-status-tabs,
.sale-choice-grid {
  display: grid;
  gap: .75rem;
}

.sales-status-tabs {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 1rem;
}

.sale-choice-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.sale-choice {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  padding: .9rem;
  border: 1px solid #bfd0cc;
  border-radius: .8rem;
  cursor: pointer;
}

.sale-choice:has(input:checked) {
  background: var(--brand-soft);
  border-color: var(--brand);
  box-shadow: 0 0 0 2px rgb(15 118 110 / 12%);
}

.sale-choice input[type="radio"],
.checkbox-row input[type="checkbox"] {
  width: 1.15rem;
  height: 1.15rem;
  min-height: 1.15rem;
  margin-top: .15rem;
  flex: 0 0 auto;
  accent-color: var(--brand);
}

.sale-choice strong,
.sale-choice small { display: block; }
.sale-choice small { margin-top: .15rem; color: var(--muted); }
.detail-form-field { margin-top: 1rem; }

.sale-list-summary,
.sale-quote-grid {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 1rem;
}

.sale-list-summary > div,
.sale-quote-grid > div {
  padding: .75rem;
  border-radius: .7rem;
  background: #f3f7f6;
}

.sale-list-summary span,
.sale-quote-grid span {
  display: block;
  color: var(--muted);
  font-size: .8rem;
}

.sale-list-summary strong,
.sale-quote-grid strong { display: block; margin-top: .2rem; }

.sale-workspace {
  display: grid;
  align-items: start;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem);
}

.sale-main-column { display: grid; gap: 1rem; }
.sale-summary-card { position: sticky; top: 5.25rem; }
.sale-total-mobile { color: var(--brand-dark); font-size: 1.15rem; }

.sale-quote {
  padding: .9rem;
  border: 1px solid #d7e2df;
  border-radius: .8rem;
  background: #f5f8f7;
}
.sale-quote p { margin: 0; color: var(--muted); }
.sale-quote-error { background: var(--danger-soft); border-color: #ffc9c2; }
.sale-quote-warning { background: var(--warning-soft); border-color: #f0d48d; }
.sale-quote-success { background: var(--success-soft); border-color: #b7e7ca; }
.sale-quote .sale-preparation-message {
  margin-top: .65rem;
  color: var(--brand-dark);
  font-weight: 700;
}

.sale-location-stock { margin-top: .75rem; }
.sale-location-stock summary {
  color: var(--brand-dark);
  font-weight: 750;
  cursor: pointer;
}
.sale-location-stock-list {
  display: grid;
  gap: .4rem;
  margin-top: .65rem;
}
.sale-location-stock-list > div {
  display: grid;
  align-items: center;
  gap: .35rem 1rem;
  grid-template-columns: minmax(0, 1fr) auto auto;
  padding: .55rem .65rem;
  border-radius: .6rem;
  background: rgb(255 255 255 / 72%);
}
.sale-location-stock-list > div > :nth-child(2) { color: var(--muted); }
.sale-location-stock-list > div > :last-child { text-align: right; }

.sale-line-form .button:disabled {
  border-color: #cbd6d4;
  background: #dfe7e5;
  color: #5f706f;
  cursor: not-allowed;
  opacity: 1;
}

.sale-line-form .button:disabled:hover { background: #dfe7e5; }

.sale-line-card {
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: .85rem;
  background: #fff;
}

.sale-line-heading,
.sale-line-meta {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
}
.sale-line-heading span,
.sale-line-meta { color: var(--muted); }
.sale-line-heading span { display: block; margin-top: .25rem; }
.sale-line-meta { margin-top: .65rem; font-size: .84rem; }
.sale-line-actions { margin-top: .85rem; }
.sale-line-actions summary { color: var(--brand-dark); font-weight: 750; cursor: pointer; }
.sale-line-edit-form { display: grid; gap: .75rem; margin: .85rem 0; }
.sale-day-note { margin-top: 1rem; }

.presentation-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.checkbox-row { display: flex; align-items: center; gap: .6rem; font-weight: 700; }

@media (max-width: 800px) {
  .customer-filters,
  .customer-form-grid,
  .sale-header-grid,
  .sale-occasional-grid,
  .sale-line-fields,
  .sale-product-filters,
  .sale-choice-grid,
  .sale-list-summary,
  .sale-quote-grid,
  .presentation-grid,
  .sale-workspace {
    grid-template-columns: 1fr;
  }

  .customer-form-wide { grid-column: auto; }
  .sale-summary-card { position: static; }
  .customer-detail-list div { grid-template-columns: 1fr; gap: .15rem; }
  .sale-line-heading,
  .sale-line-meta { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 560px) {
  .sales-status-tabs { grid-template-columns: 1fr; }
  .page-heading-actions { align-items: stretch; flex-direction: column; }
  .page-heading-actions > .button,
  .page-heading-actions .card-actions,
  .page-heading-actions .card-actions .button { width: 100%; }
  .sale-location-stock-list > div {
    grid-template-columns: 1fr;
    gap: .15rem;
  }
  .sale-location-stock-list > div > :last-child { text-align: left; }
}