﻿.fc-event,
.fc-event-dot {
    /* background-color: #ac8d56; */
    border: none;
}

#gtc-div-book-calendar {
    /* max-width: 800px; */
    margin: auto;
}

.fc-scroller {
    -webkit-overflow-scrolling: touch;
    height: auto !important;
    overflow: hidden !important;
}

.fondo-amarillo {
    background-color: #ac8d56;
}

.fondo-amarillo-fijo {
    background-color: #ac8d56;
}

.fc-event,
.fc-event-dot {
    background-color: initial;
    text-align: center;
    /* padding-top: 55px; */
}

.fc-title {
    font-size: 28px;
    color: #000000;
    font-weight: 600;
      font-family: 'Inter', sans-serif !important;

}

.fc-title::after {
    /* content: 'â‚¬'; */
    font-size: 17px;
    font-weight: 600;
      font-family: 'Inter', sans-serif !important;

}

.precio {
    font-size: 15px;
    color: #000000;
}

.fc-past a.fc-day-number {
    color: #dee2e6;
    font-size: 9px;
}


@media(max-width: 768px){
    .fc-dayGrid-view .fc-week-number,
    .fc-dayGrid-view .fc-day-number {
    font-size: 9px;
}
}

.fc th {
    text-transform: uppercase;
    font-size: 8px;
    color: #8080806b;
}

.fc-custom1-button {
    color: #FFF !important;
    background: transparent;
}

.fc-custom2-button {
    color: #FFF !important;
    background: transparent;
}

.fc-custom3-button {
    color: #FFF !important;
    background: transparent;
}

.fc-custom4-button {
    color: #8080806b;
    background: transparent;
}

.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger {
    color: #8080806b;
    background: transparent;
}

.btn-primary:hover {
    color: #343a40;
    background-color: transparent;
    border-color: transparent;
}

.fc-next-button:hover {
    color: #000000 !important;
    background: transparent !important;
    border-color: transparent !important;
}

.fc-prev-button:hover {
    color: #000000 !important;
    background: transparent !important;
    border-color: transparent !important;
}

.fc-week {
    height: 67px !important;
}

.fc-center {
    text-align: center;
    width: 100%;
    /*display: flex;*/
    background-color: #000;
    color: #ffffff;
    font-size: 8px;
    /* padding: 1px 60px 1px 60px; */
    padding: 1px 25px 1px 25px;
    text-transform: uppercase;
}

.fc-center h2 {
    line-height: 4;
}

.btn-group {
    display: flex;
    flex: 1;
}

.fc-day {
    /* border: 1px solid #ffffff !important; */
    border: 0.1px solid #00000042 !important;
}

.fc-day-header {
    border: 1px solid #ffffff !important;
}

.fc-past {
    border: 0.1px solid #0000001a !important;
}

.fc-other-month {
    border: 0px solid #0000001a !important;
}


.fc-day-top {
    border: none !important;
}

.fc table {
    width: 100%;
    box-sizing: border-box;
    table-layout: fixed;
    font-size: 1em;
    border-collapse: separate;
}

.fc-bg table {
    /* border-spacing: 1px; */
    border-spacing: 7px;
}

@media (min-width:768px) {
    .fc-bg table {
        border-spacing: 7px;
    }
}

.fc th,
.fc td {
    border-style: solid;
    border-width: 1px;
    padding: 0;
    vertical-align: top;
    padding: 5px;
}

.fc-row table {
    border-top: 0 hidden transparent;
}

.fc th,
.fc td {
    border-style: solid;
    border-width: 0px;
    padding: 0;
    vertical-align: top;
}

.table-bordered {
    border-width: 0;
}

.fc-head-container {
    border-bottom-width: 0px !important;
}

.fc-left {
    min-width: 37px;
}

.fc-right {
    min-width: 37px;
}

hr {
    margin-top: 10px;
    margin-bottom: 5px;
    border: 0;
    width: 143px;
    border-top: 1px solid #6c757da8;
}

.displayEstandar {
    display: none;
}

.displayBotones {
    display: block;
}

.d-none {
    display: none;
}

.d-none-demo {
    display: none;
}

.margin-150px-bottom {
    margin-bottom: 150px;
}

.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show>.btn-primary.dropdown-toggle:focus {
    box-shadow: none;
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {
    color: #343a40;
    background-color: transparent;
    border-color: transparent;
}

.imagen-no-entradas {
    background-image: url(../images/no-ticket.svg);
    /* margin-left: 35%;
    margin-top: -7px; */
    margin-top: 7px;
    margin-left: 31%;
    color: #80808014;
    font-size: 16px;
}

@media (min-width: 575px)
{
    .imagen-no-entradas {
        margin-top: 7px;
        margin-left: 32%;
    }
}

.fc-row .fc-bg {
    z-index: auto;
}


tr:first-child>td>.fc-day-grid-event {
    margin: 0;
    /* FIXME: click versiÃ³n mÃ³vil */
    padding: 15px 0;
    margin: -15px 0;
}

.navbarEntradas {
    background-color: #000;
    /* height: 80px; */
    height: 60px;
}

@media(max-width:575px) {
    .navbarEntradas {
        height: 60px;
    }
}


/***********Estilos ballon hover******************/

.tooltip-yellow {
    --balloon-color: #fffbc3;
}

[aria-label]:hover:before,
[aria-label]:hover:after,
[aria-label][data-balloon-visible]:before,
[aria-label][data-balloon-visible]:after,
[aria-label]:not([data-balloon-nofocus]):focus:before,
[aria-label]:not([data-balloon-nofocus]):focus:after {
    color: #000000 !important;
}

.fc-row.fc-rigid {
    overflow: inherit;
}

[aria-label][data-balloon-pos][data-balloon-pos="up"]:after {
    margin-bottom: 0 !important;
}

[aria-label][data-balloon-pos]:before {
    top: -1px !important;
}

.tooltip-big-small {
    --balloon-font-size: 9px;
}

.noticket {
    background-image: url('./images/no-ticket.png');
}

.fc-dayGrid-view .fc-body .fc-row {
    min-height: 6em;
}


/************************************************************************/

.popper,
.tooltip {
    position: absolute;
    z-index: 9999;
    background: #FFC107;
    color: black;
    width: 150px;
    border-radius: 3px;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
    padding: 10px;
    text-align: center;
}

.style5 .tooltip {
    background: #1E252B;
    color: #FFFFFF;
    max-width: 200px;
    width: auto;
    font-size: .8rem;
    padding: .5em 1em;
}

.popper .popper__arrow,
.tooltip .tooltip-arrow {
    width: 0;
    height: 0;
    border-style: solid;
    position: absolute;
    margin: 5px;
}

.tooltip .tooltip-arrow,
.popper .popper__arrow {
    border-color: #FFC107;
}

.style5 .tooltip .tooltip-arrow {
    border-color: #1E252B;
}

.popper[x-placement^="top"],
.tooltip[x-placement^="top"] {
    margin-bottom: 5px;
}

.popper[x-placement^="top"] .popper__arrow,
.tooltip[x-placement^="top"] .tooltip-arrow {
    border-width: 5px 5px 0 5px;
    border-left-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    bottom: -5px;
    left: calc(50% - 5px);
    margin-top: 0;
    margin-bottom: 0;
}

.popper[x-placement^="bottom"],
.tooltip[x-placement^="bottom"] {
    margin-top: 5px;
}

.tooltip[x-placement^="bottom"] .tooltip-arrow,
.popper[x-placement^="bottom"] .popper__arrow {
    border-width: 0 5px 5px 5px;
    border-left-color: transparent;
    border-right-color: transparent;
    border-top-color: transparent;
    top: -5px;
    left: calc(50% - 5px);
    margin-top: 0;
    margin-bottom: 0;
}

.tooltip[x-placement^="right"],
.popper[x-placement^="right"] {
    margin-left: 5px;
}

.popper[x-placement^="right"] .popper__arrow,
.tooltip[x-placement^="right"] .tooltip-arrow {
    border-width: 5px 5px 5px 0;
    border-left-color: transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
    left: -5px;
    top: calc(50% - 5px);
    margin-left: 0;
    margin-right: 0;
}

.popper[x-placement^="left"],
.tooltip[x-placement^="left"] {
    margin-right: 5px;
}

.popper[x-placement^="left"] .popper__arrow,
.tooltip[x-placement^="left"] .tooltip-arrow {
    border-width: 5px 0 5px 5px;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    right: -5px;
    top: calc(50% - 5px);
    margin-left: 0;
    margin-right: 0;
}

.alert-info {
    color: #0c5460;
    background-color: initial !important;
    border-color: #bee5eb;
}

.alert {
    position: relative;
    margin-bottom: 1rem;
    border-radius: initial !important;
}


.fc-highlight {
    background: initial !important;
    opacity: initial !important;
}


/************************************* Paso 1 ****************************************************/

.selectorEntradasTexto {
    font-size: 12px;
    margin-right: 14px;
    line-height: 1.4;
}

.selectorEntradas {
    font-size: 12px;
    padding: 6px;
}

.seccionPaso1Entradas {
    background-color: #343a40;
    padding: 50px;
}

.subTituloPaso1 {
    width: 35%;
    margin: auto;
    font-size: 11px;
    line-height: 1.5;
}

.spanEntradas {
    color: #ffffff;
}


.contenedorBtnContinuarEntradas {
    margin-top: 30px;
}


.btnContinuarEntradas {
    background: transparent !important;
    color: #343a40;
}

.btnContinuarEntradas:hover {
    background: #343a40;
    color: #ffffff;
    border-color: #ffffff;
}

.selector-entradas {
    display: flex;
    height: fit-content;
    max-width: max-content;
    /* padding-left: 2rem;
    padding-right: 2rem; */
    padding-left: 5px;
    padding-right: 5px;
}

@media (max-width: 390px) {
    .selector-entradas {
        padding-left: 5px;
        padding-right: 5px;
    }    
}

.selector-entradas>div {
    /* margin-right: 25px; */
    margin-bottom: 20px;
    line-height: 1.8;
}

@media(min-width: 768px){
    .selector-entradas>div {
        margin-bottom: 20px;
    }
}

#gtc-lanzar-calendario, .fc-day-grid-event {
    cursor: pointer;
}


.btn-disponibilidad {
    background-color: #21883C;
    border-color: #1e7e34;
    color: #ffffff;
}

.btn-disponibilidad:hover {
    background-color: transparent;
    border-color: #1e7e34;
    color: #000000;
}



/************************************** Horarios y precios **********************************/


/* @media(min-width: 768px) and (max-width: 991px) {
    .precioshoras > div > div:not(:first-child), .precioshoras > div > div:not(:first-child) .alt-font {
        font-size: 15px!important;
        line-height: 1.3!important;
    }

    .precioshoras > div > div:not(:first-child), .precioshoras > div > div:not(:first-child) .btn-very-small {
        padding: 10px!important;
    }
} */

/* @media(max-width: 575px) { */
    .precioshoras > div > div:not(:first-child), .precioshoras > div > div:not(:first-child) .alt-font {
        font-size: 18px!important;
        line-height: 1.5!important;
    }

    .precioshoras > div > div:not(:first-child), .precioshoras > div > div:not(:first-child) .btn-very-small {
        padding: 10px!important;
    }
/* } */
/* @media(max-width: 374px) { */
    .precioshoras > div > div:not(:first-child), .precioshoras > div > div:not(:first-child) .alt-font {
        font-size: 15px!important;
        line-height: 1.2!important;
    }
/* } */

.padding40-0 {
    padding: 40px 0 !important;
}

.horariosIncluye {
    font-size: 12px; 
  font-family: 'Inter', sans-serif !important;
}

.margin-4px-left-negativo {
    margin-left: -4px;
}

.margin-25px-top-negativo {
    margin-top: -25px
}

.margin-50px-top-negativo {
    margin-top: -50px;
}

/* @media(min-width: 1200px) {
    .contenedor-principal {
        max-width: 1128px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .contenedor-principal {
        max-width: 930px !important;
    }
} */



.contenedor-principal {
    max-width: 720px;
}

.precioshoras1 {
    padding-top: 0 !important;
    padding-bottom: 0px !important;
}

.precioshoras {
    padding-top: 0 !important;
    padding-bottom: 50px !important;
}



.diaHoras {
    border: solid 0.5px #939393;
    padding: 20px;
}

.infoHorarioIdioma {
    font-size: 10px;
    line-height: 1.5;
    color: #000000;
    font-weight: 500;
}

.estandarTour {
    font-size: 10px;
    font-weight: 800;
    color: #000000;
    line-height: 1.4;
}

.estandarTourSubtitulo {
    text-decoration: underline;
    font-size: 10px;
    font-weight: 600;
    color: #000000;
}

.contenedorPrecios {
    /* padding: 47px 7.2%; */
    /* margin-left: 4.1%; */
    display: flex;
    align-items: center;

}

.fondoRojo {
    background: red;
}

.textoWhite {
    color: #ffffff;
}

.textoPrivate {
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
}

.textoEstandar {
    color: #000000;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
}

.precios {
    color: #000000;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
}

.contenedorTour {
    display: flex;
    align-items: center;
    margin-left: 4.1%;
    margin-bottom: 15px;
    padding: 8px 0;
}

.border-none {
    border: none;
}

.contenedorPrecio {
    width: 100%;
    text-align: center;
}

.precios {
    font-size: 28px;
    color: #000000;
    font-weight: 600;
      font-family: 'Inter', sans-serif !important;

}

.idiomas {
    margin: 0;
    font-size: 10px;
    line-height: 1;
    padding-top: 10px;
}

.contenedorIdiomas {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 7px;
    margin-bottom: 17px;
    vertical-align: middle;
}

.w-80 {
    width: 80%;
}

.diaVisita {
    margin-bottom: 30px;
    color: #000000;
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
}

.numeroPersonas {
    margin-bottom: 5px;
    font-size: 13px;
}

.entradasPrercio {
    line-height: 1.5;
    font-size: 10px;
}

.banderas {
    width: 20px;
    margin-left: 5px;
}



.iconos {
    width: 12px;
}

.preciosIconos {
    font-weight: 700;
    color: #000000;
}

.marginIconos {
    margin-left: 8px;
}

.displayEntradas {
    display: initial;
    border-left: solid 0.5px black;
    padding-left: 30px;
}

.bordeEntradas {
    border: solid 0.5px #939393;
    padding: 20px 30px;
    display: flex;
    justify-content: space-around;
    min-height: 100px;
}

.preciosContent {
    border: solid 0.5px #939393;
    align-items: center;
    justify-content: center;
    display: flex;
    width: 100%;
    text-align: center;
    height: 100%;
    flex-direction: column;
    padding: 10px;
}

.estandarPrivate {
    padding: 10px 20px;
    margin-bottom: 10px;
}

.btnPasarResumenCompra {
    background: #343a40;
    color: #ffffff !important;
    border: transparent;
    font-size: 9px !important;
}

.btnPasarResumenCompra:hover {
    background: transparent;
    color: #343a40 !important;
    border: solid 1px #343a40 !important;
}

.btn-tipoEntrada {
    border: solid 1px black;
    color: #000000;
    font-size: 8px;
    padding: 4px 18px;
    border-radius: 15px;
}

.contenedorBtnEntrada {
    margin-top: 20px;
    margin-bottom: 20px;
}

.opacityBtnPrecios {
    opacity: 0.2;
}


.spanPrecios {
    font-size: 16px;
    font-weight: 600;
    color: #000000;
      font-family: 'Inter', sans-serif !important;

}

.btn.btn-tipoEntrada {
    cursor: pointer;
}


.horariosTitular {
    font-size: 20px;
}

.horariosTitular > span {
    font-size: 16px;
}

/* @media(max-width: 768px){ */
    .modalMovil {
        display: block !important;
    }  
/* } */

/* @media(min-width: 768px){
    .modalEscritorio {
        display: block !important;
    }
} */

.modalNoMostrar {
    display: none;
}

/************************** Form *************************************/


.titularForm {
    margin-bottom: 0;
    font-weight: 700;
    color: #000000;
    margin-bottom: 7px;
}

.subtituloForm {
    margin-bottom: 30px !important;
    font-size: 12px;
    line-height: 1.6;
}

.hrForm {
    margin-top: 0px;
    margin-bottom: 30px;
    border: 0;
    width: 100%;
    border-top: 1px solid #6c757da8;
}

.inputEntradas {
    border: 1px solid #d1d1d1;
    font-size: 14px;
    padding: 8px 15px !important;
    width: 100%;
    margin: 0 0 4px 0;
    max-width: 100%;
    resize: none;
    color: inherit;
    background: transparent;
    height: 32px;
    border-radius: 5px;
}

input,
textarea,
select {
    background: transparent;
    border-radius: 5px !important;
}

.labelForm {
    font-size: 10px;
    /* line-height: 0; */
}

.textareaForm {
    height: 78px;
}

.style {
    line-height: 1.6;
}

.accordion-style2 a,
.accordion-style2 a:hover,
.accordion-style2 a:hover i {
    color: #000000;
}

.accordion-style2 .panel .panel-heading {
    background: #fff !important;
    border-radius: 0 !important;
    padding: 10px 20px;
    background-color: #f7f7f7 !important;
    color: #000000;
    font-size: 10px;
}

.accordion-style3 a,
.accordion-style2 a:hover,
.accordion-style3 a:hover i {
    color: #000000 !important;
}

.acordeonTitular {
    font-size: 11px;
}

.fondoGrisForm {
    background-color: #f7f7f7;
}

.accordion-style2 .panel-body {
    border-top: none !important;
    padding-top: 1px;
    padding: 1px 28px 25px;
}

