/* Shared phone-only floating "Select Dates" pill (listofall + xyz property pages). */
@media (max-width: 768px) {
    .mobile-floating-dates-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        left: 50%;
        bottom: max(16px, env(safe-area-inset-bottom, 0px));
        transform: translateX(-50%);
        z-index: 20050;
        min-width: min(calc(100vw - 40px), 280px);
        min-height: 48px;
        padding: 0 1.5rem;
        margin: 0;
        border: 1.5px solid rgba(120, 190, 235, 0.85);
        border-radius: 999px;
        background:
            linear-gradient(
                145deg,
                rgba(255, 255, 255, 0.78) 0%,
                rgba(255, 255, 255, 0.52) 48%,
                rgba(236, 242, 248, 0.62) 100%
            );
        backdrop-filter: blur(22px) saturate(180%);
        -webkit-backdrop-filter: blur(22px) saturate(180%);
        font-family: var(--cc-font-sans);
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 0.03em;
        line-height: 1;
        color: #333333;
        text-align: center;
        cursor: pointer;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-rendering: optimizeLegibility;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.95),
            inset 0 -1px 0 rgba(31, 51, 68, 0.06),
            0 0 0 1px rgba(140, 205, 245, 0.35),
            0 10px 34px rgba(31, 51, 68, 0.14),
            0 2px 8px rgba(31, 51, 68, 0.08);
        -webkit-tap-highlight-color: transparent;
        transition:
            background 0.22s ease,
            border-color 0.22s ease,
            box-shadow 0.22s ease,
            transform 0.15s ease;
    }

    .mobile-floating-dates-btn__label {
        display: block;
        position: relative;
        z-index: 1;
        color: #333333;
        font-family: inherit;
        font-size: inherit;
        font-weight: 600;
        letter-spacing: 0.04em;
        line-height: 1.15;
    }

    .mobile-floating-dates-btn:hover,
    .mobile-floating-dates-btn:focus-visible {
        background:
            linear-gradient(
                145deg,
                rgba(255, 255, 255, 0.88) 0%,
                rgba(255, 255, 255, 0.62) 48%,
                rgba(228, 236, 246, 0.72) 100%
            );
        border-color: rgba(100, 180, 230, 0.95);
        outline: none;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 1),
            inset 0 -1px 0 rgba(31, 51, 68, 0.08),
            0 0 0 1px rgba(140, 205, 245, 0.45),
            0 12px 38px rgba(31, 51, 68, 0.16),
            0 3px 10px rgba(31, 51, 68, 0.1);
    }

    .mobile-floating-dates-btn:focus-visible {
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.95),
            inset 0 -1px 0 rgba(31, 51, 68, 0.06),
            0 0 0 2px rgba(120, 190, 235, 0.55),
            0 0 0 4px rgba(180, 220, 250, 0.35),
            0 10px 34px rgba(31, 51, 68, 0.14);
    }

    .mobile-floating-dates-btn:active {
        transform: translateX(-50%) scale(0.98);
        background:
            linear-gradient(
                145deg,
                rgba(255, 255, 255, 0.62) 0%,
                rgba(244, 247, 251, 0.48) 100%
            );
    }

    .mobile-floating-dates-btn:disabled {
        opacity: 0.72;
        cursor: not-allowed;
    }

    @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
        .mobile-floating-dates-btn {
            background: rgba(255, 255, 255, 0.94);
        }
    }

    body.calendar-open .mobile-floating-dates-btn,
    body.reserve-spotlight-active .mobile-floating-dates-btn {
        visibility: hidden;
        pointer-events: none;
    }
}

@media (max-width: 430px) {
    .mobile-floating-dates-btn {
        min-height: 42px;
        min-width: min(calc(100vw - 32px), 240px);
        padding: 0 1.125rem;
        font-size: 14px;
        bottom: max(12px, env(safe-area-inset-bottom, 0px));
    }
}

@media (min-width: 769px) {
    .mobile-floating-dates-btn {
        display: none !important;
    }
}