/* ==========================================================================
   VILLA LOOP & LISTINGS
   ========================================================================== */

.mi-loopvillashome .swiper-slide a {
    z-index: 10;
}

/* ==========================================================================
   VILLA RATES MENU
   ========================================================================== */

.mi-villarates-menu {
    display: flex;
    flex-direction: column;
}

/* Top Row */
.mi-villarates-menu .top-row {
    display: flex;
    text-transform: uppercase;
    color: var(--e-global-color-primary);
}

/* Rates Row */
.mi-villarates-menu .rates-row {
    display: flex;
    padding: 8px;
    border-radius: 6px;
}

.mi-villarates-menu .rates-row:nth-child(even) {
    background-color: #ffff;
}

/* Columns */
.mi-villarates-menu .top-row div,
.mi-villarates-menu .rates-row div {
    width: 30%;
    align-items: left;
    justify-content: left;
}

.mi-villarates-menu .mi-bedroom {
    text-align: right;
}

.mi-villarates-menu .mi-mobilebed {
    display: none;
}

/* ==========================================================================
   FLOORPLAN MENU
   ========================================================================== */

.mi-floorplan-menu {
    display: grid;
    grid-template-columns: auto auto;
    gap: 20px;
}

.mi-floorplan-menu div {
    width: 100%;
}
/* ==========================================================================
   ENQUIRY POPUP
   ========================================================================== */

/* Base State - Hidden by default */
#villa-enquiry-popup {
    display: none;
}

/* Active State */
#villa-enquiry-popup.popup-active {
    display: block !important;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90vw;
    max-width: 1280px;
    max-height: 90vh;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    overflow: scroll;
    z-index: 10000;
    animation: popupSlideIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Popup Overlay */
.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(3px);
    z-index: 9999;
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.popup-overlay.active {
    display: block;
    opacity: 1;
}

/* Close Button */
.popup-close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 40px;
    height: 40px;
    max-width: 1280px;
    border: none;
    border-radius: 50%;
    background: transparent !important;
    color: var(--e-global-color-primary) !important;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    z-index: 10001;
}

.popup-close .eicon-close:before {
    font-size: 33px !important;
}

.popup-close:hover {
    background: rgba(0, 0, 0, 0.9);
    transform: scale(1.1);
}

/* Gravity Forms Compatibility */
.elementor-popup-modal .dialog-close-button {
    text-decoration: none;
}

.elementor-popup-modal .gform_wrapper,
.elementor-popup-modal .gform_wrapper form {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Datepicker Styling */
.gform-theme--framework.ui-datepicker table .ui-datepicker-current-day a,
.gform-theme--framework.ui-datepicker table .ui-datepicker-current-day span {
    --gf-ctrl-date-picker-cell-content-bg-color-selected: var(--e-global-color-accent);
}

/* Datepicker Z-Index Management */
.ui-datepicker {
    z-index: 10002 !important;
    position: absolute !important;
}

#villa-enquiry-popup.popup-active .ui-datepicker-trigger {
    position: relative !important;
    z-index: 1 !important;
}
#villa-enquiry-popup.popup-active .ginput_container_date {
    position: relative !important;
    z-index: 1 !important;
}
/* Custom Scrollbar */
#villa-enquiry-popup.popup-active::-webkit-scrollbar {
    width: 6px;
}
#villa-enquiry-popup.popup-active::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}
#villa-enquiry-popup.popup-active::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}
#villa-enquiry-popup.popup-active::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}
/* Prevent Body Scroll */
body.popup-open {
    overflow: hidden;
}

/* Content Animation */
#villa-enquiry-popup.popup-active > * {
    opacity: 0;
    transform: translateY(20px);
    animation: contentFadeIn 0.4s ease 0.1s forwards;
}
#villa-enquiry-popup.popup-active #villa-popup-close-btn {
    z-index:99;
    position: absolute;
    right: 30px;
    cursor:pointer;
}
.villa-close-popup {
    font-size: 50px; line-height: 1; display: block;
}
/* ==========================================================================
   CONTENT SECTIONS
   ========================================================================== */

/* Family Friendly Features */
.mi-iconpalm li {
    padding: 0 0 12px 30px !important;
}

/* Post Content */
.mi-single-desc h2 {
    font-weight: 300;
}

.mi-single-desc h4 {
    color: var(--e-global-color-primary) !important;
    font-size: 16px;
}

/* Text Paragraphs */
.mi-textpara p {
    padding: 0;
    margin: 0;
}

/* ==========================================================================
   GOOGLE MAPS
   ========================================================================== */
/*.acf-map {
    width: 100%;
    height: 400px;
    border: #ccc solid 1px;
    margin: 20px 0;
}

.acf-map img {
    max-width: inherit !important;
}

.gm-style-mtc button {
    border-radius: 0 !important;
}

.gm-style-iw-d a {
    outline: 0;
}
.gm-ui-hover-effect span {
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z%22/%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z%22/%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22/%3E%3C/svg%3E");
}
*/
/* ==========================================================================
   ANIMATIONS
   ========================================================================== */

@keyframes popupSlideIn {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.8) translateY(-50px);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1) translateY(0);
    }
}

@keyframes contentFadeIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ==========================================================================
   RESPONSIVE STYLES
   ========================================================================== */

/* Mobile - 768px and below */
@media (max-width: 768px) {

    .slow-transition {
        padding: 0!important;
        transform: translateY(0);
        transition: transform 0.5s ease;
        background-color: #fff;
    }
    .slow-transition.elementor-sticky--active {
        transform: translateY(-4px); /* Small upward movement */
        padding: 6px!important;
        background-color: #fff;
        transition: ease
    }
    /* Rates Menu */
    .mi-villarates-menu .rates-row.top-row {
        display: none;
    }
    
    .mi-villarates-menu .rates-row {
        flex-wrap: wrap;
        padding: 15px 10px !important;
    }
    
    .mi-villarates-menu .rates-row .mi-season,
    .mi-villarates-menu .rates-row .mi-dates {
        width: 100%;
        order: 1;
        font-weight: 600;
    }
    
    .mi-villarates-menu .rates-row .mi-dates {
        order: 2;
        font-weight: 400;
        padding-bottom: 15px;
    }
    
    .mi-villarates-menu .rates-row .mi-mobilebed {
        display: block !important;
        font-size: 1em;
        color: var(--e-global-color-primary);
    }
    
    .mi-villarates-menu .rates-row .mi-bedroom {
        width: 33%;
        text-align: left;
        order: 3;
    }
    
    /* Content Adjustments */
    .mi-iconpalm ul {
        padding-left: 0;
    }
    
    /* Sticky Header Adjustment */
    html:not([lang="en-AU"]) .elementor-sticky--active {
        margin-top: 40px !important;
    }
    
    /* Popup Adjustments */
    #villa-enquiry-popup.popup-active {
        width: 95vw;
        max-height: 95vh;
        padding: 20px 15px;
        border-radius: 8px;
        top: 50%;
        left: 50%;
    }
    
    /* Prevent iOS zoom on form inputs */
    #villa-enquiry-popup.popup-active .gform_wrapper input[type="text"],
    #villa-enquiry-popup.popup-active .gform_wrapper input[type="email"],
    #villa-enquiry-popup.popup-active .gform_wrapper input[type="tel"],
    #villa-enquiry-popup.popup-active .gform_wrapper select,
    #villa-enquiry-popup.popup-active .gform_wrapper textarea {
        font-size: 16px;
    }
}

/* Small Mobile - 480px and below */
@media (max-width: 480px) {
    #villa-enquiry-popup.popup-active {
        max-width: 100vw;
    }
}