.hrFormDesplegable {
    margin-top: 10px;
    margin-bottom: 13px;
    border: 0;
    width: auto;
    border-top: 1px solid #6c757da8;
}


.spanTransporte10 {
    margin-left: 25px;
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 24px;
}

/* Hide default HTML checkbox */
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: -0.5px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked+.slider {
    background-color: #2196F3;
}

input:focus+.slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked+.slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}


.accordion-style2 .panel-heading i {
    font-size: 12px !important;
}

.transporteCheckTexto {
    font-size: 10px;
    color: #000000;
}

/* .transporteCheckTexto {
    background: transparent !important;
} */

.selectHotel {
    background: transparent !important;
}

.hrSubTransporte {
    border-top: 1px solid #6c757d3b;
}

.inputVisitantes {
    background: transparent !important;
}

.titularSidebar {
    font-weight: 700;
    color: #000000;
    line-height: 1.2;
    margin-top: 18px;
}

.diaVisitaSidebar {
    margin: 0;
    font-weight: 700;
    color: #000000;
    line-height: 1;
}

.iconosSidebar {
    width: 36px;
    border: solid 0.5px #80808054;
    padding: 9px;
    border-radius: 7px;
}

.iconosSidebarSmall {
    width: 10px;
    margin-right: 10px;
}

.contenedorAbsolutoSidebar {
    position: absolute;
    height: 100%;
    background: #9393930f;
    width: 5000px;
    left: 0;
    z-index: 3;
}

.contenedorInteriorAbsolutoSidebar {
    z-index: 65;
    position: relative;
    margin-top: 61px;
}

.hrSidebar {
    width: auto;
    margin-top: 25px;
    margin-bottom: 25px;
}

.horaVisitaSidebar {
    color: #000000;
    margin: 0;
}

.encuentroSidebar {
    margin-bottom: 7px;
    font-size: 11px;
}

.infoHotelEntradasSidebar {
    font-size: 11px;
    line-height: 1.4;
}

.textoAvisoSidebar {
    font-size: 11px;
    line-height: 1.2;
}

.btnFormPago {
    background-color: #18dd18;
    border-color: #18dd18 !important;
    margin-bottom: 0;
    font-size: 9px;
    padding: 4px 15px;
    color: #ffffff !important;
}


.precioSidebar {
    font-size: 25px;
    color: #000000;
    font-weight: 700;
}

.totalSidebar {
    margin-top: auto;
    color: #000000;
    font-weight: 300;
    font-size: 12px;
}


input:focus,
textarea:focus {
    border-color: initial !important;
}

.euroSidebar {
    font-size: 17px;
}

.btnPromocion {
    padding: 2px 15px;
    background: #0000004f;
    border-color: transparent !important;
    color: #ffffff !important;
    font-size: 9px;
}

.inputPromocion {
    margin-right: 10px;
    font-size: 10px;
}


input:focus,
textarea:focus {
    border-color: transparent;
}

.btnMovil {
    width: 100% !important;
    margin-top: 30px;
}


.textoAtras {
    color: #0282FF;
}

.iconoCarro {
    width: 18px;
    margin-right: 7px;
}

.textoMostrarResumen {
    color: #0282FF;
    font-size: 12px;
}

.flechaAcordeon {
    color: #0282FF;
    padding-top: 5px !important;
}

.accordion-style2 .panel-body {
    padding: 5px 28px 25px !important;

}

.error {
    border-color: #ff0000;
}

.btn-comprar {
    padding: 4px 24px!important;
}

.height-100 {
    height: 100%;
}

.tipo-tour {
    height: 50px;
    align-items: center;
    justify-content: center;
    display: flex;
}

.tipo-tour2 {
    align-items: center;
    justify-content: center;
    display: flex;
}

.fc-dayGrid-view .fc-body .fc-row {
    min-height: 6.5em;
}



/******************************************* Responsive ******************************************/


/* @media (min-width: 1200px) {
    .h-align {
        transform: translate(-50%, 0%);
        position: absolute;
        left: 50%;
    }
}

@media (min-width: 768px) {
    .tipo-tour {
        height: auto;
        align-items: center;
        justify-content: center;
        display: flex;
        margin-bottom: 15px;
    }
    .tipo-tour2 {
        align-items: center;
        justify-content: center;
        display: flex;
        margin-bottom: 15px;
    }
    .center-align {
        transform: translate(-50%,-50%);
        position: absolute;
        top: 50%;
        left: 50%;
    }
} */


/* @media (max-width: 665px) { */
    .seccionPaso1Entradas {
        padding: 50px 0 !important;
    }
/* } */

/* @media (max-width: 564px) { */
    .contenedorEntradasSmall {
        display: initial !important;
    }

    .contenedorEntradasSmallDiv {
        margin-right: auto !important;
        margin-left: auto !important;
    }

    .contenedorEntradasSmallTexto {
        width: 36%;
        margin-right: auto;
        margin-left: auto;
    }

    .contenedorEntradasSmallSelect {
        margin-right: auto;
        margin-left: auto;
        width: 40%;
    }

    .subTituloPaso1 {
        width: 100% !important;
    }

/* } */


/* @media (min-width: 564px) {
    .margin30right {
        margin-right: 30px;
    }

} */


/* @media (max-width: 991px) { */

    .inputEntradas {
        font-size: 12px !important;

    }

    .panel-heading {
        padding: 10px !important;
    }


    #acordeonmovil {
        display: initial !important;
    }

    .totalSidebar {
        width: 100%;
    }

    .totalPrecioMovil {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }


    .btnMovilDisplay {
        display: block !important;
    }

    .btnBigScreem {
        display: none;
    }

    .imagenSideBar {
        display: none !important;
    }

    .datosCompra {
        order: 1;
    }

    .infoEntradas {
        order: 0;
    }

    .contenedorAbsolutoSidebar {
        width: inherit;
    }

    .contenedor-principal {
        padding-left: 30px !important;
    }

    .bordeEntradas {
        padding: 20px 15px;
    }

/* } */


/* @media (min-width: 992px) {
    .w-80-Horario {
        width: 80% !important;
    }
} */


/* @media (max-width: 991px) { */
    .max-width-100-xs-sm {
        max-width: 100%;
    }
/* } */


/* @media(max-width: 767px) { */
    .displayEntradas {
        display: none;
    }
/* } */


/* @media (min-width: 575.99px) {
    .displayBotones {
        display: none;
    }

    .displayEstandar {
        display: block;
    }
} */


/* @media (max-width: 575.98px) { */
    .d-none-Precios {
        display: none;
    }
/* } */


/* @media(max-width:575px) { */
    hr {
        width: 110px;
    }

    .contenedorTour {
        margin-left: 2%;

    }

    .diaHoras {
        padding: 10px;
    }

    .fc-title {
        font-size: 16px;
        color: #000000;
    }

    .contenedor-principal {
        padding-left: 5px;
        padding-right: 5px;
    }

    .diaHoras {
        padding: 10px;
    }

    /* .contenedorPrecios {
        padding: 0;
        margin-left: 2%;
    } */

    .fc-title::after {
        /* content: 'â‚¬'; */
        font-size: 10px;
        font-weight: 500;
    }

    .precios {
        font-size: 22px;
    }


    .fc-dayGrid-view .fc-week-number,
    .fc-dayGrid-view .fc-day-number {
        padding: 4px 0 0 10px !important;
        float: left !important;
    }

    .fc-center {
        padding: 1px 25px 1px 25px;

    }

    .fc-dayGrid-view .fc-body .fc-row {
        min-height: 4em;
        height: 3em!important;
    }
/* } */

.btn.btn-gtc {background: #ac8d56; border-color: #ac8d56; color: #ffffff}
.btn.btn-gtc:hover, .btn.btn-gtc:focus {background: transparent; border-color: #ac8d56; color: #ac8d56}

.btn.btn-deep-pink {background: #ff214f; border-color: #ff214f; color: #ffffff}
.btn.btn-deep-pink:hover, .btn.btn-deep-pink:focus {background: transparent; border-color: #ff214f; color: #ff214f}
.text-white-2, .btn.text-white-2 {color:#FFF}

/* list style 6 */
.list-style-11 {list-style: none; margin: 0; padding: 0;}
.list-style-11 li {position: relative; padding: 0 0 8px 0; margin: 0 0 8px 0; border-bottom: 1px solid rgba(0, 0, 0, 0.1);}
.list-style-11 li span { position: absolute; top: 3px; right: 0;}
.list-style-11 li:last-child {border-bottom: none}
.list-style-11 li:before {content: "";}

.white-content {
    position: absolute;
    width: CALC(100% - 30px);
    height: 100%;
    background-color: #F4F1ED;
}

.white-hover {
  transition: background-color 0.2s ease, color 0.2s ease;
}

.white-hover:hover, .white-hover:active {
  background-color: var(--white);
  color: var(--dark-gray);
}


/* =========================================================
   PATCH: quitar "cuadros" + click/hover SOLO sobre el nÃºmero
   Requisitos:
   - Sin bordes/cajas en los dÃ­as
   - Click SOLO en el nÃºmero (y SOLO si hay entradas = gtc-disponible)
   - Hover verde SOLO sobre el nÃºmero (como captura â€œbuenaâ€)
   - TamaÃ±o de nÃºmeros: se respeta (no lo tocamos)
   ========================================================= */

/* 0) Ocultar icono de no-entradas (si existe) */
#gtc-div-book-calendar .imagen-no-entradas{ display:none !important; }

/* 1) Quitar â€œcuadrosâ€ (bordes) del grid */
#gtc-div-book-calendar .fc th,
#gtc-div-book-calendar .fc td,
#gtc-div-book-calendar .fc-row,
#gtc-div-book-calendar .fc-bg td,
#gtc-div-book-calendar .fc-content-skeleton td{
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Evitar que algÃºn tema pinte separadores */
#gtc-div-book-calendar .fc table{
  border-collapse: collapse !important;
  border-spacing: 0 !important;
}

/* 2) Bloquear interacciÃ³n en TODA la celda.
      Solo reactivamos pointer-events en el nÃºmero para dÃ­as disponibles. */
#gtc-div-book-calendar td.fc-day{
  pointer-events: none !important;
  cursor: default !important;
}

/* El nÃºmero, por defecto, NO clicable */
#gtc-div-book-calendar td.fc-day .fc-day-number,
#gtc-div-book-calendar td.fc-day a.fc-day-number{
  pointer-events: none !important;
  cursor: default !important;
}

/* 3) DÃ­as disponibles: el nÃºmero sÃ­ es clicable */
#gtc-div-book-calendar td.fc-day.gtc-disponible:not(.fc-past):not(.fc-other-month) .fc-day-number,
#gtc-div-book-calendar td.fc-day.gtc-disponible:not(.fc-past):not(.fc-other-month) a.fc-day-number{
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* 4) Asegurar que el nÃºmero se comporta como â€œpÃ­ldoraâ€ centrada (sin mover tamaÃ±os) */
#gtc-div-book-calendar .fc-day-top{
  padding: 0 !important;
  border: none !important;
}
#gtc-div-book-calendar .fc-day-number{
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  /* NO tocamos font-size: lo dejas perfecto */
}

/* 5) Neutralizar cualquier hover global sobre el dÃ­a completo */
#gtc-div-book-calendar td.fc-day:not(.fc-past):not(.fc-other-month):hover .fc-day-number,
#gtc-div-book-calendar td.fc-day:not(.fc-past):not(.fc-other-month):hover a.fc-day-number{
  background: transparent !important;
  color: inherit !important;
  font-weight: inherit !important;
  transform: none !important;
  box-shadow: none !important;
}

/* 6) Hover verde SOLO cuando pasas por encima del nÃºmero (y hay entradas) */
#gtc-div-book-calendar td.fc-day.gtc-disponible:not(.fc-past):not(.fc-other-month) .fc-day-number:hover,
#gtc-div-book-calendar td.fc-day.gtc-disponible:not(.fc-past):not(.fc-other-month) a.fc-day-number:hover{
  min-width: 26px !important;
  height: 26px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: #34A853 !important;
  color: #fff !important;
  font-weight: 700 !important;
  transform: scale(1.03) !important;
}

/* 7) DÃ­as NO disponibles: aspecto normal (sin hover) */
#gtc-div-book-calendar td.fc-day.gtc-no-dispo .fc-day-number:hover,
#gtc-div-book-calendar td.fc-day.gtc-no-dispo a.fc-day-number:hover{
  background: transparent !important;
  color: inherit !important;
  transform: none !important;
  box-shadow: none !important;
}
/* ========================================================= */



/* ===============================
   CALENDARIO â€“ TIPOGRAFÃA Y CENTRADO
   =============================== */

#gtc-div-book-calendar {
    font-family: 'Inter', sans-serif;
}

/* Elimina float y padding heredado */
.fc-dayGrid-view .fc-day-number {
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;

    display: flex !important;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: 18px;   /* ðŸ‘ˆ TamaÃ±o ideal desktop */
    color: #1a1a1a;
}

/* Centrado real de cada celda */
.fc-dayGrid-view td.fc-day {
    position: relative;
    text-align: center;
    vertical-align: middle;
}

/* Forzar altura uniforme */
.fc-dayGrid-view .fc-body .fc-row {
    min-height: 90px;
}

/* Estado pasado */
.fc-day.fc-past .fc-day-number {
    color: #d0d0d0;
    font-weight: 400;
}

/* DÃ­as sin disponibilidad */
.fc-day.gtc-no-dispo .fc-day-number {
    color: #c4c4c4;
}

/* Hover SOLO cuando estÃ¡ disponible */
.fc-day.gtc-disponible:hover {
    background-color: #ac8d56;
    transition: all 0.2s ease;
}

.fc-day.gtc-disponible:hover .fc-day-number {
    color: #ffffff;
}

/* ===============================
   RESPONSIVE
   =============================== */

@media (max-width: 768px) {
    .fc-dayGrid-view .fc-day-number {
        font-size: 15px;
    }

    .fc-dayGrid-view .fc-body .fc-row {
        min-height: 70px;
    }
}

/* ===============================
   DÃAS PASADOS (DESACTIVADOS)
   =============================== */

/* Celda completa */
.fc-day.fc-past {
  opacity: 0.45;
  filter: grayscale(1);
  background: transparent !important;
}

/* NÃºmero */
.fc-day.fc-past .fc-day-number {
  color: #bdbdbd !important;
  font-weight: 400 !important;
}

/* Quitar cualquier hover/feedback en dÃ­as pasados */
.fc-day.fc-past:hover {
  background: transparent !important;
}

/* Cursor y bloqueo de interacciÃ³n (por si queda algo clicable dentro) */
.fc-day.fc-past,
.fc-day.fc-past * {
  cursor: not-allowed !important;
}

/* Si quedara algÃºn enlace/evento dentro, lo anulamos */
.fc-day.fc-past a,
.fc-day.fc-past .fc-day-grid-event,
.fc-day.fc-past .fc-event {
  pointer-events: none !important;
}


/* ===============================
   DÃAS PASADOS (DESACTIVADOS) - capa visible
   =============================== */

.fc .gtc-past {
  opacity: 0.45;
  filter: grayscale(1);
}

.fc .gtc-past,
.fc .gtc-past * {
  cursor: not-allowed !important;
}

.fc .gtc-past .fc-day-number {
  color: #bdbdbd !important;
  font-weight: 400 !important;
}

/* Evita hover en pasados aunque haya clases de disponibilidad */
.fc .gtc-past:hover {
  background: transparent !important;
}


/* ===============================
   DÃAS PASADOS (DESACTIVADOS) - target correcto: fc-day-top
   =============================== */

.fc-day-top.gtc-past {
  opacity: 0.45;
  filter: grayscale(1);
}

.fc-day-top.gtc-past,
.fc-day-top.gtc-past * {
  cursor: not-allowed !important;
}

.fc-day-top.gtc-past .fc-day-number {
  color: #bdbdbd !important;
  font-weight: 300 !important;
}

/* Blindaje anti-click por si quedara algo dentro */
.fc-day-top.gtc-past a,
.fc-day-top.gtc-past .fc-day-grid-event,
.fc-day-top.gtc-past .fc-event {
  pointer-events: none !important;
}
/* ===============================
   ANTI-FLICKER CARGA CALENDARIO (sin parpadeo)
   =============================== */

#gtc-div-book-calendar.is-rendering .fc-view-container {
  visibility: hidden;
}

#gtc-div-book-calendar .fc-view-container {
  visibility: visible;
}


/* ===============================
   DESACTIVADOS: PASADOS + SIN DISPONIBILIDAD
   target correcto: fc-day-top
   =============================== */

.fc-day-top.gtc-past,
.fc-day-top.gtc-disabled {
  opacity: 0.45;
  filter: grayscale(1);
}

.fc-day-top.gtc-past,
.fc-day-top.gtc-past *,
.fc-day-top.gtc-disabled,
.fc-day-top.gtc-disabled * {
  cursor: not-allowed !important;
}

.fc-day-top.gtc-past .fc-day-number,
.fc-day-top.gtc-disabled .fc-day-number {
  color: #bdbdbd !important;
  font-weight: 400 !important;
}

/* Blindaje anti-click */
.fc-day-top.gtc-past a,
.fc-day-top.gtc-past .fc-day-grid-event,
.fc-day-top.gtc-past .fc-event,
.fc-day-top.gtc-disabled a,
.fc-day-top.gtc-disabled .fc-day-grid-event,
.fc-day-top.gtc-disabled .fc-event {
  pointer-events: none !important;
}


/* ===============================
   CLICK SOLO EN EL NÃšMERO (BOTÃ“N)
   =============================== */

