.login-popup { display: none;}
        #confirmar:hover {
    background-color: white;
        }
        .modal {
        z-index: 1;
        }
        @media (max-width: 767px)
{
    #extra_pop { margin-top: 26% !important;}


        }
        .mg-md {

    margin-top: 0px;
    margin-bottom: 10px;

}
        #header {
            padding-left:0px !important;
            padding-right: 0px !important;
            *background-color: transparent;
            padding-top: 20px !important;
            padding-bottom: 10px !important;
        }
        .sticky-nav.sticky {
            left: 0;
            background-color: white;
        }
        .sticky-nav.sticky a{
            color: #3A80A2 !important;
            text-shadow: 0px 0px 0px #3A80A2 !important;
        }

        .sticky-nav {

            background-color: transparent;
        }
        .sticky-nav a{
            color: #ffffff !important;
            text-shadow: 0px 0px 0px #ffffff !important;
        }


        .carousel{
	display:inline-block;
	vertical-align:bottom;
}
.full-width-bloc .carousel{
	width:100%;
}
.carousel .item img{
	margin-right:auto;
	margin-left:auto;
}
.carousel-control span{
	position: absolute;
	top: 50%;
	z-index: 5;
	display: inline-block;
}
.carousel-control{
	color:#FFF!important;
	text-shadow: none;
}
.carousel-indicators li{
	margin: 0 4px;
}
.carousel-indicators .active{
	margin: 0 4px -1px;
}
.carousel-control.left span{
	margin-left:-15px;
}

.no-shadows .carousel-control.left, .no-shadows .carousel-control.right{
	background-image: none;
}
        .carcaption{
	text-shadow:0px 3px 0px #000000;
	font-size:40px;
	margin-bottom:80px;
}
        
               .container-banner {
  display: flex;
  justify-content: space-between;
  align-items: stretch; /* Ensure both divs stretch to the same height */
  margin: 20px 0;
  gap: 20px; /* Space between the two divs */
}

.text-section, .review-banner {
  flex: 1; /* Ensures equal width for both divs */
  display: flex;
  flex-direction: column;
  justify-content: center; /* Vertically center content */
  padding: 20px;
  border: 1px solid #ccc;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.review-banner {
  cursor: pointer;
}

.review-banner img {
  width: 100%;
  height: auto;
  margin-bottom: 10px;
}

@media (max-width: 768px) {
  .container-banner {
    flex-direction: column;
  }
}
        
        .junta-andalucia {
      margin: 0;
      padding: 20px 0;
      display: flex;
      justify-content: center;
      font-family: Arial, sans-serif;
    }

    .junta-content {
      display: flex;
      align-items: center;
      max-width: 800px;
      flex-wrap: wrap;
      justify-content: center;
      text-align: center;
    }

    .junta-content img {
      width: 100%;
      max-width: 400px;
      height: auto;
      object-fit: cover;
      margin: 0 0 20px 0;
    }

    .junta-text {
      font-size: 16px;
      line-height: 1.4;
      max-width: 400px;
      padding: 0 10px;
    }

    @media (min-width: 600px) {
      .junta-content {
        flex-wrap: nowrap;
        text-align: left;
      }

      .junta-content img {
        margin: 0 20px 0 0;
      }
    }
        
            .top-badge-container {
    position: fixed;
    top: 80px;
    right: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    cursor: pointer;
    animation: slide-in 1s ease-out;
}

.top-badge {
    background-color: #1D1D83;
    color: white;
    font-family: 'VeraHumana95';
    font-weight: bold;
    padding: 12px 20px;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    white-space: nowrap;
    user-select: none;
}

.whatsapp-logo {
    width: 40px;
    height: 40px;
}

@keyframes slide-in {
    from {
        transform: translateX(100%);
    }
    to {
        transform: translateX(0);
    }
}

@keyframes slide-out {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(100%);
    }
}

.slide-out {
    animation: slide-out 0.5s ease-in forwards;
}
            /* =========================================================
   RENTAL SEARCH - MOBILE RESPONSIVE LAYOUT
   ========================================================= */
