body {
    /*overflow-x:visible;*/
}

#btnOcult {
    display: none !important
}

#co {
    /*min-width: 800px;*/
}

#headMain {
    background-color: #eee;
    padding: 7px 0;
    height: 110px;
}

#mod_perfil {
    display: none !important;
}

#bscCabecera {
    margin: 0 auto;
    width: 740px;
}

#bscCabecera .sty32 {
    display: block;
    float: left;
    margin-right: 5px;
    cursor: pointer;
    font-size: 12px;
    margin-top: 5px;
}

.busCabe {
    margin-top: 10px;
    width: 220px;
}

.sty4 {
    float: left;
    width: 70%;
}

.sty4 .twitter-typeahead {
    margin-bottom: 5px;
}

.sty4 .twitter-typeahead .tt-hint,
.sty4 .twitter-typeahead,
.sty4 #bsc {
    width: 100%
}

.sty4 #bsc {
    color: #b84f60
}

#bscCabecera .sty32 {
    clear: none !important;
    margin-left: 0px !important;
    margin-right: 15px !important
}

.sty5 {
    float: left;
}

#btnBuscar {
    padding: 4px 27px;
}

.foot {
    display: none !important
}

#container {
    /*overflow: hidden;min-height:1200px;*/
}

.btnListado {
    overflow: hidden;
    margin: 12px 0;
}

.btnListado .icon-list,
.btnListado .icon-map {
    float: left;
    color: #666666;
    display: block;
    background-position: 71px 4px;
    background-color: #f6f6f6;
    border: 1px solid #ccc;
    width: 83px;
    height: 20px;
    padding: 5px 0 0 10px;
    margin-right: 8px;
    text-decoration: none;
    display: none;
}

.icon-list {
    background-image: url(../images/icon_menu.png);
}

.icon-map {
    background-image: url(../images/icon_mapa.png);
}

#ordPor {
    top: 10px;
    overflow: visible;
    position: absolute;
    right: 7px;
    z-index: 55;
    font-size: 12px;
    display: flex;
    gap: 40px;
    font-size: 14px;
    align-content: center;
    justify-content: center;
    align-items: center;
}

#ordPor .nav-pills {
    margin: 0;
}

#ordPor .nav-pills .dropdown {
    border: 0;

}

#ordPor .nav-pills .dropdown .arrowsSession {
    height: 18px;
    background-position-y: 8px;
}

#ordPor .nav-pills .dropdown-toggle {
    background-color: #fff;
    margin-right: 0;
    padding: 8px 0;
    text-align: right;
    padding-right: 35px;
}

#ordPor .dropdown-menu>.active {
    background: #fff !important;
}

#ordPor a {
    color: #666;
    font-weight: normal;
}

#ordPor .arrowsSession {
    margin-left: 10px;
}

#ordPor .dropdown-menu>.active>a,
#ordPor .dropdown-menu>.active>a:hover,
#ordPor .dropdown-menu>.active>a:focus {
    background: #fff;
}

#cont {
    /*min-width:740px;*/
    max-width: 900px;
    margin: 0 auto 70px auto;
    position: relative;
}

#listResult {
    margin-bottom: 70px;
}

#listResult a:hover {
    color: #b84f60;
    text-decoration: none;
}

#listResult a:focus {
    text-decoration: none;
}

#listResult ul {
    margin: 0;
}

#listResult ul li {
    overflow: hidden;
    position: relative;
    display: block;
    border-top: 1px solid #ddd;
    padding: 20px 0;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
}

.imglist {
    width: 280px;
    margin: 10px 20px 10px 0;
    height: auto;
    flex-basis: 32%;
    flex-grow: 0;
    flex-shrink: 0;
}

.imglist img {
    width: 100%;
}

/*height:120px;*/
/*.imglist img{height: 120px;}*/


.datRow {
    display: flex;
    flex-direction: column;
}

.contentEsta {
    color: #88848a;
    line-height: 22px;
    position: relative;
}

.contentEsta h3 {
    margin: 0;
    font-size: 22px;
    color: #222;
}

.contentEsta h3:hover {
    color: #b84f60 !important;
}

.enlRow {
    position: absolute;
    right: 0;
    top: 10px;
}

.enlRow .ng {}


.mostrarMapa {
    position: relative;
    display: none;
}

.mostrarMapa a,
.addFavoritos a {
    display: block;
    width: 20px;
    text-indent: -99999px;
    border: 0;
    position: relative;
}

.addFavoritos a,
.addFavoritos a:hover,
.addFavoritos a:focus {
    color: #b84f60;
    border: 0 !important;
    width: 20px;
}

.addFavoritos.active a {
    color: #b84f60;
}

.mostrarMapa a:hover,
.addFavoritos a:hover {
    text-decoration: none;
}

.mostrarMapa:after {
    position: absolute;
    z-index: 10;
    display: block;
    top: 0;
    right: 0;
    width: 20px;
    content: "";
    background: url(../images/marker.png) no-repeat;
    height: 18px;
}

.mostrarMapa:hover:after,
.mostrarMapa.active:after {
    content: '';
    background-image: url(../images/markerV.png)
}



.addFavoritos a:after {
    position: absolute;
    z-index: 10;
    display: block;
    top: 0px;
    right: 0;
    width: 20px;
    content: " ";
    background: url(../images/estrella-null.png) no-repeat;
    height: 18px;
}

.addFavoritos a:hover:after,
.addFavoritos.active a:after {
    content: '';
    background-image: url(../images/estrellaV.png)
}

.addFavoritos .nofa:after {
    content: "";
    display: none;
    background: none;
}

.btnReservar {
    overflow: hidden;
    margin-top: 11px;
}

.btnReservar a {
    padding: 4px 15px !important;
}

.btnReservar a:hover {
    color: #fff !important;
}

.filInt {
    width: 100%;
    position: relative;
}

.preMedio {
    margin-top: 20px;
}

.preMedio ul li {
    text-align: center;
    width: 110px !important;
    float: left;
    padding-left: 0 !important;
}

.preMedio ul li:nth-child(2n+1) {
    margin-right: 4px !important;
}

.arrowTop {
    background: url(../images/arrow1.png) no-repeat 200px 8px;
}

.arrowBottom {
    background: url(../images/arrow2.png) no-repeat 200px 8px;
}

.tabDispo {
    padding: 10px 10px 10px 38px;
    border-bottom: 1px solid #ccc;
    cursor: pointer;
}

.tabFil {
    padding: 10px;
    text-align: center;
    border-bottom: 1px solid #ccc;
}

.tabFilF {
    padding: 10px;
    text-align: center;
    border-bottom: 1px solid #ccc;
    cursor: pointer;
}



.listFil+div {
    overflow: hidden;
}

.listFil>div {
    border-bottom: 1px solid #eee;
    padding: 15px 0;
    position: relative;
}

