@font-face {
    font-family: "Museo Sans";
    src: url("Fuentes nuevas/museo-sans/MuseoSans-300.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Museo Sans";
    src: url("Fuentes nuevas/museo-sans/MuseoSans_700.otf") format("opentype");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "Museo Sans";
    src: url("Fuentes nuevas/museo-sans/MuseoSans_900.otf") format("opentype");
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: "Montserrat";
    src: url("Fuentes nuevas/Montserrat/Montserrat/Montserrat-Thin.ttf") format("woff2"),url("Fuentes nuevas/Montserrat/Montserrat/Montserrat-Thin.ttf") format("woff");
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: "Montserrat";
    src: url("Fuentes nuevas/Montserrat/Montserrat/Montserrat-Regular.ttf") format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Montserrat";
    src: url("Fuentes nuevas/Montserrat/Montserrat/Montserrat-Bold.ttf") format("woff2");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "Montserrat";
    src: url("Fuentes nuevas/Montserrat/Montserrat/Montserrat-Black.ttf") format("woff2");
    font-weight: 900;
    font-style: normal;
}

:root {
    --font-family-primary: "Museo Sans", Arial;
    --font-family-secondary: "Montserrat", Arial;
    --font-family-tertiary: Arial, sans-serif;
}

body {
    font-family: var(--font-family-primary), var(--font-family-secondary), var(--font-family-tertiary) !important;
}

.NoEstiloBordesTb,
.NoEstiloBordesTb th,
.NoEstiloBordesTb td {
    border: none !important;
    border-collapse: collapse !important;
    outline: none !important;
    box-shadow: none !important;
}

.col-form-label::after {
    content: "*";
    color: red;
    font-weight: bold;
    margin-left: 2px;
}

.btnPrimario {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #b88d00;
    color: white;
    margin: 0;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    text-decoration: none;
    font-family: "Montserrat";
    font-weight: 700;
    text-transform: uppercase;
    font-size: 14px;
    text-align: center
}

    .btnPrimario:disabled {
        background-color: #ccc;
        color: #666;
        cursor: not-allowed;
        border: 1px solid #999;
        opacity: 0.7;
    }

    .btnPrimario:hover {
        background-color: #D1A000;
        transform: translateY(-2px);
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    }

.btnSecundario {
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--yellow-500);
    margin: 5px;
    padding: 5px;
    border: 2px solid var(--yellow-500);
    border-radius: 4px;
    text-decoration: none;
    font-size: 14px;
}

    .btnSecundario:hover {
        border: 2px solid var(--yellow-900);
        color: var(--yellow-900);
        transform: translateY(-2px);
    }

.btnCancelar {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #E5E5E5;
    color: black;
    margin: 0;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    text-decoration: none;
    font-family: "Montserrat";
    font-weight: 700;
    text-transform: uppercase;
    font-size: 14px;
}

    .btnCancelar:hover {
        background-color: #737373;
        transform: translateY(-2px);
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    }

.text-end {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.collapseFiltros {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-top: 10px;
}

.btnFiltros {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #333333;
    color: white;
    margin: 0;
    padding: 10px 20px;
    border: none;
    border-radius: 2px;
    text-decoration: none;
    font-family: "Montserrat";
    font-weight: 700;
    text-transform: uppercase;
    font-size: 14px;
}

@media (max-width: 768px) {


    .text-endFiltro {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    /* botón filtros arriba */
    #btnFiltrosToggle {
        order: 1;
        width: 100%;
    }

    /* contenedor collapse debajo */
    #collapseFiltros {
        order: 2;
        width: 100%;
    }

    

    #collapseFiltros button {
        width: 100%;
    }

    /* restaurar layout interno del select2 */
    .select2-container--default .select2-selection--single {
        display: block !important;
        position: relative;
        padding-right: 30px; 
    }

    /* posicionar la X correctamente */
    .select2-container--default .select2-selection__clear {
        position: absolute !important;
        right: 1px;
        top: 50%;
        transform: translateY(-50%) translateX(40%);
        margin: 0 !important;
    }

    /* flecha del dropdown */
    .select2-container--default .select2-selection__arrow {
        right: 5px;
    }

    .btnArbol {
        display: flex !important;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }

    .btnArbol .btnPrimario {
        flex: 0 0 calc(33.333% - 8px); /* 3 por fila */
        max-width: calc(33.333% - 8px);
        text-align: center;
        padding: 10px 5px;
        font-size: 13px;
        white-space: normal;
        line-height: 1.2;
    }
}

