/* Luvi accessibility compat layer (sprint 02, Q-12). Loaded after main.css by tr.master and en/en.master;
   main.css stays untouched. Sections: 1) keyboard focus  2) skip link  3) master heading-tag replacements
   (h3/h4/h5 -> div with .luvi-h*)  4) former <a href="#"> controls now rendered as <button>.
   :where() keeps the original specificity of the replaced tag selectors, so every theme class rule still wins
   exactly where it won before. */

/* 1. Keyboard focus: theme ring (same values as the existing .luvi *:focus-visible rules in main.css).
   Overrides the global `*:focus` / `button:focus` outline resets only for keyboard focus. */
:where(a, summary, [role="button"], [tabindex]:not([tabindex="-1"]), input[type="checkbox"], input[type="radio"]):focus-visible {outline: 3px solid #c99a5b; outline-offset: 4px}
button:focus-visible, input[type="submit"]:focus-visible, input[type="button"]:focus-visible {outline: 3px solid #c99a5b; outline-offset: 4px}

/* 2. Skip link: off-screen until focused. */
.luvi-skip-link {position: absolute; top: 0; left: 16px; z-index: 100000; padding: 12px 20px; background-color: #202020; color: #fff; font-family: var(--font-body); font-size: 16px; font-weight: 600; line-height: 1.2; text-decoration: none; border-radius: 0 0 4px 4px; transform: translateY(-120%)}
.luvi-skip-link:focus, .luvi-skip-link:focus-visible {transform: none; color: #fff; outline: 3px solid #c99a5b; outline-offset: 2px}

/* 3. Master headings rendered as div: base heading cascade of bootstrap + main.css typography. */
:where(.luvi-h3, .luvi-h4, .luvi-h5) {margin: 0; font-weight: 500; line-height: 1.2; color: var(--color-heading); font-family: var(--font-heading)}
:where(.luvi-h3) {font-size: 22px}
:where(.luvi-h4) {font-size: 20px}
:where(.luvi-h5) {font-size: 18px}
.author_box_content :where(.luvi-h3) {font-size: 16px; margin-bottom: 5px}
.megamenu_case :where(.luvi-h3) {line-height: 1; font-size: 14px; font-weight: 500; margin-bottom: 0; color: var(--color-white); text-transform: uppercase}
.megamenu_case :where(.luvi-h4) {line-height: 1; font-size: 24px; font-weight: 700; margin: 10px 0 0; color: var(--color-white)}
.header-style-six .megamenu_case :where(.luvi-h3), .header-style-six .megamenu_case :where(.luvi-h4) {color: var(--color-white) !important}
.luvi-products-megamenu .luvi-compact-menu-category :where(.luvi-h3) {margin: 0 0 2px; font-family: var(--font-heading); font-size: 13px; line-height: 1.25}

/* 4. Back-to-top and FAB toggle as <button>: neutralise user-agent button styles. */
:where(button.scroll, button.fab-main-btn) {padding: 0; margin: 0; border: 0; font: inherit; letter-spacing: inherit; text-align: inherit}
/* As links these controls took bootstrap's link colour (only reached by currentColor) and no native appearance. */
:where(button.fab-main-btn) {color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1))}
button.scroll[type="button"], button.fab-main-btn[type="button"] {-webkit-appearance: none; appearance: none}
