@charset "utf-8";
/*------------------------------------------------------------------
[Tabs Stylesheet]

Project: 
Version: 1.0
Update:  06/09/19
------------------------------------------------------------------*/
.tabs {
    display: flex; /* Convierte el contenedor en flexbox */
    justify-content: center; /* Centra los elementos horizontalmente */
    list-style: none; /* Quita los puntos de la lista si los tiene */
    padding: 0; /* Elimina paddings por defecto del ul */
    margin: 0; /* Elimina márgenes por defecto del ul */
    gap: 2px;
}

.tab-box {
    -webkit-transition: all 0.3s ease-in-out 0.1s;
    -moz-transition: all 0.3s ease-in-out 0.1s;
    -ms-transition: all 0.3s ease-in-out 0.1s;
    transition: all 0.3s ease-in-out 0.1s;
}

.tab_heading_main {
    padding: 0;
}

.tabi_content {
    padding: 30px;
    background-color: #fff;
    border-radius: 0 0 8px 8px;
    border: 1px solid #eee;
}

.tab_heading_main ul.tabs {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

    .tab_heading_main ul.tabs li {
        background: none;
        display: inline-block;
        width: 150px;
        text-align: center;
        padding: 1.4rem;
        cursor: pointer;
        border-bottom: 2px solid transparent;
        font-size: 1.15em;
        line-height: 24px;
        transition: 0.2s all ease-in-out;
        font-weight: 600;
        background-color: #e4e4e4;
        border-radius: 10px 10px 0 0;
    }

    .tab_heading_main ul.tabs .link-icon {
        display: none;
        font-size: 1.3rem;
        font-weight: 600;
    }

    .tab_heading_main ul.tabs li.active_tabi {
        background-color: #daddee;
        border-bottom-color: #004288;
        margin: 1px;
    }

    .tab_heading_main ul.tabs li.active_tabi,
    .tab_heading_main ul.tabs li:hover {
        color: #004288;
    }

.tabi_content .tab-content {
    padding: 0;
    margin-bottom: 1rem;
}

@media all and (max-width: 800px) {
    .tab_heading_main ul.tabs li {
        padding: 1.8rem 1.4rem;
    }

    .tab_heading_main ul.tabs .link-name {
        display: none;
    }

    .tab_heading_main ul.tabs .link-icon {
        display: block;
    }
}

/* ==========================================================================
   NUEVO: OPTIMIZACIÓN EXCLUSIVA PARA MODO OSCURO (BOOTSTRAP 5.3)
   ========================================================================== */
[data-bs-theme="dark"] .tabi_content {
    background-color: var(--bs-body-bg); /* Toma el fondo negro mate de la página */
    border: 1px solid var(--bs-border-color-translucent); /* Contorno fino visible que no brilla */
}

/* Pestañas inactivas en la noche */
[data-bs-theme="dark"] .tab_heading_main ul.tabs li {
    background-color: var(--bs-body-secondary); /* Gris carbón sutil para reposo */
    color: var(--bs-secondary-color); /* Texto gris atenuado legible */
    border: 1px solid transparent;
    border-bottom: 2px solid transparent;
}

    /* Efecto hover sobre las pestañas en la noche */
    [data-bs-theme="dark"] .tab_heading_main ul.tabs li:hover {
        color: var(--bs-body-color); /* Ilumina el texto a blanco brillante */
        background-color: var(--bs-tertiary-bg); /* Un gris ligeramente más claro */
        border: 1px solid var(--bs-border-color-translucent);
        border-bottom: 2px solid transparent;
    }

    /* PESTAÑA ACTIVA EN LA NOCHE: Diseño tipo carpeta recortada con borde fino nítido */
    [data-bs-theme="dark"] .tab_heading_main ul.tabs li.active_tabi {
        background-color: var(--bs-body-bg); /* Se fusiona con el contenedor inferior */
        color: var(--brand-blue-text); /* Texto en tu celeste corporativo de Datos Maestros */
        /* Dibuja el contorno lateral y superior visible */
        border: 1px solid var(--bs-border-color-translucent);
        border-bottom: 2px solid var(--bs-body-bg); /* Corta la línea inferior de la pestaña */
        /* Opcional: Acento superior en tu celeste corporativo */
        border-top: 3px solid var(--brand-blue-text);
        margin: 0px 2px -1px 2px; /* Ajuste milimétrico para pisar la línea del contenedor */
    }