/*
Theme Name: Bridge Child
Theme URI: http://demo.qodeinteractive.com/bridge/
Description: A child theme of Bridge Theme
Author: Qode Interactive
Author URI: http://www.qodethemes.com/
Version: 1.0.0
Template: bridge
*/
@import url("../bridge/style.css");

/* ==========================================================
   ♿️ ACCESIBILIDAD COMPLETA (WCAG 2.1 AA) PARA BRIDGE + WPBAKERY
   ========================================================== */

/* 🔹 Textos en secciones oscuras o con fondo de imagen */
.vc_row,
.vc_row.section,
.grid_section,
.full_width,
.q_elements_item,
.q_elements_item_inner,
.footer_top_holder {
  position: relative;
}

.vc_row h1,
.vc_row h2,
.vc_row h3,
.vc_row h4,
.vc_row p,
.vc_row span,
.grid_section h1,
.grid_section h2,
.grid_section p,
.grid_section span,
.full_width h1,
.full_width h2,
.full_width p,
.full_width span,
.q_elements_item h2,
.q_elements_item p,
.q_elements_item span,
.footer_top_holder h2,
.footer_top_holder p,
.footer_top_holder a {
  color: #ffffff !important;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.85) !important;
  font-weight: 600 !important;
}

/* 🔹 Fondo oscuro semitransparente bajo texto */
.vc_row.section:before,
.full_width:before,
.q_elements_item:before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 0;
}
.vc_row.section > *,
.full_width > *,
.q_elements_item > * {
  position: relative;
  z-index: 1;
}

/* 🔹 Reforzar contraste en bloques claros */
.vc_row.section.light h2,
.vc_row.section.light p,
.vc_row.section.light span,
.q_elements_item.light h2,
.q_elements_item.light p,
.q_elements_item.light span {
  color: #002e2d !important;
  text-shadow: none !important;
}

/* 🔹 Títulos de servicios, horarios, etc. */
.qode-apl-item-title,
.qode-apt-item-title {
  color: #ffffff !important;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8) !important;
  font-weight: 700 !important;
}

/* 🔹 Botones accesibles */
.qbutton,
.qbutton.default {
  background-color: #007f79 !important;
  border-color: #007f79 !important;
  color: #ffffff !important;
}
.qbutton:hover,
.qbutton.default:hover {
  background-color: #005f5a !important;
  border-color: #005f5a !important;
  color: #ffffff !important;
}

/* 🔹 Footer */
.footer_top_holder {
  background: #003333 !important;
}
.footer_top_holder p,
.footer_top_holder a {
  color: #ffffff !important;
  text-shadow: none !important;
}
.footer_top_holder a:hover {
  text-decoration: underline !important;
}

/* 🔹 Botón WhatsApp */
.qlwapp__button,
.qlwapp__button--button,
span.qlwapp__text {
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6) !important;
}

/* 🔹 Secciones claras (texto oscuro sin sombra) */
.vc_row.light h2,
.vc_row.light p,
.vc_row.light span {
  color: #002e2d !important;
  text-shadow: none !important;
}

/* 🔹 Aumentar contraste en hover */
a:hover, a:focus {
  filter: brightness(120%) !important;
}

/* 🔹 Ajuste móvil (sombras más suaves) */
@media (max-width: 768px) {
  h2, p, span, .qode-apl-item-title {
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6) !important;
  }
}

/* ==========================================================
   🔧 AJUSTE FINAL DE CONTRASTE: FOOTER + WHATSAPP
   ========================================================== */

/* Títulos pequeños del footer (h5) */
.footer_top_holder h5 {
  color: #ffffff !important;
  text-shadow: 0 2px 3px rgba(0, 0, 0, 0.8) !important;
  font-weight: 700 !important;
}

/* Texto del botón WhatsApp */
span.qlwapp__text,
a.qlwapp__button.qlwapp__button--button {
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6) !important;
  font-weight: 600 !important;
}

/* Fondo del botón para contraste AA */
a.qlwapp__button.qlwapp__button--button {
  background-color: #128C7E !important; /* Verde oficial WhatsApp accesible */
  border-color: #128C7E !important;
}

a.qlwapp__button.qlwapp__button--button:hover {
  background-color: #0d6e63 !important;
  border-color: #0d6e63 !important;
}

/* ==========================================================
   ♿️ ACCESIBILIDAD: NOMBRES DISCERNIBLES PARA ENLACES ICÓNICOS
   ========================================================== */

/* Solo mejora visual (los aria-label se añaden por JS abajo) */
a[aria-label]::after {
  position: absolute;
  left: -9999px;
  content: attr(aria-label);
}
