/* Sales uses the same quiet, aligned workspace as inventory and customer accounts. */
#sales-panel:focus-visible { outline:2px solid #7c937b; outline-offset:5px; }
/* Both panels share their heading, first-control, and content rows. */
.sales-layout { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px; align-items:stretch; margin-top:14px; }
.sales-layout > .sales-catalog,.sales-layout > .sale-checkout { display:grid; grid-row:span 3; grid-template-rows:subgrid; row-gap:0; min-width:0; border:1px solid var(--line); border-radius:4px; background:white; padding:20px; }
.sales-layout > * > h3 { grid-row:1; margin:0 0 16px; font-size:20px; }
.sales-start-field { grid-row:2; min-width:0; margin-bottom:12px; }
.sales-layout .sales-start-field > label { display:block; font-size:15px; font-weight:600; line-height:1.75; margin:0 0 6px; }
.sales-start-field input,.sales-start-field .select-trigger,.sales-start-field .sales-search > button { height:52px; min-height:52px; margin:0; }
.sales-catalog-body,.sale-checkout-body { grid-row:3; min-width:0; }
.sales-catalog-body { display:flex; flex-direction:column; }
.sale-checkout-body > .form-error { margin:0 0 16px; }
.sales-empty { display:flex; flex:1; flex-direction:column; justify-content:center; align-items:center; gap:12px; min-height:180px; padding:32px 16px; text-align:center; color:var(--muted); font-size:15px; }
.sales-empty p { max-width:32ch; margin:0; }
.sales-empty a { color:var(--accent); text-decoration:underline; text-underline-offset:4px; min-height:44px; display:inline-flex; align-items:center; }
.sales-products:empty { display:none; }
.sales-search,.sales-customer-search { display:flex; gap:8px; }
.sales-search input,.sales-customer-search input { min-width:0; flex:1; }
.sales-search button,.sales-customer-search button { white-space:nowrap; }
.sales-list-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:64px; }
.sales-list-toolbar p { font-size:13px; color:var(--muted); margin:0; }
.sales-pager { display:flex; align-items:center; gap:10px; flex-shrink:0; font-size:13px; }
.sales-pager button { font-size:13px; min-height:34px; padding:4px 10px; }
.sales-pager span { min-width:18px; text-align:center; }
.sales-products { border-top:1px solid var(--line); }
.sales-product { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px 16px; align-items:center; padding:16px 0; border-bottom:1px solid var(--line); }
.sales-product strong { display:block; font-size:17px; font-weight:600; overflow-wrap:anywhere; }
.sales-product small { display:block; color:var(--muted); font-size:13px; overflow-wrap:anywhere; }
.sales-product-actions { display:flex; flex-direction:column; align-items:end; gap:6px; }
.sales-product-actions span { font-size:15px; white-space:nowrap; }
.sales-product-actions button { font-size:14px; min-height:36px; padding:4px 14px; }
.sale-checkout label { font-size:15px; font-weight:600; margin:14px 0 5px; }
.sale-checkout .hint { margin:6px 0 12px; line-height:1.7; }
.sale-customer-lookup { margin-top:8px; }
.sale-customer-lookup summary { width:fit-content; cursor:pointer; color:var(--accent); font-size:14px; }
.sale-customer-lookup summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.sales-customer-search { margin-top:10px; }
.sales-customer-search input { font-size:14px; min-height:42px; }
.sales-customer-search button { font-size:14px; min-height:42px; padding:5px 12px; }
.sales-customer-toolbar { min-height:48px; }
.sale-cart-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; padding-top:8px; border-top:1px solid var(--line); }
.sale-cart-heading h4 { font-size:17px; font-weight:600; margin:12px 0; }
.sale-cart-heading span { font-size:13px; color:var(--muted); }
.sale-empty { border:1px dashed var(--line); padding:18px 14px; color:var(--muted); font-size:14px; text-align:center; }
.sale-cart-row { padding:12px 0; border-bottom:1px solid var(--line); }
.sale-cart-row:first-child { padding-top:0; }
.sale-cart-info { display:flex; justify-content:space-between; align-items:start; gap:12px; }
.sale-cart-info strong { font-size:16px; font-weight:600; overflow-wrap:anywhere; }
.sale-cart-info small { display:block; color:var(--muted); font-size:13px; }
.sale-cart-info button { padding:1px 8px; min-height:30px; font-size:13px; }
.sale-cart-quantity { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; margin-top:8px; }
.sale-cart-quantity label { display:flex; align-items:center; gap:8px; margin:0; font-weight:400; }
.sale-cart-quantity input { width:104px; max-width:50%; min-height:40px; padding:5px 8px; font-size:16px; }
.sale-cart-quantity span { font-size:15px; overflow-wrap:anywhere; }
.sale-cart-quantity output { font-size:16px; white-space:nowrap; }
.sale-transport { border-bottom:1px solid var(--line); padding-bottom:8px; margin-top:18px; }
.sale-totals { margin:16px 0; }
.sale-totals > div { display:flex; justify-content:space-between; gap:12px; padding:5px 0; font-size:15px; }
.sale-totals dt { font-weight:400; }
.sale-totals dd { margin:0; font-variant-numeric:tabular-nums; white-space:nowrap; }
.sale-totals .sale-total { border-top:1px solid var(--line); margin-top:6px; padding-top:12px; font-size:20px; }
.sale-total dt,.sale-total dd { font-weight:600; }
.sale-payment-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.sale-payment-heading label { margin:0; }
.sale-payment-heading button { font-size:13px; padding:3px 9px; min-height:34px; }
#sale-paid { margin-top:8px; }
.sale-debt { border-bottom:1px solid var(--line); padding-bottom:12px; }
#sale-validation { color:#82553a; }
#sale-submit { margin-top:16px; }
.sale-success { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 20px; margin-bottom:22px; background:#f4f7f1; border:1px solid #cbd8c9; border-radius:4px; }
.sale-success p { font-size:14px; margin:4px 0 0; }
.sale-print-link { padding:7px 14px; border:1px solid #bac9b9; border-radius:4px; background:white; white-space:nowrap; font-size:15px; }
@media(max-width:1000px) { .sales-layout { grid-template-columns:minmax(0,1fr); gap:20px; }.sales-layout > .sales-catalog,.sales-layout > .sale-checkout { display:block; grid-row:auto; }.sales-products { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:22px; } }
@media(max-width:600px) { .sales-products { display:block; }.sales-layout { gap:20px; }.sales-layout > .sales-catalog,.sales-layout > .sale-checkout { padding:16px 12px; }.sales-list-toolbar { flex-wrap:wrap; gap:6px; padding:10px 0; }.sale-success { align-items:start; flex-direction:column; padding:14px; }.sales-product { gap:10px; }.sales-product-actions span { font-size:14px; }.sale-cart-quantity input { width:88px; }.sale-cart-quantity output { font-size:15px; }.sale-payment-heading label { font-size:14px; } }
@media(max-width:400px) { .workspace-nav [role=tab] { font-size:13px; padding-inline:2px; }.sales-search button { padding-inline:12px; }.sale-totals > div { font-size:14px; }.sale-totals .sale-total { font-size:18px; } }

/* Put the common payment fields on one line where there is room. */
@media(min-width:1001px) {
  .sale-checkout label { margin-top:8px; }
  .sale-checkout .hint { margin:4px 0 8px; }
  .sale-cart-heading { padding-top:4px; }
  .sale-cart-heading h4 { margin:8px 0; }
  .sale-cart-row { padding:8px 0; }
  .sale-cart-quantity { margin-top:4px; }
  .sale-transport { margin-top:10px; padding-bottom:4px; }
  .sale-totals { margin:10px 0; }
  .sale-totals > div { padding:3px 0; }
  .sale-totals .sale-total { margin-top:4px; padding-top:8px; }
  .sale-payment-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; align-items:start; margin-top:12px; }
  .sale-payment-fields > div { min-width:0; }
  .sale-payment-heading,.sale-due-field > label { display:flex; align-items:center; min-height:36px; margin:0; }
  .sale-payment-heading label { margin:0; }
  .sale-payment-heading button { white-space:nowrap; padding-inline:7px; }
  .sale-payment-fields input { min-width:0; width:100%; margin-top:6px!important; }
  .sale-payment-fields .hint { font-size:13px; }
  .sale-debt { padding-bottom:8px; }
  #sale-submit { margin-top:10px; }
  #sale-validation:empty { display:none; }
}