/**
 * Bimedi — barra global de contacto y navegación compacta.
 *
 * Clases requeridas en Divi Theme Builder:
 * - Sección superior: bimedi-contact-bar
 * - Fila superior: bimedi-contact-bar__row
 * - Sección de navegación existente: bimedi-navbar
 * - Fila de navegación existente: bimedi-navbar__row
 */

body:not(.et-fb) .et-l--header {
  --bimedi-contact-bg: #FBF7F1;
  --bimedi-contact-fg: #DB7F67;
  --bimedi-contact-line: rgba(232, 215, 195, 0.18);
  --bimedi-nav-rgb: 251, 247, 241;
  --bimedi-nav-glass-opacity: 0.40;
  --bimedi-nav-glass-blur: 30px;
  --bimedi-nav-glass-saturation: 100%;
  --bimedi-topbar-height: 42px;
  --bimedi-nav-height: 84px;
  --bimedi-nav-height-compact: 79.8px; /* 84px x 0.95 */
  --bimedi-header-ease: cubic-bezier(0.22, 1, 0.36, 1);

  position: sticky;
  top: 0;
  z-index: 99990;
  width: 100%;
}

/* Divi debe tratar el contenido del header como un flujo continuo, sin gaps. */
body:not(.et-fb) .et-l--header .et_builder_inner_content {
  gap: 0 !important;
}

/* El sticky vive únicamente en .et-l--header. Neutraliza sticky/fixed internos
 * configurados previamente en las secciones de Divi, que pueden dejar placeholders. */
body:not(.et-fb) .bimedi-contact-bar,
body:not(.et-fb) .bimedi-navbar {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.admin-bar:not(.et-fb) .et-l--header {
  top: 32px;
}

/* ---------- Barra superior ---------- */

body:not(.et-fb) .bimedi-contact-bar {
  display: grid;
  align-items: center;
  box-sizing: border-box;
  height: var(--bimedi-topbar-height);
  min-height: var(--bimedi-topbar-height);
  max-height: var(--bimedi-topbar-height);
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  color: var(--bimedi-contact-fg);
  background: var(--bimedi-contact-bg) !important;
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transform-origin: top center;
  transition:
    height 320ms var(--bimedi-header-ease),
    min-height 320ms var(--bimedi-header-ease),
    max-height 320ms var(--bimedi-header-ease),
    opacity 180ms ease,
    visibility 0s linear 0s;
  will-change: height, min-height, max-height, opacity;
}

body:not(.et-fb) .bimedi-contact-bar__row {
  width: min(92%, 1240px) !important;
  max-width: 1240px !important;
  height: var(--bimedi-topbar-height);
  margin: 0 auto !important;
  padding: 0 !important;
}

body:not(.et-fb) .bimedi-contact-bar__row,
body:not(.et-fb) .bimedi-contact-bar__row .et_pb_column,
body:not(.et-fb) .bimedi-contact-bar__row .et_pb_code,
body:not(.et-fb) .bimedi-contact-bar__row .et_pb_code_inner {
  height: 100%;
  min-height: 0;
}

body:not(.et-fb) .bimedi-contact-bar__row .et_pb_code {
  margin: 0 !important;
}

body:not(.et-fb) .bimedi-contact-links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
  width: 100%;
  height: 100%;
}

body:not(.et-fb) .bimedi-contact-item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 0;
  padding: 0 16px;
  border-right: 1px solid var(--bimedi-contact-line);
  color: var(--bimedi-contact-fg) !important;
  font-family: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 12px;
  line-height: 1.1;
  text-decoration: none !important;
  white-space: nowrap;
  transition: background-color 180ms ease, opacity 180ms ease;
}

body:not(.et-fb) .bimedi-contact-item:last-child {
  border-right: 0;
}

body:not(.et-fb) .bimedi-contact-item:hover {
  color: var(--bimedi-contact-fg) !important;
  background: rgba(255, 255, 255, 0.09);
}

body:not(.et-fb) .bimedi-contact-item:focus-visible {
  position: relative;
  z-index: 2;
  color: var(--bimedi-contact-fg) !important;
  outline: 2px solid currentColor;
  outline-offset: -4px;
  background: rgba(255, 255, 255, 0.12);
}

body:not(.et-fb) .bimedi-contact-item__icon {
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  fill: currentColor;
  opacity: 0.88;
}

body:not(.et-fb) .bimedi-contact-item__copy {
  display: flex;
  align-items: baseline;
  gap: 6px;
  min-width: 0;
}

body:not(.et-fb) .bimedi-contact-item strong {
  overflow: hidden;
  font-size: inherit;
  font-weight: 650;
  letter-spacing: 0.01em;
  text-overflow: ellipsis;
}

body:not(.et-fb) .bimedi-contact-item__meta {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.035em;
  opacity: 0.66;
}

/* ---------- Navegación principal ---------- */

