/*
 * ClubPro — tablas y listados (Filament v5).
 *
 * La tabla es la planilla de la comisión: una hoja limpia, renglones de 54 px con regla fina, cabecera en caja de
 * oración y, en las tablas de PERSONAS (clase `cp-tabla-lista`, ver App\Filament\Support\ListaNumerada), el numeral
 * condensado en un margen fijo a la izquierda, como la lista de la app.
 *
 * Tokens propios del área (prefijo --cp-ta-*): se apoyan en la paleta de Filament (grises azulados y primary verde de
 * IdentidadClubPro) para que claro y oscuro salgan solos.
 */

:root {
    --cp-ta-fila: 3.375rem; /* 54 px */
    --cp-ta-numeral-col: 2.5rem;
    --cp-ta-regla: color-mix(in oklab, var(--gray-200) 75%, transparent);
    --cp-ta-cabecera-bg: var(--gray-50);
    --cp-ta-hover: color-mix(in oklab, var(--primary-50) 70%, var(--gray-50));
    --cp-ta-tinta: var(--gray-950);
    --cp-ta-tinta-2: var(--gray-600);
    --cp-ta-tinta-3: var(--gray-500);
    --cp-ta-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.dark {
    --cp-ta-regla: rgb(255 255 255 / 0.06);
    --cp-ta-cabecera-bg: rgb(255 255 255 / 0.025);
    --cp-ta-hover: rgb(255 255 255 / 0.035);
    --cp-ta-tinta: var(--gray-50);
    --cp-ta-tinta-2: color-mix(in oklab, var(--gray-300) 80%, var(--gray-200));
    --cp-ta-tinta-3: var(--gray-400);
}

/* ---------- Contenedor ---------- */
.fi-ta-ctn {
    border-radius: 0.875rem; /* 14 px, como la lista de la app */
}

/* ---------- Barra superior: buscador, filtros y columnas ---------- */
.fi-ta-ctn .fi-ta-header-toolbar {
    padding-block: 0.75rem;
    border-color: var(--cp-ta-regla);
}

.fi-ta-search-field .fi-input-wrp {
    min-height: 2.5rem;
}

.fi-ta-header-toolbar .fi-icon-btn:not(.fi-color) {
    color: var(--cp-ta-tinta-3);
    border-radius: 0.625rem;
    transition: color 160ms var(--cp-ta-ease), background-color 160ms var(--cp-ta-ease);
}

@media (hover: hover) {
    .fi-ta-header-toolbar .fi-icon-btn:not(.fi-color):hover {
        color: var(--primary-600);
        background-color: var(--gray-100);
    }

    .dark .fi-ta-header-toolbar .fi-icon-btn:not(.fi-color):hover {
        color: var(--primary-300);
        background-color: rgb(255 255 255 / 0.05);
    }
}

/* Conteo de filtros activos: chip verde suave pegado al icono, no un globo. */
.fi-ta-header-toolbar .fi-icon-btn > .fi-icon-btn-badge-ctn {
    top: 0.3rem;
    inset-inline-start: auto;
    inset-inline-end: -0.25rem;
    translate: 0 -50%;
    background: transparent;
}

.fi-ta-header-toolbar .fi-icon-btn > .fi-icon-btn-badge-ctn > .fi-badge {
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 0.3rem;
    border-radius: 0.375rem;
    font-size: 0.6875rem;
    font-weight: 800;
    font-stretch: 72%;
    font-variant-numeric: tabular-nums lining-nums;
    background-color: var(--primary-600);
    color: #fff;
    box-shadow: 0 0 0 2px var(--color-white);
}

.dark .fi-ta-header-toolbar .fi-icon-btn > .fi-icon-btn-badge-ctn > .fi-badge {
    background-color: var(--primary-500);
    color: #052e22;
    box-shadow: 0 0 0 2px var(--gray-900);
}

/* Filtros activos: renglón tranquilo con chips removibles. */
.fi-ta-ctn .fi-ta-filter-indicators {
    align-items: center;
    padding-block: 0.625rem;
    background-color: transparent;
    border-color: var(--cp-ta-regla);
}

.dark .fi-ta-ctn .fi-ta-filter-indicators {
    background-color: transparent;
    border-color: var(--cp-ta-regla);
}

.fi-ta-ctn .fi-ta-filter-indicators > :first-child .fi-ta-filter-indicators-label {
    font-size: 0.8125rem;
    font-weight: 650;
    color: var(--cp-ta-tinta-2);
}

.dark .fi-ta-ctn .fi-ta-filter-indicators > :first-child .fi-ta-filter-indicators-label {
    color: var(--cp-ta-tinta-2);
}

.fi-ta-filter-indicators .fi-badge {
    height: 1.625rem;
    padding-inline: 0.5rem 0.25rem;
}

.fi-ta-filter-indicators .fi-badge .fi-badge-delete-btn {
    border-radius: 0.25rem;
}

.fi-ta-filter-indicators .fi-badge .fi-badge-delete-btn:hover {
    background-color: color-mix(in oklab, var(--color-600, var(--gray-600)) 14%, transparent);
}

/* Selección y acciones masivas: barra verde suave, el conteo se lee de un vistazo. */
.fi-ta-ctn .fi-ta-selection-indicator {
    background-color: var(--primary-50);
    border-color: color-mix(in oklab, var(--primary-200) 70%, transparent);
    font-size: 0.875rem;
    font-weight: 650;
    color: var(--primary-800);
}

.dark .fi-ta-ctn .fi-ta-selection-indicator {
    background-color: color-mix(in oklab, var(--primary-500) 14%, transparent);
    border-color: color-mix(in oklab, var(--primary-400) 22%, transparent);
    color: var(--primary-200);
}

/* ---------- Cabecera de columnas ---------- */
.fi-ta-table > thead > tr,
.dark .fi-ta-table > thead > tr {
    background-color: var(--cp-ta-cabecera-bg);
}

.fi-ta-header-cell,
.fi-ta-header-cell .fi-ta-header-cell-sort-btn {
    font-size: 0.8125rem;
    font-weight: 650;
    letter-spacing: 0;
    text-transform: none;
    color: var(--cp-ta-tinta-2);
}

.fi-ta-header-cell {
    padding-block: 0.6875rem;
    white-space: nowrap;
}

.dark .fi-ta-header-cell,
.dark .fi-ta-header-cell .fi-ta-header-cell-sort-btn {
    color: var(--cp-ta-tinta-2);
}

.fi-ta-header-cell .fi-ta-header-cell-sort-btn:hover {
    color: var(--cp-ta-tinta);
}

.fi-ta-header-cell[aria-sort='ascending'] .fi-ta-header-cell-sort-btn,
.fi-ta-header-cell[aria-sort='descending'] .fi-ta-header-cell-sort-btn {
    color: var(--cp-ta-tinta);
}

.fi-ta-header-cell .fi-ta-header-cell-sort-btn > .fi-icon {
    color: var(--cp-ta-tinta-3);
}

.fi-ta-table > thead > tr > th {
    border-bottom: 1px solid var(--cp-ta-regla);
}

/* ---------- Filas ---------- */
.fi-ta-table > tbody > tr:not(:last-child),
.dark .fi-ta-table > tbody > tr:not(:last-child) {
    border-color: var(--cp-ta-regla);
}

.fi-ta-row > .fi-ta-cell {
    height: var(--cp-ta-fila);
}

.fi-ta-row .fi-ta-text:not(.fi-inline),
.fi-ta-row .fi-ta-icon:not(.fi-inline) {
    padding-block: 0.4375rem;
}

.fi-ta-row .fi-ta-text.fi-ta-text-has-descriptions {
    row-gap: 0.125rem;
}

.fi-ta-row .fi-ta-text-item.fi-size-sm {
    line-height: 1.25rem;
}

.fi-ta-row .fi-ta-text > .fi-ta-text-description {
    font-size: 0.8125rem;
    line-height: 1.125rem;
    color: var(--cp-ta-tinta-3);
}

.dark .fi-ta-row .fi-ta-text > .fi-ta-text-description {
    color: var(--cp-ta-tinta-3);
}

.fi-ta-row {
    transition: background-color 140ms var(--cp-ta-ease);
}

.fi-ta-row.fi-clickable:hover,
.dark .fi-ta-row.fi-clickable:hover {
    background-color: var(--cp-ta-hover);
}

.fi-ta-row.fi-selected:not(.fi-striped) {
    background-color: color-mix(in oklab, var(--primary-50) 80%, transparent);
}

.dark .fi-ta-row.fi-selected:not(.fi-striped) {
    background-color: color-mix(in oklab, var(--primary-500) 10%, transparent);
}

/* Nombre / dato principal: peso 650 en tinta plena, el dato secundario va debajo. */
.fi-ta-row .fi-ta-text-item.fi-font-medium,
.fi-ta-row .fi-ta-text-has-descriptions > .fi-ta-text-item {
    font-weight: 650;
    color: var(--cp-ta-tinta);
}

.fi-ta-cell {
    font-variant-numeric: tabular-nums lining-nums;
}

/* Cifras de dato (montos, cantidades, conteos): Archivo 800 condensada, tabulares, a la derecha si son montos. */
.fi-ta-row .fi-ta-text-item.fi-numeric,
.fi-ta-row .fi-ta-cell[class*='-count'] .fi-ta-text-item {
    font-weight: 800;
    font-stretch: 72%;
    font-size: 0.9375rem;
    letter-spacing: 0.005em;
    color: var(--cp-ta-tinta);
}

.fi-ta-cell:is(
        [class*='fi-ta-cell-monto'],
        [class*='fi-ta-cell-saldo'],
        [class*='fi-ta-cell-costo'],
        [class*='fi-ta-cell-total'],
        .fi-ta-cell-pagado,
        .fi-ta-cell-pendiente
    )
    .fi-ta-col,
.fi-ta-cell:is(
        [class*='fi-ta-cell-monto'],
        [class*='fi-ta-cell-saldo'],
        [class*='fi-ta-cell-costo'],
        [class*='fi-ta-cell-total'],
        .fi-ta-cell-pagado,
        .fi-ta-cell-pendiente
    )
    .fi-ta-text {
    justify-content: flex-end;
    text-align: end;
}

.fi-ta-header-cell:is(
        [class*='fi-ta-header-cell-monto'],
        [class*='fi-ta-header-cell-saldo'],
        [class*='fi-ta-header-cell-costo'],
        [class*='fi-ta-header-cell-total'],
        .fi-ta-header-cell-pagado,
        .fi-ta-header-cell-pendiente
    ) {
    text-align: end;
}

.fi-ta-header-cell:is(
        [class*='fi-ta-header-cell-monto'],
        [class*='fi-ta-header-cell-saldo'],
        [class*='fi-ta-header-cell-costo'],
        [class*='fi-ta-header-cell-total'],
        .fi-ta-header-cell-pagado,
        .fi-ta-header-cell-pendiente
    )
    .fi-ta-header-cell-sort-btn {
    justify-content: flex-end;
}

/* Iconos de dato (teléfono, cupos): tenues para que lea la cifra. */
.fi-ta-row .fi-ta-text-item > .fi-icon:not(.fi-color) {
    color: var(--cp-ta-tinta-3);
}

/* ---------- Acciones de fila: secundarias, verdes al pasar ---------- */
.fi-ta-row > .fi-ta-cell:has(> .fi-ta-actions) {
    padding-block: 0.375rem;
}

.fi-ta-row .fi-ta-actions {
    column-gap: 0.125rem;
}

.fi-ta-row .fi-ta-actions .fi-link {
    padding: 0.375rem 0.375rem;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--cp-ta-tinta-2);
    transition: color 140ms var(--cp-ta-ease), background-color 140ms var(--cp-ta-ease);
}