/* 1) Anula el hack que agranda el Ã¡rea clicable del evento */
tr:first-child > td > .fc-day-grid-event {
  padding: 0 !important;
  margin: 0 !important;
}

/* 2) Por defecto, NO se puede clicar en toda la celda superior */
.fc-day-top {
  pointer-events: none;
}

/* 3) El nÃºmero SÃ es clicable y se comporta como "botÃ³n" */
.fc-day-top .fc-day-number {
  pointer-events: auto;

  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  width: 42px;      /* ajusta si quieres mÃ¡s â€œbotÃ³nâ€ */
  height: 42px;
  border-radius: 999px;

  user-select: none;
}

/* 4) Solo mostramos estado hover del â€œbotÃ³nâ€ cuando hay disponibilidad */
.fc-day-top:not(.gtc-disabled):not(.gtc-past) .fc-day-number {
  cursor: pointer;
}

/* 5) Si estÃ¡ desactivado (pasado o sin disponibilidad) no hay click ni hover */
.fc-day-top.gtc-past .fc-day-number,
.fc-day-top.gtc-disabled .fc-day-number {
  pointer-events: none !important;
  cursor: not-allowed !important;
}

/* ===============================
   CALENDARIO MÃS ESTRECHO (COMO CAPTURA)
   =============================== */

/* 1) Contenedor mÃ¡s estrecho */
#gtc-div-book-calendar {
  max-width: 520px;   /* ajusta: 480â€“560 segÃºn lo quieras */
  margin-left: auto;
  margin-right: auto;
}

/* 2) Menos â€œaireâ€ entre celdas (el tuyo estaba en 7px) */
#gtc-div-book-calendar .fc-bg table {
  border-spacing: 3px !important;
}

/* 3) Menos padding interno de celda (FullCalendar mete padding en td/th) */
#gtc-div-book-calendar .fc th,
#gtc-div-book-calendar .fc td {
  padding: 2px !important;
}

/* 4) Semanas mÃ¡s bajitas/compactas */
#gtc-div-book-calendar .fc-dayGrid-view .fc-body .fc-row {
  min-height: 62px !important;
}

/* 5) BotÃ³n/nÃºmero un pelÃ­n mÃ¡s pequeÃ±o para que respire mejor */
#gtc-div-book-calendar .fc-day-top .fc-day-number {
  width: 38px;   /* si lo quieres aÃºn mÃ¡s compacto: 34px */
  height: 38px;
}

/* Responsive (mÃ³vil) */
@media (max-width: 575px) {
  #gtc-div-book-calendar {
    max-width: 360px;
  }

  #gtc-div-book-calendar .fc-bg table {
    border-spacing: 2px !important;
  }

  #gtc-div-book-calendar .fc-dayGrid-view .fc-body .fc-row {
    min-height: 54px !important;
  }

  #gtc-div-book-calendar .fc-day-top .fc-day-number {
    width: 40px;
    height: 40px;
  }
}


/* ===============================
   HOVER/SELECCIÃ“N SOLO EN EL BOTÃ“N (PREMIUM CONVERSIÃ“N)
   =============================== */

/* Neutraliza el hover grande de la celda */
#gtc-div-book-calendar td.fc-day.gtc-disponible:hover {
  background: transparent !important;
}

/* Neutraliza estilos antiguos */
#gtc-div-book-calendar td.fc-day.fondo-amarillo,
#gtc-div-book-calendar td.fc-day.fondo-amarillo-fijo {
  background: transparent !important;
}

/* TransiciÃ³n suave tipo app moderna */
#gtc-div-book-calendar .fc-day-number {
  transition:
    background-color .25s cubic-bezier(.4,0,.2,1),
    box-shadow .25s cubic-bezier(.4,0,.2,1),
    transform .18s ease,
    color .2s ease;
}

/* ===============================
   HOVER PREMIUM (efecto elevaciÃ³n)
   =============================== */

#gtc-div-book-calendar 
td.fc-day-top:not(.gtc-past):not(.gtc-disabled) 
.fc-day-number:hover {

  background: #18C964 !important;
  color: #ffffff !important;

  /* Sombra profunda premium */
  box-shadow:
    0 12px 28px rgba(24, 201, 100, 0.45),
    0 4px 12px rgba(0, 0, 0, 0.18);

  transform: translateY(-3px) scale(1.08);
}

/* ===============================
   SELECCIÃ“N FIJA (dÃ­a elegido)
   =============================== */

#gtc-div-book-calendar 
td.fc-day-top.gtc-selected 
.fc-day-number {

  background: #18C964 !important;
  color: #ffffff !important;

  box-shadow:
    0 14px 32px rgba(24, 201, 100, 0.50),
    0 6px 14px rgba(0, 0, 0, 0.20);

  transform: translateY(-2px);
}

/* ===============================
   EFECTO CLICK (micro-interacciÃ³n)
   =============================== */

#gtc-div-book-calendar 
td.fc-day-top:not(.gtc-past):not(.gtc-disabled) 
.fc-day-number:active {

  transform: scale(0.94);
  box-shadow:
    0 6px 14px rgba(24, 201, 100, 0.35);
}


/* ===============================
   FIX CORTE CÃRCULO EN BORDES (derecha/izquierda)
   =============================== */

/* 1) Aire interno: evita que el botÃ³n toque el borde del calendario */
#gtc-div-book-calendar {
  padding: 0 10px;   /* sube a 12â€“16 si quieres mÃ¡s respiraciÃ³n */
  box-sizing: border-box;
}

/* 2) Evita que wrappers recorten el cÃ­rculo/sombra */
#gtc-div-book-calendar .fc-view-container,
#gtc-div-book-calendar .fc-view,
#gtc-div-book-calendar .fc-body,
#gtc-div-book-calendar .fc-dayGrid-view,
#gtc-div-book-calendar .fc-row,
#gtc-div-book-calendar .fc-bg,
#gtc-div-book-calendar .fc-content-skeleton {
  overflow: visible !important;
}

/* 3) Tu regla global ocultaba overflow y puede recortar; lo anulamos solo en el calendario */
#gtc-div-book-calendar .fc-scroller {
  overflow: visible !important;
}

/* ===============================
   DÃAS DE LA SEMANA (CABECERA) â€“ PREMIUM
   =============================== */

/* Contenedor de la cabecera (lÃ­nea fina) */
#gtc-div-book-calendar .fc-head-container,
#gtc-div-book-calendar .fc-head {
  border: 0 !important;
}

#gtc-div-book-calendar .fc-head .fc-row {
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

/* Celdas de cabecera */
#gtc-div-book-calendar .fc-day-header,
#gtc-div-book-calendar th.fc-day-header {
  background: transparent !important;
  border: 0 !important;

  padding: 10px 0 12px !important; /* aire vertical */
  text-align: center !important;
  vertical-align: middle !important;

  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 12px;                 /* legible, premium */
  text-transform: uppercase;
  letter-spacing: 0.16em;          /* ðŸ‘ˆ clave â€œproâ€ */
  color: rgba(0,0,0,0.55);
}

/* En mÃ³vil, un pelÃ­n mÃ¡s compacto */
@media (max-width: 575px) {
  #gtc-div-book-calendar .fc-day-header,
  #gtc-div-book-calendar th.fc-day-header {
    font-size: 11px;
    letter-spacing: 0.14em;
    padding: 8px 0 10px !important;
  }
}


/* ===============================
   NAV MES: flechas en vez de texto
   =============================== */

/* Base de botones */
#gtc-div-book-calendar .fc-custom1-button,
#gtc-div-book-calendar .fc-custom2-button{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  width: 44px;
  height: 44px;
  padding: 0 !important;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  /* Oculta el texto "anterior/siguiente" */
  font-size: 0 !important;
  line-height: 0 !important;

  cursor: pointer;
}

/* Flecha izquierda */
#gtc-div-book-calendar .fc-custom1-button::before{
  content: "â€¹";
  font-size: 34px;
  line-height: 1;
  color: rgba(0,0,0,.55);
  transform: translateY(-1px);
}

/* Flecha derecha */
#gtc-div-book-calendar .fc-custom2-button::before{
  content: "â€º";
  font-size: 34px;
  line-height: 1;
  color: rgba(0,0,0,.55);
  transform: translateY(-1px);
}

/* Hover premium */
#gtc-div-book-calendar .fc-custom1-button:hover::before,
#gtc-div-book-calendar .fc-custom2-button:hover::before{
  color: rgba(0,0,0,.85);
}

/* Focus accesible (sin borde feo) */
#gtc-div-book-calendar .fc-custom1-button:focus,
#gtc-div-book-calendar .fc-custom2-button:focus{
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.18) !important; /* verde suave */
  border-radius: 999px;
}

/* ===============================
   HEADER CALENDARIO â€“ PREMIUM MINIMAL
   =============================== */

/* Contenedor principal del header */
#gtc-div-book-calendar .fc-header-toolbar {
  background: transparent !important;
  border: 0 !important;
  padding: 10px 0 20px 0;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* TÃ­tulo centrado */
#gtc-div-book-calendar .fc-center {
  flex: 1;
  text-align: center !important;
}

/* Texto del mes */
#gtc-div-book-calendar .fc-center h2 {
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  font-size: 22px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #b68a3d; /* dorado elegante tipo Alhambra */
  margin: 0;
}

/* Elimina cualquier fondo negro residual */
#gtc-div-book-calendar .fc-toolbar,
#gtc-div-book-calendar .fc-header-toolbar,
#gtc-div-book-calendar .fc-center,
#gtc-div-book-calendar .fc-left,
#gtc-div-book-calendar .fc-right {
  background: transparent !important;
  border: 0 !important;
}

/* Flechas ya creadas antes (ajuste fino posiciÃ³n) */
#gtc-div-book-calendar .fc-custom1-button,
#gtc-div-book-calendar .fc-custom2-button {
  margin: 0 10px;
}

/* ===============================
   HEADER â€“ AJUSTES FINOS (TÃTULO + FLECHAS)
   =============================== */

/* Header layout */
#gtc-div-book-calendar .fc-header-toolbar{
  padding: 10px 0 14px 0 !important;
  margin-bottom: 8px !important;
}

/* TÃ­tulo 1 lÃ­nea + mÃ¡s pequeÃ±o */
#gtc-div-book-calendar .fc-center h2{
  font-size: 18px !important;         /* antes 22 */
  font-weight: 500 !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase;
  white-space: nowrap !important;      /* âœ… evita salto */
  line-height: 1.1 !important;
  margin: 0 !important;
  color: #b68a3d;                      /* dorado */
}

/* Botones flecha: sin halo/efecto click raro */
#gtc-div-book-calendar .fc-custom1-button,
#gtc-div-book-calendar .fc-custom2-button{
  box-shadow: none !important;
  outline: none !important;
  border: 0 !important;
  background: transparent !important;
}

/* Quita cualquier â€œringâ€ en focus */
#gtc-div-book-calendar .fc-custom1-button:focus,
#gtc-div-book-calendar .fc-custom2-button:focus,
#gtc-div-book-calendar .fc-custom1-button:active,
#gtc-div-book-calendar .fc-custom2-button:active{
  box-shadow: none !important;
  outline: none !important;
}

/* Flechas mÃ¡s finas (usa caracteres â€œthinâ€) */
#gtc-div-book-calendar .fc-custom1-button::before{
  content: "\2039"; /* â€¹ */
  font-size: 30px !important;
  font-weight: 300 !important;
  color: rgba(0,0,0,.55);
}

#gtc-div-book-calendar .fc-custom2-button::before{
  content: "\203A"; /* â€º */
  font-size: 30px !important;
  font-weight: 300 !important;
  color: rgba(0,0,0,.55);
}

/* Hover sutil */
#gtc-div-book-calendar .fc-custom1-button:hover::before,
#gtc-div-book-calendar .fc-custom2-button:hover::before{
  color: rgba(0,0,0,.85);
}

/* ===============================
   CALENDARIO â€“ ARMONÃA PREMIUM (ESPACIADO + DISPOSICIÃ“N)
   =============================== */

#gtc-div-book-calendar{
  /* Ancho consistente y centrado */
  max-width: 520px;
  margin: 0 auto;
  padding: 0 14px;                 /* aire lateral para sombras/botones */
  box-sizing: border-box;
}

/* ---------- HEADER: flechas + tÃ­tulo ---------- */
#gtc-div-book-calendar .fc-header-toolbar{
  margin: 0 !important;
  padding: 6px 0 6px !important; /* ritmo vertical pro */
  display: flex;
  align-items: center;
}

#gtc-div-book-calendar .fc-left,
#gtc-div-book-calendar .fc-right{
  width: 56px;                     /* mismo â€œpesoâ€ a ambos lados */
  display: flex;
  align-items: center;
  justify-content: center;
}

#gtc-div-book-calendar .fc-center{
  flex: 1;
  text-align: center !important;
}

/* TÃ­tulo: baseline perfecto */
#gtc-div-book-calendar .fc-center h2{
  margin: 0 !important;
  line-height: 1 !important;
  padding: 0 !important;
}

/* Botones flecha: tamaÃ±o y alineaciÃ³n Ã³ptimos */
#gtc-div-book-calendar .fc-custom1-button,
#gtc-div-book-calendar .fc-custom2-button{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* ---------- CABECERA DÃAS (LUN...DOM) ---------- */
#gtc-div-book-calendar .fc-head .fc-row{
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}

#gtc-div-book-calendar th.fc-day-header{
  padding: 14px 0 12px !important; /* mÃ¡s aire, estilo premium */
  line-height: 1 !important;
}

/* ---------- GRID DE DÃAS: ritmo y consistencia ---------- */

/* Reduce â€œhuecosâ€ innecesarios entre semanas */
#gtc-div-book-calendar .fc-bg table{
  border-spacing: 4px !important;  /* 3â€“4 es el sweet spot */
}

/* Igualar altura de filas y evitar â€œbailesâ€ */
#gtc-div-book-calendar .fc-dayGrid-view .fc-body .fc-row{
  min-height: 66px !important;     /* equilibrio con tu tamaÃ±o de nÃºmero */
}

/* Asegura centrado real dentro de cada celda */
#gtc-div-book-calendar td.fc-day-top{
  padding: 0 !important;
  text-align: center !important;
  vertical-align: middle !important;
}

/* BotÃ³n del dÃ­a: proporciÃ³n armÃ³nica */
#gtc-div-book-calendar .fc-day-top .fc-day-number{
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin: 0 auto;                 /* centrado perfecto */
}

/* SeparaciÃ³n final del bloque calendario (respira con el contenido) */
#gtc-div-book-calendar .fc-view-container{
  padding-bottom: 10px;
}

/* ---------- Responsive: mÃ³vil ---------- */
@media (max-width: 575px){
  #gtc-div-book-calendar{
    max-width: 380px;
    padding: 0 12px;
  }

  #gtc-div-book-calendar .fc-header-toolbar{
    padding: 6px 0 6px !important;
  }

  #gtc-div-book-calendar .fc-bg table{
    border-spacing: 3px !important;
  }

  #gtc-div-book-calendar .fc-dayGrid-view .fc-body .fc-row{
    min-height: 58px !important;
  }

  #gtc-div-book-calendar .fc-day-top .fc-day-number{
    width: 40px;
    height: 40px;
  }
}

/* ===============================
   MÃS AIRE ENTRE CABECERA Y PRIMERA SEMANA
   =============================== */

/* AÃ±ade separaciÃ³n solo a la primera fila del grid */
#gtc-div-book-calendar 
.fc-dayGrid-view 
.fc-body 
.fc-row:first-child {
  margin-top: 16px !important;   /* prueba 14â€“18px segÃºn gusto */
}


/* ===============================
   REDUCIR ALTURA ENTRE SEMANAS
   =============================== */

#gtc-div-book-calendar 
.fc-dayGrid-view 
.fc-body 
.fc-row {
  min-height: 56px !important;   /* antes 66px */
}

/* Ajuste fino del botÃ³n para que respire bien */
#gtc-div-book-calendar 
.fc-day-top .fc-day-number {
  width: 36px;
  height: 36px;
}

/* ===============================
   COLOR ESTRATÃ‰GICO CONVERSIÃ“N
   =============================== */

/* Mes */
#gtc-div-book-calendar .fc-center h2{
  color: #1F2937 !important;
}

/* DÃ­as semana */
#gtc-div-book-calendar th.fc-day-header{
  color: #1F2937 !important;
  font-weight: 700 !important;      /* antes 500 */
  letter-spacing: 0.02em;        /* micro aire elegante */
}

/* ===============================
   MES â€“ FINO Y PREMIUM
   =============================== */

#gtc-div-book-calendar .fc-center h2{
  font-weight: 300 !important;      /* antes 500 */
  font-size: 15px !important;       /* ligeramente mÃ¡s contenido */
  letter-spacing: 0.12em !important; /* mÃ¡s aire = mÃ¡s elegancia */
  color: #1F2937 !important;
}

/* ===============================
   NÃšMEROS DEL CALENDARIO â€“ MÃS FINOS
   =============================== */

#gtc-div-book-calendar .fc-day-number{
  font-weight: 300 !important;   /* antes mÃ¡s pesado */
  font-size: 16px;               /* mantiene legibilidad */
  letter-spacing: 0.02em;        /* micro aire elegante */
}


/* ===============================
   FLECHAS ESTILO APPLE â€“ FINAS Y MINIMAL
   =============================== */

#gtc-div-book-calendar .fc-custom1-button,
#gtc-div-book-calendar .fc-custom2-button{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;

  width: 48px;
  height: 48px;

  display: flex;
  align-items: center;
  justify-content: center;

  position: relative;
  cursor: pointer;

  font-size: 0 !important; /* ocultamos texto */
}

