/* Accessibility Toolbar */
.accessibility-toolbar {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 24px;
  padding: 8px;
  background: rgba(247, 244, 239, 0.5);
  border-radius: 8px;
  border: 0.5px solid #D9D2C5;
}

.accessibility-toolbar button {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border: 2px solid var(--principal);
  background: white;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.2s;
  color: var(--texto-oscuro);
  font-family: inherit;
}

.accessibility-toolbar button:hover,
.accessibility-toolbar button:focus {
  background: var(--principal);
  color: white;
  outline: 3px solid var(--acento);
  outline-offset: 2px;
}

.accessibility-toolbar button[aria-pressed="true"] {
  background: var(--principal);
  color: white;
}

/* Mobile: botones apilados */
@media (max-width: 767px) {
  .accessibility-toolbar {
    flex-direction: column;
    padding: 6px;
    margin-top: 16px;
  }
  
  .accessibility-toolbar button span {
    display: none; /* Solo iconos en mobile */
  }
  
  .accessibility-toolbar button {
    padding: 10px;
    min-width: 44px;
    min-height: 44px;
    justify-content: center;
  }
}

/* Modo alto contraste */
body.high-contrast {
  --principal: #000000;
  --acento: #FFD700;
  --texto-oscuro: #000000;
  --texto-claro: #FFFFFF;
  --fondo: #FFFFFF;
  --borde: #000000;
  --exito: #0000FF;
  --alerta: #FF0000;
}

body.high-contrast * {
  border-width: 2px !important;
}

body.high-contrast a {
  text-decoration: underline;
  font-weight: 600;
}

body.high-contrast .hero {
  background: #000000;
  border-bottom: 3px solid #FFD700;
}

body.high-contrast .service-card,
body.high-contrast .booking-card,
body.high-contrast .location-info > div {
  background: #FFFFFF;
  border: 3px solid #000000;
}

body.high-contrast .site-header {
  border-bottom: 3px solid #000000;
}

body.high-contrast .site-footer {
  background: #000000;
  border-top: 3px solid #FFFFFF;
}

/* Modo daltónicos (protanopia/deuteranopia) */
body.colorblind {
  --exito: #0EA5E9;     /* Azul en lugar de verde */
  --alerta: #F97316;    /* Naranja en lugar de rojo */
  filter: contrast(1.05);
}

/* Añadir iconos visuales en modo daltónicos para elementos de estado */
body.colorblind .status-success::before {
  content: "✓ ";
  font-weight: bold;
}

body.colorblind .status-alert::before {
  content: "⚠ ";
  font-weight: bold;
}

body.colorblind .status-info::before {
  content: "ℹ ";
  font-weight: bold;
}

/* Badges con patrones visuales */
.badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.badge-success {
  background: var(--exito);
  color: white;
}

.badge-success::before {
  content: "✓";
}

.badge-alert {
  background: var(--alerta);
  color: white;
}

.badge-alert::before {
  content: "⚠";
}

/* En modo daltónicos, añadir borde distintivo */
body.colorblind .badge-success {
  border: 2px solid #0EA5E9;
  background: #E0F2FE;
  color: #0C4A6E;
}

body.colorblind .badge-alert {
  border: 2px solid #F97316;
  background: #FFEDD5;
  color: #7C2D12;
}

/* Ajustes adicionales para modo daltónicos */
body.colorblind .services-note {
  background: #DBEAFE;
  border-left-color: #0EA5E9;
}

body.colorblind .booking-note {
  background: #DBEAFE;
  border-left-color: #0EA5E9;
}

/* Simulación tritanopia (azul-amarillo) - opcional */
body.tritanopia {
  --principal: #C2185B;    /* Magenta en lugar de azul */
  --acento: #00897B;       /* Cian en lugar de naranja */
  filter: saturate(1.2);
}

/* Asegurar que los iconos SVG tengan suficiente contraste */
body.high-contrast .service-icon,
body.high-contrast .accessibility-toolbar svg {
  color: #000000;
}

/* Mejoras de legibilidad para todos los modos */
body.high-contrast .hero h1,
body.high-contrast .hero-subtitle {
  color: #FFFFFF;
}

body.high-contrast .site-footer {
  color: #FFFFFF;
}

body.high-contrast .footer-legal a {
  color: #FFD700;
}

body.high-contrast .footer-legal a:hover,
body.high-contrast .footer-legal a:focus {
  color: #FFFFFF;
}

/* Ajustes para botones en modo alto contraste */
body.high-contrast .btn-primary {
  background: #FFD700;
  color: #000000;
  border: 3px solid #000000;
}

body.high-contrast .btn-secondary {
  background: #FFFFFF;
  color: #000000;
  border: 3px solid #000000;
}

body.high-contrast .btn-primary:hover,
body.high-contrast .btn-primary:focus,
body.high-contrast .btn-secondary:hover,
body.high-contrast .btn-secondary:focus {
  background: #000000;
  color: #FFD700;
  border-color: #FFD700;
}

/* Ajustes para sticky button en modo alto contraste */
body.high-contrast .sticky-call-btn {
  background: #FFD700;
  color: #000000;
  border-top: 3px solid #000000;
}

body.high-contrast .sticky-call-btn:hover,
body.high-contrast .sticky-call-btn:focus {
  background: #000000;
  color: #FFD700;
}

/* Ajustes para el mapa en modo alto contraste */
body.high-contrast .location iframe {
  border: 3px solid #000000;
}

/* Ajustes para imágenes en modo alto contraste */
body.high-contrast img {
  border: 2px solid #000000;
}

/* Ajustes para el logo en modo alto contraste */
body.high-contrast .logo {
  filter: grayscale(100%) contrast(1.2);
}

/* Ajustes para servicios-note y booking-note en modo alto contraste */
body.high-contrast .services-note,
body.high-contrast .booking-note {
  background: #FFFFFF;
  border: 2px solid #000000;
  color: #000000;
  border-left-width: 4px;
}

/* Ajustes para about-badges en modo alto contraste */
body.high-contrast .about-badges {
  background: #FFFFFF;
  border: 2px solid #000000;
  border-left-width: 4px;
  color: #000000;
}

/* Ajustes para precios en modo alto contraste */
body.high-contrast .service-price,
body.high-contrast .booking-phone {
  color: #FFD700;
  font-weight: 700;
}

/* Ajustes para footer en modo alto contraste */
body.high-contrast .footer-content h3 {
  color: #FFD700;
}

/* Ajustes para accessibility toolbar en modo alto contraste */
body.high-contrast .accessibility-toolbar {
  background: #FFFFFF;
  border: 3px solid #000000;
}

body.high-contrast .accessibility-toolbar button {
  border: 3px solid #000000;
  background: #FFFFFF;
  color: #000000;
}

body.high-contrast .accessibility-toolbar button:hover,
body.high-contrast .accessibility-toolbar button:focus,
body.high-contrast .accessibility-toolbar button[aria-pressed="true"] {
  background: #000000;
  color: #FFD700;
  border-color: #FFD700;
}

/* Ajustes para focus en modo alto contraste */
body.high-contrast *:focus-visible {
  outline: 4px solid #FFD700;
  outline-offset: 2px;
}

/* Ajustes para focus en modo daltónicos */
body.colorblind *:focus-visible {
  outline: 3px solid #F97316;
  outline-offset: 2px;
}