.dark .fi-ta-row .fi-ta-actions .fi-link {
    color: var(--cp-ta-tinta-2);
}

.fi-ta-row .fi-ta-actions .fi-link > .fi-icon {
    color: var(--cp-ta-tinta-3);
    transition: color 140ms var(--cp-ta-ease);
}

.fi-ta-row .fi-ta-actions .fi-icon-btn {
    color: var(--cp-ta-tinta-3);
}

@media (hover: hover) {
    .fi-ta-row .fi-ta-actions .fi-link:hover,
    .fi-ta-row .fi-ta-actions .fi-link:hover > .fi-icon {
        color: var(--primary-600);
        text-decoration: none;
    }

    .fi-ta-row .fi-ta-actions .fi-link:hover {
        background-color: var(--primary-50);
    }

    .fi-ta-row .fi-ta-actions .fi-link.fi-color:not(.fi-color-primary):not(.fi-color-gray):hover,
    .fi-ta-row .fi-ta-actions .fi-link.fi-color:not(.fi-color-primary):not(.fi-color-gray):hover > .fi-icon {
        color: var(--color-700);
    }

    .fi-ta-row .fi-ta-actions .fi-link.fi-color:not(.fi-color-primary):not(.fi-color-gray):hover {
        background-color: var(--color-50);
    }

    .dark .fi-ta-row .fi-ta-actions .fi-link:hover,
    .dark .fi-ta-row .fi-ta-actions .fi-link:hover > .fi-icon {
        color: var(--primary-300);
    }

    .dark .fi-ta-row .fi-ta-actions .fi-link:hover {
        background-color: color-mix(in oklab, var(--primary-500) 14%, transparent);
    }

    .dark .fi-ta-row .fi-ta-actions .fi-link.fi-color:not(.fi-color-primary):not(.fi-color-gray):hover,
    .dark .fi-ta-row .fi-ta-actions .fi-link.fi-color:not(.fi-color-primary):not(.fi-color-gray):hover > .fi-icon {
        color: var(--color-300);
    }

    .dark .fi-ta-row .fi-ta-actions .fi-link.fi-color:not(.fi-color-primary):not(.fi-color-gray):hover {
        background-color: color-mix(in oklab, var(--color-500) 14%, transparent);
    }

    .fi-ta-row .fi-ta-actions .fi-icon-btn:hover {
        color: var(--primary-600);
        background-color: var(--primary-50);
    }

    .dark .fi-ta-row .fi-ta-actions .fi-icon-btn:hover {
        color: var(--primary-300);
        background-color: color-mix(in oklab, var(--primary-500) 14%, transparent);
    }
}