.listFil>div>span {
    font-weight: 600;
    font-size: 17px;
    position: relative;
}

.listFil ul {
    overflow: hidden;
    margin: 7px 0 0;
}

.listFil ul li {
    list-style: none;
    border-radius: 2px;
    margin-bottom: 5px;
    display: block;
    cursor: pointer;
    line-height: 1.5;
    padding: 2px 10px 2px 0;
    font-size: 13px;
    position: relative;
}

.listFil ul li:hover,
.listFil ul li.active {
    color: #b84f60;
}

.listFil ul li.active {
    padding-left: 35px;
}

.listFil ul li.active:before {
    content: '⟶';
    position: absolute;
    left: 3px;
}

.btnVolver {
    display: block;
    padding: 10px 10px 10px 60px;
    cursor: pointer;
    background: url(../images/flecha_atras.png) no-repeat 24px 12px;
    color: #444;
}

.btnVolver:hover {
    text-decoration: none;
}

.motorDispo {
    padding: 10px;
    background: #fff;
}

#fecha {
    cursor: pointer;
}

.motorDispo .inputB {
    width: 90%;
    margin-bottom: 0;
    margin-left: 5%;
    text-align: center;
    border-radius: 2px;
    padding: 5px 0;
}

.motorDispo .selectB {
    width: 140px;
    float: right;
    margin-bottom: 0;
    display: inline-block;
    padding: 4px;
    font-size: 13px;
    line-height: 18px;
    color: #808080;
}

.comCen {
    overflow: hidden;
}

.comCen .comida,
.comCen .cena {
    color: #88848a;
    padding: 5px 0;
    float: left;
    width: 49%;
    text-align: center;
    background: #fff;
    border: 1px solid #ccc;
    font-size: 12px;
}

.comCen .comida:hover,
.comCen .cena:hover,
.comCen .active {
    background-color: #CBCBCB;
    color: #000;
    text-decoration: none;
    border: 1px solid #8F8F8F;
}

.fechHora {
    margin-top: 20px;
    overflow: hidden;
    clear: both;
}


#motorPredic input {
    width: 95%;
}

#motorPredic span {
    width: 100%;
}

#motorPredic li,
.sty4 li {
    border: 0;
    background: none;
    width: 100%;
    height: 100%;
    padding: 0;
}

.person {
    margin-top: 20px;
    overflow: hidden;
}

.person .bntMM {
    float: left;
    margin-right: 5px;
    font-size: 21px;
    color: #333;
    background: #fff;
    border: 1px solid #ccc;
    width: 28px;
    text-align: center;
    border-radius: 2px;
}

.btnDis {
    background-color: #eee !important;
    border: 1px solid #ccc !important;
    color: #ccc !important;
}

.person .bntMM:hover {
    text-decoration: none;
}

.person label {
    padding-top: 5px;
    width: 75px;
    float: left;
    margin-right: 13px;
}

.person input {
    float: left;
    width: 30px;
    margin-right: 5px;
    text-align: center;
    margin-bottom: 0;
}

#motorLocalidad {
    clear: both;
}

#motorPredic .rowPre,
#bscCabecera .rowPre {
    font-size: .9em;
}

#motorPredic .tt-suggestion,
#bscCabecera .tt-suggestion {
    padding: 3px 10px;
}

.botonesfiltro {
    width: 100%;
    border: 0;
    display: flex;
    gap: 20px;
}

.botonesfiltro input {}

.verMas {
    text-align: center;
    display: block;
    position: absolute;
    color: #333;
    background: #fff;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    padding: 0 !important;
    border: 1px solid #ccc;
    top: 20px;
    right: 0;
    text-decoration: none
}

.verMas:hover {
    text-decoration: none;
}

.verMas:before {
    font-size: 17px;
    color: #666;
    display: block;
    margin-top: -3px;
    text-decoration: none
}

.verMas.oculto:before {
    content: "+";

}

.verMas.visible:before {
    content: "-";
}

#resultGrid {
    padding-top: 0;
}

#resultGrid .thumbnails li {
    margin: 0;
    float: none;
}

#resultGrid .thumbnails li:last-child {
    border-bottom: 1px solid #ccc;
}

#resultGrid .pagination {
    overflow: hidden;
    text-align: center;
}

#resultGrid .pagination ul li {
    float: left;
    border-top: 0
}

#resultGrid .summary {
    left: 5px;
    top: 18px;
    position: absolute;
    color: #88848a;
    font-size: 13px;
}

#bloqFavo {
    float: right;
    width: 19.5%;
    min-width: 249px;
    margin-bottom: 50px;
    display: none !important;
}

.favoInt {
    float: right;
    width: 249px;
    margin-top: 15px;
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    background-color: #f2f2f2;
}

.listFavo {
    min-height: 46px;
    background-color: #fff;
}

.listFavo ul {
    list-style: none;
    margin: 0;
}

.listFavo li {
    position: relative;
    height: 36px;
    overflow: hidden;
    display: block;
    background: #fff;
    font-size: 12px;
    line-height: 18px;
    padding: 5px;
    border-bottom: 1px solid #ccc;
}

.listFavo li:hover {
    background: #eee;
}

.listFavo li:hover .iconDelete18,
.listFavo li:hover .iconDelete19 {
    display: block;
}

.listFavo li a {
    color: #333333;
}

.listFavo li a:hover,
.listFavo li a:focus {
    text-decoration: none;
    color: #b84f60;
}

.listFavo li:last-child {
    border-bottom: 0;
}

.listFavo .imglistFav {
    float: left;
    width: 55px;
}

.listFavo .detListFav {
    float: left;
    width: 140px;
    margin-left: 10px;
    overflow: hidden;
}

.detListFav a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.detListFav span {
    clear: both;
    display: block;
}

.iconDelete18,
.iconDelete19 {
    display: none;
    cursor: pointer;
    position: absolute;
    width: 10px;
    height: 10px;
    background: url(../images/cancel10.png);
    top: 9px;
    right: 25px;
}

.noFar {
    font-size: 12px;
    padding: 10px;
    text-align: center;
}

.bloqsInf {
    float: right;
    width: 249px;
    margin-top: 15px;
    display: none;
}

.bloqsInf>div {
    float: right;
    width: 237px;
    margin-bottom: 20px;
    height: 54px;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    background-color: #f2f2f2;
    font-size: 20px;
    padding: 6px;
    display: none;
}

.bloqApp {
    background: url(../images/qr-app-min.png) no-repeat 150px 6px;
}

.bloqApp span {
    color: #b84f60;
    font-size: 18px
}

.bloqApp p {
    width: 140px;
    text-align: right;
    margin: 7px 0 0 0px;
}

.icons {
    overflow: hidden;
    position: relative;
}

.iconRD {
    position: absolute;
    top: 5px;
    left: 30px;
    width: 55px;
}

.iconRI {
    position: absolute;
    top: 30px;
    left: 30px;
    width: 55px;
}

