/* MGI – „Достъпност“ (#ddA11y): тесен панел под иконката, настройките като плочки (одобрен вариант 3, 8.11.2026). a11y.js добавя маркировката. */
html body .topbar #ddA11y>.dd-panel.pa.pa:not([hidden]){display:flex!important;flex-direction:column!important;align-items:stretch!important;padding:0!important;gap:0!important;font-family:var(--f-body,Inter,system-ui,sans-serif)}
html body .topbar #ddA11y>.dd-panel.pa.pa>*{grid-column:auto!important;grid-row:auto!important;flex-shrink:0!important}

/* order: size, reading + visibility (one block), quick profiles, theme */
#ddA11y .pa>.ax-head{order:0}
#ddA11y .pa>.pa-size{order:1}
#ddA11y .pa>.pa-read{order:2}
#ddA11y .pa>.pa-vis{order:3}
#ddA11y .pa>.pa-move{order:4}
#ddA11y .pa>.pa-pre{order:5}
#ddA11y .pa>.pa-theme{order:6}

/* header */
html body .topbar #ddA11y>.dd-panel.pa.pa>.ax-head{display:flex!important;align-items:center;gap:10px;padding:16px 14px 14px 16px!important;margin:0!important;border:0!important;border-bottom:1px solid #EEF2F6!important;background:#FFFFFF!important;border-radius:21px 21px 0 0}
html body .topbar #ddA11y .pa .ax-head>.dd-head{display:flex!important;align-items:center;gap:12px;flex:1;min-width:0;margin:0!important;padding:0!important;border:0!important;background:none!important;text-transform:none;letter-spacing:0;font-size:inherit;color:#14202B}
#ddA11y .pa-av{position:relative;width:42px;height:42px;border-radius:13px;background:linear-gradient(145deg,#3D8BD0,#1C5B8C);color:#FFFFFF;display:grid;place-items:center;flex:none;box-shadow:0 10px 18px -10px rgba(28,91,140,.7)}
#ddA11y .pa-av i{position:absolute;right:-4px;bottom:-4px;width:12px;height:12px;border-radius:50%;background:#1E9E5A;border:2.5px solid #FFFFFF}
#ddA11y .pa-ht{flex:1;min-width:0;display:grid;gap:2px}
#ddA11y .pa-ht b{font:700 1rem/1.2 Montserrat,var(--f-body,Inter),sans-serif;color:#14202B}
#ddA11y .pa-ht span{font-size:.78rem;color:#33424F;font-weight:400}
html body .topbar #ddA11y .ax-reset{display:inline-flex!important;flex-direction:row!important;white-space:nowrap;align-items:center;gap:6px;height:32px;padding:0 11px;border-radius:10px;border:1px solid #CFE2F3;background:#F4F9FE;color:#1C5B8C;font:600 .75rem var(--f-body,Inter),sans-serif;cursor:pointer;flex:none;margin:0}
html body .topbar #ddA11y .ax-reset:hover{background:#E6F1FB}
#ddA11y .dd-panel.pa .pa-x{width:32px;height:32px;padding:0;border-radius:10px;border:1px solid #DCE6EF;background:#FFFFFF;color:#3B4A5A;display:grid;place-items:center;cursor:pointer;flex:none}
#ddA11y .dd-panel.pa .pa-x:hover{background:#F3F7FB;color:#1C5B8C}

/* sections */
html body .topbar #ddA11y>.dd-panel.pa.pa>.ax-sec{margin:0!important;padding:16px!important;border:0!important;border-bottom:1px solid #EEF2F6!important;background:#FFFFFF!important;display:block}
html body .topbar #ddA11y>.dd-panel.pa.pa>.pa-read{border-bottom:0!important;padding-bottom:4px!important}
html body .topbar #ddA11y>.dd-panel.pa.pa>.pa-vis{padding-top:4px!important}
html body .topbar #ddA11y>.dd-panel.pa.pa>.ax-sec:last-child{border-bottom:0!important}
#ddA11y .pa .ax-h{display:flex!important;align-items:center;gap:10px;margin:0 0 10px;font:600 .72rem var(--f-body,Inter),sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#5A6875}
#ddA11y .pa .ax-h i{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;flex:none;background:linear-gradient(145deg,#FFFFFF,#E6F1FB);border:1px solid #9CC4E6;color:#2E7BBF;box-shadow:0 6px 14px -10px #1C5B8C}
#ddA11y .pa .pa-vis .ax-h,#ddA11y .pa .pa-move .ax-h{display:none!important}

