/* WCAG 2.2 AA accessibility corrections. Visual changes are limited to focus,
   failing contrast pairs, and semantic-control normalization. */

.skip-link {
    position: fixed;
    top: 0;
    left: 1rem;
    z-index: 100000;
    transform: translateY(-140%);
    padding: 0.75rem 1rem;
    background: #ffffff;
    color: #1a1a1a;
    border: 2px solid #1a1a1a;
    border-radius: 0 0 4px 4px;
    font: 600 1rem/1.2 Arial, sans-serif;
    text-decoration: none;
    transition: transform 0.15s ease;
}
.skip-link:focus { transform: translateY(0); }

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* A two-tone indicator remains visible on both light and dark surfaces. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid #111111 !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 6px #ffffff !important;
}
#main-content:focus { outline: none; }

/* Preserve the existing appearance after non-semantic divs become buttons. */
.custom-hamburger-menu,
.custom-close-btn,
.value-card,
.gallery-item {
    font: inherit;
    border: 0;
    margin: 0;
}
.custom-hamburger-menu,
.custom-close-btn { appearance: none; -webkit-appearance: none; }
.value-card,
.gallery-item { text-align: inherit; }
.gallery-item { padding: 0; background: transparent; }

/* Real solid backgrounds ensure the reported text/background relationship is explicit. */
#static-hero-name {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
}

/* Preserve the rendered maroon address band and declare its real background
   on the semantic container so text/background evaluation is unambiguous. */
.header-section {
    background-color: #491a28 !important;
    color: #ffffff !important;
}
.header-section h2,
.header-section p {
    color: #ffffff !important;
}

/* Brand-preserving nearest compliant accent for normal-size use on maroon. */
.accessible-accent-text { color: #c47f7a !important; }

.required-marker { color: #b91c1c !important; }
.error-message,
[id$="Error"] { color: #b00020 !important; }
.form-instructions { color: #374151; font-size: 0.875rem; margin-top: 0.5rem; }

/* Placeholder text and control boundaries meet minimum contrast without changing geometry. */
#groupReservationForm :where(input, select, textarea),
.contact-form :where(input, select, textarea) {
    border-color: #949494 !important;
}
#groupReservationForm :where(input, textarea)::placeholder,
.contact-form :where(input, textarea)::placeholder {
    color: #6b7280 !important;
    opacity: 1 !important;
}

/* Maintain custom navigation dimensions after semantic conversion. */
.custom-hamburger-menu,
.custom-close-btn {
    line-height: 1;
}
.custom-mobile-nav[inert] { pointer-events: none; }

/* Accessible carousel pause control, visually matched to existing navigation. */
.carousel-pause-button {
    position: absolute;
    left: 50%;
    bottom: 1.5rem;
    transform: translateX(-50%);
    z-index: 35;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.82);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font: 700 1rem/1 Arial, sans-serif;
    cursor: pointer;
}

/* Dialog is removed from the accessibility tree and tab order when closed. */
.modal-overlay[aria-hidden="true"] { visibility: hidden; }
.modal-overlay[aria-hidden="false"] { visibility: visible; }

/* Portfolio state is perceivable without relying only on color. */
.filter-btn[aria-pressed="true"] { text-decoration: underline; text-underline-offset: 0.2em; }
.gallery-item[aria-expanded="true"] { outline: 2px solid #491a28; outline-offset: 2px; }

/* Prevent the duplicated marquee from remaining animated for users requesting less motion. */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    .ken-burns,
    .about-usp-carousel { animation: none !important; }
}

@media (max-width: 768px) {
    .carousel-pause-button { bottom: 1rem; width: 40px; height: 40px; }
}


/* Status messages use explicit text colors and are not color-only. */
.form-status-success { color: #146c2e !important; font-weight: 600; }
.form-status-error { color: #b00020 !important; font-weight: 600; }
[aria-invalid="true"] { border-color: #b00020 !important; box-shadow: 0 0 0 1px #b00020; }

/* Preserve the original 3D cards as informational, not falsely interactive. */
.carousel-container .card { cursor: default; }

/* Hidden overlays remain unavailable to pointer users as well as assistive technology. */
#custom-mobile-nav[aria-hidden="true"], .modal-overlay[aria-hidden="true"] { pointer-events: none; }


/* Explicit offer styling preserves contrast even before the Tailwind CDN loads. */
#resort-offers-section #offer-title { color: #f3f4f6; }
#resort-offers-section #offer-description { color: #d1d5db; }
#resort-offers-section #book-now-link { color: #ffffff; border-color: #c47f7a; }
#resort-offers-section #image-slider { display: flex; width: 100%; height: 100%; }
#resort-offers-section #image-slider > div { flex: 0 0 100%; width: 100%; height: 100%; }
#resort-offers-section #image-slider img { display: block; width: 100%; max-width: 100%; height: 100%; object-fit: cover; }


/* Local fallbacks for core utility classes prevent intrinsic images from causing reflow when the CDN is delayed. */
.w-full { width: 100%; }
.h-full { height: 100%; }
.object-cover { object-fit: cover; }
img { max-width: 100%; }


/* Nearest compliant active filter blue for normal-size white text (4.75:1). */
.sidebar .filter-btn.active { background-color: #006fe6; border-color: #006fe6; }

.overflow-hidden { overflow: hidden; }
.overflow-x-hidden { overflow-x: hidden; }

/* Hotel-card titles sit over variable photography. A localized solid backing
   preserves the existing gradient while guaranteeing contrast at every crop. */
.carousel-container .card-title {
    background-color: #1a1a1a !important;
}

/* Preserve the original footer-brand heading typography after changing H1 to H2. */
.header-section h2 {
    font-size: 1.875rem;
    font-weight: 500;
    letter-spacing: 0.025em;
    margin-bottom: 0.5rem;
    font-family: Georgia, serif;
}

/* Checker-driven reinforcements for the supplied WAVE/AC reports. */
#properties-we-manage-heading {
    color: #c47f7a !important; /* 4.56:1 against #491a28 */
}
#groupReservationForm label,
#groupReservationForm legend,
.contact-form label {
    color: #4b5563 !important; /* 7.56:1 against white */
}
#groupReservationForm .required-marker,
.contact-form .required-marker {
    color: #b00020 !important; /* 7.33:1 against white */
}
#groupReservationForm .error-message,
#groupReservationForm [id$="Error"],
.contact-form .error-message,
.contact-form [id$="Error"] {
    color: #b00020 !important;
    background-color: transparent !important;
}
#static-hero-name {
    color: #ffffff !important;
    background: #1a1a1a !important; /* 17.40:1 */
}
.header-section,
#main-footer .header-section {
    color: #ffffff !important;
    background: #491a28 !important; /* 14.37:1 */
}

/* Valid phrasing-content structure inside the interactive value cards. */
.value-card .value-icon,
.value-card .value-title,
.value-card .value-desc { display: block; }

/* Valid phrasing-content structure inside property-card buttons. */
.gallery-item .image-container,
.gallery-item .gallery-item-title { display: block; }

/* WCAG 2.2 target-size corrections for form controls. */
#groupReservationForm input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
#groupReservationForm select,
#groupReservationForm textarea,
.contact-form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.contact-form select,
.contact-form textarea {
    min-height: 44px;
}
#groupReservationForm input[type="checkbox"],
#groupReservationForm input[type="radio"] {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px;
    min-height: 24px;
}

/* Ensure compact carousel arrow controls retain a WCAG 2.2-compliant target. */
#ro-prev-btn,
#ro-next-btn {
    min-width: 44px;
    min-height: 44px;
}