/* ---------- Chips de estado (badges): planos, radio 6 px, sin anillo ---------- */
.fi-badge {
    border-radius: 0.375rem;
    box-shadow: none;
    font-size: 0.78125rem; /* 12.5 px */
    font-weight: 650;
    letter-spacing: 0;
    line-height: 1.25rem;
    padding-block: 0.125rem;
    padding-inline: 0.5rem;
    background-color: var(--gray-100);
    color: var(--gray-600);
}

.fi-badge.fi-size-sm {
    padding-block: 0.0625rem;
    padding-inline: 0.4375rem;
    letter-spacing: 0;
}

.fi-badge.fi-color {
    background-color: var(--color-100);
    color: var(--color-700);
}

.fi-badge.fi-color-gray {
    background-color: var(--gray-100);
    color: var(--gray-600);
}

.dark .fi-badge {
    background-color: rgb(255 255 255 / 0.07);
    color: var(--gray-300);
    box-shadow: none;
}

.dark .fi-badge.fi-color {
    background-color: color-mix(in oklab, var(--color-500) 18%, transparent);
    color: var(--color-300);
}

.dark .fi-badge.fi-color-gray {
    background-color: rgb(255 255 255 / 0.07);
    color: var(--gray-300);
}

/* ---------- Firma: la lista numerada (tablas de personas) ---------- */
.cp-tabla-lista .fi-ta-table > tbody {
    counter-reset: cp-fila var(--cp-lista-desde, 0);
}

