/*
Theme Name: WPRentals Child
Theme URI: https://rockcliffeoliverbc.com
Description: Child theme for WPRentals
Author: NEW Design Co.
Author URI: https://newdesignco.agency
Template: wprentals
Version: 1.0.0
*/

/* ============================================
   1. MOBILE HEADER (All Pages)
   ============================================ */

@media only screen and (max-width: 1024px) {
    body .mobile_header {
        display: block !important;
        visibility: visible !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        height: 70px !important;
        background-color: #ffffff !important;
        z-index: 999999 !important;
        border-bottom: 1px solid #cccccc !important;
    }
    
    body .mobile_header .mobile-trigger,
    body .mobile_header .mobile-trigger-user,
    body .mobile_header .mobile-cart-link {
        display: block !important;
        position: absolute !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 999999 !important;
    }
    
    body .mobile_header .mobile-trigger { left: 15px !important; }
    body .mobile_header .mobile-trigger-user { right: 40px !important; }
    body .mobile_header .mobile-cart-link { right: 15px !important; }
    
    body .mobile_header .mobile-trigger i,
    body .mobile_header .mobile-trigger-user i {
        color: #000000 !important;
        font-size: 22px !important;
    }
    
    body .mobile_header .mobile-cart-link svg {
        fill: #000000 !important;
        width: 22px !important;
        height: 20px !important;
    }
    
    body .mobile_header .mobile-logo {
        display: block !important;
        text-align: center !important;
        margin: 0 auto !important;
        padding-top: 15px !important;
    }
    
    body .mobile_header .mobile-logo img {
        max-height: 40px !important;
        width: auto !important;
    }
    
    body .mobile_header .wpestream_cart_counter_header {
        position: absolute !important;
        top: -8px !important;
        right: 28px !important;
        background: #9b59b6 !important;
        color: white !important;
        border-radius: 50% !important;
        width: 18px !important;
        height: 18px !important;
        font-size: 10px !important;
        line-height: 18px !important;
        text-align: center !important;
        z-index: 1000000 !important;
    }
}

@media only screen and (min-width: 1025px) {
    body .mobile_header {
        display: none !important;
    }
}

/* ============================================
   2. HOMEPAGE - WHITE ICONS (Transparent Header)
   ============================================ */

.home .master_header .user_menu a,
.home .master_header .user_loged a,
.home .master_header .menu_username {
    color: #ffffff !important;
}

.home .master_header #shopping-cart_icon,
.home .master_header .wpestate_header_shoping_cart_icon svg {
    fill: #ffffff !important;
    color: #ffffff !important;
}

/* ============================================
   3. PROPERTY PAGES - TYPE 2 MOBILE LAYOUT
   ============================================ */

@media only screen and (max-width: 768px) {
    
    /* Stack the main row vertically */
    .single-estate_property .listing_type_2 .row.content-fixed-listing {
        display: flex !important;
        flex-direction: column !important;
    }
    
    /* Content column full width, first in order */
    .single-estate_property .listing_type_2 .col-md-8 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        order: 1 !important;
        float: none !important;
    }
    
    /* SIDEBAR: Show below content (booking form + map) */
    .single-estate_property .listing_type_2 .col-md-4.wpestate_sidebar_sticky,
    .single-estate_property .listing_type_2 #primary.col-md-4 {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        order: 2 !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        left: auto !important;
        margin-top: 30px !important;
        padding: 0 15px 30px 15px !important;
        box-sizing: border-box !important;
    }
    
    /* Force booking form visible */
    .single-estate_property #booking_form_request,
    .single-estate_property .booking_form_request {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        margin: 20px 0 !important;
        padding: 20px !important;
        background: #fff !important;
        border-radius: 8px !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    }
    
    /* Force map visible */
    .single-estate_property #listing_map_wrapper,
    .single-estate_property .property_page_container.google_map_type1 {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        height: 300px !important;
        min-height: 300px !important;
        margin: 30px 0 !important;
    }
    
    /* Calendar: show only first one, hide duplicates */
    .single-estate_property .booking-calendar:not(:first-of-type),
    .single-estate_property .wp-calendar:not(:first-of-type) {
        display: none !important;
    }
    
    .single-estate_property .booking-calendar:first-of-type,
    .single-estate_property .wp-calendar:first-of-type {
        display: block !important;
        width: 100% !important;
    }
    
    /* Hide CAD currency text from calendar price */
    .single-estate_property .wprentals_front_calendar_price {
        font-size: 0 !important;
        color: transparent !important;
    }
    
    .single-estate_property .wprentals_front_calendar_price span,
    .single-estate_property .wprentals_front_calendar_price .price_number,
    .single-estate_property .wprentals_front_calendar_price strong {
        font-size: 16px !important;
        color: #333 !important;
        display: inline-block !important;
    }
    
    /* Fix hero title position (right aligned) */
    .single-estate_property .listing_main_image h1.entry-title.entry-prop {
        white-space: normal !important;
        word-wrap: break-word !important;
        font-size: 24px !important;
        line-height: 1.3 !important;
        left: auto !important;
        right: 5% !important;
        text-align: right !important;
        max-width: 90% !important;
    }
    
    /* Hide empty sidebar widgets only */
    .single-estate_property .widget-area-sidebar:empty,
    .single-estate_property .listingsidebar:empty {
        display: none !important;
    }
    
    /* Prevent horizontal scroll */
    .single-estate_property .listing_type_2 {
        overflow-x: hidden !important;
    }
}

