/* ===== V56 Accessibility toolbar for Najran SP Club ===== */
:root{
  --a11y-panel-bg:rgba(255,255,255,.96);
  --a11y-panel-border:rgba(7,92,168,.16);
  --a11y-panel-shadow:0 24px 72px rgba(2,35,70,.20);
}
.skip-to-content{
  position:fixed;
  top:12px;
  right:12px;
  z-index:100000;
  transform:translateY(-150%);
  transition:.2s ease;
  background:#041d3a;
  color:#fff;
  padding:12px 16px;
  border-radius:14px;
  font-weight:900;
  box-shadow:0 14px 34px rgba(0,0,0,.18);
}
.skip-to-content:focus{
  transform:translateY(0);
  outline:3px solid #ffe066;
}
.accessibility-toggle{
  position:fixed;
  right:18px;
  bottom:156px;
  z-index:9998;
  border:0;
  min-width:148px;
  height:52px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:0 16px;
  color:#fff;
  background:linear-gradient(135deg,#075ca8,#22c6d7,#55b847);
  box-shadow:0 18px 46px rgba(7,92,168,.24);
  font-family:Cairo,Arial,sans-serif;
  font-weight:900;
  cursor:pointer;
  transition:transform .22s ease, box-shadow .22s ease;
}
.accessibility-toggle:hover,
.accessibility-toggle:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 24px 58px rgba(7,92,168,.30);
}
.accessibility-toggle i{
  font-size:19px;
}
.accessibility-panel{
  position:fixed;
  right:18px;
  bottom:220px;
  width:min(390px,calc(100vw - 28px));
  max-height:min(72vh,680px);
  z-index:9999;
  display:none;
  overflow:auto;
  border-radius:28px;
  padding:18px;
  background:var(--a11y-panel-bg);
  border:1px solid var(--a11y-panel-border);
  box-shadow:var(--a11y-panel-shadow);
  backdrop-filter:blur(18px);
}
.accessibility-panel.is-open{
  display:block;
}
.accessibility-panel__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(7,92,168,.10);
}
.accessibility-panel__title{
  display:flex;
  align-items:center;
  gap:10px;
}
.accessibility-panel__title i{
  width:44px;
  height:44px;
  border-radius:16px;
  display:grid;
  place-items:center;
  color:#fff;
  background:linear-gradient(135deg,#075ca8,#55b847);
}
.accessibility-panel__title strong{
  display:block;
  color:#082b4d;
  font-size:17px;
  line-height:1.35;
}
.accessibility-panel__title small{
  display:block;
  color:#60758d;
  font-size:12px;
  font-weight:800;
}
.accessibility-close{
  width:38px;
  height:38px;
  border:0;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:#f2f7fb;
  color:#075ca8;
  cursor:pointer;
}
.accessibility-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
.accessibility-action{
  min-height:50px;
  border:1px solid rgba(7,92,168,.11);
  border-radius:17px;
  padding:10px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  text-align:right;
  color:#082b4d;
  background:linear-gradient(145deg,#fff,#f7fcff);
  font-family:Cairo,Arial,sans-serif;
  font-size:12px;
  font-weight:900;
  line-height:1.45;
  cursor:pointer;
  transition:.18s ease;
}
.accessibility-action i{
  width:28px;
  height:28px;
  border-radius:11px;
  flex:0 0 28px;
  display:grid;
  place-items:center;
  color:#075ca8;
  background:rgba(34,198,215,.12);
}
.accessibility-action:hover,
.accessibility-action:focus-visible,
.accessibility-action.is-active{
  color:#fff;
  background:linear-gradient(135deg,#075ca8,#55b847);
  border-color:transparent;
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(7,92,168,.18);
}
.accessibility-action:hover i,
.accessibility-action:focus-visible i,
.accessibility-action.is-active i{
  color:#fff;
  background:rgba(255,255,255,.18);
}
.accessibility-panel__footer{
  display:grid;
  gap:9px;
  margin-top:12px;
}
.accessibility-panel__footer .accessibility-action{
  min-height:46px;
}
.accessibility-page-link{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:44px;
  border-radius:16px;
  color:#075ca8;
  background:#eef8ff;
  border:1px solid rgba(7,92,168,.13);
  font-weight:900;
  text-align:center;
}
.accessibility-page-link:hover{
  color:#fff;
  background:linear-gradient(135deg,#075ca8,#22c6d7);
}

/* Applied modes */
html.a11y-font-1{font-size:17px}
html.a11y-font-2{font-size:18.5px}
html.a11y-font-3{font-size:20px}
html.a11y-font-minus{font-size:15px}
html.a11y-line-height body,
html.a11y-line-height main,
html.a11y-line-height p,
html.a11y-line-height li{
  line-height:2.15!important;
}
html.a11y-letter-spacing body{
  letter-spacing:.75px!important;
}
html.a11y-readable-font body,
html.a11y-readable-font button,
html.a11y-readable-font input,
html.a11y-readable-font textarea,
html.a11y-readable-font select{
  font-family:Arial,Tahoma,sans-serif!important;
}
html.a11y-highlight-links a:not(.btn):not(.footer-dev-credit):not(.brand):not(.admin-brand){
  outline:2px dashed #ffb703!important;
  outline-offset:3px!important;
  text-decoration:underline!important;
  text-decoration-thickness:2px!important;
}
html.a11y-high-contrast body{
  background:#000!important;
  color:#fff!important;
}
html.a11y-high-contrast header,
html.a11y-high-contrast footer,
html.a11y-high-contrast section,
html.a11y-high-contrast article,
html.a11y-high-contrast .admin-card,
html.a11y-high-contrast .site-header,
html.a11y-high-contrast .site-footer,
html.a11y-high-contrast .page-section,
html.a11y-high-contrast .home-section,
html.a11y-high-contrast .feature-panel,
html.a11y-high-contrast .activity-card,
html.a11y-high-contrast .news-card,
html.a11y-high-contrast .product-card,
html.a11y-high-contrast .footer-card{
  background:#000!important;
  color:#fff!important;
  border-color:#fff!important;
  box-shadow:none!important;
}
html.a11y-high-contrast p,
html.a11y-high-contrast span,
html.a11y-high-contrast small,
html.a11y-high-contrast h1,
html.a11y-high-contrast h2,
html.a11y-high-contrast h3,
html.a11y-high-contrast h4,
html.a11y-high-contrast li,
html.a11y-high-contrast label{
  color:#fff!important;
}
html.a11y-high-contrast a,
html.a11y-high-contrast .btn{
  color:#ffff00!important;
  border-color:#ffff00!important;
}
html.a11y-dark body{
  background:#06192f!important;
  color:#eaf6ff!important;
}
html.a11y-dark .site-header,
html.a11y-dark .site-footer,
html.a11y-dark .page-section,
html.a11y-dark .home-section,
html.a11y-dark .feature-panel,
html.a11y-dark .activity-card,
html.a11y-dark .news-card,
html.a11y-dark .product-card,
html.a11y-dark .footer-card,
html.a11y-dark .survey-results-card,
html.a11y-dark .survey-form-card{
  background:#08233f!important;
  color:#eaf6ff!important;
  border-color:rgba(255,255,255,.14)!important;
}
html.a11y-dark p,
html.a11y-dark span,
html.a11y-dark small,
html.a11y-dark h1,
html.a11y-dark h2,
html.a11y-dark h3,
html.a11y-dark h4,
html.a11y-dark label{
  color:#eaf6ff!important;
}
html.a11y-invert{
  filter:invert(1) hue-rotate(180deg);
}
html.a11y-invert img,
html.a11y-invert video,
html.a11y-invert iframe,
html.a11y-invert .accessibility-panel,
html.a11y-invert .accessibility-toggle{
  filter:invert(1) hue-rotate(180deg);
}
html.a11y-grayscale{
  filter:grayscale(1);
}
html.a11y-stop-motion *,
html.a11y-stop-motion *:before,
html.a11y-stop-motion *:after{
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important;
}
html.a11y-big-cursor,
html.a11y-big-cursor *{
  cursor:default!important;
}
html.a11y-big-cursor a,
html.a11y-big-cursor button,
html.a11y-big-cursor [role="button"],
html.a11y-big-cursor input,
html.a11y-big-cursor textarea,
html.a11y-big-cursor select{
  cursor:pointer!important;
}
html.a11y-simplified .hero:before,
html.a11y-simplified .hero:after,
html.a11y-simplified .section-gradient:before,
html.a11y-simplified .section-gradient:after,
html.a11y-simplified .orb,
html.a11y-simplified .floating-shape{
  display:none!important;
}
html.a11y-simplified .hero,
html.a11y-simplified .home-section,
html.a11y-simplified .page-section{
  background:#fff!important;
}
html.a11y-simplified .activity-card,
html.a11y-simplified .news-card,
html.a11y-simplified .product-card,
html.a11y-simplified .feature-panel,
html.a11y-simplified .footer-card{
  box-shadow:0 8px 24px rgba(2,35,70,.08)!important;
}
html.a11y-yellow-black body,
html.a11y-yellow-black section,
html.a11y-yellow-black article,
html.a11y-yellow-black header,
html.a11y-yellow-black footer,
html.a11y-yellow-black .site-header,
html.a11y-yellow-black .site-footer,
html.a11y-yellow-black .page-section,
html.a11y-yellow-black .home-section,
html.a11y-yellow-black .footer-card{
  background:#000!important;
  color:#ffe600!important;
  border-color:#ffe600!important;
}
html.a11y-yellow-black *{
  color:#ffe600!important;
}
html.a11y-yellow-black a,
html.a11y-yellow-black button,
html.a11y-yellow-black .btn{
  color:#000!important;
  background:#ffe600!important;
  border-color:#ffe600!important;
}

/* Keyboard focus */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid #ffb703!important;
  outline-offset:3px!important;
}

/* Screen-reader utility */
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

@media(max-width:760px){
  .accessibility-toggle{
    right:12px;
    bottom:118px;
    min-width:54px;
    width:54px;
    height:54px;
    padding:0;
    border-radius:18px;
  }
  .accessibility-toggle span{
    display:none;
  }
  .accessibility-panel{
    right:10px;
    left:10px;
    bottom:184px;
    width:auto;
    max-height:62vh;
    border-radius:24px;
    padding:14px;
  }
  .accessibility-grid{
    grid-template-columns:1fr;
    gap:8px;
  }
  .accessibility-action{
    min-height:46px;
    font-size:12.5px;
  }
}
