/* Checklist markup shared by the Amenities and Features blocks. */

/* ul.* so a theme's `.entry-content ul` indent doesn't out-specify these. */
ul.doneff-checklist {
    list-style: none;
    margin: 0;
    margin-left: 0;
    padding: 0;
    padding-left: 0;
    text-indent: 0;
}

.doneff-checklist__item {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    column-gap: 0.85em;
    margin: 0 0 0.7em;
    color: #1f2328;
    font-size: 1.0625rem;
    line-height: 1.45;
}

.doneff-checklist__item:last-child {
    margin-bottom: 0;
}

.doneff-checklist__icon {
    width: 1.1em;
    height: 1.1em;
    margin-top: 0.18em;
    color: #2a2f36;
}

.doneff-block__heading {
    margin: 0 0 0.75em;
}

/* Property Manager contact card. */
.doneff-block-property-manager {
    margin-top: 1rem;
}

.doneff-pm-card {
    --doneff-pm-accent: #729C5D;
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
    max-width: 26rem;
    margin-left: auto;
    margin-right: auto;
    padding: 1.5rem;
    border: 1px solid #e6e8ec;
    border-radius: 14px;
    background: linear-gradient(180deg, #fff 0%, #fafbfc 100%);
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 8px 24px -12px rgba(16, 24, 40, 0.14);
    color: #1f2328;
}

.doneff-pm-card__head {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}

.doneff-pm-card__avatar {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background: var(--doneff-pm-accent);
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1;
}

/* Photo variant: wider card, photo on the left, all text on the right. */
.doneff-pm-card--has-photo {
    flex-direction: row;
    align-items: center;
    gap: 1.5rem;
    max-width: 38rem;
}

.doneff-pm-card__figure {
    flex: 0 0 auto;
    width: 9.5rem;
    overflow: hidden;
    border-radius: 12px;
    background: #eef0f3;
    line-height: 0;
}

.doneff-pm-card__photo {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    object-position: center top;
}

.doneff-pm-card__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 1.15rem;
    min-width: 0;
}

/* Stack the photo above the text on narrow screens. */
@media (max-width: 30rem) {
    .doneff-pm-card--has-photo {
        flex-direction: column;
        align-items: flex-start;
        gap: 1.15rem;
    }

    .doneff-pm-card__figure {
        width: 7.5rem;
    }
}

