/**
 * BSMC accessibility layer. Loaded last on every page.
 *
 * WCAG 2.1 AA audit, 29 September 2026:
 *   2.4.7 Focus visible  The parent theme removes the browser's focus
 *                        outline and the child theme only restored it on
 *                        the marketing menu, so a keyboard user lost their
 *                        place on most links and buttons.
 *   2.4.1 Bypass blocks  No page had a skip link.
 *
 * The ring is two-tone so it reads on every ground the site uses: a thin
 * dark line against the element, then gold. On the black pages the gold
 * shows; on white pages and on gold buttons the dark line does.
 *
 * !important on purpose: the parent theme's outline: none rules are more
 * specific than a bare element selector, and this has to win everywhere.
 * :focus-visible only, so a mouse click does not draw the ring.
 */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
iframe:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible,
[role="tab"]:focus-visible,
[role="link"]:focus-visible,
[contenteditable]:focus-visible {
    outline: 3px solid #C8A96E !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px #0F0E0C !important;
}

/* A text field shows its ring on the box itself, so no gap. */
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline-offset: 0 !important;
    box-shadow: none !important;
    border-color: #C8A96E !important;
}

/* Skip link: off screen until it takes focus, then top left on black. */
.bsmc-skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 100000;
    padding: 12px 18px;
    background: #0E0E0E;
    color: #EDEADF !important;
    font: 600 15px/1.2 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    text-decoration: none;
    border-radius: 0 0 4px 0;
}
.bsmc-skip-link:focus,
.bsmc-skip-link:focus-visible {
    left: 0;
}

/* The target the skip link lands on shows no ring of its own. */
main:focus {
    outline: none !important;
}

/* Links inside running text are underlined (WCAG 1.4.1). Gold on cream is
   1.9:1, so colour alone can't mark them. Buttons, menus and cards are
   identified by their shape and keep their look.

   30 September 2026: the header menu and the footer link lists are built
   from <li>, so the earlier "li a" selector underlined them too. Links in
   the header, footer and any <nav> are excluded; 1.4.1 is about links that
   sit inside text, and a menu is identified by where it is. */
body.bsmc-home3-body :is(p, li) a:not(header a, footer a, nav a, .bsmc-h3-footer a),
#bsmc-consent p a {
    text-decoration: underline !important;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}

/* Links inside posts on the ReadyLaunch feed were painted black on the dark
   feed background (1.35:1). */
.bb-rl-activity-inner p a,
.bb-rl-activity-inner .activity-read-more a {
    color: #C8A96E !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Hero background video: pause and play (WCAG 2.2.2). Sits in the corner
   of the hero, clear of the headline and the buttons. */
.bsmc-hero-pause {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 6;
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid rgba(237, 234, 223, 0.55);
    background: rgba(14, 14, 14, 0.72);
    color: #EDEADF;
    cursor: pointer;
    display: grid;
    place-items: center;
}
.bsmc-hero-pause:hover { background: rgba(14, 14, 14, 0.92); border-color: #C8A96E; }
.bsmc-hero-pause svg { width: 18px; height: 18px; fill: currentColor; }
.bsmc-hero-pause .bsmc-hero-pause__play { display: none; }
.bsmc-hero-pause.is-paused .bsmc-hero-pause__pause { display: none; }
.bsmc-hero-pause.is-paused .bsmc-hero-pause__play { display: block; }

/* Blog: "Related Articles" is an h2 now (it followed the h1 as an h3). Kept
   at the size the parent theme gave the h3. */
.post-related-posts > .post-related-posts__title { font-size: 24px; margin: 0 0 20px; }

/* Gold is one colour, the site's #A18A55, everywhere. On black it is 5.77:1
   and passes at any size. On white it is 3.34:1, which passes only for
   large text (24px, or 18.66px bold). The labels below are small gold text
   on white sections, so they alone take the darker #7A6739 (6.5:1 on
   white). Everything else keeps the site gold. The clubhouse selector
   matches the specificity of clubhouse.css's own accent rule. */
html body.bsmc-home3-body .bsmc-h3-what .bsmc-h3-kicker,
html body.bsmc-home3-body .bsmc-h3-chooser__intro .bsmc-h3-kicker,
html body.bsmc-home3-body .bsmc-h3-tier__price-note strong,
html body.bsmc-cl-body.bsmc-home3-body .bsmc-cl-kicker.bsmc-cl-kicker--dark,
html body .bsmc-adv-kicker--dark,
html body.bsmc-contact-body .bsmc-contact-club__map {
    color: #7A6739 !important;
    -webkit-text-fill-color: #7A6739 !important;
}
