/* =====================================================================
   Maxsus imkoniyatlar (imkoniyati cheklanganlar uchun): rang rejimlari, shrift,
   oraliqlar, havolalar, kursor, rasmlar, animatsiya, o'qish chizg'ichi, ovozli o'qish.
   Sozlamalar <html> sinflari orqali qo'llanadi; panelning o'zi (.a11y-ui) o'zgarmaydi.
   ===================================================================== */
.a11y-ui, .a11y-ui * { box-sizing: border-box; }

/* ---------- ochish tugmasi (header va mobil) ---------- */
.a11y-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 46px; height: 46px; border-radius: 50%; border: 2px solid currentColor;
  background: #fff; color: #053655; font-size: 20px; cursor: pointer; flex: none; padding: 0; line-height: 1; transition: transform .15s; }
.a11y-btn:hover, .a11y-btn:focus-visible { transform: scale(1.08); outline: 3px solid #8abe3f; outline-offset: 2px; }
.a11y-head-btn { margin-right: 14px; }
.a11y-fab { position: fixed; left: 16px; bottom: 16px; z-index: 99998; width: 56px; height: 56px; font-size: 24px; background: #015285; color: #fff; border-color: #fff; box-shadow: 0 6px 20px rgba(0,0,0,.3); }
.a11y-skip { position: fixed; left: 12px; top: -60px; z-index: 100000; background: #053655; color: #fff !important; padding: 10px 16px; border-radius: 8px; font: 600 16px/1.3 system-ui, sans-serif; text-decoration: none; }
.a11y-skip:focus { top: 12px; }

/* ---------- panel ---------- */
.a11y-panel { position: fixed; top: 0; right: 0; bottom: 0; width: 380px; max-width: 100vw; z-index: 99999; background: #fff; color: #10263a; box-shadow: -10px 0 40px rgba(0,0,0,.3);
  display: flex; flex-direction: column; font: 15px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; transform: translateX(105%); transition: transform .2s; }
.a11y-panel.open { transform: none; }
.a11y-panel[hidden] { display: none; }
.a11y-ph { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; background: #053655; color: #fff; }
.a11y-ph h2 { margin: 0; font-size: 19px; color: #fff; display: flex; gap: 10px; align-items: center; }
.a11y-x { background: transparent; border: 2px solid rgba(255,255,255,.6); color: #fff; width: 40px; height: 40px; border-radius: 50%; font-size: 18px; cursor: pointer; }
.a11y-x:focus-visible { outline: 3px solid #8abe3f; }
.a11y-pb { overflow-y: auto; padding: 14px 18px 20px; flex: 1; }
.a11y-g { margin-bottom: 16px; }
.a11y-g > b { display: block; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: #53687a; margin-bottom: 8px; }
.a11y-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.a11y-row.two { grid-template-columns: 1fr 1fr; }
.a11y-o { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 64px; padding: 8px 4px; border: 2px solid #d5dee6; border-radius: 12px;
  background: #fff; color: #10263a; cursor: pointer; font: 600 13px/1.2 inherit; text-align: center; }
.a11y-o i { font-size: 20px; }
.a11y-o:hover { border-color: #8abe3f; }
.a11y-o:focus-visible { outline: 3px solid #015285; outline-offset: 2px; }
.a11y-o[aria-pressed="true"] { border-color: #015285; background: #e6f0f8; color: #015285; }
.a11y-o.c-bw { background: linear-gradient(90deg, #fff 50%, #222 50%); color: #000; text-shadow: 0 0 3px #fff; }
.a11y-o.c-hc { background: #000; color: #ff0; border-color: #555; }
.a11y-o.c-inv { background: #10263a; color: #fff; }
.a11y-o.c-bw[aria-pressed="true"], .a11y-o.c-hc[aria-pressed="true"], .a11y-o.c-inv[aria-pressed="true"] { outline: 3px solid #8abe3f; outline-offset: 1px; }
.a11y-size { display: flex; align-items: center; gap: 8px; }
.a11y-size button { width: 52px; height: 48px; border-radius: 12px; border: 2px solid #d5dee6; background: #fff; color: #10263a; font-weight: 800; cursor: pointer; }
.a11y-size button:focus-visible { outline: 3px solid #015285; }
.a11y-size output { flex: 1; text-align: center; font-weight: 800; font-size: 18px; }
.a11y-speech { background: #f3f7fa; border-radius: 12px; padding: 10px; }
.a11y-speech .a11y-row { grid-template-columns: 1fr 1fr 1fr; }
.a11y-rate { display: flex; align-items: center; gap: 10px; margin-top: 8px; font-size: 13px; }
.a11y-rate input { flex: 1; }
.a11y-note { font-size: 12px; color: #6b7f90; margin: 8px 0 0; }
.a11y-reset { width: 100%; min-height: 48px; border-radius: 12px; border: 2px solid #e5484d; background: #fff; color: #c0392b; font-weight: 700; cursor: pointer; font-size: 15px; }
.a11y-reset:focus-visible { outline: 3px solid #015285; }
.a11y-say { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 99999; background: #053655; color: #fff; padding: 10px 14px; border-radius: 30px;
  font: 600 14px/1.3 system-ui, sans-serif; display: flex; align-items: center; gap: 10px; box-shadow: 0 6px 20px rgba(0,0,0,.3); max-width: 92vw; }
.a11y-say button { background: #e5484d; color: #fff; border: 0; border-radius: 20px; padding: 6px 12px; cursor: pointer; font-weight: 700; }
.a11y-guide { position: fixed; left: 0; right: 0; height: 44px; z-index: 99997; pointer-events: none; border-top: 3px solid #e8a032; border-bottom: 3px solid #e8a032; background: rgba(255, 220, 120, .18);
  box-shadow: 0 0 0 100vmax rgba(0,0,0,.35); }
.a11y-reading { outline: 3px solid #e8a032 !important; outline-offset: 2px; background-color: rgba(255, 220, 120, .35) !important; }

/* ---------- rejimlar (panel va tugmalar ta'sirlanmaydi) ---------- */
/* oq-qora */
html.a11y-gray body > *:not(.a11y-ui) { filter: grayscale(1) !important; }
/* teskari ranglar (rasmlar asl holida) */
html.a11y-invert body > *:not(.a11y-ui) { filter: invert(1) hue-rotate(180deg) !important; }
html.a11y-invert body > *:not(.a11y-ui) img, html.a11y-invert body > *:not(.a11y-ui) video { filter: invert(1) hue-rotate(180deg) !important; }
/* yuqori kontrast: qora fon, sariq matn, ko'k-havorang havolalar */
html.a11y-contrast, html.a11y-contrast body,
html.a11y-contrast body *:not(.a11y-ui):not(.a11y-ui *):not(img):not(video):not(svg):not(svg *) {
  background-color: #000 !important; background-image: none !important; color: #ff0 !important; border-color: #ff0 !important; box-shadow: none !important; text-shadow: none !important; }
html.a11y-contrast body a:not(.a11y-ui *), html.a11y-contrast body a:not(.a11y-ui *) * { color: #0ff !important; text-decoration: underline !important; }
html.a11y-contrast body button:not(.a11y-ui *), html.a11y-contrast body .theme-btn, html.a11y-contrast body .p-btn { border: 2px solid #ff0 !important; }
html.a11y-contrast body .bg-layer, html.a11y-contrast body .shape-box { display: none !important; }
/* shrift o'lchami (sahifa kattalashtiriladi; panel o'zgarmaydi) */
html[data-a11y-zoom] body > *:not(.a11y-ui) { zoom: var(--a11y-zoom, 1); }
/* oraliqlar */
html.a11y-spacing body *:not(.a11y-ui):not(.a11y-ui *):not(i) { letter-spacing: .12em !important; word-spacing: .16em !important; line-height: 1.9 !important; }
/* havolalarni ajratish */
html.a11y-links body a:not(.a11y-ui *) { text-decoration: underline !important; text-underline-offset: 3px; outline: 2px dashed currentColor; outline-offset: 2px; }
html.a11y-links body a:not(.a11y-ui *):focus, html.a11y-links body a:not(.a11y-ui *):hover { background: #ff0 !important; color: #000 !important; }
/* katta kursor */
html.a11y-cursor, html.a11y-cursor * { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M6 3 L6 40 L16 30 L23 45 L30 42 L23 27 L37 27 Z' fill='%23000' stroke='%23fff' stroke-width='3'/%3E%3C/svg%3E") 6 3, auto !important; }
/* rasmlarni o'chirish */
html.a11y-noimg body img:not(.a11y-ui *), html.a11y-noimg body video:not(.a11y-ui *), html.a11y-noimg body iframe:not(.a11y-ui *) { visibility: hidden !important; }
html.a11y-noimg body *:not(.a11y-ui):not(.a11y-ui *) { background-image: none !important; }
/* animatsiyalarni to'xtatish */
html.a11y-still *, html.a11y-still *::before, html.a11y-still *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
/* fokusni yaqqol ko'rsatish (har doim) */
html[class*="a11y-"] body :focus-visible { outline: 3px solid #e8a032 !important; outline-offset: 2px !important; }

@media (max-width: 480px) {
  .a11y-panel { width: 100vw; }
  .a11y-row { grid-template-columns: repeat(2, 1fr); }
  .a11y-head-btn { width: 40px; height: 40px; font-size: 18px; margin-right: 8px; }
}
@media print { .a11y-ui { display: none !important; } }
/* yuqori kontrast: bezak qatlamlari (pseudo-elementlar) ham o'chiriladi */
html.a11y-contrast body *:not(.a11y-ui):not(.a11y-ui *)::before, html.a11y-contrast body *:not(.a11y-ui):not(.a11y-ui *)::after { background-image: none !important; background-color: transparent !important; border-color: #ff0 !important; box-shadow: none !important; }
html.a11y-contrast body img:not(.a11y-ui *) { filter: contrast(1.2); }
@media (max-width: 991px) { .a11y-head-btn { order: -1; margin: 0 10px 0 0; } }
/* header'dagi tugma — sayt dizayniga mos (menyu tugmasi bilan bir xil o'lcham) */
.menu-right-content .a11y-head-btn { width: 54px; height: 54px; margin: 0; border: 0; background: #e8f1f7; color: var(--secondary-color, #015285); font-size: 21px; transition: background .2s, color .2s; }
.menu-right-content .a11y-head-btn:hover, .menu-right-content .a11y-head-btn[aria-expanded="true"] { background: var(--secondary-color, #015285); color: #fff; transform: none; }
.menu-right-content .a11y-head-btn:focus-visible { outline: 3px solid var(--theme-color, #8abe3f); outline-offset: 2px; }
.a11y-fab { background: var(--secondary-color, #015285); border: 3px solid #fff; }
@media (max-width: 991px) { .menu-right-content .a11y-head-btn { width: 46px; height: 46px; font-size: 18px; margin-right: 6px; } }