/* ===================================
   HEADER - Import common styles first
=================================== */
/* Link: @import 'common.css'; */

/* Top Bar */
.top-header-bar {
    background-color: #f17a37;
    color: white;
    font-size: 13px;
    padding: 6px 0;
}
.top-header-bar span { margin-left: 20px; }

/* Navbar */
.main-nav { padding: 10px 0; }
.logo-img-responsive { height: 60px;width: auto; transition: height 0.3s; }

@media (max-width: 768px) {
    .logo-img-responsive { height: 45px; }
}

.city-select {
    font-weight: var(--font-weight-medium);
    color: #333 !important;
}

/* Mega Menu (City) */
.mega-menu {
    width: 100%;
    left: 0;
    right: 0;
    margin-top: 0;
    border-radius: 0 0 15px 15px;
}
.mega-menu h6 {
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    color: #444;
}
.mega-menu a {
    display: block;
    font-size: 13px;
    color: #666;
    padding: 3px 0;
    text-decoration: none;
}
.mega-menu a:hover { color: #f17a37; }

/* Profile Dropdown */
.profile-icon { font-size: 28px; color: #444; }
.profile-dropdown {
    width: 220px;
    border-radius: var(--radius-medium);
}
.profile-dropdown .dropdown-item {
    font-size: 14px;
    padding: 8px 20px;
}

/* Orange Button - Now defined in common.css */
/* .btn-post-property { base styles in common.css } */

/* Utility Classes - Now in common.css */
/* .position-static { defined in common.css } */
/* Global Mobile Responsiveness Overrides */
@media (max-width: 768px) {
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .main-header .navbar-brand img {
        height: 40px !important;
    }
    .navbar-toggler {
        padding: 0.25rem 0.5rem;
    }
    .hero-title {
        font-size: 2rem !important;
        line-height: 1.2;
    }
    .search-box {
        padding: 1rem !important;
        margin-top: 1rem;
    }
    .property-tabs {
        margin-bottom: 1rem !important;
    }
    .info-card {
        padding: 1rem !important;
    }
    .gallery-main, #propertyGalleryCarousel .carousel-item img {
        height: 250px !important;
    }
    .city-tabs {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .city-tabs::-webkit-scrollbar {
        display: none;
    }
    .city-tab {
        white-space: nowrap;
    }
    /* Fixed fluid container padding on properties list */
    .container-fluid {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}