/* Custom CSS for Aroeira Corretor Website */

/* General Styles & Fonts */


body {
    font-family: 'Poppins', sans-serif;
    color: #333;
    background-color: #fff;
    padding-top: 75px; /* Adjust for fixed navbar height */
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
}

/* Override Bootstrap Colors */
.text-primary { color: var(--primary-color) !important; }
.btn-primary {
    background-color: var(--dark-blue-footer); /* Darker shade of primary */
    border-color: #062b5a;
    transition: all 0.3s ease;
}
.btn-primary:hover {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
.btn-outline-primary {
    color: var(--primary-color);
    border-color: var(--primary-color);
}
.btn-outline-primary:hover {
    background-color: var(--primary-color);
    color: #fff;
}
.btn-warning {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
    color: #fff;
    transition: all 0.3s ease;
}
.btn-warning:hover {
    background-color: #cc7a00; /* Darker shade of secondary */
    border-color: #cc7a00;
    color: #fff;
}

.badge.bg-success { background-color: #28a745 !important; }
.badge.bg-primary { background-color: var(--primary-color) !important; }
.badge.bg-warning { background-color: var(--secondary-color) !important; color: #333 !important;}
.badge.bg-info { background-color: #17a2b8 !important; }

.bg-light-blue { background-color: var(--light-blue-bg); }
.bg-dark-cinza { background-color: #e6eaf1;  }
.footer-dark { background-color: var(--dark-blue-footer); }
.border-white-50 { border-color: rgba(255, 255, 255, 0.25) !important; }

/* Navbar */
.navbar {
    background-color: var(--dark-blue-footer); /* White background */
    color: #fff; /* White text */
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    z-index: 1030; /* Ensure navbar is above other content */
}
.navbar-brand .text-primary {
    color: #fff !important; /* White text for brand */
    font-size: 1.4rem; /* Slightly larger font size */
}
.navbar-brand .text-secondary {
    color: #ececec !important; /* White text for brand */
    font-size: 0.8rem; /* Slightly larger font size */
}
.navbar-brand .logo {
    width: 35px;
}
.navbar-nav .nav-link {
    color: #c7c7c7;
    font-weight: 500;
    padding-right: 1.2rem;
    padding-left: 1.2rem;
    transition: color 0.3s ease;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color:#fff !important; /* White text on hover */
}
.navbar-toggler {
    border-color: #fff!important;
}
.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* Cinza claro (#cccccc) */
.navbar-dark .navbar-toggler-icon.cinza {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23cccccc' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* Hero Section */

.hero-section {
    height: 90vh; /* Adjust as needed */
    background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)), url('/img/hero-bg.jpg') no-repeat center center/cover;
    background-size: cover;
    position: relative;
    color: white;
    padding-top: 150px; /* Space for the fixed navbar */
    padding-bottom: 200px; /* Space for the search overlay */
}

.hero-section h3 {
    text-shadow: 0 1px 3px rgba(0,0,0,0.5);
    font-size: 4.5rem;
    line-height: 1.1;
}

/* Search Form Overlay */
.search-form-overlay {
    position: absolute;
    bottom: -100px; /* Half of its height above the bottom of the hero section */
    left: 50%;
    transform: translateX(-50%);
    max-width: 1100px;
    z-index: 2;
    border-radius: 1rem !important;
    padding: 2.5rem !important;
}
.search-form-overlay .form-label {
    font-size: 0.85rem;
    margin-bottom: 0.5rem;
}
.search-form-overlay .form-control,
.search-form-overlay .form-select {
    height: calc(2.8rem + 2px);
    border-radius: 0.5rem;
    font-size: 0.95rem;
}

/* Featured Property Section */
.icon-stat {
    background-color: #f8f9fa; /* Lighter background for stat boxes */
    border-radius: 0.75rem !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%; /* Ensure they take full width of column */
    padding: 1rem !important;
    min-height: 100px;
}
.icon-stat i {
    font-size: 2rem;
    margin-bottom: 0.5rem;
}
.icon-stat p {
    font-size: 1.5rem; /* Larger number for stats */
}
.icon-stat small {
    font-size: 0.8rem;
}

.feature-list i {
    font-size: 0.9rem;
}

/* Property Cards */
.card.rounded-4 {
    border-radius: 1rem !important;
}
.card-img-top.rounded-top-4 {
    border-top-left-radius: 1rem !important;
    border-top-right-radius: 1rem !important;
    height: 220px; /* Fixed height for image consistency */
    object-fit: cover;
}
.card .badge {
    border-radius: 0.5rem;
    font-size: 0.8rem;
}
.card .card-title {
    font-size: 1.5rem;
}
.card .card-subtitle {
    font-size: 1.1rem;
}
.card .card-body .d-flex.justify-content-around div {
    font-size: 0.9rem;
}
.card .card-body .d-flex.justify-content-around i {
    font-size: 1.2rem;
}

/* Broker Section */
.broker-photo {
    width: 250px;
    height: 250px;
    object-fit: cover;
    border: 5px solid var(--primary-color);
}
.stat-box {
    min-width: 180px;
    min-height: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    margin: 0 10px;
    background-color: #f8f9fa;
    border: 1px solid rgba(0,0,0,0.05);
}
.stat-box p {
    font-size: 2.5rem; /* Larger number */
}

/* Social Icons */
.social-icons .btn {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    background-color: #fff;
    border-radius: 50% !important; /* Ensure perfect circle */
}
.social-icons .btn:hover {
    background-color: var(--primary-color);
    color: #fff;
}
.social-icons .btn:hover i {
    color: #fff !important;
}

/* Contact/Office Section */
.map-placeholder {
    height: 250px;
    background-color: #e9ecef;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
    font-size: 1.2rem;
}

.map-placeholder iframe {
    border-radius: 0.75rem;
}

/* Footer */
.footer-dark {
    background-color: var(--dark-blue-footer);
}
.footer-dark .navbar-brand .text-white {
    color: #fff;
}
.footer-dark .list-unstyled a {
    transition: color 0.3s ease;
}
.footer-dark .list-unstyled a:hover {
    color: #fff !important;
}
.footer-dark .input-group .form-control {
    border-top-left-radius: 50rem !important;
    border-bottom-left-radius: 50rem !important;
    border-right: none;
}
.footer-dark .input-group .btn {
    border-top-right-radius: 50rem !important;
    border-bottom-right-radius: 50rem !important;
    border-left: none;
}


/* Responsive Adjustments */
@media (max-width: 1200px) {
    .hero-section h1 {
        font-size: 3.5rem;
    }
}

@media (max-width: 991.98px) {
    .navbar-toggler {
        border-color: var(--primary-color);
    }
    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgb(10, 67, 135)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }
    .navbar-nav {
        text-align: center;
        margin-top: 1rem;
    }
    .navbar-nav .nav-item {
        margin-bottom: 0.5rem;
    }
    .d-flex.flex-lg-row {
        justify-content: center;
        margin-top: 1rem;
    }
    .hero-section {
        height: auto; /* Adjust height for smaller screens */
        min-height: 70vh;
        padding-bottom: 150px; /* Give space for overlay */
    }
    .search-form-overlay {
        position: relative; /* Make it flow naturally below hero text */
        bottom: auto;
        left: auto;
        transform: none;
        width: 95%; /* Adjust width for smaller screens */
        margin-top: 3rem; /* Space from hero text */
        padding: 2rem !important;
    }
    .search-form-overlay .col-md-1, .search-form-overlay .col-12 {
        margin-top: 1rem;
    }
    .search-form-overlay .btn {
        height: calc(2.8rem + 2px);
    }
    .hero-section h1 {
        font-size: 2.8rem;
    }
    .hero-section .lead, .hero-section p {
        font-size: 1rem;
    }
    .stat-box {
        min-width: unset;
        width: 48%; /* Adjust for 2 columns */
        margin: 5px 0;
    }
}

@media (max-width: 767.98px) {
    body {
        padding-top: 60px; /* Smaller navbar on mobile */
    }
    .hero-section {
        padding-top: 80px;
        min-height: 60vh;
    }
    .hero-section h1 {
        font-size: 2rem;
    }
    .hero-section .lead {
        font-size: 0.9rem;
    }
    .hero-section p {
        font-size: 0.8rem;
    }
    .search-form-overlay {
        padding: 1.5rem !important;
    }
    .search-form-overlay .form-label {
        font-size: 0.75rem;
    }
    .search-form-overlay .form-control,
    .search-form-overlay .form-select {
        height: calc(2.5rem + 2px);
        font-size: 0.85rem;
    }
    .search-form-overlay .btn {
        height: calc(2.5rem + 2px);
    }

    /* Adjust broker section layout for smaller screens */
    .broker-photo {
        width: 180px;
        height: 180px;
    }
    .stat-box {
        width: 100%; /* Full width for single column */
        margin-bottom: 10px;
    }
    .d-flex.justify-content-around.text-center.mb-4 {
        flex-direction: column;
        align-items: center;
    }
    .social-icons .btn {
        width: 38px;
        height: 38px;
        font-size: 0.9rem;
    }
}
/* Custom CSS for Aroeira Corretor Website (Continued) */

/* Adjust body padding top for other pages that don't have hero-section */
.catalog-filter-section, .property-hero-banner {
    padding-top: 100px; /* Space for the fixed navbar for these sections */
}

/* Catalog Page Filter Section */
.catalog-filter-section {
    position: relative;
    z-index: 1; /* Ensure it's above other elements if needed */
    padding-bottom: 70px; /* Adjust padding if needed */
}

.search-form-flat {
    border-radius: 1rem !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08); /* Lighter shadow than hero overlay */
    max-width: 1100px;
    margin: 0 auto; /* Center the form */
}

/* Property Hero Banner (Details Page) */
.property-hero-banner {
    height: 40vh; /* Shorter than main hero, just a banner */
    background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)), url('img/featured-property-main.jpg') no-repeat center center/cover; /* Replace with dynamic image */
    background-size: cover;
    color: white;
    text-shadow: 0 1px 3px rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center; /* Center content horizontally */
    text-align: center; /* Center text within the content */
}
.property-hero-banner h1 {
    font-size: 3.5rem;
    line-height: 1.2;
}
.property-hero-banner .lead {
    font-size: 1.5rem;
}

/* Card Link Style (for Catalog and Carousel) */
.card-link {
    text-decoration: none;
    color: inherit; /* Inherit text color from parent */
}
.card-link:hover .card {
    transform: translateY(-5px); /* Lift card on hover */
    box-shadow: 0 8px 20px rgba(0,0,0,0.15) !important; /* Stronger shadow on hover */
}
.card-link .card {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

/* Carousel for Recommended Properties */
#recommendedPropertiesCarousel .carousel-inner .row {
    padding: 0 15px; /* Add some padding to rows inside carousel for better spacing */
}

#recommendedPropertiesCarousel .carousel-control-prev,
#recommendedPropertiesCarousel .carousel-control-next {
    width: 5%; /* Make controls smaller */
    background-image: none; /* Remove default background */
    opacity: 1; /* Always visible */
    top: 50%; /* Center vertically */
    transform: translateY(-50%);
    color: var(--primary-color); /* Icon color */
}

