/* =====================================================================
 * fortbrands.com accessibility polish
 * Theme: fortwestern-ada (staged) — tested against axe-core 4.x
 * Developed by Claude Code | Directed by C.S. Wohlfarth
 * ===================================================================== */

/* ---------- Skip link (ensure keyboard-accessible and visible on focus) */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 999999;
}
.skip-link:focus {
    left: 8px;
    top: 8px;
    padding: 12px 16px;
    background: #000;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    outline: 3px solid #ffcc00;
}

/* ---------- Focus visible (WCAG 2.4.7) on every interactive element */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible,
[role="link"]:focus-visible {
    outline: 3px solid #1a5d8f;
    outline-offset: 2px;
    box-shadow: 0 0 0 1px #fff, 0 0 0 4px #1a5d8f;
}
/* Fallback for browsers without :focus-visible */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
summary:focus {
    outline: 2px solid #1a5d8f;
    outline-offset: 2px;
}

/* ---------- Color-contrast floor (WCAG AA = 4.5:1 for text)
   Darken all light-grey text on white/pale backgrounds to pass AA.
   Uses !important to override inline + theme styles safely. */
body, p, li, td, th, div, span, dd, dt, figcaption, blockquote {
    color: #333 !important;
}
/* product labels, prices, meta */
.price, .product-price, .product-name a,
.product_desc, .category-name, .breadcrumb a,
.cms-page p, .cms-page li,
.pagination a, .pagination span,
.product_list .product-meta, .product-list-name,
.content_prices .price,
.availability, .stock, .ajax_add_to_cart_button {
    color: #222 !important;
}
/* Links in body copy — underline for visual affordance (WCAG 1.4.1) */
main a, #main-content a, .cms-page a, #content a, .rte a {
    text-decoration: underline;
}
main a:hover, #main-content a:hover {
    text-decoration: none;
}
/* Placeholder text */
::placeholder { color: #595959 !important; opacity: 1; }
::-webkit-input-placeholder { color: #595959 !important; }
::-moz-placeholder { color: #595959 !important; opacity: 1; }
:-ms-input-placeholder { color: #595959 !important; }

/* Disabled text needs 3:1 (1.4.11 non-text contrast UI) */
input:disabled, select:disabled, textarea:disabled,
button:disabled, .disabled { color: #595959 !important; }

/* ---------- Form labels (visual/structural association) */
label { color: #222 !important; font-weight: 600; }
.required, .form-group .required { color: #b30015 !important; }

/* ---------- Utility: visually hidden for a11y labels (sr-only) */
.sr-only, .visually-hidden {
    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;
}
.sr-only-focusable:focus {
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
}

/* ---------- Table semantics */
table th { text-align: left; }

/* ---------- Increase tap-target size for small icons (WCAG 2.5.5 AAA advisory)
   Note: advisory not required, but applied for better mobile UX */
.footer-container .toplinks a,
.footer-container ul li a,
.icon-tap-target {
    min-height: 24px;
    display: inline-block;
    padding: 2px;
}

/* ---------- Don't let theme remove outline globally */
*:focus { outline: revert; }

/* ---------- Accessibility-info footer (already rendered in footer.tpl) */
#accessibility-info {
    background: #f5f6fa;
    border-top: 2px solid #d1d5db;
    padding: 16px 0;
    font-size: 0.92em;
    color: #222;
}
#accessibility-info a { text-decoration: underline; color: #1a5d8f; }
#accessibility-info a:hover { color: #0e3a56; }

/* ---------- reduce color-only emphasis (WCAG 1.4.1) */
.sale-price, .reduction, .discount {
    text-decoration: underline wavy #b30015 2px;
    text-underline-offset: 3px;
}

/* ---------- Heading size normalisation if theme used visual-only levels */
h1.sr-only { /* preserve screen-reader-only h1 from index.tpl */ }