/* Quitamos cualquier contenido anterior */
#gtc-div-book-calendar .fc-custom1-button::before,
#gtc-div-book-calendar .fc-custom2-button::before{
  content: "";
  width: 12px;
  height: 12px;

  border-top: 1px solid #AAA;
  border-right: 1px solid #AAA;

  transform-origin: center;
  transition: transform .15s ease, opacity .15s ease;
}

/* Flecha izquierda */
#gtc-div-book-calendar .fc-custom1-button::before{
  transform: rotate(-135deg);
}

/* Flecha derecha */
#gtc-div-book-calendar .fc-custom2-button::before{
  transform: rotate(45deg);
}

/* Hover ultra sutil (muy Apple) */
#gtc-div-book-calendar .fc-custom1-button:hover::before,
#gtc-div-book-calendar .fc-custom2-button:hover::before{
  opacity: .7;
}

/* Active micro feedback */
#gtc-div-book-calendar .fc-custom1-button:active::before,
#gtc-div-book-calendar .fc-custom2-button:active::before{
  transform: scale(.9) rotate(45deg);
}

/* Ajuste especÃ­fico para izquierda en active */
#gtc-div-book-calendar .fc-custom1-button:active::before{
  transform: scale(.9) rotate(-135deg);
}

/* ===============================
   FILAS MÃS COMPACTAS â€“ AJUSTE MÃXIMO
   =============================== */

/* Reducimos altura mÃ­nima real */
#gtc-div-book-calendar 
.fc-dayGrid-view 
.fc-body 
.fc-row {
  min-height: 50px !important;
}

/* Quitamos padding vertical innecesario */
#gtc-div-book-calendar td.fc-day-top {
  padding: 0 !important;
  vertical-align: middle !important;
}

/* Ajustamos el botÃ³n para mantener proporciÃ³n */
#gtc-div-book-calendar .fc-day-number {
    width: 40px;
    height: 40px;
  line-height: 34px;
  margin: 0 auto;
}

/* =============================== 
   CONTORNO PREMIUM CALENDARIO
   =============================== */

#gtc-div-book-calendar{
  border-left: 1px solid rgba(0, 0, 0, 0.08);
  border-right: 1px solid rgba(0, 0, 0, 0.08);
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  border-top: none; /* âŒ quitamos borde superior */

  border-top-left-radius: 0;   /* âŒ sin curva arriba */
  border-top-right-radius: 0;  /* âŒ sin curva arriba */
  border-bottom-left-radius: 14px;
  border-bottom-right-radius: 14px;

  padding: 18px 18px 22px 18px;
    background: transparent !important;
}

/* ===============================
   QUITAR HUECO INFERIOR EXCESIVO
   =============================== */

/* 1) Elimina padding extra al final del grid */
#gtc-div-book-calendar .fc-view-container{
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* 2) Asegura que el scroller no reserve altura rara */
#gtc-div-book-calendar .fc-scroller{
  height: auto !important;
  max-height: none !important;
}

/* 3) Ajusta el padding del contenedor (si quedÃ³ demasiado aire abajo) */
#gtc-div-book-calendar{
  padding-bottom: 14px !important;   /* antes era mÃ¡s alto; prueba 12â€“16 */
}

#gtc-div-book-calendar .fc-dayGrid-view{
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* ===============================
   ALTURA DINÃMICA SEGÃšN NÂº DE FILAS (4/5/6)
   =============================== */

/* El contenedor que suele reservar altura de mÃ¡s */
#gtc-div-book-calendar .fc-day-grid-container,
#gtc-div-book-calendar .fc-dayGrid-view .fc-day-grid-container,
#gtc-div-book-calendar .fc-scroller,
#gtc-div-book-calendar .fc-scroller > .fc-day-grid,
#gtc-div-book-calendar .fc-body,
#gtc-div-book-calendar .fc-row,
#gtc-div-book-calendar .fc-content-skeleton,
#gtc-div-book-calendar .fc-bg {
  height: auto !important;
  max-height: none !important;
}

/* MantÃ©n tu altura de fila (ajÃºstala a tu gusto) */
#gtc-div-book-calendar .fc-dayGrid-view .fc-body .fc-row {
  min-height: 54px !important;  /* tu compactaciÃ³n premium */
}

/* Evita padding/margen inferior extra del grid */
#gtc-div-book-calendar .fc-view-container,
#gtc-div-book-calendar .fc-dayGrid-view {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
#gtc-div-book-calendar{
  padding-bottom: 12px !important;
}

/* ===============================
   COMPACTACIÃ“N EXTREMA FILAS (MAX)
   =============================== */

/* 1) Reduce al mÃ­nimo el espacio entre celdas (vertical/horizontal) */
#gtc-div-book-calendar .fc-bg table{
  border-spacing: 0px !important;   /* antes 3â€“4px */
}

/* 2) Elimina padding interno que suma altura */
#gtc-div-book-calendar .fc th,
#gtc-div-book-calendar .fc td{
  padding: 0 !important;
}

/* 3) Fuerza altura mÃ­nima de semana al lÃ­mite */
#gtc-div-book-calendar .fc-dayGrid-view .fc-body .fc-row{
  min-height: 40px !important;      /* EXTREMO (sube a 46 si roza) */
}

/* 4) BotÃ³n del dÃ­a un pelÃ­n mÃ¡s pequeÃ±o para que encaje */
#gtc-div-book-calendar .fc-day-top .fc-day-number{
  width: 32px;
  height: 32px;
  line-height: 32px;
  margin: 0 auto !important;
}

/* 5) Asegura centrado vertical perfecto */
#gtc-div-book-calendar td.fc-day-top{
  vertical-align: middle !important;
}


/* ===============================
   COMPACTACIÃ“N UNIFORME: eliminar altura reservada por eventos
   =============================== */

/* 1) El skeleton no debe empujar la altura */
#gtc-div-book-calendar .fc-content-skeleton,
#gtc-div-book-calendar .fc-content-skeleton table,
#gtc-div-book-calendar .fc-content-skeleton tbody,
#gtc-div-book-calendar .fc-content-skeleton tr {
  height: auto !important;
}

/* 2) La fila de eventos NO debe aportar altura */
#gtc-div-book-calendar td.fc-event-container {
  padding: 0 !important;
  height: 0 !important;
  line-height: 0 !important;
}

/* 3) El link del evento existe para el click, pero no ocupa espacio */
#gtc-div-book-calendar a.fc-day-grid-event,
#gtc-div-book-calendar a.fc-event {
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
}

/* 4) El "more" tampoco */
#gtc-div-book-calendar .fc-more-cell,
#gtc-div-book-calendar .fc-more {
  display: none !important;
}

/* Mantener el enlace de evento "clicable" pero sin afectar layout */
#gtc-div-book-calendar td.fc-event-container {
  position: relative;
}

#gtc-div-book-calendar a.fc-day-grid-event,
#gtc-div-book-calendar a.fc-event {
  position: absolute !important;
  top: 0; left: 0;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
}

/* ===============================
   DÃA SELECCIONADO (NARANJA FIJO)
   =============================== */

#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number{
  background: #F97316;
  color: #ffffff !important;
  box-shadow: 0 4px 10px rgba(249, 115, 22, 0.25);
}

#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number:hover{
  background: #F97316 !important;
}

/* ===============================
   AISLAR SELECCIÃ“N NARANJA
   =============================== */

/* 1) El seleccionado pisa TODO */
#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number{
  background: #F97316 !important;
  color: #ffffff !important;
  box-shadow: none !important;   /* elimina cualquier sombra verde */
  transition: all .15s ease;
  position: relative;
  z-index: 2;
}

/* 2) Desactiva completamente hover verde si estÃ¡ seleccionado */
#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number:hover{
  background: #F97316 !important;
  box-shadow: none !important;
}

/* 3) Si el verde usa ::before o ::after lo anulamos */
#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number::before,
#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number::after{
  display: none !important;
}

#gtc-div-book-calendar 
td.fc-day-top:not(.gtc-selected):not(.gtc-disabled):not(.gtc-past) 
.fc-day-number:hover {
  background: #18C964;
}

/* ===============================
   BLOQUEAR HOVER EN DÃA SELECCIONADO
   =============================== */

/* El dÃ­a seleccionado NO responde a hover */
#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number {
  pointer-events: none !important;
  cursor: default !important;
}

/* Garantiza que ninguna regla de hover lo modifique */
#gtc-div-book-calendar 
td.fc-day-top.gtc-selected 
.fc-day-number:hover,
#gtc-div-book-calendar 
td.fc-day-top.gtc-selected 
.fc-day-number:active {
  background: #F97316 !important;
  box-shadow: none !important;
  transform: none !important;
}


/* Header del acordeÃ³n (look premium) */
#gtc-accordion .gtc-acc-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
#gtc-accordion .gtc-acc-left{
  display:flex;
  align-items:center;
  gap:12px;
}
#gtc-accordion .gtc-acc-title{
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
#gtc-accordion .gtc-acc-resume{
  font-size:12px;
  color:rgba(0,0,0,.55);
  margin-left:6px;
}

/* Chevron animado */
#gtc-accordion .panel-heading .gtc-acc-chevron{
  transition: transform .2s ease;
}
#gtc-accordion .panel-heading a[aria-expanded="true"] .gtc-acc-chevron{
  transform: rotate(180deg);
}

/* Pasos bloqueados */
#gtc-accordion .panel-heading.gtc-locked{
  opacity:.45;
  pointer-events:none; /* evita abrirlos */
}
#gtc-accordion .panel-heading.gtc-locked a{
  cursor:not-allowed;
}


/* ===========================
   ACCORDION PREMIUM (GTC)
   =========================== */

#gtc-accordion.panel-group {
  margin: 0;
  border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;  
    overflow: hidden;
  background: #fff;
}

/* Panel: sin look bootstrap */
#gtc-accordion .panel {
  border: 0;
  border-radius: 0;
  margin: 0;
  box-shadow: none;
  background: transparent;
}

/* Separador tipo iOS */
#gtc-accordion .panel + .panel {
  border-top: 1px solid rgba(0,0,0,.08);
}

/* Header clickable */
#gtc-accordion .panel-heading {
  padding: 0;
  background: transparent;
  border: 0;
}

#gtc-accordion .panel-heading a {
  display: block;
  padding: 5px 5px;
  text-decoration: none !important;
  color: inherit;
}

/* Layout header */
#gtc-accordion .gtc-acc-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
}

#gtc-accordion .gtc-acc-left{
  display:flex;
  align-items:center;
  gap: 12px;
  min-width: 0;
}

/* Icono (cuadradito sutil tipo Apple) */
#gtc-accordion .gtc-acc-left i{
    width: 40px;
    height: 40px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 10px;
  background: rgba(0,0,0,.045);
  font-size: 16px;
  color: #ff6a00; /* tu naranja de marca */
  flex: 0 0 auto;
}

/* TÃ­tulo PASO */
#gtc-accordion .gtc-acc-title{
  font-weight: 700;
  text-transform: uppercase;
  font-size: 16px;
  line-height: 1.1;
  white-space: nowrap;
}

/* Resumen (fecha/hora...) */
#gtc-accordion .gtc-acc-resume{
  font-size: 13px;
  font-weight: 600;
  color: rgba(0,0,0,.55);
  margin-left: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 42vw;
}

/* Chevron */
#gtc-accordion .gtc-acc-chevron{
  font-size: 16px;
  color: rgba(0,0,0,.45);
  transition: transform .22s ease, color .22s ease;
  flex: 0 0 auto;
}

/* Chevron â€“ lÃ³gica correcta:
   - ABIERTO  => â–¼  (sin rotaciÃ³n, icono base es bi-chevron-down)
   - CERRADO  => â–²  (rotaciÃ³n 180Âº)
*/
#gtc-accordion .panel-heading a .gtc-acc-chevron{
  transition: transform .22s ease, color .22s ease;
  transform-origin: 50% 50%;
}

/* Abierto => â–¼ */
#gtc-accordion .panel-heading a[aria-expanded="true"] .gtc-acc-chevron{
  transform: rotate(0deg);
  color: rgba(0,0,0,.75);
}

/* Cerrado => â–² */
#gtc-accordion .panel-heading a[aria-expanded="false"] .gtc-acc-chevron{
  transform: rotate(180deg);
  color: rgba(0,0,0,.45);
}


/* Hover premium (solo si no estÃ¡ bloqueado) */
#gtc-accordion .panel-heading:not(.gtc-locked) a:hover{
  background: rgba(0,0,0,.03);
}

/* Bloqueado */
#gtc-accordion .panel-heading.gtc-locked{
  opacity: .45;
}
#gtc-accordion .panel-heading.gtc-locked a{
  cursor: not-allowed;
}

/* Body: aireado */
#gtc-accordion .panel-body{
  padding: 14px 18px 18px;
  border: 0 !important;
}

/* â€œCompletadoâ€ (si quieres marcar pasos ya ok) */
#gtc-accordion .panel-heading.gtc-done .gtc-acc-left i{
  background: rgba(255,106,0,.12);
  color: #ff6a00;
}

/* Empaqueta el calendario como un bloque limpio dentro del panel */
#gtc-div-book-calendar .fc {
  border-radius: 14px;
}

/* Quita fondos raros si FullCalendar mete estilos */
#gtc-div-book-calendar .fc .fc-scrollgrid,
#gtc-div-book-calendar .fc .fc-scrollgrid table {
  border: 0 !important;
}

/* Un poco mÃ¡s de aire al header del mes */
#gtc-div-book-calendar .fc-header-toolbar{
  padding: 4px 2px 10px;
}

#gtc-accordion .panel-heading {
  position: relative;
}
#gtc-accordion .panel-heading:after{
  content:"";
  position:absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: rgba(0,0,0,.08);
  transform: scaleY(.75);
}
#gtc-accordion .panel + .panel .panel-heading:after{
  display:none; /* evita doble lÃ­nea */
}

/* 1) QUITA el padding lateral del body del acordeÃ³n (es lo que encoge el calendario) */
#gtc-accordion .panel-body{
  padding-left: 0 !important;
  padding-right: 0 !important;
  /* puedes mantener vertical si quieres aire */
  padding-top: 12px !important;
  padding-bottom: 16px !important;
}

/* 2) Alinea el contenedor del calendario al ancho del acordeÃ³n */
#gtc-div-book-calendar{
  width: 100%;
  margin: 0;              /* nada de margenes laterales */
}

/* 3) â€œBLOQUEâ€ del calendario: que parezca una pieza del acordeÃ³n */
#gtc-div-book-calendar .fc{
  width: 100%;
  margin: 0;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;

  /* clave: top sin redondeo para uniÃ³n con el header */
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;

  /* redondeo solo abajo */
  border-bottom-left-radius: 16px;
  border-bottom-right-radius: 16px;

  overflow: hidden; /* para que el contenido respete el radio inferior */
}

/* 4) Si tienes un â€œcardâ€/wrapper extra del calendario (muy tÃ­pico), lo neutralizamos */
#gtc-div-book-calendar .calendar-card,
#gtc-div-book-calendar .gtc-calendar-card,
#gtc-div-book-calendar .fc-scrollgrid{
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}

#gtc-accordion .panel-body{
  padding-top: 0 !important;
}

/* Header y calendario deben tener el mismo padding lateral */
#gtc-accordion .panel-heading a{
  padding-left: 18px;
  padding-right: 18px;
}

/* Pero el body lo dejamos sin padding para que el calendario llegue al borde */
#gtc-accordion .panel-body{
  padding-left: 0 !important;
  padding-right: 0 !important;
}



/* =========================
   PASO 2 - Horarios (lista tipo radio)
   ========================= */
#gtc-div-horas .gtc-hour-row{
  display:flex;
  align-items:center;
  gap: 18px;
  padding: 18px 12px;
  border-bottom: 1px solid rgba(0,0,0,08);
  cursor: pointer;
  user-select: none;
  border-radius: 12px;
}

/* Hover muy sutil (no â€œverdeâ€) */
#gtc-div-horas .gtc-hour-row:hover{
  background: rgba(0,0,0,03);
}

/* CÃ­rculo estilo radio */
#gtc-div-horas .gtc-hour-radio{
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,25);
  flex: 0 0 auto;
  position: relative;
}

/* Texto hora */
#gtc-div-horas .gtc-hour-time{
  font-size: 28px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: .01em;
  color: rgba(0,0,0,70);
}

/* Estado seleccionado = usamos tu clase ya existente fondo-amarillo-fijo */
#gtc-div-horas .gtc-hour-row.fondo-amarillo-fijo{
  background: rgba(255,106,0,08);
}
#gtc-div-horas .gtc-hour-row.fondo-amarillo-fijo .gtc-hour-radio{
  border-color: #ff6a00;
}
#gtc-div-horas .gtc-hour-row.fondo-amarillo-fijo .gtc-hour-radio:after{
  content:"";
  position:absolute;
  inset: 7px;
  border-radius: 999px;
  background: #ff6a00;
}

/* En mÃ³vil, un pelÃ­n mÃ¡s compacto */
@media (max-width: 480px){
  #gtc-div-horas .gtc-hour-time{ font-size: 22px; }
  #gtc-div-horas .gtc-hour-row{ padding: 14px 10px; gap: 14px; }
  #gtc-div-horas .gtc-hour-radio{ width: 26px; height: 26px; }
  #gtc-div-horas .gtc-hour-row.fondo-amarillo-fijo .gtc-hour-radio:after{ inset: 6px; }
}

/* =========================================================
   PASO 2: HORA â€“ Estilo Apple-like (limpio, premium, conversiÃ³n)
   Pegar al final del CSS
========================================================= */

/* Contenedor general del paso 2 */
#gtc-div-horas{
  padding: 8px 0;
}

