/* Import Google Font */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&display=swap');

body {
    font-family: 'Montserrat', sans-serif;
    /* overflow-x: hidden; */ /* Use wrapper div instead */
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 70px; /* Increased slightly for potential header changes */
}

/* --- Header --- */
header.scrolled {
    background-color: hsl(var(--b1) / 0.95); /* Use DaisyUI background color */
/*    box-shadow: 0 2px 4px rgba(0,0,0,0.1);*/
    /* Ensure text/icons remain visible on scroll */
    --tw-text-opacity: 1;
    color: hsl(var(--bc) / var(--tw-text-opacity)); /* DaisyUI text color */
}
header.scrolled .text-white { /* Override initial text-white */
     --tw-text-opacity: 1;
    color: hsl(var(--bc) / var(--tw-text-opacity));
}
header.scrolled .btn-ghost { /* Ensure mobile toggle is visible */
     --tw-text-opacity: 1;
    color: hsl(var(--bc) / var(--tw-text-opacity));
}
header.scrolled a:hover {
    color: hsl(var(--p) / 1); /* Use Primary color for hover on scroll */
}
header.scrolled #header-contact-icons a {
    color: hsl(var(--bc) / 0.8); /* Slightly muted icon color */
}
header.scrolled #header-contact-icons a:hover {
    color: hsl(var(--p) / 1);
}

header.scrolled #brokerlogo {
    opacity:0;
}

#brokerlogo{
    transition: opacity 0.3s ease-in-out; /* Match hero fade transition */
}

#header-contact-icons {
    transition: opacity 0.3s ease-in-out; /* Match hero fade transition */
}
#header-contact-icons a {
    transition: color 0.2s ease-in-out;
}


/* --- Hero Animation --- */
.hero-fade-item {
    opacity: 0;
    transition: opacity 0.6s ease-out;
}
.hero-fade-item.is-visible {
    opacity: 1;
}

#hero video {
    filter: brightness(0.7);
}

/* --- Awards Section --- */
#awards img {
    filter: grayscale(50%); /* Make awards slightly less prominent */
    opacity: 0.8;
    transition: filter 0.3s ease, opacity 0.3s ease;
}
#awards img:hover {
    filter: grayscale(0%);
    opacity: 1;
}

/* --- Swiper --- */
.swiper-pagination-bullet {
    background-color: #A9A9A9;
    opacity: 0.7;
    transition: background-color 0.3s ease, opacity 0.3s ease;
}
.swiper-pagination-bullet-active {
    background-color: hsl(var(--p) / 1);
    opacity: 1;
}

/* --- Listing Card --- */
.listing-card img {
     transition: transform 0.3s ease-in-out;
}
.listing-card:hover img {
    transform: scale(1.05);
}

/* --- Contact Item --- */
.contact-item i, .contact-item a {
    transition: color 0.3s ease-in-out;
}
.contact-item:hover i {
    color: hsl(var(--p) / 0.8);
}
.contact-item:hover a {
    color: hsl(var(--p) / 0.8);
}


/* Fix Swiper slide height issues */
.swiper-slide {
    height: auto;
    display: flex;
    flex-direction: column;
}
.listing-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.listing-card > div:first-child {
     flex-shrink: 0;
}
/* Removed margin-top: auto as it might conflict with flex */


/* --- Modal Styling --- */
.modal {
    /* Smooth fade-in/out */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-out, visibility 0.3s ease-out;
    backdrop-filter: blur(3px); /* Optional: blur background */
}
.modal.modal-open {
    opacity: 1;
    visibility: visible;
}
.modal-box {
    /* Smooth slide-in */
    transform: translateY(-30px);
    transition: transform 0.3s ease-out;
}
.modal.modal-open .modal-box {
    transform: translateY(0);
}

/* Progress Dots */
#modal-progress-dots .progress-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: hsl(var(--bc) / 0.2); /* Inactive color */
    transition: background-color 0.3s ease;
}
#modal-progress-dots .progress-dot.active {
    background-color: hsl(var(--p) / 1); /* Active color (primary) */
}

/* Modal Steps */
.modal-step {
    display: none; /* Hide steps by default */
    animation: fadeIn 0.5s ease-out; /* Simple fade-in for steps */
}
.modal-step.active {
    display: block; /* Show active step */
}

/* Step Buttons (Cities, Bed/Bath, Price) */
.city-options .city-button.selected,
.modal-step .bed-bath-button.selected,
#price-range-options .price-button.selected {
    background-color: hsl(var(--p) / 1);
    color: hsl(var(--pc) / 1);
    border-color: hsl(var(--p) / 1);
}
.city-options .city-button,
.modal-step .bed-bath-button,
#price-range-options .price-button {
     transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* Make modal captcha container centered */
#modal-recaptcha-container > div {
    margin: 0 auto;
}


@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Ensure form labels have space */
#contact-form .label, #find-home-form .label {
    padding-bottom: 0.25rem;
}

/* Specificity needed to override DaisyUI button disabled state visually */
.modal-prev-button:disabled {
    background-color: transparent !important;
    border-color: hsl(var(--b3)) !important; /* Match DaisyUI disabled border */
    color: hsl(var(--bc) / 0.2) !important;  /* Match DaisyUI disabled text */
    cursor: not-allowed;
}

/* Add some space below form elements for error messages */
#contact-form-message:not(:empty),
#modal-form-message:not(:empty) {
    margin-top: 1rem;
    padding: 0.5rem;
    border-radius: 0.25rem;
}
#contact-form-message.success,
#modal-form-message.success {
    color: green;
    border: 1px solid green;
}
#contact-form-message.error,
#modal-form-message.error {
    color: red;
    border: 1px solid red;
}