.sales-index { container: sales-index / inline-size; }
.sales-index-heading { flex-wrap: wrap; align-items: center; justify-content: space-between; }
.sales-index-heading > :first-child { flex: 1 1 18rem; min-width: 0; }
.sales-index-toolbar { flex: 0 1 auto; }
.sales-index-toolbar .module-action-button { min-height: 44px; }
.sales-index-filters { grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); }
.sales-index-filters > * { min-width: 0; }
.sales-index-query { grid-column: 1 / -1; }
.sales-index-table { width: 100%; min-width: 65rem; font-size: .875rem; }
.sales-index-table th { white-space: nowrap; }
.sales-index-table td { vertical-align: middle; padding-top: .875rem; padding-bottom: .875rem; }
.sales-index-table td[data-label="Cliente"] { min-width: 11rem; overflow-wrap: anywhere; }
.sales-index-table td[data-label="Estado"] { min-width: 11rem; }
.sales-index-table td[data-label="Estado"] span { letter-spacing: .04em; line-height: 1.45; }
.sales-index-table td[data-label="Acciones"] { width: 13rem; min-width: 13rem; white-space: normal; }
.sales-index-row-actions { flex-wrap: nowrap; align-items: center; }
.sales-index-row-actions :is(a, button) {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 44px; font-size: .8125rem;
}
.sales-index-row-actions form { margin: 0; }
.sales-index-table-scroll { overscroll-behavior-x: contain; scrollbar-width: auto; }
.sales-index-table-scroll:focus-visible { outline: 2px solid var(--tenant-accent, #087e95); outline-offset: -2px; }
@container sales-index (min-width: 40rem) {
  .sales-index-query { grid-column: span 2; }
}
@container sales-index (min-width: 90rem) {
  .sales-index-filters { grid-template-columns: minmax(15rem, 1.7fr) repeat(6, minmax(8rem, 1fr)) auto; }
  .sales-index-query { grid-column: auto; }
}
/* Use the available content width, including when the sidebar is expanded. */
@container sales-index (min-width: 56rem) and (max-width: 64.99rem) {
  .sales-index-table { min-width: 0; table-layout: fixed; }
  .sales-index-table :is(th, td) { padding-left: .5rem; padding-right: .5rem; }
  .sales-index-table th:nth-child(1) { width: 8.5rem; }
  .sales-index-table th:nth-child(3) { width: 6.75rem; }
  .sales-index-table th:nth-child(4) { width: 8.5rem; }
  .sales-index-table th:nth-child(5) { width: 9.5rem; }
  .sales-index-table th:nth-child(6) { width: 7.5rem; }
  .sales-index-table th:nth-child(7) { width: 7.5rem; }
  .sales-index-table td:is([data-label="Cliente"], [data-label="Estado"], [data-label="Acciones"]) { min-width: 0; width: auto; }
  .sales-index-row-actions { display: grid; grid-template-columns: repeat(2, 44px); justify-content: end; gap: .375rem; }
  .sales-index-row-actions > :is(a, span), .sales-index-row-actions > span > button { width: 44px; }
}
@container sales-index (max-width: 55.99rem) {
  .sales-index-table { min-width: 0; display: block; }
  .sales-index-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .sales-index-table tbody { display: block; }
  .sales-index-table .sales-index-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: .75rem; gap: .75rem; }
  .sales-index-table .sales-index-row td { display: block; min-width: 0; width: auto; padding: 0; white-space: normal; text-align: left; }
  .sales-index-table td::before { content: attr(data-label); display: block; margin-bottom: .3rem; color: var(--ui-muted, #526178); font-size: .75rem; font-weight: 600; }
  .sales-index-table td[data-label="Cliente"], .sales-index-table td[data-label="Acciones"] { grid-column: 1 / -1; }
  .sales-index-row-actions { justify-content: flex-start; }
}

.sales-more-actions { border: 1px solid var(--ui-border, #dce3ed); border-radius: .75rem; background: var(--ui-surface, white); color: var(--ui-text, #172033); font-size: 1.5rem !important; }
.sales-actions-popover :is(a, button) { display: flex; width: 100%; min-height: 44px; align-items: center; justify-content: flex-start; gap: .5rem; margin-top: .75rem; padding: .625rem .75rem; text-align: left; }
.sales-actions-popover form { margin: 0; }

.sales-show-actions > :is(a, button),
.sales-show-actions > span > button,
.sales-show-actions > .document-action-menu > summary { min-height: 44px; }
