/* LegalFirms.in accessibility corner, read-aloud player and back-to-top
   (13 Nov 2026). Byte-identical in both repos; loaded by includes/lf-a11y.php.
   Sizes are in px so the "Text size" setting never changes the panel itself.
   Ids #awHub and #awToTop are kept: lf-global-header.css lifts them above the
   phone bottom bar. */
#awHub, #awToTop, #lfaPlayer { font: 500 14px/1.35 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; letter-spacing: normal; word-spacing: normal; }
#awHub *, #awToTop *, #lfaPlayer * { box-sizing: border-box; font-family: inherit; }
.lfa-round { width: 40px; height: 40px; border-radius: 50%; border: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; background: #101d33; color: #fff; box-shadow: 0 2px 10px rgba(16,29,51,.28); padding: 0; }
.lfa-round:hover { background: #16243f; }
.lfa-round:focus-visible, #awHub button:focus-visible, #lfaPlayer button:focus-visible { outline: 3px solid #f59e0b; outline-offset: 2px; }
.lfa-round svg { width: 20px; height: 20px; }

#awToTop { position: fixed; right: 18px; bottom: 18px; z-index: 8990; opacity: 0; transform: translateY(6px); pointer-events: none; visibility: hidden; transition: opacity .2s, transform .2s, visibility .2s; }
#awToTop.lfa-on { opacity: 1; transform: none; pointer-events: auto; visibility: visible; }

#awHub { position: fixed; left: 18px; bottom: 18px; z-index: 8990; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
#awHub .lfa-listen { background: #fff; color: #101d33; border: 1px solid #d9dee8; }
#awHub .lfa-listen:hover { background: #f4f6fa; }
#awHub .lfa-listen[aria-pressed="true"] { background: #c9a256; color: #101d33; border-color: #c9a256; }

.lfa-panel { position: absolute; left: 0; bottom: 98px; width: 292px; max-width: calc(100vw - 24px); max-height: min(560px, calc(100vh - 140px)); overflow: auto; background: #fff; color: #101d33; border: 1px solid #d9dee8; border-radius: 14px; box-shadow: 0 12px 34px rgba(16,29,51,.22); padding: 14px; }
.lfa-panel[hidden] { display: none; }
.lfa-head { display: flex; align-items: center; justify-content: space-between; margin: 0 0 10px; }
.lfa-head strong { font-size: 15px; font-weight: 700; }
.lfa-x { width: 30px; height: 30px; border-radius: 8px; border: 1px solid #e3e7ef; background: #fff; color: #101d33; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.lfa-x svg { width: 16px; height: 16px; }
.lfa-big { width: 100%; display: flex; align-items: center; gap: 10px; padding: 11px 12px; border-radius: 10px; border: 0; background: #101d33; color: #fff; font-weight: 700; font-size: 14px; cursor: pointer; text-align: left; }
.lfa-big svg { width: 20px; height: 20px; flex-shrink: 0; }
.lfa-big small { display: block; font-weight: 500; font-size: 12px; opacity: .8; }
.lfa-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 12px 0 0; padding: 8px 10px; border: 1px solid #e3e7ef; border-radius: 10px; }
.lfa-row > span { font-weight: 600; }
.lfa-steps { display: flex; gap: 4px; }
.lfa-steps button { min-width: 36px; height: 32px; border-radius: 8px; border: 1px solid #d9dee8; background: #fff; color: #101d33; font-weight: 700; cursor: pointer; padding: 0 8px; }
.lfa-steps button[aria-pressed="true"] { background: #101d33; color: #fff; border-color: #101d33; }
.lfa-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 10px 0 0; }
.lfa-tog { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 10px; min-height: 64px; border-radius: 10px; border: 1px solid #e3e7ef; background: #fff; color: #101d33; cursor: pointer; text-align: left; font-weight: 600; font-size: 13px; }
.lfa-tog svg { width: 18px; height: 18px; }
.lfa-tog:hover { border-color: #b9c2d3; }
.lfa-tog[aria-pressed="true"] { background: #eef3ff; border-color: #16243f; box-shadow: inset 0 0 0 1px #16243f; }
.lfa-foot { display: flex; justify-content: space-between; align-items: center; margin: 12px 0 0; font-size: 12px; color: #5b6475; }
.lfa-reset { border: 0; background: none; color: #9b1c1c; font-weight: 700; cursor: pointer; padding: 6px 0; font-size: 13px; }
.lfa-note { margin: 10px 0 0; font-size: 12px; color: #5b6475; }

#lfaPlayer { position: fixed; left: 50%; transform: translateX(-50%); bottom: 18px; z-index: 8995; display: flex; align-items: center; gap: 6px; background: #101d33; color: #fff; padding: 6px 8px 6px 14px; border-radius: 12px; box-shadow: 0 8px 26px rgba(16,29,51,.35); max-width: calc(100vw - 24px); }
#lfaPlayer[hidden] { display: none; }
#lfaPlayer .lfa-st { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 40vw; margin-right: 4px; }
#lfaPlayer button { height: 34px; min-width: 34px; border-radius: 8px; border: 0; background: rgba(255,255,255,.12); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 4px; padding: 0 8px; font-weight: 700; font-size: 12px; }
#lfaPlayer button:hover { background: rgba(255,255,255,.22); }
#lfaPlayer svg { width: 16px; height: 16px; }
.lfa-reading { background: #fff4cc !important; box-shadow: 0 0 0 4px #fff4cc !important; border-radius: 3px; color: #101d33 !important; }

@media (max-width: 480px) {
  #awHub { left: 12px; bottom: 12px; }
  #awToTop { right: 12px; bottom: 12px; }
  .lfa-round { width: 38px; height: 38px; }
  .lfa-panel { position: fixed; left: 12px; right: 12px; bottom: 112px; width: auto; }
  #lfaPlayer .lfa-st { display: none; }
}
@media (max-width: 1024px) {
  body:has(#lfb) #lfaPlayer { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
}
@media print { #awHub, #awToTop, #lfaPlayer { display: none !important; } }

/* ── What each setting does to the page ─────────────────────────── */
html.lfa-t1 { font-size: 112.5% !important; }
html.lfa-t2 { font-size: 125% !important; }
html.lfa-t1 body { font-size: 1.06em; }
html.lfa-t2 body { font-size: 1.12em; }
/* Root filter: it does not move fixed elements (the root is exempt). */
html.lfa-contrast { filter: contrast(1.28) saturate(1.1); }
html.lfa-contrast body { background-color: #fff; }
html.lfa-font body, html.lfa-font body :not(i):not([class*="fa-"]):not(svg):not(svg *):not(code):not(pre) { font-family: Verdana, Tahoma, "Segoe UI", Arial, sans-serif !important; }
html.lfa-spacing p, html.lfa-spacing li, html.lfa-spacing dd, html.lfa-spacing td, html.lfa-spacing blockquote, html.lfa-spacing label { line-height: 1.95 !important; letter-spacing: .03em !important; word-spacing: .12em !important; }
html.lfa-spacing p { margin-bottom: 1em; }
html.lfa-links a { text-decoration: underline !important; text-underline-offset: 2px; }
html.lfa-links :focus-visible { outline: 3px solid #f59e0b !important; outline-offset: 2px !important; }
html.lfa-still *, html.lfa-still *::before, html.lfa-still *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
/* With the phone bottom bar the corner buttons sit 76px up (lf-global-header.css),
   so the panel and the footer's last spacer clear both corner buttons. */
@media (max-width: 1024px) {
  body:has(#awHub) #lff .lff-space { height: calc(150px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 480px) {
  body:has(#lfb) .lfa-panel { bottom: calc(176px + env(safe-area-inset-bottom, 0px)); max-height: calc(100vh - 250px); }
}
