/* ==========================================================================
   GIGW 3.0 — Keyboard Focus Visibility (dedicated accessibility stylesheet)
   Loaded LAST (after bootstrap.min.css, style.css, accessibility_style.css,
   responsive.css, wall-of-fame.css) so every rule here wins the cascade
   without needing to touch those files or any Bootstrap source file.

   Design: :focus-visible only (no ring on a plain mouse click), a thick
   brand-orange outline as the primary ring, plus a thin dark inner line so
   the ring stays legible even on light/white surfaces where the orange
   alone is borderline. On dark surfaces (header, footer, overlays) the
   orange ring alone already contrasts well.
   ========================================================================== */

/* ---- 1. Global baseline ---- */
:focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

/* Legacy browsers without :focus-visible support: fall back to plain :focus
   so keyboard users are never left with no indicator at all. Browsers that
   understand :focus-visible ignore this whole block. */
@supports not selector(:focus-visible) {
    a:focus,
    button:focus,
    input:focus,
    select:focus,
    textarea:focus,
    [tabindex]:focus,
    [role="button"]:focus {
        outline: 3px solid #f47920;
        outline-offset: 2px;
    }
}

/* ---- 2. Links (header, footer, body copy, cards) ---- */
a:focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
    border-radius: 2px;
}

/* ---- 3. Buttons: native <button>, brand button classes, icon/close
   buttons, the mobile navbar toggler ---- */
button:focus-visible,
.btn:focus-visible,
.btn-02:focus-visible,
.btn-03:focus-visible,
.btn-04:focus-visible,
input[type="submit"]:focus-visible,
input[type="button"]:focus-visible,
.vs-menu-toggle:focus-visible,
.navbar-toggler:focus-visible,
.content__close:focus-visible,
.btn-close:focus-visible,
.searchBoxTggler:focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

/* ---- 4. Form controls ---- */
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.form-check-input:focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: 2px !important;
}

/* Contact/subscribe forms in style.css permanently disable the outline on
   `:focus` (not gated by :focus-visible), so restore it explicitly here. */
#ajax-form input:focus-visible,
#ajax-form textarea:focus-visible,
#ajax-form button:focus-visible,
.subscribe input:focus-visible,
.subscribe button:focus-visible,
.menu-area .searchBoxSt .form-control:focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

/* ---- 5. Main navigation, dropdowns, nested submenus ----
   Reinforces the existing rules in style.css so focus stays visible at
   every level and is never mistaken for the plain :hover state. */
.main-menu ul li a:focus-visible,
.main-menu ul.sub-menu li a:focus-visible,
.top-info-list .dropdown-toggle a:focus-visible,
.top-info-list .dropdown-menu .dropdown-item:focus-visible,
.dropdown-menu .dropdown-item:focus-visible,
.vs-mobile-menu a:focus-visible,
.vs-mean-expand:focus-visible,
[role="button"]:focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
    border-radius: 2px;
}

/* ---- 6. Tabs (Bootstrap .nav-tabs and the site's custom pill-tab
   skins). Plain .nav-tabs/.nav-pills aren't clipped, so they get the
   normal outset ring; the pill-style wrappers below have
   overflow:hidden, so they use the same clip-safe inset technique as
   item 10. ---- */
.nav-tabs .nav-link:focus-visible,
.nav-pills .nav-link:focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: -3px !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

.tab-style-items_3 .nav-tabs .nav-link:focus-visible,
.tab-style-two-items .nav-tabs .nav-link:focus-visible,
.reg-tabs-wrapper .nav-link:focus-visible {
    outline: none !important;
    box-shadow: inset 0 0 0 3px #f47920 !important;
}

/* ---- 7. Accordions ---- */
.accordion-button:focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
    z-index: 2;
    position: relative;
}

/* ---- 8. Carousels (bx-slider hero banner + owl-carousel sliders) ---- */
.bx-wrapper .bx-controls-direction a:focus-visible,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item a:focus-visible,
.bannerSection .bx-controls-auto .bx-start:focus-visible,
.owl-carousel .owl-nav button:focus-visible,
.owl-carousel .owl-dots button:focus-visible,
.owl-carousel .owl-dots .owl-dot:focus-visible,
.carousel-control-prev:focus-visible,
.carousel-control-next:focus-visible,
.carousel-indicators button:focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

/* ---- 9. Fixing a dead rule: .ic-gallery-card .img-wrap a had TWO
   conflicting style.css rules (an outline fix, then an outline:none right
   after it that cancelled the fix). Restore the visible ring here. ---- */
.ic-gallery-card .img-wrap a:focus-visible {
    outline: 3px solid #003399 !important;
    outline-offset: 3px !important;
}

/* ---- 10. Components whose wrapper uses overflow:hidden, so an
   outline+outline-offset ring on a child near the edge would be clipped.
   Use an inset box-shadow instead — it stays inside the focused element's
   own box and cannot be clipped by an ancestor's overflow:hidden. ---- */
.serviceBoxArea a:focus-visible,
.cg-profile-card a:focus-visible,
.pct-contact-wrapper a:focus-visible,
.pct-box a:focus-visible,
.contatInfoBox.bg-20 a:focus-visible,
.news-slider-wrapper a:focus-visible,
.upComungNews .newsBoxArea a:focus-visible,
#causeListTable a:focus-visible,
.contact-rgniipm-pages .profile-card a:focus-visible,
.boxHistoryArea a:focus-visible,
.lft-side .submenu a:focus-visible,
.act-trades-page .card a:focus-visible {
    outline: none !important;
    box-shadow: inset 0 0 0 3px #f47920 !important;
}

/* serviceBoxArea already gets a card-level ring via :has() in style.css;
   keep that visible instead of letting it get clipped too. */
.serviceBoxArea:has(a:focus-visible) {
    outline: none !important;
    box-shadow: inset 0 0 0 3px #f47920 !important;
}

/* ---- 11. Dark surfaces (footer, dark header states, dark overlays):
   the brand orange ring already contrasts well here, this just guarantees
   the dark 1px inner line from the global rule doesn't muddy it — drop it
   in favour of a plain crisp orange ring. ---- */
.section-footer :focus-visible,
footer :focus-visible,
.vs-header header :focus-visible,
.overlay-dark :focus-visible {
    outline: 3px solid #f47920 !important;
    outline-offset: 2px !important;
    box-shadow: none !important;
}
