:root {
  --utpl-a11y-font-scale: 1;
}

body {
  font-size: calc(1rem * var(--utpl-a11y-font-scale));
}
/* Aplicación del zoom al sitio */
html {
  font-size: calc(16px * var(--utpl-a11y-font-scale));
}

/* Barra flotante */
.utpl-a11y{
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 9999;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

.utpl-a11y__toggle{
  border: 0;
  padding: 10px 14px;
  border-radius: 999px;
  background: #003366;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(0,0,0,.15);
}

.utpl-a11y__panel{
  margin-top: 10px;
  padding: 10px;
  border-radius: 16px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  box-shadow: 0 12px 34px rgba(0,0,0,.12);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 220px;
}

.utpl-a11y__btn{
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  padding: 10px 10px;
  border-radius: 12px;
  cursor: pointer;
  font-weight: 600;
}

.utpl-a11y__btn.is-active{
  border-color: rgba(0,51,102,.35);
  box-shadow: 0 0 0 3px rgba(0,51,102,.12);
}

/* Foco visible (WCAG) */
.utpl-a11y__toggle:focus-visible,
.utpl-a11y__btn:focus-visible{
  outline: 3px solid rgba(0,114,206,.6);
  outline-offset: 3px;
}

/* Alto contraste */
body.utpl-a11y--contrast{
  background: #000 !important;
  color: #fff !important;
}
body.utpl-a11y--contrast a{
  color: #00c8ff !important;
}
body.utpl-a11y--contrast *{
  border-color: rgba(255,255,255,.35) !important;
}

/* Subrayar links */
body.utpl-a11y--underline a{
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* Reducir movimiento */
body.utpl-a11y--reduce-motion *{
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}