/* Cada opciÃ³n (fila) */
#gtc-div-horas .contenedorPrecio{
  display: flex;
  align-items: center;
  gap: 14px;

  /* look premium */
  padding: 14px 16px;
  margin: 10px 0;

  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  background: #fff;

  /* animaciÃ³n suave */
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease;
  cursor: pointer;

  /* quita cualquier subrayado/linea rara heredada */
  text-decoration: none !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.04);
}

/* Hover: sutil, sin â€œgigantismoâ€ */
#gtc-div-horas .contenedorPrecio:hover{
  transform: translateY(-1px);
  border-color: rgba(0,0,0,.14);
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

/* Evitar la â€œlÃ­neaâ€ debajo (por si hay border-bottom heredado) */
#gtc-div-horas .contenedorPrecio,
#gtc-div-horas .contenedorPrecio *{
  border-bottom: none !important;
  background-image: none !important;
}

/* El cÃ­rculo radio (izquierda) */
#gtc-div-horas .gtc-hour-radio{
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,.18);
  background: #fff;

  flex: 0 0 24px;
  transition: border-color .12s ease, box-shadow .12s ease, background-color .12s ease;
}

/* Texto de la hora */
#gtc-div-horas .gtc-hour-time{
  font-size: 22px;     /* antes estaba muy grande */
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -0.2px;
  color: #111;
  margin: 0;
}

/* Si quieres un microtexto tipo â€œDisponibleâ€ o similar en futuro */
#gtc-div-horas .gtc-hour-sub{
  font-size: 13px;
  line-height: 1.2;
  color: rgba(17,17,17,.55);
  margin-top: 2px;
}

/* Estado seleccionado (usa tu clase actual) */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo{
  background: rgba(17,17,17,.03);
  border-color: rgba(0,0,0,.22);
  box-shadow: 0 12px 28px rgba(0,0,0,.08);
}

/* Radio seleccionado: punto interior tipo iOS */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo .gtc-hour-radio{
  border-color: rgba(0,0,0,.55);
  box-shadow: 0 0 0 4px rgba(0,0,0,.06) inset;
  position: relative;
}

#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo .gtc-hour-radio::after{
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 999px;
  background: #111;
}

/* Accesibilidad: foco con teclado */
#gtc-div-horas .contenedorPrecio:focus,
#gtc-div-horas .contenedorPrecio:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(0,0,0,.10), 0 10px 24px rgba(0,0,0,.06);
  border-color: rgba(0,0,0,.35);
}

/* Mobile: un pelÃ­n mÃ¡s compacto */
@media (max-width: 480px){
  #gtc-div-horas .contenedorPrecio{
    padding: 13px 14px;
    border-radius: 14px;
  }
  #gtc-div-horas .gtc-hour-time{
    font-size: 21px;
  }
  #gtc-div-horas .gtc-hour-radio{
    width: 22px;
    height: 22px;
    flex-basis: 22px;
  }
}

/* CONTENEDOR PASO 2 - mismo lenguaje que paso 1 */

#gtc-step-hora{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 22px;
  padding: 18px 18px 8px 18px;
  box-shadow: 0 12px 40px rgba(0,0,0,.04);
  margin-bottom: 24px;
}

/* ===============================
   PASO 2 â€“ HORARIOS PREMIUM
=================================*/

#gtc-div-horas{
  padding: 4px 0 12px 0;
}

/* Cada fila */
#gtc-div-horas .contenedorPrecio{
  display: flex;
  align-items: center;
  gap: 12px;

  padding: 12px 16px;
  margin: 10px 0;

  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.06);
  background: #fff;

  transition: all .15s ease;
  cursor: pointer;

  box-shadow: 0 6px 20px rgba(0,0,0,.03);
}

/* Hover elegante (NO negro) */
#gtc-div-horas .contenedorPrecio:hover{
  background: rgba(0,0,0,.025);
  border-color: rgba(0,0,0,.10);
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
  transform: translateY(-1px);
}

/* Elimina cualquier fondo negro heredado */
#gtc-div-horas .contenedorPrecio:hover *{
  background-color: transparent !important;
  color: #111 !important;
}

/* Texto hora â€“ mÃ¡s fino */
#gtc-div-horas .gtc-hour-time{
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.2px;
  color: #111;
}

/* Radio mÃ¡s pequeÃ±o */
#gtc-div-horas .gtc-hour-radio{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1.5px solid rgba(0,0,0,.25);
  background: #fff;
  flex: 0 0 18px;
  transition: all .15s ease;
}

/* Estado seleccionado */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo{
  background: rgba(0,0,0,.035);
  border-color: rgba(0,0,0,.18);
  box-shadow: 0 14px 30px rgba(0,0,0,.07);
}

/* Radio seleccionado */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo .gtc-hour-radio{
  border-color: #111;
  position: relative;
}

#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo .gtc-hour-radio::after{
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 999px;
  background: #111;
}


/* =========================================================
   PASO 2: HORA â€“ chips en lÃ­nea (compacto, premium)
========================================================= */

#gtc-div-horas{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 8px 0 12px 0;
}

/* cada opciÃ³n como chip */
#gtc-div-horas .contenedorPrecio{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;

  padding: 10px 14px;
  margin: 0;

  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.10);
  background: #fff;

  box-shadow: 0 6px 18px rgba(0,0,0,.03);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease;
  cursor: pointer;

  /* tamaÃ±o compacto */
  min-height: 38px;
}

/* texto */
#gtc-div-horas .gtc-hour-time{
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.2px;
  line-height: 1;
  color: #111;
}

/* ocultar radio (el punto negro) */
#gtc-div-horas .gtc-hour-radio{
  display: none !important;
}

/* hover fino (nada negro) */
#gtc-div-horas .contenedorPrecio:hover{
  background: rgba(0,0,0,.03);
  border-color: rgba(0,0,0,.18);
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
  transform: translateY(-1px);
}

/* seleccionado: pill marcada (muy clara y premium) */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo{
  background: rgba(0,0,0,.06);
  border-color: rgba(0,0,0,.28);
  box-shadow: 0 14px 32px rgba(0,0,0,.10);
}

/* opcional: check sutil al seleccionar */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo::after{
  content: "âœ“";
  font-size: 14px;
  font-weight: 800;
  margin-left: 10px;
  line-height: 1;
  color: #111;
  opacity: .9;
}

/* mÃ³vil: que respiren y se adapten */
@media (max-width: 480px){
  #gtc-div-horas{
    gap: 8px;
  }
  #gtc-div-horas .contenedorPrecio{
    padding: 10px 12px;
    min-height: 36px;
  }
  #gtc-div-horas .gtc-hour-time{
    font-size: 14px;
  }
}

#gtc-div-horas .contenedorPrecio{
  flex: 1 1 calc(33.333% - 10px);
  justify-content: center;
}
@media (max-width: 480px){
  #gtc-div-horas .contenedorPrecio{
    flex: 1 1 calc(50% - 8px);
  }
}


/* =====================================================
   PASO 2 â€“ Horarios en lÃ­nea horizontal
===================================================== */

#gtc-div-horas{
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 12px;
  align-items: center;
}

/* Quitar cualquier width heredado */
#gtc-div-horas .contenedorPrecio{
  width: auto !important;
  flex: 0 0 auto !important;
}

/* EstÃ©tica premium compacta */
#gtc-div-horas .contenedorPrecio{
  padding: 9px 16px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;

  min-height: 36px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  transition: all .15s ease;
  box-shadow: 0 6px 18px rgba(0,0,0,.03);
}

/* Texto mÃ¡s fino */
#gtc-div-horas .gtc-hour-time{
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.2px;
  line-height: 1;
}

/* Hover suave */
#gtc-div-horas .contenedorPrecio:hover{
  background: rgba(0,0,0,.03);
  border-color: rgba(0,0,0,.18);
  transform: translateY(-1px);
}

/* Seleccionado */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo{
  background: rgba(0,0,0,.08);
  border-color: rgba(0,0,0,.35);
  box-shadow: 0 10px 28px rgba(0,0,0,.10);
}

/* Ocultamos radio clÃ¡sico */
#gtc-div-horas .gtc-hour-radio{
  display: none !important;
}

#gtc-div-horas{
  display: flex;
  gap: 12px;
}

#gtc-div-horas .contenedorPrecio{
  flex: 1;
}


/* =====================================================
   PASO 2 â€“ FORZAR HORAS EN HORIZONTAL (anti Bootstrap cols)
   Pegar al final del CSS
===================================================== */

/* 1) El contenedor real de las horas (el tuyo) */
#gtc-div-horas{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center !important;
}

/* 2) Si cada hora viene dentro de un wrapper (col-12, etc), lo neutralizamos */
#gtc-div-horas > *{
  width: auto !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Caso Bootstrap: si hay un .row/.col-* dentro del contenedor */
#gtc-div-horas .row{
  display: contents !important; /* aplana la rejilla para que no rompa la fila */
}
#gtc-div-horas [class*="col-"]{
  width: auto !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 3) El chip (la opciÃ³n clicable) */
#gtc-div-horas .contenedorPrecio{
  display: inline-flex !important;
  width: auto !important;
  flex: 0 0 auto !important;

  align-items: center !important;
  justify-content: center !important;

  padding: 9px 14px !important;
  min-height: 36px !important;

  border-radius: 999px !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  background: #fff !important;

  box-shadow: 0 6px 18px rgba(0,0,0,.03) !important;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease !important;
  cursor: pointer !important;
}

/* Texto */
#gtc-div-horas .gtc-hour-time{
  font-size: 15px !important;
  font-weight: 650 !important;
  letter-spacing: -0.2px !important;
  line-height: 1 !important;
  color: #111 !important;
}

/* Ocultar radio clÃ¡sico */
#gtc-div-horas .gtc-hour-radio{
  display: none !important;
}

/* Hover suave */
#gtc-div-horas .contenedorPrecio:hover{
  background: rgba(0,0,0,.03) !important;
  border-color: rgba(0,0,0,.20) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.06) !important;
  transform: translateY(-1px) !important;
}

/* Seleccionado */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo{
  background: rgba(0,0,0,.07) !important;
  border-color: rgba(0,0,0,.32) !important;
  box-shadow: 0 14px 32px rgba(0,0,0,.10) !important;
}

#gtc-div-horas .contenedorPrecio{
  flex: 1 1 calc(33.333% - 12px) !important;
}
@media (max-width: 520px){
  #gtc-div-horas .contenedorPrecio{
    flex: 1 1 calc(50% - 12px) !important;
  }
}

/* PASO 2: Hora + Idioma (premium) */
#gtc-div-horas .contenedorPrecio.gtc-hour-row{
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Hora */
#gtc-div-horas .gtc-hour-time{
  font-size: 16px;
  font-weight: 750;
  letter-spacing: -0.2px;
  color: #111;
}

/* Idiomas */
#gtc-div-horas .gtc-hour-lang{
  font-size: 13px;
  font-weight: 550;
  color: rgba(17,17,17,.55);
  letter-spacing: -0.1px;
  line-height: 1.1;
}

/* Si quieres que en mÃ³vil pueda partir lÃ­nea sin romper */
@media (max-width: 480px){
  #gtc-div-horas .gtc-hour-lang{
    white-space: normal;
  }
}

/* Badges idioma estilo premium */
#gtc-div-horas .gtc-hour-lang{
  display: inline-flex;
  gap: 6px;
  margin-left: 10px;
  align-items: center;
}

#gtc-div-horas .gtc-lang-badge{
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;

  padding: 4px 8px;
  border-radius: 999px;

  border: 1px solid rgba(0,0,0,.10);

  line-height: 1;
}

/* Eliminar cualquier check anterior */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo::after{
  content: none !important;
}

/* PASO 2 - seleccionado estilo PASO 1 */

#gtc-div-horas .contenedorPrecio.gtc-hour-row.fondo-amarillo-fijo{
  background: #e36f2c !important; /* mismo naranja que paso 1 */
  border-color: #e36f2c !important;
  box-shadow: 0 12px 32px rgba(227,111,44,.35) !important;
}

/* Texto blanco */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo .gtc-hour-time{
  color: #fff !important;
}

/* Idiomas blancos pero mÃ¡s suaves */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo .gtc-hour-lang{
  color: rgba(255,255,255,.85) !important;
}

/* Si usas badges */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo .gtc-lang-badge{
  background: rgba(255,255,255,.15) !important;
  border-color: rgba(255,255,255,.35) !important;
  color: #fff !important;
}

#gtc-div-horas .contenedorPrecio{
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

/* ==========================================
   PASO 2 â€“ Hover verde como PASO 1
========================================== */

/* Hover SOLO si no estÃ¡ seleccionado */
#gtc-div-horas .contenedorPrecio:not(.fondo-amarillo-fijo):hover{
  background: #18C964 !important;   /* usa aquÃ­ tu verde exacto del paso 1 */
  border-color: #18C964 !important;
  box-shadow: 0 12px 32px rgba(46,125,50,.35) !important;
  transform: translateY(-1px);
}

/* Texto blanco en hover */
#gtc-div-horas .contenedorPrecio:not(.fondo-amarillo-fijo):hover .gtc-hour-time,
#gtc-div-horas .contenedorPrecio:not(.fondo-amarillo-fijo):hover .gtc-hour-lang{
  color: #fff !important;
}

/* Badges en hover */
#gtc-div-horas .contenedorPrecio:not(.fondo-amarillo-fijo):hover .gtc-lang-badge{
  background: rgba(255,255,255,.15) !important;
  border-color: rgba(255,255,255,.35) !important;
  color: #fff !important;
}

/* Asegurar que el seleccionado naranja NO tenga hover verde */
#gtc-div-horas .contenedorPrecio.fondo-amarillo-fijo:hover{
  background: #e36f2c !important;  /* tu naranja */
  border-color: #e36f2c !important;
  transform: none !important;
}

/* =====================================================
   PASO 2 â€“ Contorno premium real (wrapper completo)
===================================================== */

#gtc-c-hora{
  background: #fff;

  border: 1px solid rgba(0,0,0,.08);
  border-radius: 22px;

  box-shadow: 0 20px 60px rgba(0,0,0,.04);

  overflow: hidden; /* clave para que el radio funcione bien */
}

/* Quitar fondo gris del panel-body */
#gtc-c-hora .panel-body{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 24px 24px 28px 24px !important;
}

/* El header debe tener fondo transparente */
#gtc-h-hora{
  background: transparent !important;
  border: none !important;
}

/* =====================================================
   PASO 2 (HORA) â€“ Wrapper premium sin romper estilos internos
===================================================== */

/* 1) Contorno premium (wrapper del collapse) */
#gtc-c-hora{
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  border-radius: 22px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.04) !important;
  overflow: hidden !important;
}

/* 2) Header dentro del mismo bloque (no lo mates) */
#gtc-h-hora{
  background: #f6f6f6 !important; /* si en paso 1 es otro, cÃ¡mbialo aquÃ­ */
  border: 0 !important;
  border-radius: 0 !important;
}

/* 3) Body transparente pero con padding correcto */
#gtc-c-hora .panel-body{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 22px 22px 26px 22px !important;
}

/* =====================================================
   4) HORARIOS â€“ chips + badges + hover verde + seleccionado naranja
   (reaplicado con mÃ¡xima especificidad)
===================================================== */

/* contenedor horas */
#gtc-c-hora #gtc-div-horas{
  padding: 6px 0 10px 0 !important;
}

/* cada chip */
#gtc-c-hora .contenedorPrecio.gtc-hour-row{
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;

  padding: 10px 14px !important;
  margin: 0 12px 12px 0 !important; /* lÃ­nea horizontal con wrap */
  border-radius: 999px !important;

  border: 1px solid rgba(0,0,0,.12) !important;
  background: #fff !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.03) !important;

  cursor: pointer !important;
  user-select: none !important;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease !important;
}

/* texto hora */
#gtc-c-hora .gtc-hour-time{
  font-size: 15px !important;
  font-weight: 500 !important;
  letter-spacing: -0.2px !important;
  line-height: 1 !important;
  color: #111 !important;
}

/* contenedor idiomas */
#gtc-c-hora .gtc-hour-lang{
  display: inline-flex !important;
  gap: 6px !important;
  align-items: center !important;
}

/* badge idioma */
#gtc-c-hora .gtc-lang-badge{
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .6px !important;
  text-transform: uppercase !important;

  padding: 4px 8px !important;
  border-radius: 999px !important;

  border: 1px solid rgba(0,0,0,.10) !important;
  background: rgba(0,0,0,.02) !important;
  color: rgba(17,17,17,.70) !important;

  line-height: 1 !important;
}

/* ocultar radio clÃ¡sico */
#gtc-c-hora .gtc-hour-radio{
  display: none !important;
}

/* -----------------------------
   Hover verde (solo NO seleccionado)
------------------------------ */
#gtc-c-hora .contenedorPrecio.gtc-hour-row:not(.fondo-amarillo-fijo):hover{
  background: #18C964 !important;  /* tu verde del paso 1 */
  border-color: #18C964 !important;
  box-shadow: 0 12px 32px rgba(46,125,50,.30) !important;
  transform: translateY(-1px) !important;
}

#gtc-c-hora .contenedorPrecio.gtc-hour-row:not(.fondo-amarillo-fijo):hover .gtc-hour-time{
  color: #fff !important;
}

#gtc-c-hora .contenedorPrecio.gtc-hour-row:not(.fondo-amarillo-fijo):hover .gtc-lang-badge{
  background: rgba(255,255,255,.16) !important;
  border-color: rgba(255,255,255,.32) !important;
  color: #fff !important;
}