/* =========================================================
   RENTAL SEARCH
   Keep the existing HTML structure
   ========================================================= */

.booking-search {
    width: 90%;
    margin: 0 auto;
}

.booking-group {
    width: 100%;
}

.booking-title {
    display: none;
}

.booking-location,
.booking-date-time {
    width: 100%;
}

.booking-date-time {
    display: flex;
    gap: 8px;
}

.booking-date,
.booking-time {
    flex: 1;
}

.booking-field {
    width: 100%;
}

.booking-search-button {
    width: 100%;
}


/* =========================================================
   MOBILE
   <= 767px
   This keeps the layout you already like
   ========================================================= */

@media (max-width: 767px) {

    .booking-search {
        width: 94% !important;
        margin: 0 auto !important;
    }

    .booking-group {
        width: 100% !important;
        margin-bottom: 14px;
    }

    .booking-title {
        display: block;
        color: white;
        font-size: 18px;
        font-weight: 600;
        margin: 0 0 6px 4px;
        text-align: left;
    }

    .booking-location,
    .booking-date-time {
        width: 100% !important;
        float: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .booking-date-time {
        display: flex !important;
        gap: 6px;
        margin-top: 6px;
    }

    .booking-date,
    .booking-time {
        width: 50% !important;
        float: none !important;
        padding: 0 !important;
    }

    .booking-field {
        height: 52px !important;
        font-size: 17px !important;
        border-radius: 0 !important;
        margin: 0 !important;
    }

    .booking-search-button {
        width: 100% !important;
        float: none !important;
        padding: 0 !important;
        margin-top: 4px;
    }

    #buscarBtn {
        display: block;
        width: 100%;
        height: 52px;
        line-height: 52px;
        padding: 0 !important;
        font-size: 18px;
        text-align: center;
    }

    /* Remove Bootstrap row spacing on mobile */

    #beginSel .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    #beginSel {
        width: 94% !important;
    }

    /* Coupon */

    #beginSel #cupon {
        width: 100% !important;
    }

    #beginSel .form-group {
        margin-bottom: 0;
    }
}


/* =========================================================
   DESKTOP
   992px+
   ========================================================= */

@media (min-width: 992px) {

    #beginSel {
        width: 100%;
        max-width: 1120px;
        margin-left: auto;
        margin-right: auto;
    }


    /* -----------------------------------------
       Main booking row
       ----------------------------------------- */

    #beginSel .booking-groups {

        display: grid;

        /*
         * Pickup       Return       Search
         *
         * The two booking groups get equal space.
         * Search is deliberately narrower.
         */
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr)
            135px;

        column-gap: 18px;

        align-items: end;

        width: 100%;
    }


    /* -----------------------------------------
       Pickup / Return
       ----------------------------------------- */

    #beginSel .booking-group {

        width: 100%;
        min-width: 0;

        margin: 0;
        padding: 0;
    }


    /* -----------------------------------------
       Titles
       ----------------------------------------- */

    #beginSel .booking-title {

        display: block;

        color: #ffffff;

        font-family: 'Montserrat', sans-serif;

        font-size: 17px;
        font-weight: 600;

        line-height: 22px;

        text-align: left;

        margin: 0 0 7px 3px;
    }


    /* -----------------------------------------
       Location
       ----------------------------------------- */

    #beginSel .booking-location {

        width: 100%;

        margin: 0;
        padding: 0;
    }


    #beginSel .booking-location .form-group {

        margin-bottom: 0;
    }


    #beginSel .booking-location .booking-field {

        width: 100%;
    }


    /* -----------------------------------------
       Date + Time
       ----------------------------------------- */

    #beginSel .booking-date-time {

        display: grid;

        grid-template-columns:
            minmax(0, 1.35fr)
            minmax(90px, 0.65fr);

        column-gap: 8px;

        width: 100%;

        margin-top: 8px;

        padding: 0;
    }


    #beginSel .booking-date,
    #beginSel .booking-time {

        width: 100%;
        min-width: 0;

        padding: 0;
        margin: 0;
    }


    #beginSel .booking-date .form-group,
    #beginSel .booking-time .form-group {

        margin-bottom: 0;
    }


    /* -----------------------------------------
       All booking fields
       ----------------------------------------- */

    #beginSel .booking-field {

        width: 100%;

        height: 48px;

        box-sizing: border-box;

        border-radius: 0 !important;

        font-size: 16px;
    }


    /* -----------------------------------------
       Search button
       ----------------------------------------- */

    #beginSel .booking-search-button {

        width: 135px;

        margin: 0;
        padding: 0;

        align-self: end;
    }


    #beginSel .btnBuscar {

        width: 100%;

        margin: 0;
        padding: 0;
    }


    #beginSel #buscarBtn {

        display: block;

        width: 100%;
        height: 48px;

        line-height: 48px;

        padding: 0 !important;

        margin: 0;

        border-radius: 0 !important;
        border: none !important;

        color: #ffffff !important;

        background-color: #3A80A2 !important;

        font-family: 'Montserrat', sans-serif;

        font-size: 15px;
        font-weight: 500;

        text-align: center;

        box-sizing: border-box;

        cursor: pointer;
    }


    #beginSel #buscarBtn:hover {

        background-color: #316f8d !important;
    }


    /* -----------------------------------------
       Coupon
       ----------------------------------------- */

    #beginSel .booking-search-button + .row {

        margin-top: 12px;
    }


    #beginSel .booking-search-button + .row .form-group {

        margin-bottom: 0;
    }


    #beginSel #cupon {

        width: 220px !important;

        height: 36px;

        margin: 0 auto;

        border-radius: 0 !important;

        font-size: 14px;
    }

}


