* { box-sizing: border-box; }

/* Accessible focus-visible outlines for header (WCAG 2.1) */
.wp-block-stellar-theme-header a.cta-button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--focus-ring-color, #005fcc);
  border-radius: inherit;
}

.wp-block-stellar-theme-header .menu .header-menu a:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 3px;
  border-radius: 6px;
}

.wp-block-stellar-theme-header .mobile-bottom-menu .mobile-menu-item a:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 10px;
}

.wp-block-stellar-theme-header .mobile-bottom-menu .mobile-menu-item .mobile-hamburger-button:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 8px;
}

.wp-block-stellar-theme-header .mobile-overlay-menu .mobile-hamburger-menu .mobile-menu-item a:focus-visible,
.wp-block-stellar-theme-header .mobile-overlay-menu .login-button:focus-visible,
.wp-block-stellar-theme-header .mobile-overlay-menu .logout-button:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 6px;
  border-radius: 8px;
}

/* Make profile dropdown accessible on keyboard focus */
.wp-block-stellar-theme-header .profile-button:focus-within .profile-menu {
  opacity: 1;
  pointer-events: auto;
  top: -5px;
  right: -5px;
  width: 350px;
  height: 650px;
}

.wp-block-stellar-theme-header .profile-button .profile-button-bg:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 50%;
}

.wp-block-stellar-theme-header .profile-menu .profile-menu-content .menu ul li a:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 6px;
}

/* Back arrow focus visibility */
.wp-block-stellar-theme-header .back-arrow:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 50%;
}

/* Blog section pagination a11y */
.stellar-blog-section .pagination-container:focus-within {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 6px;
  border-radius: 8px;
}
.stellar-blog-section .pagination-content button:focus-visible,
.stellar-blog-section .pagination-content a:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 6px;
  background-color: var(--pagination-active-button-bg-color, #005fcc);
  color: var(--pagination-active-button-color, #ffffff);
}

/* Core Query Pagination a11y */
.wp-block-query-pagination:focus-within {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 6px;
  border-radius: 8px;
}
.wp-block-query-pagination a:focus-visible,
.wp-block-query-pagination button:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 4px;
  background-color: #005fcc;
  color: #ffffff;
}

/* Also style the active page in core pagination */
.wp-block-query-pagination .page-numbers.current,
.wp-block-query-pagination [aria-current="page"] {
  background-color: #005fcc;
  color: #ffffff;
  border-radius: 4px;
}

/* Locked video overlay and popup a11y helpers */
.stellar-video-locked:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
}
.stellar-video-locked { cursor: pointer; }
.video-popup-open { overflow: hidden; }
.stellar-video-popup.is-open { outline: none; }
.stellar-video-popup [data-close]:focus-visible,
.stellar-video-popup .video-popup__close:focus-visible,
.stellar-video-popup .modal-close:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 6px;
}

/* Login popup a11y */
.login-popup-open { overflow: hidden; }
.stellar-login-popup { outline: none; }
.stellar-login-popup:focus { outline: none; }
.stellar-login-popup [data-close]:focus-visible,
.stellar-login-popup .modal-close:focus-visible,
.stellar-login-popup .login-popup__close:focus-visible,
.stellar-login-popup button:focus-visible,
.stellar-login-popup a:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 6px;
}
.stellar-login-popup input:focus-visible,
.stellar-login-popup select:focus-visible,
.stellar-login-popup textarea:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--focus-ring-color, #005fcc);
}

/* Tabs inside login popup */
.stellar-login-popup__tabs {
  --focus-ring-color: var(--focus-ring-color, #005fcc);
}
.stellar-login-popup__tabs [role="tab"],
.stellar-login-popup__tab {
  outline: none;
}
.stellar-login-popup__tabs [role="tab"]:focus-visible,
.stellar-login-popup__tab:focus-visible {
  outline: 2px solid var(--focus-ring-color, #005fcc);
  outline-offset: 4px;
  border-radius: 8px;
}
.stellar-login-popup__tabs [role="tab"][aria-selected="true"],
.stellar-login-popup__tab[aria-selected="true"],
.stellar-login-popup__tab.is-active {
  background-color: #005fcc;
  color: #ffffff;
}