/*
 * Superficie de vidrio del header.
 * .bimedi-site-header es la única capa responsable del fondo y el blur;
 * .bimedi-navbar conserva exclusivamente la estructura y compactación.
 */
body:not(.et-fb) .bimedi-site-header {
  background-color: rgba(var(--bimedi-nav-rgb), var(--bimedi-nav-glass-opacity)) !important;
  -webkit-backdrop-filter:
    blur(var(--bimedi-nav-glass-blur))
    saturate(var(--bimedi-nav-glass-saturation));
  backdrop-filter:
    blur(var(--bimedi-nav-glass-blur))
    saturate(var(--bimedi-nav-glass-saturation));
  transition:
    background-color 260ms ease,
    -webkit-backdrop-filter 260ms ease,
    backdrop-filter 260ms ease;
}

body:not(.et-fb) .bimedi-navbar {
  display: grid;
  align-items: center;
  min-height: var(--bimedi-nav-height);
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  isolation: isolate;
  transition:
    min-height 320ms var(--bimedi-header-ease),
    background-color 260ms ease,
    box-shadow 260ms ease,
    border-color 260ms ease;
}

/* ---------- Botón Doctoralia del header ---------- */

body:not(.et-fb) .bimedi-nav-doctoralia .et_pb_button,
body:not(.et-fb) a.bimedi-nav-doctoralia {
  border-color: rgba(33, 1, 36, 0.28) !important;
  background-color: #fbf7f1 !important;
  background-image: none !important;
  color: #210124 !important;
  opacity: 1 !important;
}


body:not(.et-fb) .bimedi-navbar__row {
  width: min(92%, 1240px) !important;
  max-width: 1240px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  transform: scale(1);
  /* Al compactar, ancla la escala arriba para que no aparezca una franja vacía. */
  transform-origin: top center;
  transition: transform 320ms var(--bimedi-header-ease);
  will-change: transform;
}

/* El script agrega esta clase a <html> al bajar de la parte superior. */
html.bimedi-header-scrolled body:not(.et-fb) .bimedi-contact-bar {
  /* height: 0 elimina el espacio de maquetación; opacity por sí sola no lo hace. */
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border-width: 0 !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: none;
  transition:
    height 320ms var(--bimedi-header-ease),
    min-height 320ms var(--bimedi-header-ease),
    max-height 320ms var(--bimedi-header-ease),
    opacity 150ms ease,
    visibility 0s linear 320ms;
}

/* Respaldo para wrappers y placeholders generados por Sticky Options de Divi. */
html.bimedi-header-scrolled body:not(.et-fb) .et-l--header .et_pb_sticky_placeholder {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html.bimedi-header-scrolled body:not(.et-fb) .bimedi-site-header {
  --bimedi-nav-rgb: 250, 248, 244;
  --bimedi-nav-glass-opacity: 0.30;
  --bimedi-nav-glass-blur: 30px;
  --bimedi-nav-glass-saturation: 130%;
}

html.bimedi-header-scrolled body:not(.et-fb) .bimedi-navbar {
  min-height: var(--bimedi-nav-height-compact);
  margin-top: 0 !important;
  border-bottom: 1px solid rgba(23, 63, 59, 0.10);
  box-shadow: 0 12px 34px rgba(20, 43, 41, 0.09);
}

/* El fondo debe vivir en la superficie de vidrio, no en sus capas internas. */
body:not(.et-fb) .bimedi-site-header .bimedi-navbar,
body:not(.et-fb) .bimedi-site-header .bimedi-navbar .et_pb_row,
body:not(.et-fb) .bimedi-site-header .bimedi-navbar .et_pb_column,
body:not(.et-fb) .bimedi-site-header .bimedi-navbar .et_pb_menu,
body:not(.et-fb) .bimedi-site-header .bimedi-navbar .et_pb_menu_inner_container,
body:not(.et-fb) .bimedi-site-header.bimedi-navbar .et_pb_row,
body:not(.et-fb) .bimedi-site-header.bimedi-navbar .et_pb_column,
body:not(.et-fb) .bimedi-site-header.bimedi-navbar .et_pb_menu,
body:not(.et-fb) .bimedi-site-header.bimedi-navbar .et_pb_menu_inner_container {
  background-color: transparent !important;
  background-image: none !important;
}

html.bimedi-header-scrolled body:not(.et-fb) .bimedi-navbar__row {
  transform: scale(0.85);
}

/* Respaldo cuando backdrop-filter no está disponible. */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  body:not(.et-fb) .bimedi-site-header {
    background-color: rgba(var(--bimedi-nav-rgb), 0.96) !important;
  }
  
}

/* ---------- Tableta y móvil ---------- */

@media (max-width: 782px) {
  body.admin-bar:not(.et-fb) .et-l--header {
    top: 46px;
  }
}

/* En WordPress el admin bar deja de ser fijo por debajo de 600 px. */
@media (max-width: 600px) {
  body.admin-bar:not(.et-fb) .et-l--header {
    top: 0;
  }
}

