/**
 * Responsive Stylesheet for the Property Website Frontend
 */

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    .hero-section .min-vh-75 {
        min-height: 60vh;
    }
    
    .hero-section h1 {
        font-size: 2rem;
    }
    
    .search-box {
        margin-top: 0;
        border-radius: 0;
    }
    
    .property-details .property-main-image {
        height: 250px;
    }
    
    .property-details .property-thumbnail {
        height: 60px;
    }
    
    .property-details .attribute-item {
        width: 100%;
    }
    
    .team-member-info {
        margin-left: 10px;
        margin-right: 10px;
        padding: 1rem;
    }
    
    .contact-info-item {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    .contact-info-icon {
        margin-right: 0;
        margin-bottom: 1rem;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
    .hero-section .min-vh-75 {
        min-height: 65vh;
    }
    
    .search-box {
        margin-top: -25px;
    }
    
    .property-details .property-main-image {
        height: 300px;
    }
    
    .property-details .property-thumbnail {
        height: 70px;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .hero-section .min-vh-75 {
        min-height: 70vh;
    }
    
    .search-box {
        margin-top: -35px;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .hero-section .min-vh-75 {
        min-height: 70vh;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }
}

/* Custom responsive classes */
@media (max-width: 767.98px) {
    .text-md-start {
        text-align: center !important;
    }
    
    .text-md-end {
        text-align: center !important;
    }
    
    .mb-md-0 {
        margin-bottom: 1.5rem !important;
    }
    
    .mb-md-4 {
        margin-bottom: 1.5rem !important;
    }
    
    .d-md-flex {
        display: block !important;
    }
    
    .justify-content-md-end {
        justify-content: center !important;
    }
    
    .ms-md-auto {
        margin-left: auto !important;
    }
}

/* Navbar responsive */
@media (max-width: 991.98px) {
    .navbar-collapse {
        padding: 1rem 0;
    }
    
    .navbar-nav {
        margin-bottom: 1rem;
    }
    
    .navbar-nav .nav-link {
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    }
    
    .navbar-nav .nav-item:last-child .nav-link {
        border-bottom: none;
    }
    
    .navbar .ms-lg-3 {
        margin-left: 0 !important;
    }
    
    .navbar .btn {
        display: block;
        width: 100%;
    }
}

/* Property cards responsive */
@media (max-width: 767.98px) {
    .property-card {
        margin-bottom: 1.5rem;
    }
    
    .category-card {
        margin-bottom: 1.5rem;
    }
}

/* Footer responsive */
@media (max-width: 767.98px) {
    footer .col-lg-4,
    footer .col-lg-2,
    footer .col-lg-3 {
        text-align: center;
    }
    
    footer .d-flex {
        justify-content: center;
    }
    
    footer .social-icon {
        margin: 0 0.5rem;
    }
    
    footer .list-inline {
        margin-top: 1rem;
    }
    
    footer .list-inline-item {
        margin-right: 0.5rem !important;
        margin-left: 0.5rem !important;
    }
}

/* Search page responsive */
@media (max-width: 991.98px) {
    .filter-sidebar {
        margin-bottom: 2rem;
    }
}

/* Property details page responsive */
@media (max-width: 767.98px) {
    .property-details .property-gallery {
        margin-bottom: 1.5rem;
    }
    
    .property-details .property-info {
        padding: 1rem;
    }
}

/* Contact page responsive */
@media (max-width: 991.98px) {
    .contact-info {
        margin-bottom: 2rem;
    }
    
    .contact-form {
        padding: 1.5rem;
    }
}

/* Login & Register page responsive */
@media (max-width: 575.98px) {
    .auth-card {
        padding: 1.5rem;
        margin: 1rem;
    }
}