.iconT {
    position: absolute;
    top: 22px;
    left: 95px;
}

.bloqsInf .icons {
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    background-color: #f2f2f2;
}

.oneLine {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

/***********FICHA*****************/
.fichaTop {
    overflow: hidden;
    margin-top: 15px;
    border: 1px solid #ccc;
    position: relative;
}

.cabFichaTop {
    padding: 5px 10px;
}

.cabFichaTop h1 {
    font-size: 26px;
    line-height: 26px;
    margin: 0 0 5px
}

.cabFichaTop h3 {
    font-size: 14px;
    font-weight: normal;
    line-height: 14px;
    margin: 0 0 5px;
    display: inline-block;
}

.cabFichaTop .rds {
    float: right;
    position: relative;
    width: 342px;
}

.imgRes {
    background: #f2f2f2;
    overflow: hidden;
    clear: both;
}

.btn-inverse {
    background: #000;
    border: 1px solid #000;
    border-radius: 20px;
    padding: 10px;
}

.btn-inverse:hover {
    background: #fff;
    border: 1px solid #b84f60;
    color: #b84f60
}

.btn {
    background: #fff;
    border: 1px solid #666;
    border-radius: 20px;
    padding: 10px;
    color: #333
}

.btn:hover {
    background: #fff;
    border: 1px solid #b84f60;
    color: #b84f60
}


.btn-inverse {
    background: #000;
    border: 1px solid #000;
    border-radius: 20px;
    padding: 10px;
    color: #fff;
}

.btn-inverse:hover {
    background: #fff;
    border: 1px solid #b84f60;
    color: #b84f60
}

.btnDet {
    float: left;
    width: 29.7%;
    border-top: 1px solid #ccc;
    position: relative;
    height: 300px;
}

.btnDet .notaGP {
    width: 100%;
    height: 58px;
    text-align: center;
    font-weight: bold;
    margin: 22px auto 0 auto;
    padding: 14px 0 0px 0;
    color: #000;
}

.btnDet .notaGP .notaGP1 {
    font-size: 2.5em;
    line-height: 0.9em;
}

.btnDet .notaGP .notaGP1:after {
    content: "/10";
    font-size: 0.5em
}

.btnDet .opiRst {
    display: block;
}

.btnDet .saborea {
    width: 100%;
    height: 48px;
    text-align: center;
    font-weight: bold;
    margin: -20px auto 0 auto;
    padding: 0px 0 0px 0;
    color: #000;
}

.fb-like {
    overflow: hidden !important;
}

#btnReservarF {
    display: block;
    font-size: 16px;
    padding: 4px 45px;
    width: 28%;
    margin: 13px auto 0 auto;
}

.rds .fb-like {
    float: left;
    width: 130px;
}

.rdsInt {
    height: 95px;
    margin-top: 30px;
}

.rdsInt .fb-like {
    margin-left: 27%;
    width: 45% !important;
    text-align: center;
}

.rdsInt #twitter-widget-0 {
    display: block;
    width: 105px !important;
    margin: 0px auto 5px auto;
}

.rdsInt #___plusone_0,
.rdsInt #___plusone_0 iframe {
    width: 105px !important;
    display: block !important;
    margin: 0 auto !important;
}

.lnkEs,
.lnkEs:hover {
    color: #7EAF1F;
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 0;
    margin-top: 6px;
    font-size: 1.2em;
}

.lnkFa,
.lnkFa:hover,
.lnkFa:focus,
.lnkFa:active,
#anf,
#anf:hover {
    color: #000;
    outline: none;
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 0;
    font-size: 1.2em;
}

#anf.btn-link:focus {
    color: #000;
    outline: thin dotted transparent;
}


#allInfo {
    margin-top: 10px;
    font-size: 1em;
}

#allInfo .tab-content {
    margin-bottom: 35px;
    border: 1px solid #ccc;
}

#allInfo .tab-content .tab-pane {
    padding: 15px;
    overflow: hidden;
}

#allInfo .tab-content #mapa.tab-pane {
    padding: 0;
}

#allInfo .nav-tabs {
    border-bottom: 0;
}

#allInfo .nav-tabs li:first-child {
    margin-left: 0;
}

#allInfo .nav-tabs li {
    /*width:194px;*/
    width: 182px;
    text-align: center;
    margin-left: 8px;
}

#allInfo .nav-tabs li a {
    /*width:167px;*/
    width: 150px;
    margin-bottom: 0;
    color: #555555;
    background-color: #f2f2f2;
    border: 1px solid #ddd;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
}

#allInfo .nav-tabs li.active a {
    border-bottom: 0;
    background-color: #fff;
    border-bottom: 1px solid #fff;
}

#tabReservar a {
    background-color: #b84f60 !important;
    color: #fff !important;
}

#reservar {
    height: 100%;
}

.infoIzq,
.infoDer {
    float: left;
    width: 48%;
}

.infoIzqB {
    width: 99%;
}

.infoIzq {
    padding-right: 2%;
}

.infoIzq>div,
.infoIzqB>div {
    padding-bottom: 15px;
}

.infoDer {
    padding-left: 2%;
}

.titInfo,
.titCar {
    color: #88848a;
    font-weight: bold;
    border-bottom: 1px solid #88848a;
    display: block;
    margin-bottom: 10px;
}

.listaNone ul {
    list-style: none;
    margin: 0;
}

.cart {
    background-color: #f2f2f2;
    padding: 10px;
    border: 1px solid #ccc;
}

.widSSP {
    width: 100% !important;
}

.ocultar {
    display: block;
}

#btnAtrasFi {
    margin-bottom: 20px;
}

.topCom {
    overflow: hidden;
    border-bottom: 1px solid #cccccc;
    padding: 20px 0
}

.blNotG {
    background: #f2f2f2;
    margin: 10px;
    border-radius: 8px;
}

.blNotG .notaG {
    color: #b84f60;
    font-weight: bold;
    font-size: 3.5em;
    line-height: 1em;
    text-align: center;
    padding-top: 15px;
}

.blNotG .notaG:after {
    content: "/10";
    font-size: 0.3em
}

.blNotG .startG {
    width: 167px;
    margin: 0 auto;
}

.blNotG .votus {
    display: inline-block;
    text-align: center;
    width: 100%;
    margin: 5px 0 18px 0;
}

.resuVal {
    font-weight: bold;
    margin-top: 10px;
}

.votvalo {
    margin: 5px 0
}

.votvalo span {
    width: 120px;
    display: inline-block;
}

.votvalo img {
    width: 20px;
    height: 20px;
}

.ordCom {
    overflow: hidden;
    padding: 10px 0;
    border-bottom: 1px solid #cccccc
}

.ordPor {
    float: left;
}

.escCom {
    float: right;
}

.escCom a {
    font-size: 1em;
    color: #fff;
}

