:root {
  --focus-color: #2563eb;
  --focus-ring-width: 3px;
  --focus-outline-offset: 2px;
  --focus-ring-spread: 3px;
  --focus-ring-alpha: 0.12;
}

:is(a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-color);
  outline-offset: var(--focus-outline-offset);
  box-shadow: 0 0 0 var(--focus-ring-spread) rgba(37, 99, 235, var(--focus-ring-alpha));
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.form-control:focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-color);
  outline-offset: var(--focus-outline-offset);
  box-shadow: 0 0 0 calc(var(--focus-ring-spread) + 1px) rgba(37, 99, 235, var(--focus-ring-alpha));
}

button.btn-primary:focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-color) !important;
  outline-offset: var(--focus-outline-offset) !important;
  box-shadow: 0 0 0 var(--focus-ring-spread) rgba(255, 255, 255, 0.4), 0 0 0 calc(var(--focus-ring-spread) + 1px) rgba(37, 99, 235, var(--focus-ring-alpha));
}

.swiper-pagination-bullet {
  box-shadow: none;
  outline: none;
}

.swiper-pagination-bullet:focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-color) !important;
  outline-offset: var(--focus-outline-offset) !important;
  box-shadow: 0 0 0 var(--focus-ring-spread) rgba(37, 99, 235, var(--focus-ring-alpha)) !important;
  border-radius: 50%;
  z-index: 1;
}

.swiper-pagination-bullet-active,
.swiper-pagination-bullet[aria-current="true"] {
  background-color: #2563eb;
  box-shadow: 0 0 0 var(--focus-ring-spread) rgba(29, 78, 216, 0.12);
  border-radius: 50%;
}

.swiper-pagination-bullet-active:focus-visible,
.swiper-pagination-bullet[aria-current="true"]:focus-visible {
  box-shadow: 0 0 0 var(--focus-ring-spread) rgba(37, 99, 235, var(--focus-ring-alpha)) !important;
  outline: var(--focus-ring-width) solid var(--focus-color) !important;
  outline-offset: var(--focus-outline-offset) !important;
}

.swiper-button:focus-visible::before {
  content: '';
  position: absolute;
  inset: -4px;
  border: 2px solid var(--focus-color);
  border-radius: 4px;
}   

.nav ul li:hover > ul,
.nav ul li.hover > ul,
.nav ul li:focus-within > ul,
.dropdown.show > .dropdown-menu,
.dropdown.open > .dropdown-menu {
  left: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  z-index: 9999;
}

.dropdown .dropdown-menu.show {
  display: block;
  visibility: visible;
  opacity: 1;
}