/* =====================================================
   EVA CLINIC — FLOATING CTA + LIGHTBOX
===================================================== */

.floating-cta {
  position: fixed;
  z-index: 900;
  right: var(--space-2);
  bottom: var(--space-2);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.7rem;
}

.fab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  text-decoration: none;
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-lg);
  transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease);
}
.fab:hover { transform: translateY(-3px); }

.fab-whatsapp, .fab-call {
  width: 52px; height: 52px;
  font-size: 1.3rem;
  color: #fff;
}
.fab-whatsapp { background: #25d366; }
.fab-call { background: var(--color-primary); }

.fab-book {
  padding: 0.9rem 1.4rem;
  background: var(--color-accent);
  color: #1c1c1a;
  font-weight: 700;
  font-size: 0.9rem;
  white-space: nowrap;
}

/* Desktop: only the Book Consultation pill (header already carries CTA + call) */
@media (min-width: 981px) {
  .fab-whatsapp, .fab-call { display: none; }
}
/* Mobile: WhatsApp + Call only, keep clear of bottom nav thumb zone */
@media (max-width: 980px) {
  .fab-book { display: none; }
  .floating-cta { right: var(--space-1); bottom: calc(var(--space-1) + env(safe-area-inset-bottom, 0px)); }
  .fab-whatsapp, .fab-call { width: 50px; height: 50px; }
}

/* ---------- Lightbox ---------- */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(10, 10, 9, 0.92);
  padding: var(--space-3);
}
.lightbox.is-open { display: flex; }
.lightbox img {
  max-width: min(1000px, 100%);
  max-height: 88vh;
  border-radius: var(--radius-md);
  box-shadow: 0 30px 80px rgba(0,0,0,0.5);
}
.lightbox-close {
  position: absolute;
  top: var(--space-2);
  right: var(--space-2);
  width: 44px; height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.12);
  color: #fff;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
}
.lightbox-close:hover { background: rgba(255,255,255,0.22); }