/* -----------------------------
   Seleccionado naranja (sin hover verde)
------------------------------ */
#gtc-c-hora .contenedorPrecio.gtc-hour-row.fondo-amarillo-fijo{
  background: #e36f2c !important; /* tu naranja del paso 1 */
  border-color: #e36f2c !important;
  box-shadow: 0 12px 32px rgba(227,111,44,.35) !important;
  transform: none !important;
}

#gtc-c-hora .contenedorPrecio.gtc-hour-row.fondo-amarillo-fijo .gtc-hour-time{
  color: #fff !important;
}

#gtc-c-hora .contenedorPrecio.gtc-hour-row.fondo-amarillo-fijo .gtc-lang-badge{
  background: rgba(255,255,255,.18) !important;
  border-color: rgba(255,255,255,.34) !important;
  color: #fff !important;
}

/* quitar cualquier check residual */
#gtc-c-hora .contenedorPrecio.gtc-hour-row.fondo-amarillo-fijo::after{
  content: none !important;
}

/* =====================================================
   PASO 2 â€“ Contorno premium (arriba recto, abajo redondeado)
===================================================== */

#gtc-c-hora{
  background: #fff !important;

  border-left: 1px solid rgba(0,0,0,.08) !important;
  border-right: 1px solid rgba(0,0,0,.08) !important;
  border-bottom: 1px solid rgba(0,0,0,.08) !important;
  border-top: none !important;

  /* SOLO abajo redondeado */
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 22px !important;
  border-bottom-right-radius: 22px !important;

  box-shadow: 0 20px 60px rgba(0,0,0,.04) !important;
}

/* Body transparente */
#gtc-c-hora .panel-body{
  background: transparent !important;
  border: 0 !important;
}

/* ==========================================
   Alternativa sin :has() (siempre funciona)
========================================== */

#gtc-c-hora{
  margin-bottom: 16px !important;
  position: relative !important;
}

/* Pintamos el hueco de blanco justo debajo del PASO 2 */
#gtc-c-hora::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -18px;      /* mismo valor que margin-bottom */
  height: 18px;       /* mismo valor que margin-bottom */
  background: #fff !important;
  pointer-events: none;
}

/* ==========================================
   PASO 2: estrechar bloque horas
   Quitar padding vertical (arriba/abajo)
========================================== */

/* Tu wrapper directo */
#gtc-step-hour{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Por si el padding viene del panel-body */
#gtc-c-hora .panel-body{
  padding-top: 0px !important;     /* pon 0 si lo quieres totalmente pegado */
  padding-bottom: 10px !important;  /* pon 0 si lo quieres totalmente pegado */
}

/* Por si el section/container mete margen/padding extra */
#gtc-c-hora #gtc-div-horas section.precioshoras{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#gtc-c-hora #gtc-div-horas .container{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#gtc-c-hora,
#gtc-c-hora.panel-collapse,
#gtc-c-hora.panel-collapse.show{
  box-shadow: none !important;
}

/* ==========================================
   PASO 1: eliminar separador superior grueso
========================================== */

/* 1) Quita el borde inferior del header (separador) */
#gtc-h-fecha{
  border-bottom: 0 !important;
}

/* 2) Quita cualquier borde superior del contenido */
#gtc-c-fecha,
#gtc-c-fecha .panel-body,
#gtc-div-book-calendar{
  border-top: 0 !important;
}

/* 3) FullCalendar a veces mete una lÃ­nea arriba */
#gtc-c-fecha .fc-toolbar,
#gtc-c-fecha .fc-view-container,
#gtc-c-fecha .fc-head,
#gtc-c-fecha table.table-bordered{
  border-top: 0 !important;
}

#gtc-h-fecha::after{
  background: transparent !important;
  height: 0 !important;
}

/* === PASO 3: PERSONAS (layout vertical 2 columnas) === */
.gtc-people-list{
  margin-top: 10px;
}

.gtc-person-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 0;
  border-bottom: 1px solid #ededed;
}

.gtc-person-row-last{
  border-bottom: 0;
}

.gtc-person-info{
  flex: 1;
  text-align: left;
}

.gtc-person-title{
  font-weight: 700;
  font-size: 18px;
  line-height: 22px;
  color: #111;
}

.gtc-person-age{
  font-weight: 500;
  opacity: .7;
  font-size: 16px;
}

.gtc-person-lang{
  margin-top: 2px;
  font-size: 14px;
  opacity: .75;
}

.gtc-person-price{
  margin-top: 6px;
  font-weight: 800;
  font-size: 22px;
  line-height: 1;
  color: #ff4d4d; /* rojo precio */
}

.gtc-person-control{
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}

/* Ajusta el ancho del select y lo deja â€œtipo selectorâ€ a la derecha */
.gtc-select-qty{
  width: 110px;
}

/* Mobile: sigue 2 columnas pero mÃ¡s compactas */
@media (max-width: 576px){
  .gtc-person-title{ font-size: 16px; }
  .gtc-person-age{ font-size: 14px; }
  .gtc-person-price{ font-size: 20px; }
  .gtc-select-qty{ width: 96px; }
}


/* === PASO 3 PERSONAS: layout + stepper (-/+) === */
.gtc-people-list{ margin-top: 10px; }

.gtc-person-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:18px 0;
  border-bottom:1px solid #ededed;
}
.gtc-person-row-last{ border-bottom:0; }

.gtc-person-info{ flex:1; text-align:left; }
.gtc-person-title{ font-weight:700; font-size:18px; line-height:22px; color:#111; }
.gtc-person-age{ font-weight:500; opacity:.7; font-size:16px; }
.gtc-person-price{ margin-top:6px; font-weight:800; font-size:22px; line-height:1; }

.gtc-person-control{ flex:0 0 auto; display:flex; align-items:center; }

/* Stepper */
.gtc-stepper{
  display:flex;
  align-items:center;
  border:2px solid #2b2b2b;
  border-radius:14px;
  overflow:hidden;
  height:52px;
  min-width:180px;
  background:#fff;
}
.gtc-stepper-btn{
  width:58px;
  height:52px;
  border:0;
  background:#f3f3f3;
  font-size:26px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.gtc-stepper-value{
  width:64px;
  text-align:center;
  font-size:24px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* Mobile */
@media (max-width:576px){
  .gtc-stepper{ min-width:160px; height:48px; }
  .gtc-stepper-btn{ width:52px; height:48px; }
  .gtc-stepper-value{ width:56px; font-size:22px; }
  .gtc-person-title{ font-size:16px; }
  .gtc-person-age{ font-size:14px; }
  .gtc-person-price{ font-size:20px; }
}


/* === PASO 3 PERSONAS: tipografÃ­a heredada del calendario === */
#gtc-div-people,
#gtc-div-people *{
  font-family: 'Inter', sans-serif !important;
}

/* Ajuste general de cada fila (mÃ¡s compacto) */
.gtc-person-row{
  padding: 14px 0;
  gap: 14px;
}

/* TÃ­tulos y textos: mÃ¡s â€œcalendar-likeâ€ */
.gtc-person-title{
  font-size: 16px;
  line-height: 20px;
  font-weight: 700;
}

.gtc-person-age{
  font-size: 12px;
  font-weight: 300;
  opacity: .75;
}

/* Precio: misma fuente + menos gigante */
.gtc-person-price{
  margin-top: 6px;
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
  font-family: 'Inter', sans-serif !important;
}

/* === Stepper mÃ¡s pequeÃ±o y limpio === */
.gtc-stepper{
  height: 36px;            /* antes 52 */
  min-width: 128px;        /* antes 180 */
  border-width: 1px;       /* mÃ¡s fino */
  border-radius: 12px;
  font-family: 'Inter', sans-serif !important;
}

.gtc-stepper-btn{
  width: 40px;             /* antes 58 */
  height: 38px;
  font-size: 18px;         /* antes 26 */
  background: #f4f4f4;
  font-family: 'Inter', sans-serif !important;
}

.gtc-stepper-value{
  width: 44px;             /* antes 64 */
  font-size: 16px;         /* antes 24 */
  font-weight: 500;
  color: inherit;
  font-family: 'Inter', sans-serif !important;
    color: var(--gtc-accent-color, #ff7a00);

}

/* Mobile: todavÃ­a mÃ¡s compacto */
@media (max-width: 576px){
  .gtc-stepper{ height: 36px; min-width: 120px; }
  .gtc-stepper-btn{ width: 38px; height: 36px; font-size: 18px; }
  .gtc-stepper-value{ width: 42px; font-size: 18px; }
  .gtc-person-title{ font-size: 15px; }
  .gtc-person-age{ font-size: 13px; }
  .gtc-person-price{ font-size: 17px; }
}


/* === Espaciado interno del PASO 3 === */


/* Ajuste de cada fila */
.gtc-person-row{
  /* padding: 16px 0; */
  gap: 20px;
}


/* === Precio PASO 3 === */
.gtc-person-price{
  font-family: 'Inter', sans-serif !important;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.2;
  color: var(--gtc-accent-color, #ff7a00); /* usa variable si existe */
  margin-top: 6px;
}

.gtc-person-price{
  font-family: 'Inter', sans-serif !important;
  font-weight: 600;
  font-size: 20px;
  color: var(--gtc-accent-color, #ff7a00);
  letter-spacing: -1px;
}

.gtc-person-price::after{
  font-size: 16px;
}


/* === Contorno PASO 3 PERSONAS === */
#gtc-c-tipo .accordion-body,
#gtc-c-personas .accordion-body{
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
  border-bottom: 1px solid #e6e6e6;
  border-top: none;
  border-radius: 0 0 18px 18px; /* solo esquinas inferiores */
  background: #fff;
}

/* Aseguramos que el header no duplique borde */
#gtc-h-tipo,
#gtc-h-personas{
  border-bottom: 1px solid #e6e6e6;
}

/* === Contorno SOLO para contenido (no acordeÃ³n) === */
.gtc-step-content-box{
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
  border-bottom: 1px solid #e6e6e6;
  border-top: 0;                 /* ðŸ‘ˆ arriba sin borde */
  border-radius: 0 0 18px 18px;  /* ðŸ‘ˆ solo abajo */
  background: #fff;
  padding: 18px 20px 22px 20px;  /* ðŸ‘ˆ margen interior para que no se pegue */
}

/* El panel-body no debe meter padding/borde extra */
#gtc-c-tipo > .panel-body{
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* 1ï¸âƒ£ El panel-body NO debe meter padding lateral */
#gtc-c-tipo > .panel-body{
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* 2ï¸âƒ£ La caja de contenido ocupa todo el ancho */
.gtc-step-content-box{
  width: 100%;
  margin: 0;
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6;
  border-bottom: 1px solid #e6e6e6;
  border-top: 0;
  border-radius: 0 0 18px 18px;
  background: #fff;

  /* padding SOLO interno */
  padding: 4px 22px 8px 22px;
}

#gtc-c-tipo{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* === PASO 2: separadores por fila (cada .row es un horario) === */
#gtc-div-horas .precioshoras > .container > .row{
  margin-left: 0;
  margin-right: 0;
}

#gtc-div-horas .precioshoras > .container > .row .col-12.order-1{
  padding-left: 0;
  padding-right: 0;
  border-bottom: 1px solid #ededed;  /* âœ… lÃ­nea separadora full-width */
}

/* Quitar lÃ­nea al Ãºltimo horario */
#gtc-div-horas .precioshoras > .container > .row:last-of-type .col-12.order-1{
  border-bottom: 0;
}

/* Aire vertical y layout dentro del clickable */
#gtc-div-horas .contenedorPrecio.gtc-hour-row{
  padding: 14px 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
}

/* Padding lateral del PASO 2 */
#gtc-step-hour{
  padding: 0 20px;
}

/* LÃ­nea separadora PASO 2 */
#gtc-step-hour .contenedorPrecio.gtc-hour-row{
  border-bottom: 1px solid #ededed;
  padding: 14px 0;
}

/* Quitar lÃ­nea al Ãºltimo */
#gtc-step-hour .contenedorPrecio.gtc-hour-row:last-of-type{
  border-bottom: 0;
}


/* PASO 2: separadores tipo PASO 3, casi a filo sin tocar el contorno */
#gtc-step-hour{
  padding-left: 20px;
  padding-right: 20px;
}

#gtc-step-hour .contenedorPrecio.gtc-hour-row{
  position: relative;
  padding: 16px 0 18px 0;   /* ðŸ‘ˆ aire: arriba y sobre todo abajo antes de la lÃ­nea */
  border-bottom: 0 !important; /* quitamos cualquier borde previo */
}

/* Dibujamos la lÃ­nea â€œlargaâ€ con ::after */
#gtc-step-hour .contenedorPrecio.gtc-hour-row::after{
  content: "";
  position: absolute;
  left: -14px;              /* ðŸ‘ˆ se estira hacia el borde (sin tocar) */
  right: -14px;             /* ðŸ‘ˆ ajusta a gusto */
  bottom: 0;
  height: 1px;
  background: #ededed;
}

/* Quitar la lÃ­nea del Ãºltimo horario */
#gtc-step-hour .row:last-of-type .contenedorPrecio.gtc-hour-row::after{
  display: none;
}


/* ============================
   PASO 2: Separadores LIMPIOS
   ============================ */

/* 0) Reset: mata cualquier lÃ­nea previa en el horario */
#gtc-div-horas .contenedorPrecio.gtc-hour-row{
  border: 0 !important;
}
#gtc-div-horas .contenedorPrecio.gtc-hour-row::before,
#gtc-div-horas .contenedorPrecio.gtc-hour-row::after{
  content: none !important;
}

/* 1) Aire horizontal general (no toca el contorno) */
#gtc-step-hour{
  padding-left: 20px;
  padding-right: 20px;
}

/* 2) Cada horario vive en: .row -> .col-12.order-1 -> .contenedorPrecio
      Dibujamos la lÃ­nea en la col, asÃ­ es 1 lÃ­nea por fila SIEMPRE */
#gtc-div-horas .row .col-12.order-1{
  position: relative;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0px;  /* ðŸ‘ˆ aire entre horario y lÃ­nea */
  margin-bottom: 12px;   /* ðŸ‘ˆ aire extra bajo la lÃ­nea */
}

/* 3) LÃ­nea: casi de lado a lado, pero sin tocar el contorno */
#gtc-div-horas .row .col-12.order-1::after{
  content: "";
  position: absolute;
  left: 0;     /* ðŸ‘ˆ no toca el contorno */
  right: 0;    /* ðŸ‘ˆ no toca el contorno */
  bottom: 0;
  height: 1px;
  background: #ededed;
}

/* 4) Quita la lÃ­nea del ÃšLTIMO horario real (Ãºltima col-12.order-1 del bloque) */
#gtc-div-horas .col-12.order-1:last-of-type::after{
  display: none;
}

/* 5) El clickable del horario, compacto y alineado */
#gtc-div-horas .contenedorPrecio.gtc-hour-row{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0; /* el aire ya lo da el wrapper */
}

#gtc-div-horas .row .col-12.order-1::after{
  left: 0;
  right: 0;
}

/* Reset total lÃ­neas anteriores paso 2 */
#gtc-div-horas .contenedorPrecio,
#gtc-div-horas .contenedorPrecio::before,
#gtc-div-horas .contenedorPrecio::after,
#gtc-div-horas .col-12::after{
  border: 0 !important;
  content: none !important;
}

#gtc-div-horas .contenedorPrecio.gtc-hour-row{
  width: 100%;
  padding: 16px 0 18px 0;  /* aire arriba y debajo */
  border-bottom: 1px solid #ededed; /* lÃ­nea limpia */
}

#gtc-div-horas .contenedorPrecio.gtc-hour-row:last-of-type{
  border-bottom: 0;
}

#gtc-div-horas .col-12{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ============================
   PASO 2: LÃ­nea = ancho gtc-step-hour
   ============================ */

/* 0) Reset por si habÃ­a lÃ­neas anteriores */
#gtc-div-horas .contenedorPrecio.gtc-hour-row{
  border: 0 !important;
}
#gtc-div-horas .contenedorPrecio.gtc-hour-row::before,
#gtc-div-horas .contenedorPrecio.gtc-hour-row::after{
  content: none !important;
}

/* 1) Quita padding lateral del grid para que el separador sea full-width del step */
#gtc-step-hour .container,
#gtc-step-hour .row,
#gtc-step-hour .col-12{
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* 2) Cada horario: aire + separador al ancho del step */
#gtc-div-horas .col-12.order-1{
  position: relative;
  padding-bottom: 18px; /* ðŸ‘ˆ aire entre el botÃ³n y la lÃ­nea */
  margin-bottom: 16px;  /* ðŸ‘ˆ aire bajo la lÃ­nea */
}

/* 3) LÃ­nea separadora full width (gtc-step-hour) */
#gtc-div-horas .col-12.order-1::after{
  content: "";
  position: absolute;
  left: 0;     /* ðŸ‘ˆ full */
  right: 0;    /* ðŸ‘ˆ full */
  bottom: 0;
  height: 1px;
  background: #ededed;
}

/* 4) Quita la lÃ­nea del Ãºltimo horario */
#gtc-div-horas .col-12.order-1:last-of-type::after{
  display: none;
}

/* 5) El clickable sigue ocupando todo el ancho */
#gtc-div-horas .contenedorPrecio.gtc-hour-row{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0; /* el aire lo da el wrapper */
}

/* El contenido dentro de gtc-div-horas debe ocupar todo el ancho */
#gtc-div-horas > section{
  flex: 1;
  width: 100%;
}

#gtc-div-horas > *{
  flex: 1;
  width: 100%;
}

/* ============================
   PASO 2: que el contenido ocupe TODO el ancho del step
   ============================ */