#recommendedPropertiesCarousel .carousel-control-prev-icon,
#recommendedPropertiesCarousel .carousel-control-next-icon {
    filter: invert(1); /* Make default white icons visible on darker background */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230a4387'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
    width: 2rem;
    height: 2rem;
    background-size: 100%, 100%;
}

#recommendedPropertiesCarousel .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230a4387'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* Responsive Adjustments for new pages */
@media (max-width: 991.98px) {
    .catalog-filter-section, .property-hero-banner {
        padding-top: 80px; /* Adjust for smaller navbar */
    }
    .catalog-filter-section .search-form-flat {
        padding: 2rem !important;
    }
    .property-hero-banner h1 {
        font-size: 2.5rem;
    }
    .property-hero-banner .lead {
        font-size: 1.2rem;
    }
}

@media (max-width: 767.98px) {
    .catalog-filter-section .search-form-flat {
        padding: 1.5rem !important;
    }
    .property-hero-banner h1 {
        font-size: 2rem;
    }
    .property-hero-banner .lead {
        font-size: 1rem;
    }
    /* Hide some cards in carousel for smaller screens */
    #recommendedPropertiesCarousel .carousel-item .col:nth-child(2),
    #recommendedPropertiesCarousel .carousel-item .col:nth-child(3) {
        display: none;
    }
    #recommendedPropertiesCarousel .carousel-item .col:first-child {
        display: block; /* Ensure at least one card is visible */
    }
    #recommendedPropertiesCarousel .carousel-control-prev,
    #recommendedPropertiesCarousel .carousel-control-next {
        width: 10%;
    }
}

/* Show 2 cards on medium screens (md) in carousel */
@media (min-width: 768px) and (max-width: 991.98px) {
    #recommendedPropertiesCarousel .carousel-item .col:nth-child(3) {
        display: none;
    }
    #recommendedPropertiesCarousel .carousel-item .col {
        flex: 0 0 auto;
        width: 50%;
    }
}

/* Show 3 cards on large screens (lg) and up in carousel */
@media (min-width: 992px) {
    #recommendedPropertiesCarousel .carousel-item .col {
        flex: 0 0 auto;
        width: 33.333333%;
    }
}

.fs-6 {
    font-size: 1rem !important;
}
.fs-7 {
    font-size: 0.875rem !important;
}   