/* Pestañas (EasyComponentes/Tabs): EasyTabs y EasyTab. Solo tokens --easy-* con valores por omisión.
   Esquinas: salen de --easy-radio-base con la escala de la librería (ver easygrid.css). */

.easy-tabs {
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: var(--easy-color-texto, #1f2430);
    font-family: var(--easy-fuente-base, inherit);
    font-size: calc(14px * var(--easy-escala-fuente, 1));
}

.easy-tablist {
    display: flex;
    gap: 2px;
    overflow-x: auto;
    /* overflow-x: auto vuelve auto a overflow-y: si una pestaña sobresale 1px (antes margin-bottom: -1px) aparece un scroll vertical */
    overflow-y: hidden;
    scrollbar-width: thin;
    /* La línea de la base va como sombra interior (no como borde) para que la pestaña activa la cubra sin sobresalir del contenedor */
    box-shadow: inset 0 -1px 0 var(--easy-color-borde, #e5e7eb);
}

.easy-tab {
    position: relative;
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 38px;
    padding: 0 14px;
    font: inherit;
    font-weight: 600;
    white-space: nowrap;
    color: var(--easy-color-texto-tenue, #6b7280);
    background: transparent;
    border: 1px solid transparent;
    border-bottom: 2px solid transparent;
    border-radius: calc(var(--easy-radio-base, 8px) * .75) calc(var(--easy-radio-base, 8px) * .75) 0 0;
    cursor: pointer;
    transition: color .12s, background-color .12s, border-color .12s;
}
.easy-tab:hover:not(:disabled):not(.activa) { color: var(--easy-color-texto, #1f2430); background: var(--easy-color-hover, #f3f4f6); }
.easy-tab.activa {
    color: var(--easy-color-primario, #940404);
    border-bottom-color: var(--easy-color-primario, #940404);
}
.easy-tab:focus-visible { outline: 0; box-shadow: inset 0 0 0 2px var(--easy-color-foco, rgba(148, 4, 4, .25)); }
.easy-tab:disabled { opacity: .5; cursor: default; }
.easy-tab .easy-grid-ico { flex: none; }

.easy-tab-insignia {
    min-width: 20px;
    padding: 1px 6px;
    font-size: calc(11px * var(--easy-escala-fuente, 1));
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    color: var(--easy-color-primario, #940404);
    background: var(--easy-color-primario-suave, #fbeaea);
    border-radius: calc(var(--easy-radio-base, 8px) * 2);
}

.easy-tabpanels { min-width: 0; padding-top: 14px; }
.easy-tabpanel[hidden] { display: none; }

@media (prefers-reduced-motion: reduce) {
    .easy-tab { transition: none; }
}