/* =========================================================
   LARGE DESKTOP
   1200px+
   ========================================================= */

@media (min-width: 1200px) {

    #beginSel {
        max-width: 1160px;
    }


    #beginSel .booking-groups {

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr)
            145px;

        column-gap: 20px;
    }


    #beginSel .booking-search-button {

        width: 145px;
    }


    #beginSel .booking-date-time {

        grid-template-columns:
            minmax(0, 1.4fr)
            minmax(100px, 0.6fr);

        column-gap: 10px;
    }


    #beginSel .booking-field {

        height: 50px;

        font-size: 16px;
    }


    #beginSel #buscarBtn {

        height: 50px;

        line-height: 50px;
    }

}


/* =========================================================
   TABLET
   768px - 991px
   ========================================================= */

@media (min-width: 768px) and (max-width: 991px) {

    #beginSel {

        width: 94%;

        margin-left: auto;
        margin-right: auto;
    }


    /*
     * At this width we don't force everything
     * onto one horizontal line.
     *
     * Pickup and return stay side-by-side,
     * while the search button goes underneath.
     */

    #beginSel .booking-groups {

        display: grid;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr);

        column-gap: 15px;
        row-gap: 12px;

        width: 100%;
    }


    #beginSel .booking-group {

        width: 100%;
        min-width: 0;
    }


    #beginSel .booking-title {

        display: block;

        color: white;

        font-size: 16px;
        font-weight: 600;

        margin: 0 0 6px 3px;
    }


    #beginSel .booking-location {

        width: 100%;
    }


    #beginSel .booking-date-time {

        display: flex;

        gap: 7px;

        margin-top: 7px;
    }


    #beginSel .booking-date,
    #beginSel .booking-time {

        width: 50%;
        min-width: 0;
    }


    #beginSel .booking-field {

        height: 48px;

        font-size: 15px;

        border-radius: 0 !important;
    }


    /* Search button occupies both columns */

    #beginSel .booking-search-button {

        grid-column: 1 / -1;

        width: 100%;

        margin-top: 2px;
    }


    #beginSel #buscarBtn {

        width: 100%;

        height: 48px;

        line-height: 48px;
    }


    #beginSel #cupon {

        width: 220px !important;

        margin: 0 auto;
    }

}


/* =========================================================
   VERY SMALL PHONES
   <= 380px
   ========================================================= */