.oneComent {
    padding: 15px 0;
    border-bottom: 1px solid #cccccc
}

.datUs {
    width: 160px;
    float: left;
}

.datUs span {
    display: block;
}

.datUs .nomCom {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    display: block;
    font-weight: bold;
}

.comentUs {
    width: 570px;
    float: left;
    margin-left: 20px;
    position: relative;
    overflow: hidden;
}

.utiCom {
    margin-top: 5px;
    font-size: 0.9em;
    color: #656565;
}

.utiCom a {
    line-height: 15px;
    padding: 0 10px;
}

.utiCom .btnUtils {
    display: inline-block;
}

.respEst {
    margin-top: 10px;
    font-size: 0.9em;
    color: #656565;
    line-height: 1.5em;
    border-top: 1px solid #cccccc;
    padding-top: 5px;
}

.respEst span {
    font-weight: bold;
}

.bloNot {
    float: right;
    width: 100px;
}

.bloNot .notOneCom {
    font-size: 2.5em;
    color: #b84f60;
    display: inline-block;
    width: 100%;
    text-align: center;
    margin-top: 20px;
}


#formComentar {
    margin-bottom: 0
}

.txtAreCom {
    margin-top: 30px;
    clear: both;
}

.txtVal {
    float: left;
    margin-top: 8px;
    display: block;
    width: 172px;
    clear: both;
}

.start-common {
    background: url(../images/rating_not.png) no-repeat;
    width: 30px;
    height: 30px;
    background-size: 30px 30px;
    display: inline-block;
    cursor: pointer;
}

.start-common.active,
.start-common.ac {
    background: url(../images/rating.png) no-repeat;
    background-size: 30px 30px;
}

.allcabop {
    overflow: hidden;
}

.puntOnco {
    width: 345px;
    float: left;
}

.nota {
    height: 165px;
    float: right;
    width: 160px;
    position: relative;
}

.nota span {
    display: block;
    text-align: center;
    color: #b84f60;
    font-weight: bold;
    font-size: 3em;
    line-height: 1em;
    margin-top: 72px;
}

.modal-body {
    overflow: hidden;
    max-height: 414px;
}

#resultComent .summary {
    text-align: left;
}

.countLikes {
    position: relative;
    display: inline-block;
    height: 17px;
}

.countLikes .popover {
    display: block;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
    top: 1px;
    z-index: 50;
}

.countLikes .popover-content {
    padding: 0 7px 0 7px;
}

.countLikes .arrow {
    left: -10px !important;
    margin-top: -5px !important;
    border-width: 5px !important;
    background: #fff;
}

/***********Botones ocultos**************/
#btnOcult {
    width: 825px;
    margin: 0 auto;
    position: relative;
}

#btnColumIz {
    width: 120px;
    padding: 10px 0;
    left: 30px;
    position: absolute;
    top: 85px;
    display: none;
}

#btnColumDe {
    width: 120px;
    padding: 10px 0;
    right: 50px;
    top: 85px;
    position: absolute;
    display: none;
}


/****************************************/


/***************Checkbox**********/
input[type="checkbox"] {
    margin-top: 1px;
    position: absolute;
    height: 14px;
    width: 14px;
    z-index: -1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
}

input[type="checkbox"]+label:before {
    background: #fff;
    content: "";
    display: block;
    float: left;
    width: 14px;
    height: 14px;
    border: 1px solid #ccc;
    margin-top: 1px;
    border-radius: 2px;
    margin-right: 8px;
}

input[type="checkbox"]+label.checkbox-on:before {
    content: '';
    background: url(../images/check-on-gris.png) #fff 2px 2px no-repeat;
    border: 1px solid #333333;
}

input[type="checkbox"]+label {
    margin-left: 0 !important;
}


@media screen and (min-width: 260px) and (max-width: 1279px) {
    #btnColumDe {
        display: block;
    }

    #bloqFavo {
        display: none;
        min-width: 250px;
        width: 236px;
        position: absolute;
        right: 0;
        top: 156px;
        z-index: 9999;
        background: #fff;
        display: none !important;
    }

    #bloqFavo.active {
        display: block;
        display: none;
    }

    #bloqFavo .favoInt {
        margin-top: -1px;
    }

    .bloqApp {
        display: none;
    }

    .bloqsInf .icons {
        margin-bottom: 0;
    }

    #headMain {
        height: 130px;
    }

    .contentEsta {
        width: 370px;
    }

    .enlRow {
        width: 173px;
    }

    #langContainer {
        top: 57px;
        right: 25px;
    }
}

@media screen and (min-width: 260px) and (max-width: 1040px) {
    #btnAtrasFi {
        display: none;
    }


    #btnColumIz {
        display: block;
    }


}

/*Tooltip redes sociales*/
.ui-tooltip {
    display: none !important;
}


/* Airbnb-inspired Redesign Overrides */
/* Typography & Reset bits */
body {
    font-family: 'Circular', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif;
    color: #222;
    background-color: #fff;
    font-size: 16px;
    line-height: 1.43;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #222;
    font-weight: 600;
}

a {
    color: #222;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* Layout Containers */
.airbnb-container {
    max-width: 1120px;
    max-width: 100%;
    width: 900px;
    margin: 0 auto;
    padding: 24px;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    background: #fff;
    /* Ensure strict white background */
}

/* Header */
.listing-header {
    width: 100%;
    padding: 24px 0;
    margin-bottom: 0;
    border-bottom: none;
}

.listing-header h1 {
    font-size: 26px;
    line-height: 30px;
    margin-bottom: 4px;
    font-weight: 600;
}

.listing-subtitle {
    font-size: 14px;
    color: #222;
    font-weight: 500;
    text-decoration: underline;
    margin-top: 0;
}

/* Gallery */
.listing-gallery {
    width: 100%;
    margin-bottom: 48px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}

/* Force Carousel to look rounded */
#myCarousel {
    border-radius: 12px;
    overflow: hidden;
}

#myCarousel .item img {
    width: 100%;
    object-fit: cover;
    height: 480px;
    /* specific height for uniformity */
}

/* Main Content Area (Left Column) */
.listing-main {
    width: 58.333%;
    /* approx 7 cols */
    padding-right: 48px;
    box-sizing: border-box;
    float: left;
    /* Fallback */
    position: relative;
}

/* Details Sections */
.listing-details {
    padding-top: 32px;
}

.section-info,
.section-map,
.section-reviews,
.section-reservation,
.section-amenities {
    padding: 24px 0;
    /*border-bottom: 1px solid #dddddd;*/
}

.section-title {
    font-size: 22px;
    font-weight: 600;
    padding-bottom: 24px;
    margin: 0;
}

.section-divider {
    border: 0;
    border-top: 1px solid #dddddd;
    margin: 32px 0;
}

/* Amenities List */
.amenities-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
}