.cp-tabla-lista .fi-ta-row {
    counter-increment: cp-fila;
}

.cp-tabla-lista:not(.cp-tabla-lista-orden) .fi-ta-row > .fi-ta-cell:first-child,
.cp-tabla-lista:not(.cp-tabla-lista-orden) .fi-ta-table > thead > tr > th:first-child {
    position: relative;
    padding-inline-start: calc(var(--cp-ta-numeral-col) + 0.25rem);
}

.cp-tabla-lista:not(.cp-tabla-lista-orden) .fi-ta-row > .fi-ta-cell:first-child::before {
    content: counter(cp-fila) '.';
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    width: var(--cp-ta-numeral-col);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 1.1875rem;
    font-weight: 800;
    font-stretch: 72%;
    font-variant-numeric: tabular-nums lining-nums;
    line-height: 1;
    letter-spacing: -0.01em;
    color: var(--cp-ta-tinta-3);
    pointer-events: none;
}

/* Con selección masiva la primera celda es la casilla: se separa del numeral. */
.cp-tabla-lista:not(.cp-tabla-lista-orden) .fi-ta-row > .fi-ta-cell.fi-ta-selection-cell:first-child,
.cp-tabla-lista:not(.cp-tabla-lista-orden) .fi-ta-table > thead > tr > th.fi-ta-selection-cell:first-child {
    padding-inline-start: calc(var(--cp-ta-numeral-col) + 0.875rem);
}

/* El texto de la primera columna ya no necesita su propio margen: lo da el numeral. */
.cp-tabla-lista:not(.cp-tabla-lista-orden) .fi-ta-row > .fi-ta-cell:first-child .fi-ta-text:not(.fi-inline) {
    padding-inline-start: 0.625rem;
}

.cp-tabla-lista:not(.cp-tabla-lista-orden) .fi-ta-table > thead > tr > th:first-child {
    padding-inline-start: calc(var(--cp-ta-numeral-col) + 0.875rem);
}

