/*
 * MXB Premier MLS Connector - agent microsite inventory, pager and maintenance state.
 *
 * Every visual decision is a --mxb-site-* custom property so the first-party
 * theme restyles without overriding selectors. Loaded on microsites only.
 */

:root {
    --mxb-site-gap: 1.5rem;
    --mxb-site-card-min: 17rem;
    --mxb-site-card-bg: #fff;
    --mxb-site-card-radius: 0;
    --mxb-site-card-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
    --mxb-site-text: #1d1d1d;
    --mxb-site-muted: #6b6b6b;
    --mxb-site-accent: #1d1d1d;
    --mxb-site-badge-bg: #2e7d32;
    --mxb-site-badge-sold-bg: #b71c1c;
    --mxb-site-badge-pending-bg: #1565c0;
    --mxb-site-badge-text: #fff;
    --mxb-site-font-price: inherit;
}

.mxb-site-inventory { color: var(--mxb-site-text); }

.mxb-site-inventory__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(var(--mxb-site-card-min), 1fr));
    gap: var(--mxb-site-gap);
    list-style: none;
    margin: 0;
    padding: 0;
}

.mxb-site-card { position: relative; }

.mxb-site-card__body {
    background: var(--mxb-site-card-bg);
    border-radius: var(--mxb-site-card-radius);
    box-shadow: var(--mxb-site-card-shadow);
    height: 100%;
    overflow: hidden;
}

.mxb-site-card__link {
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding-bottom: 1rem;
    text-decoration: none;
}

.mxb-site-card__link > :not(.mxb-site-card__photo):not(.mxb-site-card__badge) { padding: 0 1rem; }

.mxb-site-card__photo {
    aspect-ratio: 480 / 352;
    display: block;
    height: auto;
    object-fit: cover;
    width: 100%;
}

.mxb-site-card__badge {
    background: var(--mxb-site-badge-bg);
    color: var(--mxb-site-badge-text);
    font-size: 0.75rem;
    left: 0.75rem;
    padding: 0.2rem 0.5rem;
    position: absolute;
    top: 0.75rem;
}

.mxb-site-card__badge--sold { background: var(--mxb-site-badge-sold-bg); }
.mxb-site-card__badge--pending { background: var(--mxb-site-badge-pending-bg); }

.mxb-site-card__price { font-family: var(--mxb-site-font-price); font-size: 1.25rem; font-weight: 600; margin-top: 0.75rem; }
.mxb-site-card__address { color: var(--mxb-site-muted); }
.mxb-site-card__facts { display: flex; flex-wrap: wrap; gap: 1rem; font-size: 0.875rem; }
.mxb-site-card__mls { color: var(--mxb-site-muted); font-size: 0.75rem; }

.mxb-site-card__favorite {
    background: rgba(255, 255, 255, 0.9);
    border: 0;
    border-radius: 50%;
    color: var(--mxb-site-accent);
    cursor: pointer;
    font-size: 1.25rem;
    height: 2.25rem;
    line-height: 1;
    position: absolute;
    right: 0.75rem;
    top: 0.75rem;
    width: 2.25rem;
}

.mxb-site-card__favorite:focus-visible,
.mxb-site-card__link:focus-visible,
.mxb-site-pager__link:focus-visible { outline: 2px solid var(--mxb-site-accent); outline-offset: 2px; }

.mxb-site-pager {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: center;
    margin: var(--mxb-site-gap) 0;
}

.mxb-site-pager__link { color: var(--mxb-site-accent); }
.mxb-site-pager__status { color: var(--mxb-site-muted); }

.mxb-site-inventory__notice,
.mxb-site-maintenance__message {
    color: var(--mxb-site-muted);
    margin: var(--mxb-site-gap) 0;
    text-align: center;
}

.mxb-site-maintenance-page { padding: 4rem 1rem; }

/* Search: the filter form and the Active / Pending / Sold tabs. */
.mxb-site-search__form {
    align-items: end;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: var(--mxb-site-gap);
}

.mxb-site-search__field { display: flex; flex: 1 1 10rem; flex-direction: column; gap: 0.25rem; }
.mxb-site-search__label { color: var(--mxb-site-muted); font-size: 0.75rem; text-transform: uppercase; }
.mxb-site-search__field select { min-height: 2.5rem; width: 100%; }
.mxb-site-search__actions { align-items: center; display: flex; gap: 1rem; }

.mxb-site-search__submit {
    background: var(--mxb-site-accent);
    border: 0;
    color: var(--mxb-site-badge-text);
    cursor: pointer;
    min-height: 2.5rem;
    padding: 0 1.5rem;
}

.mxb-site-search__clear { color: var(--mxb-site-muted); }

.mxb-site-search__tabs {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    margin-bottom: var(--mxb-site-gap);
}

.mxb-site-search__tab {
    border: 1px solid var(--mxb-site-accent);
    color: var(--mxb-site-accent);
    min-width: 7rem;
    padding: 0.4rem 1rem;
    text-align: center;
    text-decoration: none;
}

.mxb-site-search__tab--current { background: var(--mxb-site-accent); color: var(--mxb-site-badge-text); }