.doneff-pm-card__identity {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.doneff-pm-card__label {
    color: #6b7280;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.doneff-pm-card__name {
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
}

/* ul.* so a theme's `.entry-content ul` indent doesn't out-specify these. */
ul.doneff-pm-card__contact {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    list-style: none;
    margin: 0;
    margin-left: 0;
    padding: 1.15rem 0 0;
    padding-left: 0;
    border-top: 1px solid #eef0f3;
    text-indent: 0;
}

.doneff-pm-card__row {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    column-gap: 0.7rem;
    margin: 0;
    font-size: 1rem;
    line-height: 1.4;
}

.doneff-pm-card__icon {
    width: 1.05em;
    height: 1.05em;
    color: var(--doneff-pm-accent);
}

.doneff-pm-card__value {
    color: inherit;
    text-decoration: none;
    overflow-wrap: anywhere;
    transition: color 0.15s ease;
}

.doneff-pm-card__value:hover,
.doneff-pm-card__value:focus-visible {
    color: var(--doneff-pm-accent);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

/* Dropdown Button: a pill button whose menu opens on hover / focus / tap. */
.doneff-block-dropdown-button {
    /* Overridable per-instance from the theme or a wrapper's inline style. */
    --doneff-dropdown-bg: #333F33;
    --doneff-dropdown-bg-hover: #5E7E49;
    --doneff-dropdown-text: #ffffff;
    --doneff-dropdown-radius: 8px;
}

/* Alignment is set per breakpoint, so each variant hands the block four
   values rather than a flat text-align: where the button sits, and where its
   menu hangs from (a centered button wants a centered menu, a right-aligned one
   wants its menu's right edge pinned so it can't overhang the viewport). */
.doneff-block-dropdown-button--left {
    --doneff-text-align: left;
    --doneff-menu-left: 0;
    --doneff-menu-right: auto;
    --doneff-menu-x: 0;
}
.doneff-block-dropdown-button--center {
    --doneff-text-align: center;
    --doneff-menu-left: 50%;
    --doneff-menu-right: auto;
    --doneff-menu-x: -50%;
}
.doneff-block-dropdown-button--right {
    --doneff-text-align: right;
    --doneff-menu-left: auto;
    --doneff-menu-right: 0;
    --doneff-menu-x: 0;
}

/* Kadence's breakpoints. Tablet is max-width so it also covers mobile; the
   mobile query comes after it and wins where both apply. */
@media (max-width: 1024px) {
    .doneff-block-dropdown-button--tablet-left {
        --doneff-text-align: left;
        --doneff-menu-left: 0;
        --doneff-menu-right: auto;
        --doneff-menu-x: 0;
    }
    .doneff-block-dropdown-button--tablet-center {
        --doneff-text-align: center;
        --doneff-menu-left: 50%;
        --doneff-menu-right: auto;
        --doneff-menu-x: -50%;
    }
    .doneff-block-dropdown-button--tablet-right {
        --doneff-text-align: right;
        --doneff-menu-left: auto;
        --doneff-menu-right: 0;
        --doneff-menu-x: 0;
    }
}

@media (max-width: 767px) {
    .doneff-block-dropdown-button--mobile-left {
        --doneff-text-align: left;
        --doneff-menu-left: 0;
        --doneff-menu-right: auto;
        --doneff-menu-x: 0;
    }
    .doneff-block-dropdown-button--mobile-center {
        --doneff-text-align: center;
        --doneff-menu-left: 50%;
        --doneff-menu-right: auto;
        --doneff-menu-x: -50%;
    }
    .doneff-block-dropdown-button--mobile-right {
        --doneff-text-align: right;
        --doneff-menu-left: auto;
        --doneff-menu-right: 0;
        --doneff-menu-x: 0;
    }

    /* Full-width buttons on mobile (e.g. stacked in the slide-out nav). */
    .doneff-block-dropdown-button .doneff-dropdown {
        display: block;
        width: 100%;
    }

    .doneff-dropdown__toggle {
        display: flex;
        justify-content: center;
        width: 100%;
        margin-top: 5px !important;
        margin-bottom: 5px !important;
    }
}

/* The open menu overhangs whatever follows the block. Page builders give their
   sections stacking contexts and overflow clipping of their own, so the block
   lifts itself above its siblings while open and refuses to clip its own
   wrappers. An ancestor further up with overflow:hidden still wins - that one
   has to be fixed on the section itself. */
.doneff-block-dropdown-button,
.doneff-block-dropdown-button .doneff-dropdown {
    overflow: visible;
}

.doneff-block-dropdown-button {
    position: relative;
    z-index: 1;
    display: inline-block;
    vertical-align: middle;
    text-align: var(--doneff-text-align, left);
}

/* Back to full width on mobile so the stacked buttons can stretch. */
@media (max-width: 767px) {
    .doneff-block-dropdown-button {
        display: block;
    }
}

.doneff-block-dropdown-button:hover,
.doneff-block-dropdown-button:focus-within {
    z-index: 900;
}

/* Tap-to-open on touch triggers neither :hover nor :focus-within. Kept in its
   own rule so browsers without :has() still get the two selectors above. */
.doneff-block-dropdown-button:has(.doneff-dropdown.is-open) {
    z-index: 900;
}

/* inline-block so the block's text-align can place it, while the menu still
   positions against the button. */
.doneff-dropdown {
    position: relative;
    display: inline-block;
    text-align: left;
}

.doneff-dropdown__toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.6em;
    margin: 0;
    padding: 6px 12px;
    border: 0;
    border-radius: var(--doneff-dropdown-radius);
    background: var(--doneff-dropdown-bg);
    color: var(--doneff-dropdown-text);
    font-family: inherit;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.2;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.doneff-dropdown__toggle:hover,
.doneff-dropdown__toggle:focus-visible,
.doneff-dropdown.is-open .doneff-dropdown__toggle {
    background: var(--doneff-dropdown-bg-hover);
    color: var(--doneff-dropdown-text);
}

.doneff-dropdown__caret {
    width: 0.75em;
    height: 0.5em;
    flex: none;
    transition: transform 0.2s ease;
}

.doneff-dropdown:hover .doneff-dropdown__caret,
.doneff-dropdown:focus-within .doneff-dropdown__caret,
.doneff-dropdown.is-open .doneff-dropdown__caret {
    transform: rotate(180deg);
}

.doneff-dropdown__menu {
    position: absolute;
    top: calc(100% + 8px);
    left: var(--doneff-menu-left, 0);
    right: var(--doneff-menu-right, auto);
    z-index: 900;
    min-width: 100%;
    width: max-content;
    max-width: min(320px, 90vw);
    /* Explicit: the menu grows to fit however many links the repeater holds, and
       never clips them. Stops a theme rule from capping it. */
    height: auto;
    max-height: none;
    overflow: visible;
    padding: 6px 0;
    border-radius: var(--doneff-dropdown-radius);
    background: #fff;
    box-shadow: 0 10px 30px rgba(31, 35, 40, 0.16);
    opacity: 0;
    visibility: hidden;
    transform: translate(var(--doneff-menu-x, 0), 4px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0s linear 0.18s;
}

/* Invisible bridge across the 8px gap: without it the pointer leaves the
   dropdown on its way from the button to the menu and the menu closes. */
.doneff-dropdown__menu::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: -8px;
    height: 8px;
}

.doneff-dropdown:hover .doneff-dropdown__menu,
.doneff-dropdown:focus-within .doneff-dropdown__menu,
.doneff-dropdown.is-open .doneff-dropdown__menu {
    opacity: 1;
    visibility: visible;
    transform: translate(var(--doneff-menu-x, 0), 0);
    transition-delay: 0s;
}

.doneff-dropdown__item,
.doneff-dropdown__item:any-link {
    display: block;
    padding: 10px 20px;
    color: #1f2328;
    font-size: 1rem;
    line-height: 1.35;
    text-decoration: none;
}

.doneff-dropdown__item:hover,
.doneff-dropdown__item:focus-visible {
    background: #eef0f3;
    color: #1f2328;
    text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
    .doneff-dropdown__menu,
    .doneff-dropdown__caret,
    .doneff-dropdown__toggle {
        transition: none;
    }
}
