/**
 * Listagem inline (§6.2 guia listagens): tabela directamente no fundo da página,
 * sem cartão envolvente — padrão `/agenda/bloqueios`.
 */
@use '@/styles/breakpoints' as *;

.listingInline {
    :global(.ant-table-wrapper),
    :global(.ant-table-container),
    :global(.ant-table-content),
    :global(.ant-table-body),
    :global(.ant-table) {
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
        border-radius: 0 !important;
    }

    :global(.ant-table-wrapper) {
        box-sizing: content-box;
        box-shadow: none !important;
    }

    :global(.ant-table-ping-left .ant-table-container::before),
    :global(.ant-table-ping-right .ant-table-container::after),
    :global(.ant-table-cell-fix-left-first::after),
    :global(.ant-table-cell-fix-left-last::after),
    :global(.ant-table-cell-fix-right-first::after),
    :global(.ant-table-cell-fix-right-last::after) {
        box-shadow: none !important;
    }

    :global(.ant-table-wrapper .ant-table-bordered > .ant-table-container) {
        border: none !important;
        border-radius: 0 !important;
    }

    :global(.ant-table-wrapper table) {
        border-radius: 0 !important;
    }

    :global(.ant-table-pagination) {
        margin-bottom: 0 !important;
        padding-top: 12px;
    }

    :global(.ant-table-tbody > tr > td) {
        background: transparent !important;
    }

    :global(.ant-table-tbody > tr:hover > td) {
        background: var(--gray-100, #f5f5f5) !important;
    }
}

/**
 * Cabeçalho primário (`primaryHeader`): o Ant Design marca a direcção activa com
 * `.ant-table-column-sorter-up.active` / `.down.active` e `colorPrimary` vs `headerIconColor`.
 * Um único `color` em `.ant-table-column-sorter` faz todos os carets herdarem o mesmo branco
 * e o estado activo deixa de ser visível (parece sempre «seta dupla» neutra).
 */
.primaryHeaderTable :global(.ant-table-thead) {
  :global(.ant-table-column-sorter-up:not(.active)),
  :global(.ant-table-column-sorter-down:not(.active)) {
    color: rgba(255, 255, 255, 0.32) !important;
  }

  :global(.ant-table-column-sorter-up.active),
  :global(.ant-table-column-sorter-down.active) {
    color: #ffffff !important;
    opacity: 1 !important;
  }

  :global(.ant-table-column-sorters:hover .ant-table-column-sorter-up:not(.active)),
  :global(.ant-table-column-sorters:hover .ant-table-column-sorter-down:not(.active)) {
    color: rgba(255, 255, 255, 0.55) !important;
  }
}

/**
 * Coluna de selecção compacta no mobile (listagem padrão + toggle «Selecionar vários»).
 * Mantém checkbox tocável sem ocupar ~77px com padding de célula padrão.
 */
.dataTable {
  @include max-mobile {
    :global(th.ant-table-cell:has([data-testid='listing-mobile-select-toggle'])) {
      vertical-align: middle;
      text-align: center !important;
      padding-block: 0 !important;
    }

    :global(col.ant-table-selection-col) {
      width: 32px !important;
      min-width: 32px !important;
    }

    :global(th.ant-table-selection-column),
    :global(td.ant-table-selection-column) {
      width: 32px !important;
      min-width: 32px !important;
      max-width: 32px !important;
      padding-inline: 4px !important;
      text-align: center !important;
    }

    :global(.ant-table-selection-column .ant-checkbox) {
      margin-inline: 0;
    }

    :global(.ant-table-selection-column .ant-checkbox-inner) {
      width: 16px;
      height: 16px;
    }

    :global(.ant-table-selection-column .ant-checkbox-inner::after) {
      inset-inline-start: 21%;
      width: 5px;
      height: 8px;
    }
  }
}