.amenities-list li {
    width: 50%;
    margin-bottom: 16px;
    font-size: 16px;
    padding-left: 0;
    /* Reset */
    position: relative;
    display: flex;
    align-items: center;
}

.amenities-list li:before {
    /* content: '?'; */
    /* Optional icon */
    /* margin-right: 10px; */
}

/* Sidebar (Right Column) */
.listing-sidebar {
    width: 33.3333%;
    /* approx 4 cols */
    margin-left: 8.3333%;
    /* spacer */
    float: right;
    position: relative;
}

.sidebar-sticky {
    position: sticky;
    top: 80px;
    /* Sticky effect */
    border: 1px solid #dddddd;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
    background: #fff;
    margin-top: 32px;
}

/* Sidebar Elements */
.sidebar-block {
    margin-bottom: 16px;
}

.back-link a {
    color: #717171;
    font-size: 14px;
    font-weight: 500;
    display: inline-block;
    margin-bottom: 16px;
}

.price-info {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 24px;
}

/* Availability Motor Override */
/* Assuming the included layout uses forms/inputs, let's style them */
#motorDisponibilidad {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

.motorDispo {
    background: transparent !important;
    padding: 0 !important;
}

.motorDispo label {
    font-size: 12px !important;
    font-weight: normal !important;
    text-transform: none !important;
}

/* Inputs styling to match Airbnb */
input[type='text'],
select {
    width: 100%;
    padding: 12px;
    border: 1px solid #b0b0b0;
    border-radius: 8px;
    margin-bottom: 10px;
    font-size: 16px;
}

.btnReservar .btn-primary,
.cta-reserve .btn-primary {
    background-color: #FF385C;
    /* Airbnb Red */
    border-color: #FF385C;
    width: 100%;
    padding: 14px 24px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    transition: background 0.2s;
}

.btnReservar .btn-primary:hover {
    background-color: #d9324e;
}

/* Reviews */
.review-score {
    font-size: 48px;
    font-weight: 700;
    color: #222;
}

.reviews-summary {
    background: #f7f7f7;
    padding: 24px;
    border-radius: 12px;
    margin-bottom: 24px;
}

/* Map */
#mapaG {
    border-radius: 12px;
    overflow: hidden;
}

/* Reset Old Styles */
#cont,
#allInfo,
.tab-content,
.tab-pane {
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.nav-tabs {
    display: none !important;
}

/* Hide old tabs */

/* Responsive */
@media (max-width: 744px) {
    .airbnb-container {
        flex-direction: column;
    }

    .listing-main {
        width: 100%;
        margin-right: 0;
    }

    .listing-sidebar {
        width: 100%;
        margin-left: 0;
        margin-top: 24px;
    }

    .sidebar-sticky {
        position: static;
        box-shadow: none;
        border: none;
        padding: 0;
    }
}


/* Fix for Search Widget (motorDisponibilidad.php) */
.airbnb-container #bscDispo {
    width: 100%;
    margin: 0;
    display: flex;
    align-items: center !important;
}

.airbnb-container .filInt {
    width: 100% !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
}

.airbnb-container .motorDispo {
    background: transparent !important;
    padding: 0 !important;
}

.airbnb-container .tabDispo {
    border-bottom: none !important;
    font-size: 18px;
    font-weight: 600;
    padding: 0 0 16px 0 !important;
}


/* Airbnb Search Pill Header */
.airbnb-header-container {
    width: 100%;
    border-bottom: 1px solid #ebebeb;
    background: #fff;
    padding: 20px 0;
    margin-bottom: 24px;
    display: flex;
    justify-content: center;
}

.search-pill-bar {
    display: inline-flex;
    align-items: center;
    border: 1px solid #dddddd;
    border-radius: 40px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08), 0 4px 12px rgba(0, 0, 0, 0.05);
    padding: 8px 8px 8px 24px;
    height: 48px;
    cursor: pointer;
    transition: box-shadow 0.2s;
}

.search-pill-bar:hover {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
}

.search-pill-content {
    display: flex;
    align-items: center;
}

.pill-section {
    padding: 0 16px;
    font-size: 14px;
    font-weight: 500;
    color: #222;
}

.pill-location {
    padding-left: 0;
    font-weight: 600;
}

.pill-divider {
    width: 1px;
    height: 24px;
    background-color: #dddddd;
}

.pill-guests {
    color: #717171;
    font-weight: 400;
    display: flex;
    align-items: center;
}

.pill-search-icon {
    background-color: #FF385C;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 16px;
    color: #fff;
}

.pill-search-icon i {
    margin: 0;
}

/* Listing Header (Name & Breadcrumbs) */
.listing-header-block {
    margin-bottom: 24px;
}

.listing-title {
    font-size: 26px;
    font-weight: 600;
    color: #222;
    margin-bottom: 4px;
}

.listing-breadcrumbs {
    font-size: 14px;
    color: #222;
    font-weight: 500;
    text-decoration: underline;
}

.listing-breadcrumbs .sep {
    margin: 0 5px;
    text-decoration: none;
}

/* Full Width Gallery */
.listing-gallery-full {
    width: 100%;
    margin-bottom: 48px;
    border-radius: 12px;
    overflow: hidden;
}

.listing-gallery-full img {
    width: 100%;
    height: 500px;
    object-fit: cover;
}

/* 2 Columns Layout Override */
.listing-content-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}

.listing-left-col {
    width: 58%;
    /* Left content */
}

.listing-right-col {
    width: 33.333%;
    /* Right sidebar */
}

/* Info data rows */
.data-row {
    margin: 8px 0;
    display: flex;
    align-items: center;
    color: #222;
}

.data-row i {
    margin-right: 12px;
    color: #717171;
    font-size: 16px;
}

.sidebar-sticky {
    top: 24px;
    /* Ensure sticky works if container height allows */
}

/* Sidebar Sections (Reserve, Menu) */
.sidebar-section {
    margin-bottom: 32px;
    padding: 24px;
    border: 1px solid #dddddd;
    border-radius: 12px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.sidebar-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 16px;
}

.menu-block .cart {
    font-size: 14px;
    line-height: 1.5;
    color: #717171;
}

/* Map Full Width */
.listing-map-full {
    width: 100%;
    margin-top: 48px;
}


/* Round 2 Refinements */

/* 1. Header Search Pill (Replicating design on #headMain or visual equivalent) */
/* Assuming #headMain contains the search bar. Since I can't see #headMain structure in detail right now without viewing layout again, 
   I will attempt to style the common container IF it exists, or provide a generic class override. 
   However, the user said 'Replica su dise�o en #headMain'. */
/* Creating styling for the standard input in header if possible */
#headMain input[type='text'] {
    /* If there's an input there, make it pill-like? */
    /* This might be risky without seeing #headMain. */
}

/* Instead, I will assume the user manually puts the HTML structure in header or is happy if I style #bscCabecera */

/* 2. Gallery 100% */
#gallery {
    width: 100% !important;
}

