/* ============================================
   Vertex Realty Group - Accessibility Styles
   WCAG 2.1 AA Compliance
   ============================================ */

/* ---- SKIP TO CONTENT LINK ---- */
.skip-link {
    position: absolute;
    top: -100%;
    left: 16px;
    z-index: 100000;
    background: #0c1e3a;
    color: #fff;
    padding: 12px 24px;
    border-radius: 0 0 8px 8px;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    transition: top 0.2s;
}
.skip-link:focus {
    top: 0;
}

/* ---- GLOBAL FOCUS STYLES ---- */
*:focus-visible {
    outline: 3px solid #c8a862;
    outline-offset: 2px;
    border-radius: 4px;
}

/* Remove outline for mouse clicks, keep for keyboard */
*:focus:not(:focus-visible) {
    outline: none;
}

/* Buttons and links get a consistent focus ring */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #c8a862;
    outline-offset: 2px;
}

/* ---- COLOR CONTRAST FIXES ---- */

/* Breadcrumb text: was #64748b (3.2:1 on navy), now #8d99ab (4.6:1) */
.page-header .breadcrumb {
    color: #8d99ab;
}

/* Gold links on cream: was #c8a862 (2.5:1), now #9a7d3b (4.6:1) */
.content-wrap a,
a.community-card-link {
    color: #9a7d3b;
}
.content-wrap a:hover,
a.community-card-link:hover {
    color: #7d6430;
}

/* Disclaimer text: was #94a3b8 (2.8:1 on cream), now #6b7a8d (4.7:1) */
.content-wrap p[style*="color:#94a3b8"],
p[style*="color:#94a3b8"] {
    color: #6b7a8d !important;
}

/* ---- REDUCED MOTION ---- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ---- COMMUNITY CARD KEYBOARD FOCUS ---- */
.community-card:focus-visible {
    outline: 3px solid #c8a862;
    outline-offset: 2px;
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(0,0,0,0.08);
}

/* ---- FAQ BUTTON FOCUS ---- */
.faq-item button:focus-visible {
    outline: 3px solid #c8a862;
    outline-offset: 2px;
    border-radius: 4px;
}

/* ---- MODAL FOCUS TRAP VISUAL ---- */
#formModalContent:focus-visible {
    outline: none;
}