/* La regla del renglón arranca después del margen numérico, como una hoja rayada. */
.cp-tabla-lista .fi-ta-table > tbody > tr:not(:last-child) {
    border-bottom-color: transparent;
}

.cp-tabla-lista .fi-ta-table > tbody > tr:not(:last-child) > td {
    border-bottom: 1px solid var(--cp-ta-regla);
}

.cp-tabla-lista:not(.cp-tabla-lista-orden) .fi-ta-table > tbody > tr:not(:last-child) > td:first-child {
    border-bottom-color: transparent;
}

.cp-tabla-lista:not(.cp-tabla-lista-orden) .fi-ta-table > tbody > tr:not(:last-child) > td:first-child::after {
    content: '';
    position: absolute;
    inset-inline: calc(var(--cp-ta-numeral-col) + 0.25rem) 0;
    bottom: -1px;
    height: 1px;
    background-color: var(--cp-ta-regla);
}

/* Nombre en la primera columna de datos (peso 650, tinta plena). */
.cp-tabla-lista .fi-ta-row > .fi-ta-cell:nth-child(1 of [class*='fi-ta-cell-']) .fi-ta-text-item,
.cp-tabla-lista-orden .fi-ta-row > .fi-ta-cell:nth-child(2 of [class*='fi-ta-cell-']) .fi-ta-text-item {
    font-weight: 650;
    color: var(--cp-ta-tinta);
}

/* Inscritos: la tabla ya trae su columna "#" (orden de llegada); esa columna es el numeral. */
.cp-tabla-lista-orden .fi-ta-row > .fi-ta-cell:nth-child(1 of [class*='fi-ta-cell-']) {
    width: var(--cp-ta-numeral-col);
}

.cp-tabla-lista-orden .fi-ta-row > .fi-ta-cell:nth-child(1 of [class*='fi-ta-cell-']) .fi-ta-text-item {
    font-size: 1.1875rem;
    font-weight: 800;
    font-stretch: 72%;
    color: var(--cp-ta-tinta-3);
}

.cp-tabla-lista-orden .fi-ta-row > .fi-ta-cell:nth-child(1 of [class*='fi-ta-cell-']) .fi-ta-text-item::after {
    content: '.';
}

.cp-tabla-lista-orden .fi-ta-row > .fi-ta-cell:nth-child(1 of [class*='fi-ta-cell-']) .fi-ta-col,
.cp-tabla-lista-orden .fi-ta-row > .fi-ta-cell:nth-child(1 of [class*='fi-ta-cell-']) .fi-ta-text {
    justify-content: flex-end;
    text-align: end;
}

.cp-tabla-lista-orden .fi-ta-table > thead > tr > th:nth-child(1 of [class*='fi-ta-header-cell-']) {
    text-align: end;
    color: var(--cp-ta-tinta-3);
}

/* ---------- Paginación ---------- */
.fi-ta-ctn .fi-pagination {
    border-color: var(--cp-ta-regla);
    padding-block: 0.75rem;
}

.fi-pagination .fi-pagination-overview {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--cp-ta-tinta-2);
    font-variant-numeric: tabular-nums lining-nums;
}

.fi-pagination .fi-pagination-items {
    border-radius: 0.625rem;
    box-shadow: 0 0 0 1px var(--cp-ta-regla);
    overflow: hidden;
}

.dark .fi-pagination .fi-pagination-items {
    background-color: transparent;
}

.fi-pagination .fi-pagination-item {
    border-color: var(--cp-ta-regla);
}

.fi-pagination .fi-pagination-item-btn {
    min-width: 2.25rem;
    height: 2.25rem;
    justify-content: center;
}

.fi-pagination .fi-pagination-item:first-of-type .fi-pagination-item-btn,
.fi-pagination .fi-pagination-item:last-of-type .fi-pagination-item-btn {
    border-radius: 0;
}

.fi-pagination .fi-pagination-item-label {
    font-weight: 700;
    font-stretch: 72%;
    font-size: 0.9375rem;
    font-variant-numeric: tabular-nums lining-nums;
    color: var(--cp-ta-tinta-2);
}

.fi-pagination .fi-pagination-item.fi-active .fi-pagination-item-btn {
    background-color: var(--primary-50);
}

.fi-pagination .fi-pagination-item.fi-active .fi-pagination-item-label {
    font-weight: 800;
    color: var(--primary-700);
}

.dark .fi-pagination .fi-pagination-item.fi-active .fi-pagination-item-btn {
    background-color: color-mix(in oklab, var(--primary-500) 16%, transparent);
}