/* 3. Sidebar Container Cleanup */
.listing-right-col .sidebar-sticky {
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
}

.sidebar-section {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
    /* Restore shadow on children cards */
    border: 1px solid #dddddd;
    border-radius: 12px;
    padding: 24px;
    background: #fff;
    margin-bottom: 24px;
}

.FiltrosTitulo {
    width: 100%;
    padding: 10px 0;
    position: relative;
}

.FiltrosTitulo span {
    font-size: 22px !important;
    color: #000
}

.FiltrosTitulo #filtrosCerrar {
    position: absolute;
    top: 10px;
    right: 0;
    text-align: center;
    display: block;
    color: #333;
    background: #fff;
    width: 20px;
    height: 20px;
    padding: 0 !important;
    text-decoration: none;
    font-weight: bold;
    font-size: 22px !important;
}

.FiltrosTitulo #filtrosCerrar:hover {
    color: #b84f60;
}

#filtros {
    /* Currently id for availability widget */
    padding: 1em;
    border: 1px solid #dddddd;
    border-radius: 20px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
    background: #fff;
    margin: 5% 5% 5% calc(-250px - 3%);
    position: fixed;
    display: block;
    width: 500px;
    max-width: 90%;
    top: 0;
    left: 50%;
    z-index: 99999;
    height: auto;
    overflow: auto;
}

/* Ensure widget removes internal styling to fit card */
#filtros #bscDispo {
    width: 100% !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* 4. Availability Widget Styling (Airbnb Capture Look) */
.motorDispo {
    display: block !important;
    /* Ensure it shows */
}

/* Input boxes setup */
.fechHora {
    /* Date input wrapper */
    border: 1px solid #b0b0b0;
    border-radius: 8px 8px 0 0;
    padding: 10px;
    position: relative;
    margin-top: 10px;
    display: block;
}

.fechHora label {
    width: 100%;
    position: absolute;
    top: -15px;
    text-align: center;
    display: block;
}

.fechHora input {
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
    font-size: 14px;
    color: #222;
    height: auto;
}

.person {
    border: 1px solid #b0b0b0;
    border-top: none;
    border-radius: 0 0 8px 8px;
    padding: 10px;
    position: relative;
    margin-bottom: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.person label {
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    margin: 0;
}

.person input {
    width: 30px;
    text-align: center;
    border: none !important;
    box-shadow: none !important;
}

/* Button Pink */
#btnDispo {
    background-color: #E51D55 !important;
    /* Airbnb brand pink/red */
    border-color: #E51D55 !important;
    width: 100%;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    padding: 14px;
    border-radius: 8px;
    text-shadow: none;
    background-image: none;
}

/* Checkbox styling */
#verDis+label {
    font-size: 14px;
    color: #222;
    font-weight: 400;
}


/* Round 3: Header Pill & Horizontal Availability */

/* 1. HEADER PILL (Styling #headMain container from header.php) */

#headMain {
    align-items: center;
    display: flex;
    padding: 0 20px 0 120px;
}

#home {
    display: flex !important;
    height: 100vh;
    width: 100vw;
}

#home #headMain {
    display: flex !important;
    height: calc(100vh - 40px);
    width: calc(100% - 40px);
    border: 0;
    padding: 20px;
}

#headMain #logo {
    display: block !important;
    width: 70px;
    position: absolute;
    top: 20px;
    left: -90px;
    margin: 0;
}

#home #headMain #logo {
    width: auto;
    top: -130px;
    left: calc(50% - 70px);
}

#home #contenido {
    display: none !important;
}

/* Convert #bscCabecera to the Pill Container */
#bscCabecera {
    width: auto;
    max-width: 850px;
    height: 75px;
    /* Pill height */
    margin: 0 auto;
    background: #fff;
    border: 1px solid #dddddd;
    border-radius: 32px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08), 0 4px 12px rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* Space out Logo, Input, Button */
    padding: 8px 8px 8px 24px;
    position: relative;
    float: none;
    /* Override existing floats */
}

.tt-hint {
    margin-top: -1px !important;

}

/* Logo override inside pill? Or outside? Standard header usually has logo. 
   The User said 'Replicate design in #headMain'. The capture shows just the search bar. 
   If #headMain has logo inside #bscCabecera (from view file), we might want to hide it or adapt it.
   View code: #logo is inside #bscCabecera. The capture shows generic icons. 
   I will Flexbox it. */
#logo {
    display: none;
    /* Hide Logo to match 'Search Pill' look strictly? Or keep it? 
                    User said 'aspecto de la captura'. Capture is just the search bar. 
                    I'll hide logo inside the pill to match the look. */
}

/* Input (Destino) styling to match 'Destino' part of pill */
.sty4 {
    flex: 1;
    display: flex;
    align-items: center;
    border-right: 1px solid #dddddd;
    /* Divider */
    margin-right: 10px;
    height: 100%;
    float: none;
    width: auto;
}

.busCabe {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    font-size: 14px;
    font-weight: 500;
    color: #222;
    padding: 0 10px;
    width: 100%;
    margin: 0 !important;
}

/* Hide checkboxes */
.sty4>div {
    display: none;
}

/* Button (Pink Circle) */
.sty5 {
    float: none;
    width: auto;
    margin: 0;
}

#btnBuscar {
    background-color: #FF385C !important;
    border-color: #FF385C !important;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    padding: 0;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0;
    /* Hide text 'Buscar' if we want just icon, but I can't easily add icon. Keep text or use CSS content */
}

#btnBuscar:before {
    content: '\\1F50D';
    /* Magnifying glass unicode or icon font if available */
    font-size: 18px;
    color: white;
}

/* If using FontAwesome, assuming it's available */
#btnBuscar i {
    margin: 0;
}


/* 2. HORIZONTAL AVAILABILITY (Top of Content) */
.horizontal-availability {
    width: 100%;
    background: #fff;
    border: 1px solid #dddddd;
    border-radius: 32px;
    /* Rounded pill look for horizontal bar too? Or just bar? Users capture 2 shows horizontal pill. */
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
    padding: 10px 20px;
    margin-bottom: 30px;
    margin-top: 10px;
}

.horizontal-availability .motorDispo {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 20px;
}

.horizontal-availability .tabDispo {
    display: none;
}

/* Hide title */

