/* A row number and its existing action share one intrinsic table track. */
@layer alfares-row-number-more {
  :is(table:has(> thead [data-row-number-more-cell]), .my-report-data-table, .my-report-html-mini-table, .my-document-line-table, .fp-table, .items-units-detail-table, .units-table, .sellers-table) {
    table-layout: auto !important;
  }

  :is(.erp-invoice-detail-table-scroll-x, .item-pricing-table-scroll):has(> table > thead [data-row-number-more-cell]) {
    scrollbar-gutter: auto !important;
  }

  :is([data-row-number-more-cell], .col-row-number, .my-document-line-table .col-no, .my-document-line-table [data-column-key="idx"], .unit-col-row, .fp-col-no, .units-col-id, .units-row-serial) {
    width: 1% !important;
    inline-size: 1% !important;
    min-width: 0 !important;
    min-inline-size: 0 !important;
    max-width: none !important;
    max-inline-size: none !important;
    padding-inline: 4px !important;
    white-space: nowrap !important;
    text-align: end !important;
  }

  :is(.alfares-row-number-more, .erp-invoice-row-number-actions, .voucher-line-row-head, .opr-unit-row-anchor, .report-row-number-actions-group) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 16px !important;
    align-items: center !important;
    justify-content: end !important;
    gap: 2px !important;
    width: 100% !important;
    inline-size: 100% !important;
    min-width: max-content !important;
    min-inline-size: max-content !important;
    min-height: 24px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  :is([data-row-number], [data-business-number], .erp-invoice-row-number-input, .voucher-line-row-head > input[readonly], .opr-unit-row-anchor > .is-index, .invoice-row-order) {
    field-sizing: content !important;
    width: auto !important;
    inline-size: auto !important;
    min-width: 1ch !important;
    min-inline-size: 1ch !important;
    max-width: none !important;
    max-inline-size: none !important;
    height: 24px !important;
    block-size: 24px !important;
    min-height: 24px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
    font: inherit !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums;
    line-height: 24px !important;
    text-align: end !important;
    white-space: nowrap !important;
    justify-self: end !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    appearance: textfield;
  }

  :is([data-row-number], .erp-invoice-row-number-input)::-webkit-inner-spin-button,
  :is([data-row-number], .erp-invoice-row-number-input)::-webkit-outer-spin-button {
    appearance: none;
    margin: 0;
  }

  td[data-row-number] {
    width: 1% !important;
    inline-size: 1% !important;
    min-width: 0 !important;
    min-inline-size: 0 !important;
    padding-inline: 4px !important;
  }

  [data-row-number] > button {
    width: auto !important;
    height: 24px !important;
    min-height: 24px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
    font: inherit !important;
    line-height: 24px !important;
    transform: none !important;
    transition: none !important;
  }

  [data-row-number] > button > span {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
  }

  :is([data-row-more-trigger], [data-header-more-trigger], .report-row-menu-trigger, .report-row-number-actions-group > .report-row-bulk-trigger, .erp-invoice-row-number-actions > .erp-detail-row-toggle, .voucher-line-context-button, .opr-unit-row-anchor > .items-row-action, .unit-settings-trigger, .my-document-line-table .invoice-column-settings-header-button) {
    display: inline-grid !important;
    place-content: center !important;
    place-items: center !important;
    width: 16px !important;
    inline-size: 16px !important;
    min-width: 16px !important;
    min-inline-size: 16px !important;
    max-width: 16px !important;
    max-inline-size: 16px !important;
    height: 24px !important;
    block-size: 24px !important;
    min-height: 24px !important;
    min-block-size: 24px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 16px !important;
    line-height: 1 !important;
    transform: none !important;
    translate: none !important;
    scale: none !important;
    transition: none !important;
    flex: 0 0 16px !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    cursor: pointer;
  }

  :is([data-row-more-trigger], [data-header-more-trigger], .report-row-menu-trigger, .report-row-number-actions-group > .report-row-bulk-trigger, .erp-invoice-row-number-actions > .erp-detail-row-toggle, .voucher-line-context-button, .opr-unit-row-anchor > .items-row-action, .unit-settings-trigger, .my-document-line-table .invoice-column-settings-header-button) :is(svg, i, span) {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
    transform: none !important;
    translate: none !important;
    scale: none !important;
    box-shadow: none !important;
    transition: none !important;
  }

  :is([data-row-more-trigger], [data-header-more-trigger], .erp-invoice-row-number-actions > .erp-detail-row-toggle, .voucher-line-context-button, .opr-unit-row-anchor > .items-row-action, .unit-settings-trigger, .my-document-line-table .invoice-column-settings-header-button) svg {
    width: 14px !important;
    height: 14px !important;
  }

  .report-row-menu-trigger {
    grid-template-columns: 3px !important;
    grid-template-rows: repeat(3, 3px) !important;
    row-gap: 2px !important;
  }

  .report-row-number-actions-group > .report-row-bulk-trigger::before {
    content: "" !important;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 -5px 0 currentColor, 0 5px 0 currentColor;
  }

  .report-row-number-actions-group > .report-row-bulk-trigger > span {
    display: none !important;
  }

  .report-row-number-actions-group > .report-row-bulk-trigger > b {
    display: none !important;
  }

  :is(.report-row-selection-heading, .report-row-selection-cell, .report-row-selection-actions-heading, .report-row-selection-actions-cell, .report-row-selection-actions-footer):not([data-row-number-more-cell]) {
    width: 1% !important;
    inline-size: 1% !important;
    min-width: 0 !important;
    min-inline-size: 0 !important;
    max-width: none !important;
    max-inline-size: none !important;
    padding-inline: 4px !important;
  }

  .report-row-selection-actions-group:not(.report-row-number-actions-group) {
    min-width: 0 !important;
    min-inline-size: 0 !important;
    gap: 0 !important;
  }

  .report-row-selection-actions-group.report-row-selection-number-group {
    display: grid !important;
    grid-template-columns: max-content minmax(max-content, 1fr) !important;
    gap: 4px !important;
    width: 100% !important;
    min-width: max-content !important;
    min-inline-size: max-content !important;
  }

  /* The ordinal pin follows the entire checkbox hit area, not its glyph. */
  .my-report-data-table:has(> thead tr > th:first-child [data-select-page]) {
    --alfares-row-selection-track: 33px;
  }

  .my-report-data-table:has(> thead tr > th:first-child [data-select-page])
    :is(.report-row-selection-actions-heading, .report-row-selection-actions-cell, .report-row-selection-actions-footer) {
    box-sizing: border-box !important;
    width: var(--alfares-row-selection-track) !important;
    inline-size: var(--alfares-row-selection-track) !important;
    min-width: var(--alfares-row-selection-track) !important;
    min-inline-size: var(--alfares-row-selection-track) !important;
    max-width: var(--alfares-row-selection-track) !important;
    max-inline-size: var(--alfares-row-selection-track) !important;
  }

  .my-report-data-table:has(> thead tr > th:first-child [data-select-page]) :is(th, td).col-row-number {
    position: sticky !important;
    left: auto !important;
    right: auto !important;
    inset-inline-end: auto !important;
    inset-inline-start: var(--alfares-row-selection-track) !important;
    z-index: 6 !important;
  }

  .my-report-data-table:has(> thead tr > th:first-child [data-select-page]) tbody td.report-row-selection-actions-cell {
    z-index: 7 !important;
  }

  /* Shared unpinned headings use 12 and footers use 11. */
  .my-report-data-table:has(> thead tr > th:first-child [data-select-page]) thead th.col-row-number {
    z-index: 13 !important;
  }

  .my-report-data-table:has(> thead tr > th:first-child [data-select-page]) thead th.report-row-selection-actions-heading {
    z-index: 14 !important;
  }

  .my-report-data-table:has(> thead tr > th:first-child [data-select-page]) tfoot td.col-row-number {
    z-index: 12 !important;
  }

  .my-report-data-table:has(> thead tr > th:first-child [data-select-page]) tfoot td.report-row-selection-actions-footer {
    z-index: 13 !important;
  }

  @media (pointer: coarse) {
    .my-report-data-table:has(> thead tr > th:first-child [data-select-page]) {
      --alfares-row-selection-track: 45px;
    }
  }
}