.dark .fi-pagination .fi-pagination-item.fi-active .fi-pagination-item-label {
    color: var(--primary-300);
}

.fi-pagination .fi-pagination-records-per-page-select .fi-input-wrp {
    min-height: 2.25rem;
    border-radius: 0.625rem;
}

/* ---------- Estado vacío ---------- */
.fi-ta-empty-state {
    padding-block: 3.5rem;
}

.fi-ta-empty-state .fi-ta-empty-state-icon-bg,
.fi-empty-state .fi-empty-state-icon-bg {
    width: 3.75rem;
    height: 3.75rem;
    padding: 0;
    display: grid;
    place-items: center;
    margin-bottom: 1rem;
    border-radius: 1rem;
    background-color: var(--primary-100);
}

.dark .fi-ta-empty-state .fi-ta-empty-state-icon-bg,
.dark .fi-empty-state .fi-empty-state-icon-bg {
    background-color: color-mix(in oklab, var(--primary-500) 20%, transparent);
}

.fi-ta-empty-state .fi-ta-empty-state-icon-bg > .fi-icon,
.fi-empty-state .fi-empty-state-icon-bg > .fi-icon {
    width: 1.75rem;
    height: 1.75rem;
    color: var(--primary-700);
}

.dark .fi-ta-empty-state .fi-ta-empty-state-icon-bg > .fi-icon,
.dark .fi-empty-state .fi-empty-state-icon-bg > .fi-icon {
    color: var(--primary-300);
}

.fi-ta-empty-state .fi-ta-empty-state-heading {
    font-size: 1.125rem;
    line-height: 1.3;
    font-weight: 800;
    font-stretch: 90%;
    letter-spacing: -0.01em;
    text-wrap: balance;
    color: var(--cp-ta-tinta);
}

.dark .fi-ta-empty-state .fi-ta-empty-state-heading {
    color: var(--cp-ta-tinta);
}

.fi-ta-empty-state .fi-ta-empty-state-description {
    max-width: 32ch;
    margin-inline: auto;
    margin-top: 0.375rem;
    font-size: 0.9375rem;
    line-height: 1.45;
    text-wrap: pretty;
    color: var(--cp-ta-tinta-3);
}

.dark .fi-ta-empty-state .fi-ta-empty-state-description {
    color: var(--cp-ta-tinta-3);
}

/* ---------- Pestañas de listado (Todos / Por validar …) ---------- */
.fi-sc-tabs:not(.fi-contained) > .fi-tabs:not(.fi-contained) {
    padding: 0.25rem;
    border-radius: 0.75rem;
    box-shadow: 0 0 0 1px var(--cp-ta-regla);
}

.fi-sc-tabs:not(.fi-contained) > .fi-tabs:not(.fi-contained) .fi-tabs-item {
    border-radius: 0.5rem;
    padding: 0.4375rem 0.875rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--cp-ta-tinta-2);
}

.fi-sc-tabs:not(.fi-contained) > .fi-tabs:not(.fi-contained) .fi-tabs-item .fi-tabs-item-label {
    color: inherit;
}

.fi-sc-tabs:not(.fi-contained) > .fi-tabs:not(.fi-contained) .fi-tabs-item:hover {
    color: var(--cp-ta-tinta);
    background-color: var(--gray-50);
}

.fi-sc-tabs:not(.fi-contained) > .fi-tabs:not(.fi-contained) .fi-tabs-item.fi-active {
    background-color: var(--primary-50);
    color: var(--primary-700);
    font-weight: 700;
}

.dark .fi-sc-tabs:not(.fi-contained) > .fi-tabs:not(.fi-contained) .fi-tabs-item:hover {
    background-color: rgb(255 255 255 / 0.05);
}

.dark .fi-sc-tabs:not(.fi-contained) > .fi-tabs:not(.fi-contained) .fi-tabs-item.fi-active {
    background-color: color-mix(in oklab, var(--primary-500) 16%, transparent);
    color: var(--primary-200);
}

.fi-sc-tabs:not(.fi-contained) > .fi-tabs:not(.fi-contained) .fi-tabs-item .fi-badge {
    font-stretch: 72%;
    font-weight: 800;
    font-variant-numeric: tabular-nums lining-nums;
}

@media (prefers-reduced-motion: reduce) {
    .fi-ta-row,
    .fi-ta-row .fi-ta-actions .fi-link,
    .fi-ta-header-toolbar .fi-icon-btn {
        transition: none;
    }
}