/* Layered important rules outrank late-loading Woo Blocks focus rings. */
@layer bera-focus {
  body :focus,
  body :focus::before,
  body :focus::after {
    outline: none !important;
  }

  body :focus,
  .bera-currency-switcher--menu:focus-within,
  .bera-search-dialog__input-field:focus-within,
  .bera-account .select2-container--focus .select2-selection--single,
  .bera-account .select2-container--open .select2-selection--single {
    outline: none !important;
    box-shadow: none !important;
  }

  /* Woo draws an additional ring outside express-payment iframe buttons. */
  .wc-block-components-express-payment__event-buttons > :is(
    :focus-within,
    .wc-block-components-express-payment__event-button--focused
  )::after {
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
  }
}

/* Keyboard focus is visible without a ring or any change in geometry. */
body :is(a, button, summary, [role="button"], [role="tab"]):focus-visible {
  text-decoration-line: underline !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 0.22em !important;
}

body :is(button, summary, [role="button"], [role="tab"], a.button, .claudify-icon-btn):not(.pswp__button):focus-visible,
body .bera-checkout-shell .wc-block-components-notice-banner > .wc-block-components-button:focus-visible,
.wc-block-components-express-payment__event-buttons > :focus-within {
  background-image: linear-gradient(rgba(128, 128, 128, 0.24), rgba(128, 128, 128, 0.24)) !important;
}

body :is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"]), textarea):focus:not(
  [aria-invalid="true"], :user-invalid, .has-error *
),
body #pwgc-redeem-gift-card-number:focus:not([aria-invalid="true"], :user-invalid, .has-error *),
.bera-account .select2-container--focus .select2-selection--single,
.bera-account .select2-container--open .select2-selection--single {
  background-color: #edf1eb !important;
}

body select:not([data-bera-pointer-focus]):focus-visible {
  filter: brightness(0.88);
}

/* PhotoSwipe icons and custom select arrows are background images. */
body .pswp__button:focus-visible {
  background-color: #565656 !important;
}

.bera-search-dialog__input-field:focus-within {
  background-color: #edf1eb;
  border-color: transparent;
}

/* Keep checked indicators intact; tint their label rather than the control. */
body label:has(input:is([type="checkbox"], [type="radio"]):focus-visible),
.wc-block-components-checkbox:has(input:focus-visible) label {
  background-color: #e4eadf !important;
  text-decoration: underline;
  text-underline-offset: 0.22em;
}

@media (forced-colors: active) {
  body #pwgc-redeem-gift-card-number:focus:not([aria-invalid="true"], :user-invalid, .has-error *),
  body .bera-checkout-shell .wc-block-components-notice-banner > .wc-block-components-button:focus-visible,
  body :is(a, button, summary, input, select, textarea, [role="button"], [role="tab"]):focus-visible,
  body label:has(input:is([type="checkbox"], [type="radio"]):focus-visible),
  .bera-currency-switcher--menu:has(select:focus-visible) {
    forced-color-adjust: none;
    filter: none;
    background: Highlight !important;
    color: HighlightText !important;
  }
}
