:root {
    /* Colores primarios */
    /* --color-verde-selva: #2f7b48; */
    --color-verde-selva: #00c339;
    --color-azul-medianoche: #126f9a;

    /* Colores secundarios */
    --color-verde-claro: #a7d7a2;
    --color-celeste-amazonico: #a0d2eb;
    --color-turquesa-profundo: #1fbfae;

    /* Colores neutros */
    --color-gris-oscuro: #2e2e2e;
    --color-gris-claro: #f2f2f2;
    --color-blanco: #ffffff;

    /* Colores de énfasis */
    --color-naranja-cálido: #f4a261;
    --color-amarillo-selva: #ffd166;
}

body {
    background-color: var(--color-blanco);
    color: var(--color-gris-oscuro);
}

/* Asegúrate de que el carrusel tenga posición relativa */
#relateds {
    position: relative;
}

/* Contenedor de los botones nav */
#relateds .owl-nav {
    position: absolute;
    top: 40%;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    transform: translateY(-40%);
    pointer-events: none;
    /* evita bloqueos */
    z-index: 2;
}

/* Botones individuales (prev y next) */
#relateds .owl-nav button.owl-prev,
#relateds .owl-nav button.owl-next {
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
    border: none;
    padding: 0px 14px !important;
    border-radius: 50%;
    font-size: 30px;
    cursor: pointer;
    pointer-events: all;
    transition: background 0.3s ease;
    position: relative;
    height: 40px !important;
    width: 40px !important;
    line-height: 1em;
}

/* Mover hacia fuera */
#relateds .owl-nav button.owl-prev {
    margin-left: -25px;
    /* empuja hacia fuera del carrusel */
}

#relateds .owl-nav button.owl-next {
    margin-right: -25px;
}

/* Hover efecto */
#relateds .owl-nav button:hover {
    background-color: rgba(0, 0, 0, 0.9);
}

#fullscreen-loading {
    display: none !important;
    /* Oculto por defecto */
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.6);
    /* Fondo semi-transparente */
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-text {
    color: white;
    font-size: 2rem;
    font-weight: bold;
    font-family: sans-serif;
    animation: blink 1s infinite;
}

#fullscreen-loading.show-loading {
    display: flex !important;
}

.bold {
    font-weight: bold;
}

.nowrap {
    white-space: nowrap;
}

.float-right {
    float: right;
}

.button,
a.btn_1,
.btn_1 {
    background-color: var(--color-verde-selva);
    color: var(--color-blanco);
}

.btn-download-package {
    background: white !important;
    border: 2px solid #fc5b62 !important;
    color: #fc5b62 !important;
    margin-top: 10px;
}

.form-group label {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--color-gris-oscuro);
    display: block;
}

.form-control {
    padding-left: 20px;
    padding-right: 20px;
}

#carousel .item .title h4,
.score strong {
    background-color: var(--color-azul-medianoche);
}

header.header.sticky {
    padding: 8px 20px;
}

.main-menu ul li a.active {
    border-bottom: 2px solid var(--color-verde-selva) !important;
    color: var(--color-turquesa-profundo);
    font-weight: bold;
    line-height: 1em;
}

.index__hotel__grid__figure {
    height: 240px !important;
}

.index__hotel__grid__figure__img {
    height: 100% !important;
}

.index__packages__boxdescription__price {
    color: var(--color-azul-medianoche);
    font-weight: bold;
    font-size: 20px;
}

footer {
    background-color: var(--color-gris-oscuro); /* #2e2e2e */
    color: var(--color-blanco); /* #ffffff */
}

footer a {
    color: var(--color-celeste-amazonico); /* #a0d2eb */
}

footer a:hover {
    color: var(--color-naranja-cálido); /* #f4a261 */
}

.badge-city {
    position: absolute;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.6);
    padding: 5px 10px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    font-size: 12px;
}

.badge-time {
    background-color: var(--color-turquesa-profundo) !important;
}

.link-detail {
    padding-top: 10px;
    display: inline-block;
    /* color: var(--color-gris-oscuro); */
}

.badge-time-tourdetail {
    background-color: var(--color-turquesa-profundo) !important;
    padding: 5px 10px;
    font-size: 12px;
    color: white;
    border-radius: 4px;
}

.box_include_tour ul,
.webapp__tour__sectiondescription ul {
    line-height: 1.8;
    margin: 0;
    padding: 0;
}

.box_include_tour ul li,
.webapp__tour__sectiondescription ul li {
    position: relative;
    padding-left: 20px;
}

.box_include_tour ul li:before,
.webapp__tour__sectiondescription ul li:before {
    font-style: normal;
    font-weight: normal;
    font-family: "ElegantIcons";
    font-size: 14px;
    font-size: 0.875rem;
    content: "\\";
    color: #ccc;
    position: absolute;
    left: 0;
    top: 0;
}

.box_include_tour p {
    margin-top: 10px;
    margin-bottom: 10px;
}

.card-header h5 {
    font-size: 18px;
    margin-left: 10px;
}

.accordion_2 .card-header h5 a {
    color: var(--color-gris-oscuro);
}

a.tab-title[aria-expanded="true"] {
    color: var(--color-turquesa-profundo) !important;
    font-weight: bold;
    font-size: 18px !important;
}

.webapp__tour__sectiondescription {
    margin-top: 15px;
}