/* Flex Items overrides for horizontal layout */
.horizontal-availability .motorDispo>div {

    flex: 1;
    border-right: 1px solid #ebebeb;
    /* Dividers */
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.horizontal-availability .motorDispo>div:last-child {
    border-right: none;
    flex: 0 0 100px;
    /* Button width */
}

/* Checkbox */
.horizontal-availability #verDisponibles,
.horizontal-availability label[for='verDisponibles'] {
    /* Hide or Style? If horizontal bar is strictly search, maybe hide checkbox or put it small */
    /* Let's keep it but compact */
}

/* Comida/Cena */
.horizontal-availability .comCen {
    display: flex;
    gap: 5px;
}

/* Date input */
.horizontal-availability .fechHora {
    border: none;
    margin: 0;
    padding: 0;
}


/* People */
.horizontal-availability .person {
    border: none;
    margin: 0;
    padding: 0;
}

.horizontal-availability .bntMM {
    color: #222;
    background: #ebebeb;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    padding: 0 !important;
}

/* Button Pink Horizontal */
.horizontal-availability #btnDispo {
    width: auto;
    height: 48px;
    border-radius: 24px;
    /* Pill button */
    padding: 0 24px;
    margin: 0 !important;
    background-color: #E51D55 !important;
}

/* Profile / Lang positioning override */
#modPerfil,
#idiomas {
    position: absolute;
    right: 20px;
    top: 20px;
}


/* Round 3 Refinements */

/* 1. Equal Columns */
.listing-left-col,
.listing-right-col {
    width: 49%;
    /* Almost 50% */
}

.listing-left-col {
    margin-right: 2%;
}

.listing-right-col {
    width: 49%;
}

/* 2. Accordion #reservar */
.full-width-accordion {
    width: 100%;
    margin: 32px 0;
    border: 1px solid #dddddd;
    border-radius: 12px;
    overflow: hidden;
}

.accordion-title {
    background: #f7f7f7;
    padding: 16px 24px;
    margin: 0;
    cursor: pointer;
    font-size: 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.accordion-title:hover {
    background: #ebebeb;
}

.accordion-title i {
    margin-top: 5px;
}

/* 3. Header Checkboxes (Elegant Minimalist) */
/* Reset existing display:none from previous round */
.sty4>div {
    display: flex !important;
    flex-wrap: wrap;
    width: 100%;
}

/* Allow .sty4 to wrap (Input then Checkboxes) */
.sty4 {
    flex-wrap: wrap;
    /* Input needs to take full width of top row */
    /* Checkboxes full width of bottom row */
    align-items: flex-start;
}

.busCabe {
    width: 100%;
    /* Force input full width */
}

/* Style Checkboxes */
.bscCabeceraBusq {
    gap: 0;
    margin: -14px 0 0 -20px;
}

.bscCabeceraBusq label {
    font-size: 12px;
}

.sty32 {
    display: flex;
    align-items: center;
    color: #000;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}

.sty32 input[type='checkbox'] {
    /* Hide default or style nicely? User said 'no con dise�o del sistema' */
    /* Simple Custom Checkbox */
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border: 1px solid #000;
    border-radius: 4px;
    margin-right: 8px;
    position: relative;
    cursor: pointer;
    background: #fff;
}

.sty32 input[type='checkbox']:checked {
    background: #000;
}

.sty32 input[type='checkbox']:checked:after {
    content: '?';
    color: #fff;
    position: absolute;
    top: -2px;
    left: 2px;
    font-size: 14px;
}

/* 4. Header Icon (Black Transparent) */
#btnBuscar {
    background-color: transparent !important;
    border-color: transparent !important;
    color: #484848 !important;
    /* Black/Dark Gray */
    box-shadow: none !important;
    width: auto;
    margin: 0;
}

#btnBuscar:before {
    color: #484848 !important;
    font-size: 24px;
    font-weight: 300;
}

#btnBuscar:hover {
    background-color: rgba(0, 0, 0, 0.05) !important;
}

/* 5. Horizontal Bar Inline Elements */
.horizontal-availability .comCen {
    flex-direction: row;
    /* Ensure row */
    justify-content: center;
    align-items: center;
}

.horizontal-availability .person {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    border: none;
    padding: 0;
    margin: 0;
}

.horizontal-availability .person label {
    margin-right: 10px;
}

/* Fix flex child spacing */
.horizontal-availability .motorDispo>div {
    display: flex;
    flex-direction: row;
    /* Override column from previous round if applied */
    align-items: center;
}


/* Round 4 Refinements: Alignment and Icons */

/* 1. Availability Bar Vertical Alignment */
.horizontal-availability .motorDispo>div {
    /* Align items centrally */
    justify-content: center;
    /* Center horizontally in flex cell */
    align-items: center;
    /* Center vertically */
    display: flex;
}

/* Ensure inner wrappers are also centered */
.horizontal-availability .comCen,
.horizontal-availability .person,
.horizontal-availability .fechHora {
    display: flex;
    align-items: center;
    /* Center children vertically */
    justify-content: center;
    border: none !important;
    /* Cleanup borders from earlier */
    padding: 0 !important;
    margin: 0 !important;
}


/* 2. Custom Search Icon (buscar.png) for Header & Availability */
#btnBuscar,
#btnDispo {
    background-image: url('../images/buscar.png') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 24px 24px !important;
    /* Adjust based on image scale */
    color: transparent !important;
    /* Hide text */
    text-indent: -9999px;
    /* Hide text fallback */
    /* Ensure sizing matches pill button from Round 3 */
    display: block;
}

#btnBuscar:before,
#btnDispo:before {
    display: none !important;
    /* Hide any unicode icons added previously */
}

#btnBuscar {
    /* Transparent bg for header */
    background-color: transparent !important;
    width: 48px;
    height: 48px;
}

#btnDispo {
    /* Pink bg for availability bar, but icon on top? 
       User said 'buscar.png... como lupa del buscador de ... #availability-bar'. 
       Should the pink button remain? 'quita el texto buscar'. 
       If I use the image, it might clash with pink background if image is black. 
       The user provided a black icon. 
       If I keep pink background, I need white icon. 
       If I use black icon, I should maybe use transparent background or light gray.
       BUT Round 4 request: '#availability-bar ... alinea vertical... #btn buscar.png'. 
       I will assume keeps Pink background if legible, OR switch to transparent circular button like header?
       The capture showed a PINK button. 
       The user said 'pon buscar.png ... quita el texto buscar'.
       I will set background to Pink, and try to invert image filter or just show black icon on pink (might be low contrast). 
       Actually, if the PNG is black logic (transparent bg), it will show black on pink. 
       I will assume this is desired, or apply filter: invert(1) to make it white if CSS supports it. */
    background-color: #E51D55 !important;
    border-radius: 50%;
    /* Circle button in bar? Users capture showed Circle? 
                         Capture 2 showed a round pink button with icon. */
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    border: none !important;
    filter: invert(1);
    /* Invert black icon to white for better contrast on pink */
}

/* Ensure no double-borders in availability bar layout */
.horizontal-availability .motorDispo>div {
    border-right: 1px solid #ebebeb;
}

.horizontal-availability .motorDispo>div:last-child {
    border-right: none;
}


/* Custom Checkbox & Radio Styling (Airbnb/Material-inspired) */

/* Base Reset for Both */
input[type='checkbox'],
input[type='radio'] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 20px;
    height: 20px;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    margin: 0 8px 0 0;
    flex-shrink: 0;
}