/* 1) El wrapper AJAX debe ocupar todo */
#gtc-step-hour,
#gtc-div-horas,
#gtc-div-horas > section.precioshoras{
  width: 100% !important;
  max-width: 100% !important;
}

/* 2) El .container de Bootstrap es el que te corta: lo anulamos SOLO aquÃ­ */
#gtc-div-horas > section.precioshoras > .container{
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 3) Quitamos gutters de filas/cols para que la lÃ­nea sea full-width del step */
#gtc-div-horas .row{
  margin-left: 0 !important;
  margin-right: 0 !important;
}
#gtc-div-horas .col-12{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ============================
   Separadores (ancho = gtc-step-hour)
   ============================ */

/* Reset: fuera bordes/pseudos anteriores */
#gtc-div-horas .contenedorPrecio.gtc-hour-row{
  border: 0 !important;
}
#gtc-div-horas .contenedorPrecio.gtc-hour-row::before,
#gtc-div-horas .contenedorPrecio.gtc-hour-row::after{
  content: none !important;
}

/* LÃ­nea la dibujamos en el wrapper del horario */
#gtc-div-horas .col-12.order-1{
  position: relative;
  padding-bottom: 18px; /* aire entre horario y lÃ­nea */
  margin-bottom: 14px;  /* aire bajo la lÃ­nea */
}

/* LÃ­nea full-width del step */
#gtc-div-horas .col-12.order-1::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: #ededed;
}

/* Quitar Ãºltima lÃ­nea */
#gtc-div-horas .col-12.order-1:last-of-type::after{
  display: none;
}

/* ============================
   PASO 2 â€“ Estilo elegante horarios
   ============================ */

#gtc-div-horas .contenedorPrecio.gtc-hour-row{
    background: transparent !important;
  border: 1px solid #e6e6e6; /* contorno fino */
  border-radius: 12px;       /* mismo lenguaje que resto */
  box-shadow: 0 4px 14px rgba(0,0,0,0.04); /* sombra suave */
  transition: all 0.25s ease;
  padding: 14px 18px; /* aire interior */
  margin-bottom: 8px;
}

/* Hover elegante */
#gtc-div-horas .contenedorPrecio.gtc-hour-row:hover{
  border-color: #dcdcdc;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
  transform: translateY(-1px);
}

/* Cuando estÃ¡ seleccionada */
#gtc-div-horas .contenedorPrecio.gtc-hour-row.active,
#gtc-div-horas .contenedorPrecio.gtc-hour-row.selected{
  border-color: #ac8d56; /* tu color premium */
  box-shadow: 0 0 0 2px rgba(172,141,86,0.12);
}



/* ============================
   PASO 2 â€“ Contorno fino elegante en cada franja horaria
   (override fuerte)
   ============================ */

#gtc-div-horas .col-12.order-1 .contenedorPrecio.gtc-hour-row{
  border: 1px solid rgba(0,0,0,0.08) !important; /* contorno fino */
  border-radius: 14px !important;
  box-shadow: 0 10px 26px rgba(0,0,0,0.06) !important; /* mantiene el sombreado bonito */
  padding: 14px 18px !important;
  width: 100% !important;

  display: flex !important;
  align-items: center !important;
  gap: 10px !important;

  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

/* ===============================
   DÃA SELECCIONADO: SIN HOVER VERDE, PERO SÃ CLICABLE âœ…
   =============================== */

/* Mantiene el estilo naranja pero permite volver a hacer click (reconsultar horarios) */
#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number{
  pointer-events: auto !important;     /* âœ… permitir click */
  cursor: pointer !important;          /* âœ… feedback claro */
}

/* Garantiza que ninguna regla de hover/active lo cambie (no verde, no â€œliftâ€) */
#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number:hover,
#gtc-div-book-calendar td.fc-day-top.gtc-selected .fc-day-number:active{
  background: #F97316 !important;
  box-shadow: none !important;
  transform: none !important;
}


/* =========================================================
   UX FIX: PASO 3 (PERSONAS) - quitar cursor "mano"
   DOM real: #gtc-h-tipo > a[role="button"]
   ========================================================= */

#gtc-h-tipo > a,
#gtc-h-tipo > a[role="button"],
#gtc-h-tipo > a .gtc-acc-head,
#gtc-h-tipo > a .gtc-acc-head * {
  cursor: default !important;
}



/* =========================================================
   CHEVRON ROBUSTO (fallback): usa .collapsed (Bootstrap)
   - Si por cualquier motivo aria-expanded no se actualiza (PASO 1),
     Bootstrap sÃ­ suele alternar la clase .collapsed.
   - Abierto => sin .collapsed => â–¼
   - Cerrado => con .collapsed => â–²
   ========================================================= */
#gtc-accordion .panel-heading > a .gtc-acc-chevron{
  transition: transform 180ms ease;
  transform-origin: 50% 50%;
}

#gtc-accordion .panel-heading > a.collapsed .gtc-acc-chevron{
  transform: rotate(180deg) !important; /* â–² */
}

#gtc-accordion .panel-heading > a:not(.collapsed) .gtc-acc-chevron{
  transform: rotate(0deg) !important;   /* â–¼ */
}


/* =========================================================
   ICONOS PASOS (Bootstrap Icons) -> mÃ¡s grandes + â€œgorditosâ€
   ========================================================= */

#gtc-accordion .gtc-acc-left > i.bi{
  /* TamaÃ±o / presencia */
  font-size: 14px !important;
  line-height: 1 !important;

  /* â€œGrosorâ€ simulado (Bootstrap Icons no engordan con font-weight) */
  text-shadow:
    0 0 0 currentColor,
    0.3px 0 0 currentColor,
    -0.3px 0 0 currentColor,
    0 0.3px 0 currentColor,
    0 -0.3px 0 currentColor !important;

  /* Caja premium */
  width: 30px !important;
  height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  /* EstÃ©tica */
  color: #F97316 !important;
  background: rgba(249,115,22,0.12) !important;
  border: 1px solid rgba(249,115,22,0.18) !important;
  border-radius: 12px !important;

  /* SeparaciÃ³n del tÃ­tulo */
  margin-right: 4px !important;
}

/* Asegura alineaciÃ³n vertical del bloque izquierdo */
#gtc-accordion .gtc-acc-left{
  display: flex !important;
  align-items: center !important;
}




/* =========================================================
   TOTAL + CTA (debajo de asistentes)
   ========================================================= */
#gtc-order-bar{
  margin-top: 16px;
  padding: 14px 14px;
  border-radius: 18px;
  border: 1px solid rgba(17,24,39,0.10);
  background: #fff;
  box-shadow: 0 14px 30px rgba(17,24,39,0.06);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

#gtc-order-bar .gtc-order-bar__left{
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

#gtc-order-bar .gtc-order-bar__label{
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: rgba(17,24,39,0.55);
}

#gtc-order-bar .gtc-order-bar__amount{
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -0.3px;
  color: rgba(17,24,39,0.92);
  white-space: nowrap;
}

#gtc-btn-reservar{
  border: 0;
  border-radius: 16px;
  padding: 14px 18px;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  white-space: nowrap;

  background: #111827;
  color: #fff;
  box-shadow: 0 12px 24px rgba(17,24,39,0.18);
  transition: transform 150ms ease, opacity 150ms ease;
}

#gtc-btn-reservar:hover{
  transform: translateY(-1px);
}

#gtc-btn-reservar:disabled,
#gtc-btn-reservar.is-disabled{
  opacity: 0.45;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

#gtc-order-bar.is-ready{
  border-color: rgba(249,115,22,0.22);
  box-shadow: 0 16px 34px rgba(249,115,22,0.10);
}

@media (max-width: 520px){
  #gtc-order-bar{ flex-direction: column; align-items: stretch; }
  #gtc-btn-reservar{ width: 100%; text-align: center; }
}

/* ================================
   ORDER BAR FLAT (sin contorno)
   ================================ */

#gtc-order-bar.gtc-order-bar--flat{
  padding: 0;
  margin-top: 16px;
  background: transparent;
  border: 0 !important;
  box-shadow: none !important;
}

/* LÃ­nea del total */
#gtc-order-bar .gtc-order-line{
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 14px;
}

#gtc-order-bar .gtc-order-label{
  font-size: 16px;
  font-weight: 500;
  color: rgba(17,24,39,0.65);
}

#gtc-order-bar .gtc-order-amount{
  font-size: 18px;
  font-weight: 700;
  color: rgba(17,24,39,0.85);
}

#gtc-order-bar .gtc-order-tax{
  font-size: 14px;
  color: rgba(17,24,39,0.45);
}

/* BotÃ³n limpio, plano */
#gtc-order-bar .gtc-order-cta{
  width: 100%;
  padding: 14px 16px;
  border-radius: 8px;
  border: 0;

  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;

  background: #4caf6d;   /* verde como tu captura */
  color: #fff;

  transition: opacity 150ms ease;
}

#gtc-order-bar .gtc-order-cta:not(:disabled):hover{
  opacity: 0.9;
}

#gtc-order-bar .gtc-order-cta:disabled{
  background: rgba(0,0,0,0.15);
  color: rgba(0,0,0,0.35);
  cursor: not-allowed;
}


/* ================================
   ORDER BAR â€“ centrado limpio
   ================================ */

#gtc-order-bar.gtc-order-bar--flat{
  margin-top: 16px;
  text-align: center;
}

/* Centra la lÃ­nea completa */
#gtc-order-bar .gtc-order-line{
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 8px;
}

/* Opcional: si quieres aÃºn mÃ¡s compacto */
#gtc-order-bar .gtc-order-label{
  font-size: 15px;
}

#gtc-order-bar .gtc-order-amount{
  font-size: 20px;
  font-weight: 800;
}

#gtc-order-bar .gtc-order-tax{
  font-size: 14px;
  opacity: 0.6;
}

/* =========================================
   ORDER TOTAL â€“ versiÃ³n minimal premium
   ========================================= */

#gtc-order-bar.gtc-order-bar--flat{
  margin-top: 18px;
  text-align: center;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}

#gtc-order-bar .gtc-order-price-block{
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.1;
}

#gtc-order-bar .gtc-order-amount{
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.5px;
  color: rgba(17,24,39,0.92);
}

#gtc-order-bar .gtc-order-tax{
  margin-top: 6px;
  font-size: 13px;
  font-weight: 500;
  color: rgba(17,24,39,0.45);
  letter-spacing: 0.4px;
}

/* =========================================
   ORDER TOTAL â€“ centrado respecto acordeÃ³n
   ========================================= */

#gtc-order-bar-anchor{
  margin-top: 18px;
  display: flex;
  justify-content: center; /* centra respecto al contenedor */
}

#gtc-order-bar.gtc-order-bar--flat{
  text-align: center;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  width: 100%;
  max-width: 100%; /* respeta el ancho del sidebar */
}

#gtc-order-bar .gtc-order-price-block{
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.1;
}

/* TOTAL */
#gtc-order-bar .gtc-order-label{

    font-weight: 300 !important;
    font-size: 15px !important;
    letter-spacing: 0.12em !important;
    color: #1F2937 !important;     
  text-transform: uppercase;
  
  margin-bottom: 10px;
}

/* Importe */
#gtc-order-bar .gtc-order-amount{
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.6px;
  color: rgba(17,24,39,0.95);
}

/* IVA */
#gtc-order-bar .gtc-order-tax{

  font-size: 12px;
  font-weight: 500;
  opacity: .75;
  margin-top: 6px;
  color: rgba(17,24,39,0.45);
  letter-spacing: 0.4px;
}


/* =========================================
   CENTRADO REAL EN LA COLUMNA SIDEBAR
   ========================================= */

#gtc-order-bar-anchor{
  display: flex;
  justify-content: center;   /* centra horizontalmente */
  width: 100%;
}

/* Le damos un ancho controlado al bloque */
#gtc-order-bar.gtc-order-bar--flat{
  text-align: center;
  width: 100%;
  max-width: 420px;  /* ajusta si quieres mÃ¡s ancho */
}

/* Centrado interno */
#gtc-order-bar .gtc-order-price-block{
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Solo centramos el bloque del TOTAL, sin tocar el resto del sidebar */
.col-sidebar .gtc-sidebar-sticky #gtc-order-bar-anchor{
  width: 100%;
  display: flex;
  justify-content: center;
}

.col-sidebar .gtc-sidebar-sticky #gtc-order-bar.gtc-order-bar--flat{
  width: auto;
  max-width: 420px;
  text-align: center;
  margin-top: 6px;  
}


/* =========================================
   ORDER SUMMARY â€“ 2 columnas (producto + total)
   ========================================= */

#gtc-order-bar.gtc-order-bar--flat{
  padding: 0;
  background: transparent;
  border: 0 !important;
  box-shadow: none !important;
}

#gtc-order-bar .gtc-order-summary{
  width: 100%;
  max-width: 520px;              /* ajusta si quieres mÃ¡s/menos ancho */
  margin: 0px auto 12px auto;      /* âœ… centra en el sidebar */
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

/* Columna izquierda: producto */
#gtc-order-bar .gtc-order-product{
  flex: 1 1 auto;
  font-weight: 300 !important;
  font-size: 15px !important;
  letter-spacing: 0.05em !important;
  color: #1F2937 !important;
  line-height: 1.4;
  text-align: left;  
}

/* Columna derecha: importe */
#gtc-order-bar .gtc-order-price{
  flex: 0 0 auto;
  text-align: right;
  line-height: 1.05;
}

#gtc-order-bar .gtc-order-amount{
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -0.6px;
    color: #232323;
}

#gtc-order-bar .gtc-order-tax{
  margin-top: 6px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(17,24,39,0.45);
}

/* Responsive: en mÃ³vil, que baje a dos lÃ­neas (mÃ¡s legible) */
@media (max-width: 520px){
  #gtc-order-bar .gtc-order-summary{
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  #gtc-order-bar .gtc-order-price{
    width: 100%;
    text-align: left;
  }
}


/* =========================================
   CTA RESERVAR AHORA
   ========================================= */

#gtc-order-bar .gtc-order-cta{
  width: 100%;
  max-width: 520px;
  margin: 20px auto 0 auto;
  display: block;

  padding: 14px 18px;
  border-radius: 10px;
  border: none;

  font-size: 15px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;

  background: #f97316; /* naranja elegante */
  color: #fff;

  transition: all 160ms ease;
  cursor: pointer;
}

/* Hover */
#gtc-order-bar .gtc-order-cta:not(:disabled):hover{
  transform: translateY(-1px);
  opacity: 0.92;
}

/* Estado desactivado */
#gtc-order-bar .gtc-order-cta:disabled{
  background: rgba(0,0,0,0.15);
  color: rgba(0,0,0,0.35);
  cursor: not-allowed;
  transform: none;
}

/* =========================================
   BOTÃ“N RESERVAR AHORA â€“ ancho completo
   ========================================= */

#gtc-boton{
  margin-top: 6px;
}

/* Base */
#gtc-order-cta{
  width: 100%;
  display: block;

  padding: 14px 16px;
  border-radius: 6px;
  border: 2px solid transparent;

  font-size: 15px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;

  transition: all 160ms ease;
}

/* Estado DESACTIVADO (como tu captura gris) */
#gtc-order-cta:disabled{
    background: #F97316;
    color: #FFFFFF;
    /* border-color: #d8d8d8; */
    cursor: not-allowed;
    opacity: 0.3;
}

/* Estado ACTIVO */
#gtc-order-cta:not(:disabled){
  background: #f97316;   /* naranja elegante */
  color: #ffffff;
  cursor: pointer;
}

/* Hover activo */
#gtc-order-cta:not(:disabled):hover{
  opacity: 0.92;
  transform: translateY(-1px);
}


/* =========================================
   HEADERS NO EDITABLES (sin cursor mano)
   ========================================= */

.gtc-acc-disabled > a{
  cursor: default !important;
  pointer-events: none; /* elimina interacciÃ³n real */
}

.gtc-acc-disabled .gtc-acc-chevron{
  opacity: 0.4;
}

/* ===============================
   FIX: TOTAL + PRECIO alineados por baseline
   =============================== */

#gtc-order-bar .gtc-order-summary{
  display: flex !important;
  align-items: baseline !important;      /* ðŸ‘ˆ base tipogrÃ¡fica */
  justify-content: space-between;
}

/* Importante: sin line-height raro que desplace la base */
#gtc-order-bar .gtc-order-product{
  line-height: 1 !important;
  margin: 0 !important;
}

#gtc-order-bar .gtc-order-amount{
  line-height: 1 !important;
  margin: 0 !important;
}


/* =========================================================
   TICKET MEZQUITA - STICKY MOBILE ORDER BAR
   ========================================================= */

@media (max-width: 991px){
  body.ticket-mezquita-page #gtc-order-bar-anchor,
  body.ticket-mezquita-page #gtc-boton{
    position: fixed;
    left: 16px;
    right: 16px;
    z-index: 999;
    margin: 0;
    width: auto;
    max-width: 100%;
    box-sizing: border-box;
    background: transparent !important;
    border-top: 1px solid rgba(17,24,39,0.12);
  }

  body.ticket-mezquita-page #gtc-order-bar-anchor{
    bottom: 62px;
    padding: 10px 14px 8px;
  }

  body.ticket-mezquita-page #gtc-boton{
    bottom: 0;
    padding: 8px 14px calc(8px + env(safe-area-inset-bottom));
    box-shadow: 0 -6px 24px rgba(0,0,0,0.08);
  }

  body.ticket-mezquita-page #gtc-order-bar .gtc-order-summary{
    margin: 0;
    max-width: 100%;
    align-items: center !important;
  }

  body.ticket-mezquita-page #gtc-order-bar .gtc-order-product{
    font-size: 11px !important;
    letter-spacing: .12em !important;
    text-transform: uppercase;
    color: rgba(17,24,39,0.60) !important;
  }

  body.ticket-mezquita-page #gtc-order-bar .gtc-order-price,
  body.ticket-mezquita-page #gtc-order-bar .gtc-order-amount{
    text-align: right !important;
  }

  body.ticket-mezquita-page #gtc-order-bar .gtc-order-amount{
    font-size: 33px;
    font-weight: 800;
    line-height: 1;
  }

  body.ticket-mezquita-page #gtc-order-cta{
    border-radius: 0 !important;
    padding: 12px 14px;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .03em;
  }

  body.ticket-mezquita-page .footer-demo{
    margin-bottom: 146px;
  }
}