.btnFiltrar {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #333333;
    color: white;
    margin: 0;
    padding: 10px 20px;
    border: none;
    border-radius: 2px;
    text-decoration: none;
    font-family: "Montserrat";
    font-weight: 700;
    border-radius: 5px 0 0 5px;
    text-transform: uppercase;
    font-size: 14px;
}

.btnLimpiar {
    display: flex;
    font-size: 14px;
    justify-content: center;
    align-items: center;
    background: #333333;
    color: white;
    margin: 0;
    padding: 10px 20px;
    border: none;
    text-decoration: none;
    font-family: "Montserrat";
    font-weight: 700;
    text-transform: uppercase;
}

.text-endFiltro {
    display: flex;
    justify-content: flex-end;
    gap: 0px;
}

.btnFiltroAccion {
    border-radius: 5px;

}

    .btnFiltroAccion .icon-closed,
    .btnFiltroAccion .icon-open {
        margin-right: 5px;
    }

    .btnFiltroAccion .icon-open {
        display: none;
    }

    .btnFiltroAccion[aria-expanded="true"] {
        border-radius: 0 5px 5px 0;
    }

        .btnFiltroAccion[aria-expanded="true"] .icon-open {
            display: inline-block;
        }

        .btnFiltroAccion[aria-expanded="true"] .icon-closed {
            display: none;
        }

    .btnFiltroAccion .icon-closed,
    .btnFiltroAccion .icon-open {
        transition: opacity 0.3s ease-in-out;
    }

    .btnFiltroAccion[aria-expanded="false"] .icon-open,
    .btnFiltroAccion[aria-expanded="true"] .icon-closed {
        opacity: 0;
    }

    .btnFiltroAccion[aria-expanded="true"] .icon-open,
    .btnFiltroAccion[aria-expanded="false"] .icon-closed {
        opacity: 1;
    }

.linkPrimario {
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    font-size: 14px;
    line-height: 160%;
    text-transform: uppercase;
    color: var(--yellow-500);
}

    .linkPrimario:hover {
        transform: translateY(-2px);
        background: #f5f5f5;
        border-radius: 4px;
        color: var(--yellow-900);
    }

.form-check-input {
    border-color: #3d3d3d;
}

    .form-check-input:checked {
        background-color: #f5bc00;
        border-color: #f5bc00;
    }

.form-control:focus {
    outline: none !important;
    border-color: #f5bc00;
    box-shadow: 0 0 5px rgba(255, 102, 0, 0.5) !important;
}

h1 {
    font-family: "Montserrat";
    font-size: 40px;
}

h2 {
    font-family: "Montserrat";
    font-size: 32px;
}

h3 {
    font-family: "Montserrat";
    font-size: 28px;
}

h4 {
    font-family: "Montserrat";
    font-size: 24px;
}

h5 {
    font-family: "Montserrat";
}

label {
    font-family: "Arial";
    font-size: 14px;
}

select,
input,
textarea,
checkbox,
radio {
    font-family: "Arial";
    font-size: 16px;
}

.view-index {
    min-height: 400px; 
    padding-bottom: 2rem;
   
}


#content-wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

#content {
    flex: 1;
}

.text-align-right {
    text-align: right;
}

.font-arial {
    font-family: "Arial" !important;
}

.font-museo-sans {
    font-family: "Museo Sans" !important;
}

.carousel-caption {
    width: 100% !important;
}

.carousel-heading {
    font-size: clamp(1rem, 5vw, 2.5rem);
}

.list-group-item {
    font-family: "Montserrat" !important;
    font-weight: 700;
}

/* Este estilo se encarga de que los botones ocupen el ancho completo del contenedor. */
.ordenBotonesAlert .swal2-actions {
    display: flex !important;
    justify-content: center !important;
    width: 50% !important;
}

/* Este estilo mueve el botón de "Aceptar" a la derecha. */
.ordenBotonesAlert .btnPrimario {
    order: 2 !important;
    margin-left: auto !important;
}

