@import url("../../css/site.css");

:root {
    --bs-primary: #518840;
    --bs-primary-2: #0c0b81;
    --bs-body-color: #8e8c8c;
    --bs-blanco: #fff;
}

/*.navbar .nav-link {
    color: #ffffffb3;
}*/

hr{
    border: 1px solid var(--bs-primary)
}
.text-white {
    color: var(--bs-white);
}

.rating-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2px;
}

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

.rating-box {
    /*width: 40px;*/
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #ccc;
    cursor: pointer;
    font-weight: bold;
}
    /* Colores según las secciones */
    .rating-box.green {
        background-color: #98FB98; /* Verde claro */
    }

    .rating-box.yellow {
        background-color: #FFFF99; /* Amarillo */
    }

    .rating-box.orange {
        background-color: #FFD580; /* Naranja */
    }

    .rating-box.red {
        background-color: #FF9999; /* Rojo claro */
    }
    /* Estilo al seleccionar */
    .rating-box.selected {
        border: 2px solid black;
    }

.max-width-15 {
    max-width: 15rem; /* ancho máximo relativo (≈ 240px si 1rem = 16px) */
}

.wrap-col-1 {
    max-width: 15rem; /* ajusta al ancho que quieras */
    white-space: normal !important; /* permite saltos de línea normales */
    word-wrap: break-word; /* rompe palabras largas */
    word-break: break-word;
}

.wrap-col-2 {
    max-width: 20rem; /* ajusta al ancho que quieras */
    white-space: normal !important; /* permite saltos de línea normales */
    word-wrap: break-word; /* rompe palabras largas */
    word-break: break-word;
}

.vh-75 {
    height: 75vh !important;
}
.full-page-background {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: absolute;
    z-index: -1;
    height: 100%;
    width: 100%;
    display: block;
    top: 0;
    left: 0;
    opacity: 0.2;
}

/* Cookies */

/* CSS para la animación y localización de los DIV de cookies */
@keyframes desaparecer {
    0% {
        bottom: 0px;
    }

    80% {
        bottom: 0px;
    }

    100% {
        bottom: -50px;
    }
}

@-webkit-keyframes desaparecer /* Safari and Chrome */
{
    0% {
        bottom: 0px;
    }

    80% {
        bottom: 0px;
    }

    100% {
        bottom: -50px;
    }
}

@keyframes aparecer {
    0% {
        bottom: -38px;
    }

    10% {
        bottom: 0px;
    }

    90% {
        bottom: 0px;
    }

    100% {
        bottom: -38px;
    }
}

@-webkit-keyframes aparecer /* Safari and Chrome */
{
    0% {
        bottom: -38px;
    }

    10% {
        bottom: 0px;
    }

    90% {
        bottom: 0px;
    }

    100% {
        bottom: -38px;
    }
}

#cookiesms1:target {
    display: none;
}

.cookiesms {
    height: 43px;
    width: 100%;
    clear: both;
    font-weight: 700;
    color: #000;
    bottom: -50px;
    position: fixed;
    left: 0px;
    background-color: #FFF;
    /*opacity: 0.7;
    filter: alpha(opacity=70);*/ /* For IE8 and earlier */
    transition: bottom 1s;
    -webkit-transition: bottom 1s; /* Safari */
    -webkit-box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
    -moz-box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
    box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
    z-index: 999999999;
}

    .cookiesms:hover {
        bottom: 0px;
    }

.cookies2 {
    height: 30px;
    background-color: var(--bs-primary);
    color: var(--bs-white);
    display: inline;
    /*opacity: 0.95;
    filter: alpha(opacity=95);*/
    position: absolute;
    left: 1%;
    top: -30px;
    -webkit-border-top-right-radius: 15px;
    -webkit-border-top-left-radius: 15px;
    -moz-border-radius-topright: 15px;
    -moz-border-radius-topleft: 15px;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    border: 3px solid #FFF;
}

@media (max-width: 720px) {
    .cookiesms {
        height: 200px;
    }
}

/*  FIN cookies */

/* Quitar bullets de todo por defecto */

.navbar-vertical .navbar-nav .nav-link[data-toggle=collapse][aria-expanded=true]:after,
.navbar-vertical .navbar-nav .nav-link[data-toggle=collapse]:after {
    color: var(--bs-blanco);
}

ul.nav {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

    /* --- Hijos con numeración --- */
    ul.nav.ms-3.ps-3 {
        counter-reset: hijo-counter; /* reinicia el contador por cada padre */
        padding-left: 1.5rem;
    }

        ul.nav.ms-3.ps-3 > li {
            counter-increment: hijo-counter; /* suma 1 por cada hijo */
            position: relative;
            padding-left: 1.5rem; /* espacio para el número */
        }

            ul.nav.ms-3.ps-3 > li::before {
                content: counter(hijo-counter) ". "; /* muestra el número */
                /* position: absolute;
                                                                left: 0; */
                color: var(--bs-blanco);
                font-weight: bold;
                font-size: .75rem;
            }

    /* --- Nietos con punto --- */
    ul.nav.nav-sm.flex-column {
        list-style: disc;
        padding-left: 2rem;
    }

.act-pri.nav-link.active2 {
    background-color: #002E48 !important;
    color: #fff !important;
    font-weight: 700;
}

/* Hijos activos */
.act-sec.nav-link.active2 {
    background-color: #77A2FF !important;
    font-weight: 700;
}

/* Nietos */
.li-nieto .nav-link {
    font-size: 0.9rem;
    padding-left: 25px;
    color: #555;
}

    .li-nieto .nav-link.active {
        font-weight: 700;
        color: #002E48;
    }

.nav-link2 {
    position: relative;
    background-color: transparent;
    box-shadow: none;
    padding-top: .417rem;
    padding-bottom: .417rem;
    font-size: .75rem;
}

    .nav-link2.active {
        font-weight: 600;
    }

    .nav-link2[data-toggle=collapse]:after {
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: Font Awesome\ 5 Free;
        font-weight: 700;
        content: "\f107";
        margin-left: auto;
        color: rgba(24, 24, 27, .5);
        transition: all .2s ease-in-out;
        margin-right: .75rem;
    }

.nav-link3 {
    font-size: .75rem !important;
}

.navbar-vertical .navbar-nav > .nav-item .nav-link.active {
    background-color: var(--bs-gray-100);
}