/* Modern Accessibility (WP Accessibility-style) */

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

/* Skip link */
.mam-skip-link{
  position:absolute;
  left:12px;
  top:12px;
  z-index:1000000;
  padding:10px 14px;
  border-radius:999px;
  background:#111;
  color:#fff;
  text-decoration:none;
  transform:translateY(-140%);
  transition:transform .2s ease;
}
.mam-skip-link:focus{
  transform:translateY(0);
}

/* Floating button + panel */
.mam-root{
  position:fixed;
  right:16px;
  bottom:16px;
  z-index:1000000;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.mam-fab{
  width:52px;
  height:52px;
  border-radius:999px;
  border:none;
  background:#111;
  color:#fff;
  cursor:pointer;
  box-shadow:0 10px 25px rgba(0,0,0,.25);
}
.mam-fab:focus-visible{
  outline:3px solid #00a3ff;
  outline-offset:3px;
}
.mam-fab-icon{
  font-weight:700;
  font-size:18px;
}

.mam-panel{
  position:absolute;
  right:0;
  bottom:64px;
  width:320px;
  max-width: calc(100vw - 32px);
  border-radius:16px;
  background:#fff;
  color:#111;
  box-shadow:0 18px 40px rgba(0,0,0,.25);
  overflow:hidden;
}
.mam-panel-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 12px 12px 16px;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.mam-title{
  font-weight:700;
}
.mam-close{
  width:36px;
  height:36px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  cursor:pointer;
}
.mam-close:focus-visible{
  outline:3px solid #00a3ff;
  outline-offset:3px;
}
.mam-panel-body{
  padding:14px 16px 16px 16px;
}
.mam-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 0;
}
.mam-label{
  font-size:14px;
}
.mam-controls{
  display:flex;
  align-items:center;
  gap:8px;
}
.mam-btn{
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  color:#111;
  border-radius:10px;
  padding:8px 10px;
  cursor:pointer;
  font-size:13px;
}
.mam-btn:focus-visible{
  outline:3px solid #00a3ff;
  outline-offset:3px;
}
.mam-switch .mam-toggle{
  min-width:64px;
  text-align:center;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  color:#111;
  border-radius:999px;
  padding:8px 12px;
  cursor:pointer;
  font-size:13px;
}
.mam-note{
  padding-top:6px;
}
.mam-small{
  font-size:12px;
  color:rgba(0,0,0,.7);
  line-height:1.4;
}

/* ---- Text scaling (robust, includes WP preset sizes) ---- */
/* Keep a snapshot of WordPress preset font sizes, then scale them. */
html{
  --mam-scale: 1;

  --mam-wp-small: var(--wp--preset--font-size--small, 0.875rem);
  --mam-wp-medium: var(--wp--preset--font-size--medium, 1rem);
  --mam-wp-large: var(--wp--preset--font-size--large, 1.125rem);
  --mam-wp-xlarge: var(--wp--preset--font-size--x-large, 1.5rem);
}

/* Steps: -2..5 (max 200%) */
html.mam-text--2{ --mam-scale: 0.85; }
html.mam-text--1{ --mam-scale: 0.93; }
html.mam-text-1{  --mam-scale: 1.12; }
html.mam-text-2{  --mam-scale: 1.25; }
html.mam-text-3{  --mam-scale: 1.40; }
html.mam-text-4{  --mam-scale: 1.60; }
html.mam-text-5{  --mam-scale: 2.00; }

/* Ensure body uses scalable units even if theme sets px on body */
html.mam-text--2 body,
html.mam-text--1 body,
html.mam-text-1 body,
html.mam-text-2 body,
html.mam-text-3 body,
html.mam-text-4 body,
html.mam-text-5 body{
  font-size: calc(1rem * var(--mam-scale)) !important;
  line-height: 1.55;
}

/* Scale WP preset variables so Gutenberg utility classes (has-small-font-size, etc.) scale too */
html.mam-text--2,
html.mam-text--1,
html.mam-text-1,
html.mam-text-2,
html.mam-text-3,
html.mam-text-4,
html.mam-text-5{
  --wp--preset--font-size--small:  calc(var(--mam-wp-small) * var(--mam-scale));
  --wp--preset--font-size--medium: calc(var(--mam-wp-medium) * var(--mam-scale));
  --wp--preset--font-size--large:  calc(var(--mam-wp-large) * var(--mam-scale));
  --wp--preset--font-size--x-large:calc(var(--mam-wp-xlarge) * var(--mam-scale));
}

/* Optional helper: also scale inline small-size utility in case theme hardcodes it */
html.mam-text--2 .has-small-font-size,
html.mam-text--1 .has-small-font-size,
html.mam-text-1 .has-small-font-size,
html.mam-text-2 .has-small-font-size,
html.mam-text-3 .has-small-font-size,
html.mam-text-4 .has-small-font-size,
html.mam-text-5 .has-small-font-size{
  font-size: var(--wp--preset--font-size--small) !important;
}

/* ---- High contrast ---- */
html.mam-contrast{
  filter: contrast(1.15);
}
html.mam-contrast body{
  background:#000 !important;
  color:#fff !important;
}
html.mam-contrast a{
  color:#7dd3fc !important;
}

/* ---- Underline links ---- */
html.mam-underline a{
  text-decoration: underline !important;
  text-underline-offset: .18em;
  text-decoration-thickness: .12em;
}

/* ---- Focus highlight ---- */
html.mam-focus :focus-visible{
  outline: 3px solid #00a3ff !important;
  outline-offset: 3px !important;
}

/* ---- Reduce motion ---- */
html.mam-motion,
html.mam-motion *{
  scroll-behavior: auto !important;
  transition: none !important;
  animation: none !important;
}