/* text size: one segmented bar */
html body .topbar #ddA11y .pa .ax-fs{display:flex!important;gap:0!important;border:1px solid #E1E8EF;border-radius:12px;overflow:hidden;background:#FFFFFF;padding:0!important}
html body .topbar #ddA11y .pa .ax-fs button{flex:1;height:40px;display:grid!important;place-items:center;text-align:center;border:0!important;border-right:1px solid #EEF2F6!important;border-radius:0!important;background:#FFFFFF!important;color:#33424F!important;font-weight:700;cursor:pointer;box-shadow:none!important;margin:0;padding:0}
html body .topbar #ddA11y .pa .ax-fs button:last-child{border-right:0!important}
html body .topbar #ddA11y .pa .ax-fs button[aria-pressed=true]{background:linear-gradient(135deg,#F2F8FD,#E6F1FB)!important;color:#1C5B8C!important;box-shadow:inset 0 0 0 1.5px #9CC4E6!important}

/* settings as tiles, two columns */
html body .topbar #ddA11y .pa .ax-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
html body .topbar #ddA11y .pa .ax-tg{display:grid!important;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"ic sw" "tx tx";align-items:center;gap:7px!important;padding:11px!important;border-radius:14px!important;border:1px solid #E1E8EF;background:#FFFFFF;cursor:pointer;position:relative;transition:border-color .15s,background .15s}
html body .topbar #ddA11y .pa .ax-tg:hover{border-color:#B9D6EF;background:#FAFCFE}
html body .topbar #ddA11y .pa .ax-tg:has(input:checked){background:linear-gradient(135deg,#FFFFFF,#E6F1FB);border:1.5px solid #9CC4E6}
html body .topbar #ddA11y .pa .ax-tg.vis-off{display:none!important}
#ddA11y .pa .ax-tg>.pa-ic{grid-area:ic;width:30px;height:30px;border-radius:9px;display:grid;place-items:center}
#ddA11y .pa .ax-tg>i{grid-area:sw;justify-self:end;width:38px!important;height:22px!important}
#ddA11y .pa .ax-tg>i:after{top:3px!important;left:3px!important}
#ddA11y .pa .ax-tg input:checked+i{background:linear-gradient(145deg,#3D8BD0,#1C5B8C)!important}
#ddA11y .pa .ax-tg>span:not(.pa-ic){grid-area:tx;display:block!important;font-size:.82rem;line-height:1.25}
#ddA11y .pa .ax-tg b{font-weight:600;color:#14202B}
#ddA11y .pa .ax-tg small{display:none}
#ddA11y .pa .c-b{background:#E6F1FB;color:#1C5B8C}#ddA11y .pa .c-g{background:#E3F5EB;color:#167A45}#ddA11y .pa .c-o{background:#FFF1E5;color:#A8501A}#ddA11y .pa .c-p{background:#F1EAFB;color:#5E3399}#ddA11y .pa .c-t{background:#E2F5F6;color:#127380}

/* quick profiles: 2 × 2 */
html body .topbar #ddA11y .pa .ax-pre{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important}
html body .topbar #ddA11y .pa .ax-pre button{display:flex;align-items:center;gap:9px;height:auto!important;min-height:46px;padding:8px 10px!important;border-radius:14px!important;border:1px solid #E1E8EF!important;background:#FFFFFF!important;color:#14202B!important;font:600 .82rem var(--f-body,Inter),sans-serif;text-align:left;cursor:pointer;box-shadow:none!important;margin:0}
html body .topbar #ddA11y .pa .ax-pre button:hover{border-color:#B9D6EF!important;background:#FAFCFE!important}
html body .topbar #ddA11y .pa .ax-pre button:is([aria-pressed=true],.on,.is-on){background:linear-gradient(135deg,#FFFFFF,#E6F1FB)!important;border:1.5px solid #9CC4E6!important}
#ddA11y .pa .ax-pre .pa-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none}