@media (max-width: 380px) {

    .booking-title {

        font-size: 17px;
    }

    .booking-date-time {

        gap: 5px;
    }

    .booking-field {

        font-size: 16px !important;
    }

    #buscarBtn {

        font-size: 17px !important;
    }
}
        .sticky-nav.sticky {
    left: 0;
    background-color: transparent;
    border-bottom: none;
    box-shadow: none;
}
        .sticky-nav.sticky a.hospital-header-button {
    color: #ffff !important;
}
        .sticky-nav.sticky a.hospital-header-button:hover,
.sticky-nav.sticky a.hospital-header-button:focus,
.sticky-nav.sticky a.hospital-header-button:active {
    color: #3A80A2 !important;
}
#header .navbar-collapse,
#header .nav-special,
#header .sidebar-nav {
    background-color: transparent !important;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}
        /* ===== jQuery UI datepicker — C-A-R theme ===== */
#ui-datepicker-div.ui-datepicker {
    width: 244px;
    padding: 6px;
    background: #ffffff;
    border: 1px solid #3A80A2;
    border-radius: 6px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.18);
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    z-index: 9999 !important;
}
#ui-datepicker-div .ui-datepicker-header {
    position: relative;
    background: #3A80A2;
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 6px 0;
    margin-bottom: 5px;
}
#ui-datepicker-div .ui-datepicker-title {
    text-align: center;
    font-weight: 600;
}
#ui-datepicker-div .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-next {
    position: absolute;
    top: 5px;
    width: 32px;
    height: 22px;
    line-height: 22px;
    font-size: 11px;
    color: #fff;
    text-align: center;
    cursor: pointer;
}
#ui-datepicker-div .ui-datepicker-prev { left: 4px; }
#ui-datepicker-div .ui-datepicker-next { right: 4px; }
#ui-datepicker-div .ui-datepicker-prev .ui-icon,
#ui-datepicker-div .ui-datepicker-next .ui-icon { display: none; }  /* use Ant/Sig text, no sprite */
#ui-datepicker-div .ui-datepicker-prev:hover,
#ui-datepicker-div .ui-datepicker-next:hover { opacity: .8; }

#ui-datepicker-div table.ui-datepicker-calendar {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
}
#ui-datepicker-div table.ui-datepicker-calendar th {
    padding: 4px 0;
    color: #3A80A2;
    font-weight: 600;
    font-size: 11px;
    text-align: center;
}
#ui-datepicker-div table.ui-datepicker-calendar td {
    padding: 1px;
    text-align: center;
}
#ui-datepicker-div td .ui-state-default {
    display: block;
    padding: 6px 0;
    text-decoration: none;
    color: #333;
    background: #f4f7f9;
    border: 1px solid transparent;
    border-radius: 4px;
}
#ui-datepicker-div td .ui-state-hover {
    background: #d6e4ec;
    border-color: #3A80A2;
    color: #1f4a5e;
}
#ui-datepicker-div td .ui-state-active,
#ui-datepicker-div td .ui-state-highlight {
    background: #3A80A2;
    color: #fff;
    border-color: #3A80A2;
}
#ui-datepicker-div td .ui-priority-secondary {
    color: #b0b0b0;
    background: #fafafa;
    opacity: 1;
}
#ui-datepicker-div .ui-datepicker-buttonpane {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid #e0e0e0;
    text-align: center;
}
#ui-datepicker-div .ui-datepicker-buttonpane button {
    background: #3A80A2;
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 4px 12px;
    margin: 0 4px;
    cursor: pointer;
    font-size: 12px;
}
#ui-datepicker-div .ui-datepicker-buttonpane button:hover {
    background: #316f8d;
}
        .tc-white-smoke {
  color: #1D1D83 !important;
}
        .ui-datepicker-trigger {
    display: none !important;
}
        #ui-datepicker-div.ui-datepicker {
    width: 244px;
    padding: 6px;
    background: #ffffff;
    border: 1px solid #3A80A2;
    border-radius: 6px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.18);
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    z-index: 9999 !important;
    display: none;          /* stay hidden until jQuery UI opens it */
}
.top-badge {margin-top: 20px;}
