/* RapidRoomz 100% Mobile App & Responsive Web Optimization Stylesheet */

/* 1. Global Viewport & Reset */
html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
    -webkit-tap-highlight-[#167A70]/10;
    -webkit-text-size-adjust: 100%;
}

/* Mobile Safe Area Inset Support */
.pt-safe {
    padding-top: env(safe-area-inset-top, 0px);
}
.pb-safe {
    padding-bottom: env(safe-area-inset-bottom, 0px);
}

/* 2. Mobile Form Input Auto-Zoom Prevention (16px base on small screens) */
@media screen and (max-width: 768px) {
    input[type="text"],
    input[type="email"],
    input[type="number"],
    input[type="tel"],
    input[type="password"],
    input[type="date"],
    select,
    textarea {
        font-size: 16px !important;
        min-height: 44px !important;
    }

    /* Buttons minimum touch target size */
    button, 
    .btn, 
    a.button {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* Mobile Container Padding Adjustments */
    .container {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

/* 3. Smooth Horizontal Touch Scrollbars */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

/* 4. Responsive Card Grids & Image Ratios */
.property-card-img {
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}

/* 5. Mobile Search & Filter Box Overflows */
@media screen and (max-width: 640px) {
    .search-hero-box {
        padding: 16px !important;
        border-radius: 16px !important;
    }

    .mobile-grid-1col {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }

    /* Mobile Sticky Bottom Booking Bar */
    .mobile-sticky-booking {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: #ffffff;
        border-top: 1px solid #e2e8f0;
        padding: 12px 16px;
        z-index: 999;
        box-shadow: 0 -4px 15px rgba(0,0,0,0.1);
    }
}

/* 6. Typography & Text Truncation */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.line-clamp-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 7. Image Gallery Responsive Grid */
@media screen and (max-width: 768px) {
    .property-gallery-grid {
        grid-template-columns: 1fr !important;
    }
    .property-gallery-secondary {
        display: none !important;
    }
}