@media (max-width: 767px) {
  body:not(.et-fb) .et-l--header {
    --bimedi-topbar-height: 72px;
    --bimedi-nav-height: 74px;
    --bimedi-nav-height-compact: 70.3px; /* 74px x 0.95 */
  }

  body:not(.et-fb) .bimedi-contact-bar__row,
  body:not(.et-fb) .bimedi-navbar__row {
    width: 100% !important;
  }

  body:not(.et-fb) .bimedi-contact-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }

  body:not(.et-fb) .bimedi-contact-item {
    justify-content: flex-start;
    gap: 7px;
    padding: 0 12px;
    font-size: 11px;
  }

  body:not(.et-fb) .bimedi-contact-item:nth-child(2) {
    border-right: 0;
  }

  body:not(.et-fb) .bimedi-contact-item:nth-child(-n + 2) {
    border-bottom: 1px solid var(--bimedi-contact-line);
  }

  body:not(.et-fb) .bimedi-contact-item__meta {
    display: none;
  }

  body:not(.et-fb) .bimedi-contact-item__icon {
    flex-basis: 14px;
    width: 14px;
    height: 14px;
  }
}

@media (max-width: 390px) {
  body:not(.et-fb) .bimedi-contact-item {
    padding-inline: 9px;
    font-size: 10.5px;
  }
}

/* ---------- Accesibilidad de movimiento ---------- */

@media (prefers-reduced-motion: reduce) {
  body:not(.et-fb) .bimedi-contact-bar,
  body:not(.et-fb) .bimedi-navbar,
  body:not(.et-fb) .bimedi-navbar__row,
  body:not(.et-fb) .bimedi-contact-item {
    transition-duration: 1ms !important;
  }
}

/* ==========================================================
   Botón WhatsApp de la navegación
   Clase del módulo Divi: bimedi-nav-whatsapp
   Este es el único bloque que controla su color, elevación y estados.
   ========================================================== */

.bimedi-nav-whatsapp {
  --wa-background: #db7f67;
  --wa-background-hover: #25d366;
  --wa-focus: rgba(37, 211, 102, 0.35);

  margin-bottom: 0 !important;
  line-height: 1;
  white-space: nowrap;
}

body:not(.et-fb) .bimedi-nav-whatsapp {
  position: relative;
  z-index: 1;
  translate: 0 0;
  transition: translate 180ms cubic-bezier(0.2, 0.8, 0.2, 1) !important;
  will-change: translate;
}

body:not(.et-fb) .bimedi-nav-whatsapp .et_pb_button {
  display: inline-flex !important;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 18px !important;
  border: 1px solid var(--wa-background) !important;
  border-radius: 999px !important;
  background-color: var(--wa-background) !important;
  background-image: none !important;
  box-shadow:
    0 8px 20px rgba(219, 127, 103, 0.22),
    0 2px 5px rgba(33, 1, 36, 0.08);
  color: #ffffff !important;
  font-family: "Manrope", Arial, sans-serif !important;
  font-size: 14px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  opacity: 1 !important;
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    color 180ms ease !important;
}

body:not(.et-fb) .bimedi-nav-whatsapp:hover {
  z-index: 20;
  translate: 0 -5px;
}

body:not(.et-fb) .bimedi-nav-whatsapp:hover .et_pb_button {
  padding: 0 18px !important;
  border-color: var(--wa-background-hover) !important;
  background-color: var(--wa-background-hover) !important;
  box-shadow:
    0 14px 28px rgba(37, 211, 102, 0.28),
    0 5px 10px rgba(18, 140, 126, 0.14) !important;
  color: #ffffff !important;
}

/* Evita que Divi desplace el texto al mostrar el icono. */
body:not(.et-fb) .bimedi-nav-whatsapp .et_pb_button:hover {
  padding-right: 18px !important;
  padding-left: 18px !important;
}

body:not(.et-fb) .bimedi-nav-whatsapp .et_pb_button::before,
body:not(.et-fb) .bimedi-nav-whatsapp .et_pb_button::after {
  position: static !important;
  margin: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
}

body:not(.et-fb) .bimedi-nav-whatsapp .et_pb_button:focus-visible {
  outline: 3px solid var(--wa-focus) !important;
  outline-offset: 3px;
}

@media (max-width: 980px) {
  body:not(.et-fb) .bimedi-nav-whatsapp .et_pb_button,
  body:not(.et-fb) .bimedi-nav-whatsapp:hover .et_pb_button,
  body:not(.et-fb) .bimedi-nav-whatsapp .et_pb_button:hover {
    min-height: 42px;
    padding-right: 14px !important;
    padding-left: 14px !important;
    font-size: 13px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.et-fb) .bimedi-nav-whatsapp {
    translate: none !important;
    transition: none !important;
  }

  body:not(.et-fb) .bimedi-nav-whatsapp:hover {
    translate: none !important;
  }

  body:not(.et-fb) .bimedi-nav-whatsapp .et_pb_button {
    transition: none !important;
  }
}