/*
 * Bianchini's Market keyboard-focus remediation.
 * Loaded after the theme's LessPHP-generated stylesheet.
 */

/*
 * Cross-browser fallback: older browsers show the indicator for all focus.
 * !important is intentional because the legacy theme contains component-level
 * outline:none rules with greater selector specificity.
 */
:focus {
    outline: 3px solid #005fcc !important;
    outline-offset: 3px;
    box-shadow: 0 0 0 6px #fff !important;
}

/* Maintain a two-color, high-contrast indicator in the dark slide-out menu. */
.slideMenu a:focus,
.slideMenu button:focus,
.slideMenu [tabindex]:not([tabindex="-1"]):focus {
    outline-color: #fff !important;
    box-shadow: 0 0 0 6px #005fcc !important;
}

/* The close control is now a native button; retain the legacy visual design. */
.slideMenu .slideClose {
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border-radius: 0;
    font: inherit;
    line-height: 1;
}

/* Modern browsers suppress the indicator only for pointer-driven focus. */
@supports selector(:focus-visible) {
    :focus:not(:focus-visible) {
        outline: none !important;
        box-shadow: none !important;
    }
}

/* Keyboard focus lands on the link; highlight its parent menu item too. */
header .header_content .main_nav .primary ul#navPrimary li.colHolder ul.colBreak li:focus-within {
    border-bottom-color: #231f20;
}

header .header_content .main_nav .primary ul#navPrimary li.colHolder ul.colBreak li#menu-item-1564:focus-within > a {
    text-decoration: underline;
}

@media (forced-colors: active) {
    :focus {
        outline-color: Highlight !important;
        box-shadow: none !important;
    }
}

/*
 * Do not depend on the cross-origin Font Awesome webfont for core navigation
 * controls. Firefox correctly rejects the current font response when it lacks
 * an Access-Control-Allow-Origin header, which otherwise exposes private-use
 * characters as missing-glyph boxes.
 */
header .header_content .main_nav .toggle-nav a {
    color: transparent !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 0 !important;
    line-height: 1;
}

header .header_content .main_nav .toggle-nav a::before {
    color: #231f20;
    content: "\2630";
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 25px;
    font-weight: 700;
    line-height: 1;
}

header .header_content .main_nav .primary ul#navPrimary li.colHolder ul.colBreak li.menu-item-has-children > a::after {
    border: 0 solid currentColor !important;
    border-bottom-width: 2px !important;
    border-right-width: 2px !important;
    content: "" !important;
    display: inline-block !important;
    font-family: inherit !important;
    height: 0.38em;
    margin-left: 0.45em;
    padding-left: 0 !important;
    position: relative;
    top: -0.16em;
    transform: rotate(45deg);
    width: 0.38em;
}

header .header_content .main_nav .primary ul#navPrimary li.colHolder ul.colBreak li.menu-item-has-children.changeArrow > a::after {
    transform: rotate(225deg) !important;
}

/*
 * Keep the desktop navigation inside the header even while Barlow Condensed is
 * delayed, blocked, or replaced with a wider fallback font.
 */
@media screen and (min-width: 1024px) {
    header .header_content .main_nav .primary ul#navPrimary li.colHolder ul.colBreak li > a {
        font-size: clamp(14px, 1vw, 16px);
        letter-spacing: clamp(1px, 0.1vw, 1.75px);
        padding-left: clamp(4px, 0.3vw, 6px);
        padding-right: clamp(4px, 0.3vw, 6px);
    }
}

/* Avoid the legacy 1024px desktop jump exposing the entire nav at once. */
@media screen and (min-width: 1024px) and (max-width: 1099px) {
    header .header_content .main_nav .primary {
        display: none;
    }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    header .header_content .main_nav .toggle-nav a::before {
        font-size: 30px;
    }
}

@media screen and (max-width: 767px) {
    header .header_content .main_nav .toggle-nav a::before {
        font-size: 40px;
    }
}