/* themes: 4 in a row */
html body .topbar #ddA11y .pa .ax-themes{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px!important}
html body .topbar #ddA11y .pa .ax-th{display:grid!important;justify-items:center;gap:6px;padding:8px 4px 7px!important;border-radius:12px!important;border:1px solid #E1E8EF!important;background:#FFFFFF!important;font:600 .72rem var(--f-body,Inter),sans-serif;color:#33424F!important;cursor:pointer;box-shadow:none!important;margin:0}
html body .topbar #ddA11y .pa .ax-th[aria-pressed=true]{border:1.5px solid #9CC4E6!important;background:linear-gradient(135deg,#FFFFFF,#EEF5FC)!important;color:#1C5B8C!important}

/* computer and tablet: right under the button, the arrow pointing at it */
@media (min-width:761px){
  html body .topbar #ddA11y>.dd-panel.pa.pa:not([hidden]){position:fixed!important;inset:auto!important;left:var(--pa-l,auto)!important;top:var(--pa-t,64px)!important;right:auto!important;bottom:auto!important;width:400px!important;min-width:0!important;max-width:calc(100vw - 24px)!important;max-height:none!important;overflow:visible!important;transform:none!important;margin:0!important;border:1px solid #D3E0EC!important;border-radius:22px!important;background:#FFFFFF!important;box-shadow:0 30px 70px -28px rgba(16,40,70,.45),0 2px 6px rgba(16,40,70,.06)!important;z-index:140!important}
  html body .topbar #ddA11y>.dd-panel.pa.pa:not([hidden]).pa-scroll{max-height:var(--pa-mh)!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain}
  html body .topbar #ddA11y>.dd-panel.pa.pa:not([hidden]):before{content:""!important;display:block!important;position:absolute!important;top:-8px!important;left:var(--pa-cx,50%)!important;right:auto!important;margin-left:-8px!important;width:16px!important;height:16px!important;background:#FFFFFF!important;border-left:1px solid #D3E0EC!important;border-top:1px solid #D3E0EC!important;transform:rotate(45deg)!important;border-radius:3px 0 0!important;z-index:2}
  #ddA11y .dd-panel.pa>.dd-xw,#ddA11y .dd-panel.pa>.mhs-h{display:none!important}
}

/* phone: the sheet has its own title bar (with back); keep only „Нулирай“ from our header */
@media (max-width:760px){
  html body .topbar #ddA11y>.dd-panel.pa.pa>.ax-head:not(:has(.ax-reset)){display:none!important}
  html body .topbar #ddA11y>.dd-panel.pa.pa>.ax-head{justify-content:flex-end;padding:0 16px 4px!important;border:0!important;border-radius:0}
  html body .topbar #ddA11y .pa .ax-head>.dd-head,#ddA11y .dd-panel.pa .pa-x{display:none!important}
  html body .topbar #ddA11y>.dd-panel.pa.pa>.ax-sec{padding:14px 16px!important}
  html body .topbar #ddA11y>.dd-panel.pa.pa>.pa-read{padding-bottom:4px!important}
  html body .topbar #ddA11y>.dd-panel.pa.pa>.pa-vis{padding-top:4px!important}
  html body .topbar #ddA11y .pa .ax-tg{min-height:84px}
  html body .topbar #ddA11y .pa .ax-fs button{height:46px}
}
@media (hover:none){
  html body .topbar #ddA11y .pa .ax-tg:hover:not(:has(input:checked)){border-color:#E1E8EF;background:#FFFFFF}
}