@media (max-width: 575px){
  body.ticket-mezquita-page #gtc-order-bar-anchor,
  body.ticket-mezquita-page #gtc-boton{
    left: 10px;
    right: 10px;
  }
  body.ticket-mezquita-page #gtc-order-bar-anchor{
    bottom: 60px;
    padding: 8px 10px 7px;
  }

  body.ticket-mezquita-page #gtc-boton{
    padding: 6px 10px calc(8px + env(safe-area-inset-bottom));
  }

  body.ticket-mezquita-page #gtc-order-bar .gtc-order-summary{
    gap: 8px;
  }

  body.ticket-mezquita-page #gtc-order-bar .gtc-order-product{
    font-size: 10px !important;
  }

  body.ticket-mezquita-page #gtc-order-bar .gtc-order-amount{
    font-size: 29px;
  }

  body.ticket-mezquita-page #gtc-order-cta{
    font-size: 14px;
    padding: 11px 12px;
  }

  body.ticket-mezquita-page .footer-demo{
    margin-bottom: 138px;
  }
}

/* =========================================================
   TICKET MEZQUITA - STICKY CTA GUTTER 15px MOBILE
   ========================================================= */
@media (max-width: 991px){
  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky{
    display: block;
  }

  body.ticket-mezquita-page #gtc-order-bar-anchor,
  body.ticket-mezquita-page #gtc-boton{
    left: 15px !important;
    right: 15px !important;
  }
}

@media (max-width: 575px){
  body.ticket-mezquita-page #gtc-order-bar-anchor,
  body.ticket-mezquita-page #gtc-boton{
    left: 15px !important;
    right: 15px !important;
  }
}

/* =========================================================
   TICKET MEZQUITA - MOBILE FOOTER CTA + POPUP CALENDARIO
   ========================================================= */

#gtc-booking-backdrop,
#gtc-booking-popup-close{
  display: none;
}

#gtc-order-bar .gtc-order-summary--total{
  display: none;
}

#gtc-order-bar .gtc-order-summary--launcher{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin: 0;
  max-width: 100%;
}

#gtc-order-bar .gtc-launcher-left{
  display: flex;
  flex-direction: column;
  min-width: 0;
}

#gtc-order-bar .gtc-launcher-kicker{
  font-size: 12px;
  letter-spacing: .05em;
  font-weight: 500;
  color: rgba(17,24,39,.52);
  text-transform: uppercase;
  line-height: 1.2;
}

#gtc-order-bar .gtc-launcher-price{
  margin-top: 2px;
  font-size: 56px;
  line-height: .95;
  font-weight: 800;
  letter-spacing: -1.5px;
  color: #111827;
}

#gtc-order-bar .gtc-launcher-sub{
  margin-top: 4px;
  font-size: 11px;
  letter-spacing: .04em;
  color: rgba(17,24,39,.52);
  text-transform: uppercase;
}

#gtc-order-bar .gtc-launcher-right{
  flex: 0 0 auto;
  padding-top: 2px;
}

#gtc-order-bar .gtc-launcher-rating{
  font-size: 15px;
  font-weight: 500;
  color: rgba(17,24,39,.82);
  white-space: nowrap;
}

#gtc-order-bar .gtc-launcher-star{
  color: #f3b431;
  font-weight: 700;
}

@media (max-width: 991px){
  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky{
    display: block;
  }

  body.ticket-mezquita-page #gtc-order-bar-anchor,
  body.ticket-mezquita-page #gtc-boton{
    left: 15px !important;
    right: 15px !important;
    background: transparent !important;
    border: 1px solid rgba(17,24,39,.10);
    z-index: 1102;
  }

  body.ticket-mezquita-page #gtc-order-bar-anchor{
    bottom: 74px;
    border-bottom: 0;
    border-radius: 12px 12px 0 0;
    padding: 10px 14px 8px;
  }

  body.ticket-mezquita-page #gtc-boton{
    bottom: 0;
    border-top: 0;
    border-radius: 0 0 12px 12px;
    padding: 8px 14px calc(10px + env(safe-area-inset-bottom));
    box-shadow: 0 -8px 26px rgba(0,0,0,.12);
    display: flex;
    justify-content: flex-end;
  }

  body.ticket-mezquita-page #gtc-order-cta{
    width: 52%;
    min-width: 220px;
    max-width: 360px;
    border-radius: 8px;
    border: 0;
    padding: 13px 14px;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .02em;
    background: #f97316;
    color: #fff;
    opacity: 1;
    text-transform: uppercase;
  }

  body.ticket-mezquita-page #gtc-order-cta:disabled{
    opacity: .45;
  }

  body.ticket-mezquita-page #gtc-booking-backdrop{
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(17,24,39,.46);
    z-index: 1098;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open #gtc-booking-backdrop{
    display: block;
  }

  body.ticket-mezquita-page .gtc-booking-popup-close{
    display: none;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky{
    display: block;
    position: fixed !important;
    top: 74px;
    bottom: 160px;
    left: 15px;
    right: 15px;
    z-index: 2141 !important;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 48px rgba(0,0,0,.24);
    overflow: auto;
    padding: 14px 14px 20px;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .gtc-booking-popup-close{
    display: flex;
    align-items: center;
    justify-content: center;
    position: sticky;
    top: 0;
    margin: 0 0 10px auto;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 8px;
    background: #111827;
    color: #fff;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    z-index: 2;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky{
    display: block !important;
    position: fixed !important;
    top: 10px;
    top: max(10px, env(safe-area-inset-top));
    left: 15px;
    right: 15px;
    bottom: auto;
    height: calc(100vh - 20px);
    height: calc(100vh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    max-height: calc(100dvh - 20px);
    max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    z-index: 2141 !important;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 48px rgba(0,0,0,.24);
    padding: 12px 12px calc(12px + env(safe-area-inset-bottom));
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .gtc-booking-popup-header{
    position: sticky;
    top: 0;
    z-index: 4;
    display: flex;
    justify-content: flex-end;
    margin: 0 0 8px 0;
    padding: 2px 0 8px 0;
    background: #fff;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .gtc-booking-popup-close{
    display: flex;
    align-items: center;
    justify-content: center;
    position: static;
    margin: 0;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(17,24,39,0.16);
    border-radius: 8px;
    background: #fff;
    color: #111827;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
    z-index: 5;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open{
    overflow: hidden;
  }

  body.ticket-mezquita-page .footer-demo{
    margin-bottom: 160px;
  }
}

@media (max-width: 575px){
  #gtc-order-bar .gtc-launcher-price{
    font-size: 48px;
  }

  body.ticket-mezquita-page #gtc-order-cta{
    width: 58%;
    min-width: 190px;
  }

  #gtc-order-bar .gtc-launcher-rating{
    font-size: 13px;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky{
    display: block;
    top: 68px;
    bottom: 152px;
  }
}
/* =========================================================
   DESKTOP RESTORE (CTA only mobile)
   ========================================================= */
@media (min-width: 992px){
  #gtc-order-bar .gtc-order-summary--launcher{
    display: none !important;
  }

  #gtc-order-bar .gtc-order-summary--total{
    display: flex !important;
  }

  #gtc-booking-backdrop,
  #gtc-booking-popup-close{
    display: none !important;
  }

  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky{
    display: block !important;
  }
}
/* =========================================================
   MOBILE LAUNCHER + BOOKING POPUP (CANONICAL)
   ========================================================= */
#gtc-mobile-reserve-launcher,
#gtc-booking-backdrop{
  display: none;
}

.gtc-booking-popup-header{
  display: none;
}

@media (max-width: 991px){
  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky{
    display: block !important;
  }

  /* Oculta cabecera de precio del sidebar en mÃ³vil (se usa el launcher fijo) */
  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky > span.fs-15,
  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky .gtc-price-block{
    display: none !important;
  }

  body.ticket-mezquita-page:not(.gtc-booking-popup-open) .col-sidebar .gtc-sidebar-sticky > span.fs-15,
  body.ticket-mezquita-page:not(.gtc-booking-popup-open) .col-sidebar .gtc-sidebar-sticky .gtc-price-block,
  body.ticket-mezquita-page:not(.gtc-booking-popup-open) .col-sidebar .gtc-sidebar-sticky .gtc-booking-popup-header,
  body.ticket-mezquita-page:not(.gtc-booking-popup-open) .col-sidebar .gtc-sidebar-sticky #gtc-booking-popup-close,
  body.ticket-mezquita-page:not(.gtc-booking-popup-open) .col-sidebar .gtc-sidebar-sticky #gtc-step-calendar,
  body.ticket-mezquita-page:not(.gtc-booking-popup-open) .col-sidebar .gtc-sidebar-sticky #gtc-step-hour,
  body.ticket-mezquita-page:not(.gtc-booking-popup-open) .col-sidebar .gtc-sidebar-sticky #gtc-step-people,
  body.ticket-mezquita-page:not(.gtc-booking-popup-open) .col-sidebar .gtc-sidebar-sticky #gtc-order-bar-anchor,
  body.ticket-mezquita-page:not(.gtc-booking-popup-open) .col-sidebar .gtc-sidebar-sticky #gtc-boton{
    display: none !important;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher{
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    bottom: 0 !important;
    z-index: 2140 !important;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 20px calc(0px + env(safe-area-inset-bottom));
    background: #fff;
    border-top: 1px solid rgba(17,24,39,0.06);
    box-shadow: 0 -8px 30px rgba(0,0,0,0.12);
    pointer-events: auto;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__price{
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 2px;
    min-width: 0;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__label{
    font-size: 10px;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: rgba(17,24,39,0.58);
    line-height: 1.15;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__label.fs-8{
    font-size: 9px !important;
    letter-spacing: .05em;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__amount{
    margin-top: 1px;
    font-size: 50px;
    line-height: .9;
    font-weight: 800;
    color: #000;
    letter-spacing: -1px;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__cta{
    flex: 0 0 50%;
    min-width: 156px;
    max-width: 210px;
    width: 42%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 7px;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__reviews{
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 10px;
    line-height: 1.15;
    color: rgba(17,24,39,0.82);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__reviews i{
    flex: 0 0 auto;
    color: #f4b740;
    font-size: 13px;
    line-height: 1;
    margin-top: -1px;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__reviews-score{
    font-weight: 700;
    color: #111827;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__reviews-meta{
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__btn{
    width: 100%;
    border: 0;
    border-radius: 10px;
    background: #f97316;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
    padding: 15px 12px;
    box-shadow: 0 4px 14px rgba(249,115,22,0.35);
    transition: transform .15s ease, box-shadow .15s ease;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__btn:active{
    transform: scale(0.97);
    box-shadow: 0 2px 8px rgba(249,115,22,0.25);
  }

  body.ticket-mezquita-page #gtc-booking-backdrop{
    display: none !important;
    position: fixed !important;
    inset: 0;
    background: rgba(17,24,39,0.46);
    z-index: 2130 !important;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open #gtc-booking-backdrop{
    display: block !important;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open #gtc-mobile-reserve-launcher{
    display: none !important;
  }

  body.ticket-mezquita-page .gtc-booking-popup-close{
    display: none;
  }



  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky{
    display: block !important;
    position: fixed !important;
    top: 10px;
    top: max(10px, env(safe-area-inset-top));
    left: 15px;
    right: 15px;
    bottom: auto;
    height: calc(100vh - 20px);
    height: calc(100vh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    max-height: calc(100dvh - 20px);
    max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    z-index: 2141 !important;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 48px rgba(0,0,0,.24);
    padding: 12px 12px calc(12px + env(safe-area-inset-bottom));
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .gtc-booking-popup-header{
    position: sticky;
    top: 0;
    z-index: 4;
    display: flex;
    justify-content: flex-end;
    margin: 0 0 8px 0;
    padding: 2px 0 8px 0;
    background: #fff;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .gtc-booking-popup-close{
    display: flex;
    align-items: center;
    justify-content: center;
    position: static;
    margin: 0;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(17,24,39,0.16);
    border-radius: 8px;
    background: #fff;
    color: #111827;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
    z-index: 5;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open{
    overflow: hidden;
  }

  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky #gtc-order-bar-anchor,
  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky #gtc-boton{
    position: static !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
  }

  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky #gtc-order-bar .gtc-order-summary{
    margin: 16px 0 20px 0 !important;
    max-width: 100% !important;
  }

  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky #gtc-order-bar .gtc-order-product{
    font-size: 11px !important;
    letter-spacing: .10em !important;
    text-transform: uppercase;
    color: rgba(17,24,39,0.60) !important;
  }

  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky #gtc-order-bar .gtc-order-amount{
    font-size: 32px !important;
    font-weight: 800;
    line-height: 1;
  }

  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky #gtc-order-cta{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    border-radius: 12px !important;
    padding: 12px 14px;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .03em;
  }

  body.ticket-mezquita-page #gtc-order-bar .gtc-order-summary--launcher{
    display: none !important;
  }

  body.ticket-mezquita-page #gtc-order-bar .gtc-order-summary--total{
    display: flex !important;
  }

  body.ticket-mezquita-page .footer-demo{
    margin-bottom: 126px;
  }
}

@media (max-width: 575px){
  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__amount{
    font-size: 42px;
    padding-bottom: 4px;
    padding-top: 4px;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__cta{
    min-width: 146px;
    width: 44%;
    max-width: 190px;
    gap: 6px;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__btn{
    width: 100%;
    font-size: 14px;
    padding: 12px 10px;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__reviews{
    font-size: 10px;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__label.fs-8{
    font-size: 8.8px !important;
    letter-spacing: .03em;
  }
}

@media (max-width: 380px){
  body.ticket-mezquita-page #gtc-mobile-reserve-launcher{
    gap: 12px;
    padding: 11px 14px calc(9px + env(safe-area-inset-bottom));
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__amount{
    font-size: 38px;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__cta{
    min-width: 132px;
    width: 41%;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__btn{
    width: 100%;
    font-size: 13px;
  }

  body.ticket-mezquita-page #gtc-mobile-reserve-launcher .gtc-mobile-reserve-launcher__reviews{
    font-size: 9px;
    gap: 4px;
  }
}

@media (min-width: 992px){
  #gtc-mobile-reserve-launcher,
  #gtc-booking-backdrop,
  #gtc-booking-popup-close{
    display: none !important;
  }

  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky{
    display: block !important;
  }

  /* En escritorio el bloque de precio debe permanecer visible */
  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky > span.fs-15{
    display: inline-block !important;
  }

  body.ticket-mezquita-page .col-sidebar .gtc-sidebar-sticky .gtc-price-block{
    display: block !important;
  }

  #gtc-order-bar .gtc-order-summary--total{
    display: flex !important;
  }
}


/* =========================================================
   MOBILE POPUP POLISH - FULL HEIGHT + VISIBLE CLOSE
   ========================================================= */
@media (max-width: 991px){
  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky{
    top: max(6px, env(safe-area-inset-top)) !important;
    right: 15px !important;
    bottom: max(6px, env(safe-area-inset-bottom)) !important;
    left: 15px !important;
    height: auto !important;
    max-height: none !important;
    padding: 8px 20px calc(10px + env(safe-area-inset-bottom)) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky > span.fs-15,
  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky > .gtc-price-block{
    display: none !important;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky .gtc-booking-popup-header{
    display: flex !important;
    position: sticky !important;
    top: 0 !important;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 38px;
    margin: 0 !important;
    padding: 0 0 6px 0 !important;
    background: #fff;
    z-index: 2200 !important;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .gtc-booking-popup-header__label{
    display: inline-block;
    font-size: 16px;
    line-height: 1;    
    text-transform: uppercase;
    font-weight: 700;
    color: #000;
    white-space: nowrap;
  letter-spacing: .04em;    
  }

  body.ticket-mezquita-page.gtc-booking-popup-open #gtc-booking-popup-close{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative;
    z-index: 2201 !important;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open #gtc-booking-popup-close .gtc-booking-popup-close__icon{
    width: 16px;
    height: 16px;
    display: block;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open #gtc-booking-popup-close .gtc-booking-popup-close__icon line{
    stroke: #111827;
    stroke-width: 2;
    stroke-linecap: round;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky #gtc-step-calendar,
  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky #gtc-step-calendar.pt-2,
  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky #gtc-accordion{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky > .gtc-booking-popup-header + #gtc-step-calendar{
    margin-top: 0 !important;
    padding-top: 2px !important;
  }
}






@media (max-width: 991px){
  /* Header del popup en flujo normal (sin sticky/fixed) */
  body.ticket-mezquita-page.gtc-booking-popup-open .col-sidebar .gtc-sidebar-sticky .gtc-booking-popup-header{
    position: static !important;
    top: auto !important;
    z-index: auto !important;
    margin-top: -20px!important;
  }

  body.ticket-mezquita-page.gtc-booking-popup-open #gtc-booking-popup-close{
    position: static !important;
    top: auto !important;
  }
}
