/* fab.css — Opción A v2: FAB radial con iconos visibles y arco uniforme */
:root{
  --fab-radius: 92px;              /* radio del arco */
  --fab-item-size: 44px;           /* tamaño de cada ítem */
  --pp-wa-safe: 120px;             /* separación respecto a WhatsApp */
}
.pp-fab-wrap{position:fixed;right:22px;bottom:calc(18px + var(--pp-wa-safe));z-index:1500}
.pp-fab{position:relative;width:56px;height:56px}
.pp-fab-main{position:absolute;inset:0;border-radius:999px;border:none;background:#0070ba;color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 28px rgba(0,0,0,.28);cursor:pointer;font-weight:800;transition:transform .18s ease}
.pp-fab-main svg{width:26px;height:26px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.pp-fab.open .pp-fab-main{ transform: rotate(45deg); }
.pp-fab-ring{position:absolute;inset:0;pointer-events:none}
.pp-fab-item{position:absolute;width:var(--fab-item-size);height:var(--fab-item-size);left:50%;top:50%;
  margin-left:calc(var(--fab-item-size)/-2);margin-top:calc(var(--fab-item-size)/-2);
  border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(17,24,39,.92);
  display:flex;align-items:center;justify-content:center;opacity:0;transform:translate(0,0) scale(.6);
  transition:transform .2s ease, opacity .2s ease; pointer-events:none}
.pp-fab-item svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.96}
.pp-fab.open .pp-fab-item{opacity:1; pointer-events:auto}
/* Ajustes del menú original ocultos por seguridad */
.nav .settings{display:none!important}

/* --- Mobile polish fixes --- */
/* 1) Evitar overflow horizontal por elementos del nav y botón */
html, body{ overflow-x:hidden; }

/* 2) Drawer cerrado por defecto salvo .open (evita que se vean opciones sin tocar) */
.drawer{ display:none !important; max-height:0 !important; overflow:hidden !important; }
.drawer.open{ display:flex !important; max-height:80vh !important; }

/* 3) Contención del nav (evita que botones “salgan” y generen ancho extra) */
.nav, .nav-row{ overflow:hidden }
.menu-btn{ flex-shrink:0 }

/* 4) Compactar padding superior de la barra en móvil y respetar notch */
@media (max-width: 640px){
  .nav-wrap{position:static}
}

/* 5) WhatsApp floating bubbles comunes: colócalas abajo a la derecha */
a[href*="wa.me"], a[href*="api.whatsapp.com"], 
.wa__btn_popup, .wa__btn_side, .wa-widget, .whatsapp-button, 
#wa-widget, #WAButton, #whatsapp, #btnWhatsApp, .whatsapp-float {
  position: fixed !important; right: 18px !important; bottom: 18px !important; z-index: 1400 !important;
  transform: translateZ(0);
}
/* WhatsApp flotante (solo #waSupport / .wa-float) */
#waSupport.wa-float, .wa-float#waSupport, .wa-float:not(.inside-results){
  position: fixed !important;
  right: 18px !important;
  bottom: 18px !important;
  z-index: 1400 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
/* Icon-only bubble */
#waSupport.wa-float .wa-label{ display:none !important; }
#waSupport.wa-float .wa-fab{ display:flex !important; align-items:center; justify-content:center; width:56px; height:56px; border-radius:999px; background:#25D366; box-shadow:0 8px 20px rgba(0,0,0,.25); color:#fff }
#waSupport.wa-float .wa-fab svg{ width:28px; height:28px; fill:#fff; stroke:none }


/* === FAB/WA alignment & accessibility improvements (non-invasive) === */
:root{ --pp-wa-gap: 20px; }

/* Always respect safe-area and use a minimum right spacing */
.wa-float{
  right: max(16px, calc(env(safe-area-inset-right, 0px) + 12px)) !important;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 1400;
}

/* FAB sits above WA; bottom offset comes from --pp-wa-safe computed via JS */
.pp-fab-wrap{
  right: max(16px, calc(env(safe-area-inset-right, 0px) + 12px));
  bottom: calc(env(safe-area-inset-bottom, 0px) + var(--pp-wa-safe));
}

/* Reduced motion friendly */
@media (prefers-reduced-motion: reduce){
  .pp-fab-main{ transition:none }
  .pp-fab.open .pp-fab-main{ transform:none }
}

/* Small screens: slightly tighter spacing */
@media (max-width:420px){
  :root{ --pp-wa-gap: 16px; }
}