/* CHECKBOX Styles */
input[type='checkbox'] {
    border: 2px solid #c0c0c0;
    border-radius: 4px;
    background: #fff;
    transition: all 0.15s ease-in-out;
}

input[type='checkbox']:hover {
    border-color: #b84f60;
}

input[type='checkbox']:checked {
    background-color: #b84f60;
    border-color: #b84f60;
}

input[type='checkbox']:checked::after {
    content: '';
    position: absolute;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

input[type='checkbox']:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

input[type='checkbox']:disabled:checked {
    background-color: #90CAF9;
    border-color: #90CAF9;
}

/* RADIO Styles */
input[type='radio'] {
    border: 2px solid #c0c0c0;
    border-radius: 50%;
    background: #fff;
    transition: all 0.15s ease-in-out;
}

input[type='radio']:hover {
    border-color: #b84f60;
}

input[type='radio']:checked {
    border-color: #b84f60;
    border-width: 2px;
}

input[type='radio']:checked::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 10px;
    height: 10px;
    background-color: #b84f60;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

input[type='radio']:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Label alignment */
label {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
}


/* CRITICAL FIX: Checkbox & Radio Override with Higher Specificity */

/* Override all checkbox styles with !important to ensure blue design */
input[type='checkbox'],
#bscCabecera input[type='checkbox'],
.sty32 input[type='checkbox'],
#availability-bar input[type='checkbox'],
.motorDispo input[type='checkbox'] {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    width: 20px !important;
    height: 20px !important;
    border: 2px solid #c0c0c0 !important;
    border-radius: 4px !important;
    background: #fff !important;
    cursor: pointer !important;
    position: relative !important;
    vertical-align: middle !important;
    margin: 0 8px 0 0 !important;
}

.horizontal-availability input[type='checkbox']#verDisponibles {
    position: absolute !important;
}

input[type='checkbox']:checked,
#bscCabecera input[type='checkbox']:checked,
.sty32 input[type='checkbox']:checked,
#availability-bar input[type='checkbox']:checked,
.motorDispo input[type='checkbox']:checked {
    background-color: #b84f60 !important;
    border-color: #b84f60 !important;
}

input[type='checkbox']:checked::after,
#bscCabecera input[type='checkbox']:checked::after,
.sty32 input[type='checkbox']:checked::after {
    content: '' !important;
    position: absolute !important;
    left: 6px !important;
    top: 2px !important;
    width: 5px !important;
    height: 10px !important;
    border: solid #fff !important;
    border-width: 0 2px 2px 0 !important;
    transform: rotate(45deg) !important;
    display: block !important;
}

/* Radio buttons with higher specificity */
input[type='radio'],
.motorDispo input[type='radio'] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 20px !important;
    height: 20px !important;
    border: 2px solid #c0c0c0 !important;
    border-radius: 50% !important;
    background: #fff !important;
    cursor: pointer !important;
    position: relative !important;
}

input[type='radio']:checked,
.motorDispo input[type='radio']:checked {
    border-color: #b84f60 !important;
}

input[type='radio']:checked::after {
    content: '' !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 10px !important;
    height: 10px !important;
    background-color: #b84f60 !important;
    border-radius: 50% !important;
    transform: translate(-50%, -50%) !important;
}

/* FIX: Button Color - Remove filter from entire button, apply only to icon */
#btnDispo {
    filter: none !important;
    background-color: #b84f60 !important;
    border-color: #b84f60 !important;
    border-radius: 8px !important;
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Use white version of icon or invert only the background-image */
#btnDispo {
    background-image: url('../images/buscar.png') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 20px 20px !important;
    /* Invert the icon to white using filter on a pseudo-element instead */
}

/* Availability Bar Vertical Alignment Fix */
.horizontal-availability {
    display: none;
    align-items: center !important;
    padding: 16px 24px !important;
    z-index: 999999;
    width: 1000px;
    width: 800px;
    border: 0 !important;
    position: fixed;
    max-width: calc(95vw - 88px);
    top: 0;
}

.aint .horizontal-availability {
    width: 800px;
}

.horizontal-availability .motorDispo {
    display: flex !important;
    align-items: center !important;
}

.horizontal-availability .motorDispo>div {
    display: flex !important;
    align-items: center !important;
    height: auto !important;
}


.horizontal-availability .motorDispo>.person,
.horizontal-availability .motorDispo>.fechHora {
    display: block !important;
    overflow: unset;
}

.horizontal-availability .motorDispo>.person .plazas-cont {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.horizontal-availability .motorDispo>.person .plazas-cont #plazas {
    border-radius: 8px;
    margin-bottom: 10px;
    font-size: 16px;
    margin-top: 12px;
    padding: 6px 12px;
}

.horizontal-availability label {
    margin: 0 !important;
    line-height: 1 !important;
    margin-bottom: 0;
}

.horizontal-availability .motorDispo>.person label {
    position: absolute;
    top: -8px;
    width: 100%;
    text-align: center;
    left: 0;
    display: block;
}

.horizontal-availability .tabDispo {
    display: none !important;
}


/* FINAL FIX: Style the LABEL pseudo-elements (not inputs) for custom checkboxes */

/* Checkbox Label Styling - Unchecked State */
input[type='checkbox']+label::before {
    content: '' !important;
    display: inline-block !important;
    width: 20px !important;
    height: 20px !important;
    border: 2px solid #c0c0c0 !important;
    border-radius: 4px !important;
    background: #fff !important;
    margin-right: 8px !important;
    vertical-align: middle !important;
    position: relative !important;
    top: -1px !important;
}

/* Checkbox Label Styling - Checked State (checkbox-on class) */
input[type='checkbox']+label.checkbox-on::before {
    background-color: #b84f60 !important;
    border-color: #b84f60 !important;
    content: '\2713' !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: bold !important;
    text-align: center !important;
    line-height: 18px !important;
}

/* Radio Button Label Styling - Unchecked */
input[type='radio']+label::before {
    content: '' !important;
    display: inline-block !important;
    width: 20px !important;
    height: 20px !important;
    border: 2px solid #c0c0c0 !important;
    border-radius: 50% !important;
    background: #fff !important;
    margin-right: 8px !important;
    vertical-align: middle !important;
}

/* Radio Button Label Styling - Checked */
input[type='radio']:checked+label::before,
input[type='radio']+label.checkbox-on::before {
    border-color: #b84f60 !important;
    background: radial-gradient(circle, #b84f60 40%, #fff 45%) !important;
}

/* Button Fix - Use specific class override */
.btn-inverse#btnDispo,
#btnDispo.btn.btn-inverse {
    background-color: #fff !important;
    background-image: url('../images/buscar.png') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 20px 20px !important;
    border-color: #fff !important;
    color: transparent !important;
    text-indent: -9999px !important;
    filter: none !important;
}