/* ============================================
   4. MENU & ICON COLORS
   ============================================ */

#access .menu li a:hover,
.nav li a:hover {
    color: #b881fc !important;
}

#access .current-menu-item > a {
    color: #b881fc !important;
}

.wpestate_header_shoping_cart_icon svg,
#shopping-cart_icon {
    fill: #333333 !important;
}

.menu_username {
    color: #333333 !important;
}

/* ============================================
   5. BOOKING FORM LIGHTNING ICON
   ============================================ */

#submit_booking_front_instant_wrap:after {
    content: "\f0e7";
    font-family: FontAwesome;
    position: relative;
    top: -36px;
    left: 48px;
    color: #d0fd76;
    font-size: 21px;
}

/* ============================================
   FIX TITLE CONTAINMENT & VIDEO
   ============================================ */

@media only screen and (max-width: 768px) {
    
    /* Fix title - contain within viewport */
    .single-estate_property .listing_main_image h1.entry-title.entry-prop {
        left: 5% !important; /* Change from right: 5% to left: 5% */
        right: 5% !important; /* Add right constraint */
        text-align: left !important; /* Left align for readability */
        width: 90% !important; /* Constrain width */
        max-width: 90% !important;
        font-size: 22px !important; /* Slightly smaller for mobile */
    }
    
    /* Make YouTube video responsive */
    .single-estate_property iframe,
    .single-estate_property .wp-block-embed__wrapper,
    .single-estate_property .property_media iframe {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 16/9;
    }
    
    /* Fix any video containers */
    .single-estate_property .property_video_wrapper,
    .single-estate_property .video-container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }
}

/* ============================================
   EMERGENCY FIXES - HERO & LAYOUT
   ============================================ */

@media only screen and (max-width: 768px) {
    
    /* HERO TITLE - Force visible */
    .single-estate_property .listing_main_image h1.entry-title.entry-prop {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: absolute !important;
        bottom: 20px !important;
        left: 5% !important;
        right: 5% !important;
        width: 90% !important;
        color: #fff !important;
        text-shadow: 0 2px 4px rgba(0,0,0,0.7) !important;
        z-index: 10 !important;
    }
    
    /* FORCE ALL IMAGES TO FIT SCREEN */
    .single-estate_property img,
    .single-estate_property .property_media img,
    .single-estate_property .listing_main_image img {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
    
    /* VIDEO RESPONSIVE */
    .single-estate_property iframe,
    .single-estate_property video,
    .single-estate_property embed {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 16/9;
        display: block !important;
    }
    
    /* PREVENT HORIZONTAL SCROLL */
    .single-estate_property,
    .single-estate_property .listing_type_2,
    .single-estate_property .row {
        max-width: 100vw !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }
    
    /* GALLERY CONTAINER FIX */
    .single-estate_property .property_media,
    .single-estate_property .property_media_section {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
}

.single-estate_property .listing_main_image {
    min-height: 300px !important;
    position: relative !important;
}

/* ============================================
   HERO TITLE - NUCLEAR FIX
   ============================================ */

@media only screen and (max-width: 768px) {
    
    /* Target the h1 directly by class combination */
    .single-estate_property h1.entry-title.entry-prop,
    .listing_main_image h1.entry-prop,
    .listing_main_image h1.entry-title,
    .single-estate_property .listing_main_image h1 {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: #ffffff !important;
        font-size: 22px !important;
        font-weight: 600 !important;
        text-align: center !important;
        width: 90% !important;
        margin: 0 auto !important;
        padding: 15px !important;
        position: absolute !important;
        bottom: 50px !important;
        left: 5% !important;
        right: 5% !important;
        z-index: 1000 !important;
        background-color: rgba(0,0,0,0.5) !important;
        border-radius: 4px !important;
        white-space: normal !important;
        word-wrap: break-word !important;
        line-height: 1.3 !important;
    }
    
    /* Ensure the parent container shows it */
    .listing_main_image {
        position: relative !important;
        min-height: 350px !important;
    }
    
    /* Hide only the star ratings if they're causing issues */
    .single-estate_property .property_ratings.listing_slider {
        display: block !important;
        margin-top: 5px !important;
    }
    
    /* FOOTER LOGO SIZE FIX */
    footer img,
    .site-footer img,
    .footer-logo img {
        max-height: 75px !important;
        width: auto !important;
    }
}

/* ============================================
   HIDE EMPTY SIDEBAR ON MOBILE
   ============================================ */

@media only screen and (max-width: 768px) {
    
    /* Hide the empty sidebar container after map */
    .single-estate_property #primary.col-md-4.widget-area-sidebar,
    .single-estate_property .wpestate_sidebar_sticky.widget-area-sidebar,
    .single-estate_property .listingsidebar:empty,
    .single-estate_property .widget-area-sidebar:empty,
    .single-estate_property #primary .xoxo:empty {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        visibility: hidden !important;
    }
}