/* Este estilo mueve el botón de "Volver" a la izquierda. */
.ordenBotonesAlert .btnCancelar {
    order: 1 !important;
    margin-right: auto !important;
}
/* Fondo del popup */
.swal2-popup.swal2-bg-custom {
    background-color: #ffffff !important;
    border-radius: 16px !important;
    padding: 30px 20px;
}

/* Botones base */
.swal2-popup .btn-custom {
    font-weight: bold;
    font-size: 14px;
    border-radius: 6px;
    padding: 10px 24px;
    border: none;
    margin: 0 5px;
    min-width: 100px;
    cursor: pointer;
}

/* Botón aceptar */
.swal2-popup .btn-aceptar {
    background-color: #CC9C00 !important; /* amarillo que quieres */
    color: white !important;
    margin-left: 15px;
    font-family: 'Montserrat';
    font-weight: 700;
    font-size: 12px;
}

    .swal2-popup .btn-aceptar:hover {
        background-color: #b88d00 !important;
        font-family: 'Montserrat';
        font-weight: 700;
        font-size: 12px;
    }

/* Botón cancelar */
.swal2-popup .btn-cancelar {
    background-color: #f1f1f1 !important;
    color: black !important;
    font-family: 'Montserrat';
    font-weight: 700;
    font-size: 12px;
}

    .swal2-popup .btn-cancelar:hover {
        background-color: #e0e0e0 !important;
        font-family: 'Montserrat';
        font-weight: 700;
        font-size: 12px;
    }
.logo-icon {
    width: auto !important;
    height: 80px !important;
}
/* botones */

@media (min-width: 320px) and (max-width: 600px) {
    #divBandera {
        /*position:relative !important;*/
        margin-top: 9px !important
    }

    .logo-icon {
        width: auto !important;
        height: 80px !important;
    }
}

@media (min-width: 750px) and (max-width: 801px) {
    #divBandera {
        /*position:relative !important;*/
        margin-top: 10px !important
    }

    .logo-icon {
        width: auto !important;
        height: 80px !important;
    }
}

@media (min-width:601px) and (max-width: 1001px) {
    #divBandera {
        /*position:relative !important;*/
        margin-top: 10px !important
    }

    .logo-icon {
        width: auto !important;
        height: 80px !important;
    }
}

.toggle-btn {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    margin-top: 4px;
}

.swal2-title {
    color: black !important; 
    font-weight: 600; 
}

.swal2-html-container h2 {
    color: black !important;
}

/*Tooltip*/
.tooltip-custom {
    position: relative;
    display: inline-block;
}

.tooltip-custom:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    top: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%);
    background: #ffc107;
    color: black;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 12px;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(0,0,0,0.20);
    z-index: 999;
}

.tooltip-custom:hover::before {
    content: "";
    position: absolute;
    top: calc(100% + 2px);
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #ffc107;
    z-index: 998;
}

/*Cards*/
.stat-card {
    background: #fff;
    border-radius: 14px;
    padding: 16px 20px 16px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /*box-shadow: 0 6px 16px rgba(0,0,0,.08);*/
    margin-bottom: 1rem; /* Añadir margen entre cards */
}

.stat-card h2 {
    margin: 0;
    font-weight: 700;
    font-size: 32px;
}

.stat-card p {
    margin: 0;
    color: #555;
    font-size: 15px;
}

/* Icono */
.stat-card .icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
}
.stat-card > div:first-child {
    text-align: left;
}

/* Colores bordes */
.border-gray {
    border: 2px solid #6c757d;
    border-left: 10px solid #6c757d;
}

.border-yellow {
    border: 2px solid #d4a100;
    border-left: 10px solid #d4a100;
}

.border-orange {
    border: 2px solid #fd7e14;
    border-left: 10px solid #fd7e14;
}

.border-dark {
    border: 2px solid #343a40;
    border-left: 10px solid #343a40;
}

.border-green {
    border: 2px solid #198754;
    border-left: 10px solid #198754;
}

.border-red {
    border: 2px solid #dc3545;
    border-left: 10px solid #dc3545;
}

/* Colores iconos */
.icon.gray {
    background: #6c757d;
}

.icon.yellow {
    background: #d4a100;
}

.icon.orange {
    background: #fd7e14;
}

.icon.dark {
    background: #343a40;
}

.icon.green {
    background: #198754;
}

.icon.red {
    background: #dc3545;
}