.mxb-site-search__submit:focus-visible,
.mxb-site-search__tab:focus-visible { outline: 2px solid var(--mxb-site-accent); outline-offset: 2px; }

/* Listing detail. */
.mxb-site-detail { color: var(--mxb-site-text); display: flex; flex-direction: column; gap: var(--mxb-site-gap); }

.mxb-site-detail__header {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: var(--mxb-site-gap);
    justify-content: space-between;
}

.mxb-site-detail__address { margin: 0; }
.mxb-site-detail__locality,
.mxb-site-detail__price-caption { color: var(--mxb-site-muted); margin: 0.25rem 0 0; }
.mxb-site-detail__pricing { text-align: right; }
.mxb-site-detail__price { font-family: var(--mxb-site-font-price); font-size: 1.75rem; font-weight: 600; margin: 0.25rem 0 0; }

.mxb-site-detail__status {
    background: var(--mxb-site-badge-bg);
    color: var(--mxb-site-badge-text);
    font-size: 0.75rem;
    padding: 0.2rem 0.5rem;
}

.mxb-site-detail--sold .mxb-site-detail__status { background: var(--mxb-site-badge-sold-bg); }

.mxb-site-detail__favorite {
    background: transparent;
    border: 1px solid var(--mxb-site-accent);
    color: var(--mxb-site-accent);
    cursor: pointer;
    margin-top: 0.75rem;
    min-height: 2.5rem;
    padding: 0 1rem;
}

.mxb-site-detail__gallery {
    display: grid;
    gap: 0.5rem;
    grid-auto-columns: minmax(80%, 1fr);
    grid-auto-flow: column;
    list-style: none;
    margin: 0;
    overflow-x: auto;
    padding: 0;
    scroll-snap-type: x mandatory;
}

.mxb-site-detail__photo { scroll-snap-align: start; }
.mxb-site-detail__photo img { aspect-ratio: 3 / 2; display: block; height: auto; object-fit: cover; width: 100%; }

.mxb-site-detail__facts {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
    margin: 0;
}

.mxb-site-detail__fact dt,
.mxb-site-detail__row dt { color: var(--mxb-site-muted); font-size: 0.75rem; text-transform: uppercase; }
.mxb-site-detail__fact dd,
.mxb-site-detail__row dd { margin: 0; }

.mxb-site-detail__section { border-top: 1px solid rgba(0, 0, 0, 0.12); padding: 0.75rem 0; }
.mxb-site-detail__section summary { cursor: pointer; font-weight: 600; }
.mxb-site-detail__section dl {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
    margin: 0.75rem 0 0;
}

.mxb-site-detail__attribution { color: var(--mxb-site-muted); font-size: 0.75rem; }

.mxb-site-detail__favorite:focus-visible,
.mxb-site-detail__section summary:focus-visible { outline: 2px solid var(--mxb-site-accent); outline-offset: 2px; }

.mxb-site-detail-page { padding: 2rem 1rem; }
.mxb-site-notice { margin: var(--mxb-site-gap) 0; text-align: center; }
.mxb-site-notice__message { color: var(--mxb-site-muted); }

/* Detail contact form (SiteContact: the main site's native lead form). */
.mxb-site-contact { margin: var(--mxb-site-gap) 0; color: var(--mxb-site-text); }
.mxb-site-contact__title { margin: 0 0 1rem; font-size: 1.25rem; }
.mxb-site-contact .mxb-pml-native-lead-form { display: grid; gap: 0.75rem; max-width: 40rem; }
.mxb-site-contact .mxb-pml-lead-row { display: grid; gap: 0.75rem; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
.mxb-site-contact .mxb-pml-lead-field { display: grid; gap: 0.25rem; }
.mxb-site-contact .mxb-pml-lead-field label { font-size: 0.875rem; }
.mxb-site-contact input[type="text"],
.mxb-site-contact input[type="email"],
.mxb-site-contact input[type="tel"],
.mxb-site-contact textarea { width: 100%; box-sizing: border-box; padding: 0.5rem; border: 1px solid var(--mxb-site-muted); font: inherit; }
.mxb-site-contact textarea { min-height: 7rem; }
.mxb-site-contact .mxb-pml-lead-extra { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.mxb-site-contact .mxb-pml-captcha { display: flex; gap: 0.5rem; align-items: center; }
.mxb-site-contact button[type="submit"] { padding: 0.6rem 1.5rem; border: 0; background: var(--mxb-site-accent); color: #fff; font: inherit; cursor: pointer; }
.mxb-site-contact button[type="submit"][disabled] { opacity: 0.6; cursor: progress; }
.mxb-site-contact button[type="submit"]:focus-visible,
.mxb-site-contact input:focus-visible,
.mxb-site-contact textarea:focus-visible { outline: 2px solid var(--mxb-site-accent); outline-offset: 2px; }
.mxb-site-contact .mxb-pml-lead-response.is-success { color: var(--mxb-site-badge-bg); }
.mxb-site-contact .mxb-pml-lead-response.is-error { color: var(--mxb-site-badge-sold-bg); }