.webapp__tour__sectiondescription > h3 {
    margin-top: 15px;
    margin-bottom: 10px;
    font-weight: bold;
    color: var(--color-gris-oscuro);
    font-size: 13px !important;
}

.accordeon-tour .collapse.show {
    background: #f2f2f247;
}

.price-tour {
    color: var(--color-azul-medianoche);
    font-weight: bold;
}

.booking select {
    display: block !important;
}

.box-social-book {
    text-align: center;
    padding-top: 15px;
    padding-bottom: 15px;
    background-color: #f8f8f8;
}

ul.social-book {
    display: inline-block;
    margin-bottom: 0px;
}

ul.social-book li {
    display: inline;
}

ul.social-book li a {
    font-size: 25px;
    padding: 10px;
}

ul.social-book li a .bi-facebook {
    color: blue !important;
}
ul.social-book li a .bi-instagram {
    color: rgb(255, 0, 157) !important;
}

ul.social-book li a .bi-tiktok {
    color: rgb(7, 0, 4) !important;
}

ul.social-book li a .bi-youtube {
    color: red !important;
}

.webapp__boxrelacionados__title {
    font-weight: bold;
    font-size: 20px;
    margin-top: 0px;
    margin-bottom: 10px;
}

a.box_news figure {
    height: 100%;
}

.box-package {
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1);
}

.content-package {
    padding-right: 5px;
    padding-bottom: 10px;
}

.content-package .tours-include {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
    margin-bottom: 10px;
    color: grey;
}

.package_content {
    padding: 25px 15px;
    background-color: white;
}

.package_content_title {
    font-size: 23px;
    font-weight: bold;
}

.package_badge {
    background: var(--color-turquesa-profundo);
    padding: 2px 5px;
    border-radius: 4px;
    color: white;
    font-size: 12px;
}

.tablaPrecios td {
    vertical-align: middle;
    padding: 5px;
}

.img-hotel-name {
    display: inline;
    margin-left: 10px;
    font-size: 12px;
}

.input-check {
    height: 18px !important;
    width: 20px !important;
    margin-right: 15px !important;
}

.label_hotel {
    cursor: pointer;
    vertical-align: middle;
    align-items: center;
    display: inline-flex;
}

.cbp_tmtimeline > li .cbp_tmlabel,
.card-body-services,
.tablaPrecios tbody tr.resaltado td {
    /* background: #ddecf7; */
    background: #edf7ff;
}

table tr td {
    vertical-align: middle;
}

table .table-light th {
    background: #f3f3f3;
    padding: 15px;
}

.tablaPrecios tbody tr.resaltado td .label_precio {
    font-weight: bold;
}

.tablaPrecios tbody tr.resaltado .icon {
    display: inline !important;
}

.tablaPrecios tbody tr.filas-precios .icon {
    color: green;
    margin-left: 5px;
    display: none;
}

.tablaPrecios tbody tr td a {
    white-space: nowrap;
}

.hotel__list__item__boxdescription p:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    font-size: 12px;
    margin-bottom: 0px;
}

.hotel__list__item__boxdescription p:not(:first-child),
.hotel__list__item__boxdescription div:not(:first-child) {
    display: none;
}

.hotel__list__item__boxservices ul {
    display: inline-block;
}

.box_list ul li.hotel__itemservice {
    float: left !important;
    margin-bottom: 3px;
    font-size: 10px;
}

/* .box_list.hotels figure a img {
    transform: translate(-50%, -50%) scale(1) !important;
    height: 100% !important;
    width: 100% !important;
} */

.form_search a,
.form_search button {
    display: flex;
    justify-content: center;
    height: 50px;
    vertical-align: middle;
    align-items: center;
}

.nice-select,
.nice-select.open .list {
    width: 100%;
}

.card-body-services ul {
    display: inline-block;
    margin-bottom: 10px;
}

.card-body-services ul li.hotel__itemservice {
    float: left !important;
    margin-bottom: 3px;
    font-size: 12px;
    margin-right: 10px;
}

.hotel__titleservice {
    font-weight: bold;
    margin-bottom: 15px;
    font-size: 15px;
}

.content-iframe iframe {
    width: 100% !important;
}

.title-pax-hotel {
    color: var(--color-azul-medianoche);
    font-weight: 700;
    font-size: 16px;
}

.text-package-related a {
    color: var(--color-gris-oscuro);
    font-weight: 700;
    font-size: 19px;
}

.package_hotel_selected {
    background: var(--color-celeste-amazonico);
    margin-bottom: 15px;
    padding: 10px;
    align-items: center;
    vertical-align: middle;
}

.box_detail {
    background-color: white;
}

.box-linked a{
    display: block;
    margin-top: 5px;
    font-weight: 600;
}

.share li {
    display: inline-block;
    margin-right: 25px;
    font-size: 20px;
}

.post-content p{
    margin-bottom: 10px;
}

@media (max-width: 550px) {
    /* Mover hacia fuera */
    #relateds .owl-nav button.owl-prev {
        margin-left: 0px;
        /* empuja hacia fuera del carrusel */
    }

    #relateds .owl-nav button.owl-next {
        margin-right: 0px;
    }

    /* Hover efecto */
    #relateds .owl-nav button:hover {
        background-color: rgba(0, 0, 0, 0.9);
    }

    .main-menu ul li a.active {
        line-height: 2.5em;
    }

    #sidebar {
        margin-top: 30px;
    }

    .thumb_cart {
        display: block;
        width: 45px;
        height: 45px;
        border-radius: 15%;
    }
}