/* ============================================================================
   ZONA FLOTANTĂ — WhatsApp + reCAPTCHA, fără suprapunere pe niciun ecran
   ============================================================================
   Problema reală: badge-ul reCAPTCHA v3 este injectat de Google într-un
   iframe cu `position: fixed; bottom: 14px; right: 0; z-index: 2000000000`
   scris inline. Nu îl putem stiliza din exterior, dar îl putem MUTA, iar
   containerul lui (`.grecaptcha-badge`) accepta transform.

   Strategia: nu „reparăm" suprapunerea cu z-index — z-index-ul lui Google
   (2 miliarde) câștigă oricând. În schimb rezervăm două benzi verticale
   distincte în colţul din dreapta jos și fixăm fiecare widget în banda lui.
   Dacă benzile nu se intersectează geometric, suprapunerea e imposibilă,
   indiferent de ordinea de stivuire.

   Banda 1 (jos):  reCAPTCHA   — înălţime 60px
   Banda 2 (peste): WhatsApp   — pornește deasupra benzii 1
   ============================================================================ */

:root {
  /* marginea de siguranţă faţă de marginea ecranului */
  --fab-gutter: 16px;

  /* dimensiunile reale ale badge-ului reCAPTCHA v3 (măsurate) */
  --recaptcha-h: 60px;
  --recaptcha-w: 70px;      /* lăţimea în stare colapsată */
  --recaptcha-w-open: 256px; /* lăţimea la hover, când se extinde */

  /* butonul WhatsApp */
  --wa-size: 56px;

  /* spaţiul minim garantat între cele două benzi */
  --fab-gap: 12px;

  /* poziţia verticală de start a benzii WhatsApp:
     deasupra reCAPTCHA + spaţiu de siguranţă */
  --wa-bottom: calc(var(--fab-gutter) + var(--recaptcha-h) + var(--fab-gap));

  /* rezervă în josul paginii, ca footer-ul să nu fie acoperit */
  --fab-safe-area: calc(var(--fab-gutter) + var(--recaptcha-h)
                        + var(--fab-gap) + var(--wa-size) + var(--fab-gutter));
}

/* ---------------------------------------------------------------------------
   1. reCAPTCHA — ancorat în banda de jos
   --------------------------------------------------------------------------- */
.grecaptcha-badge {
  /* Google scrie bottom:14px inline; îl normalizăm la gutter-ul nostru.
     !important e necesar: stilul lui e inline, altfel nu îl putem depăşi. */
  bottom: var(--fab-gutter) !important;
  right: 0 !important;

  /* ascundem parţial badge-ul în afara ecranului, lăsând doar logo-ul vizibil.
     La hover iese complet — comportamentul standard permis de Google, cât timp
     păstrăm atribuirea vizibilă în formular (vezi .recaptcha-notice). */
  transform: translateX(calc(100% - var(--recaptcha-w))) !important;
  transition: transform .28s cubic-bezier(.4, 0, .2, 1) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .18) !important;
  border-radius: 4px 0 0 4px !important;
}

.grecaptcha-badge:hover,
.grecaptcha-badge:focus-within {
  transform: translateX(0) !important;
}

/* ---------------------------------------------------------------------------
   2. WhatsApp — ancorat în banda de deasupra
   --------------------------------------------------------------------------- */
.wa-fab {
  position: fixed;
  right: var(--fab-gutter);
  bottom: var(--wa-bottom);

  width: var(--wa-size);
  height: var(--wa-size);
  border-radius: 50%;

  display: grid;
  place-items: center;

  background: #25d366;
  color: #fff;
  text-decoration: none;

  box-shadow: 0 4px 14px rgba(0, 0, 0, .22), 0 1px 3px rgba(0, 0, 0, .12);

  /* Rămâne sub reCAPTCHA în ordinea de stivuire (al lui e 2e9), dar asta nu
     mai contează: benzile nu se intersectează. Valoarea e suficient de mare
     ca să treacă peste conţinutul paginii. */
  z-index: 9000;

  transition: transform .18s ease, box-shadow .18s ease;
  -webkit-tap-highlight-color: transparent;
}

.wa-fab:hover,
.wa-fab:focus-visible {
  transform: scale(1.06);
  box-shadow: 0 6px 20px rgba(0, 0, 0, .28);
  color: #fff;
}

.wa-fab:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

.wa-fab svg {
  width: 60%;
  height: 60%;
  fill: currentColor;
  pointer-events: none;
}

/* eticheta care apare la hover pe desktop */
.wa-fab .wa-label {
  position: absolute;
  right: calc(100% + 10px);
  white-space: nowrap;
  background: #1f2328;
  color: #fff;
  font-size: .82rem;
  padding: .35rem .7rem;
  border-radius: 6px;
  opacity: 0;
  transform: translateX(6px);
  transition: opacity .18s ease, transform .18s ease;
  pointer-events: none;
}

.wa-fab:hover .wa-label,
.wa-fab:focus-visible .wa-label {
  opacity: 1;
  transform: translateX(0);
}

/* ---------------------------------------------------------------------------
   3. Rezervă în josul paginii — footer-ul nu stă niciodată sub widget-uri
   --------------------------------------------------------------------------- */
.site-foot {
  padding-bottom: var(--fab-safe-area);
}

/* ---------------------------------------------------------------------------
   4. TABLETĂ — banda reCAPTCHA rămâne, WhatsApp coboară puţin
   --------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  :root {
    --fab-gutter: 14px;
    --wa-size: 54px;
  }
}

/* ---------------------------------------------------------------------------
   5. TELEFON — reCAPTCHA complet ascuns, WhatsApp coboară în locul lui
   --------------------------------------------------------------------------- */
@media (max-width: 640px) {
  :root {
    --fab-gutter: 12px;
    --wa-size: 52px;
    /* badge-ul e ascuns pe mobil (vezi regula de mai jos), deci banda de jos
       se eliberează şi WhatsApp poate ocupa gutter-ul direct */
    --wa-bottom: var(--fab-gutter);
    --fab-safe-area: calc(var(--fab-gutter) * 2 + var(--wa-size));
  }

  /* Pe ecran mic badge-ul acoperă conţinut real. Îl ascundem vizual şi
     păstrăm atribuirea textuală obligatorie în formular. Este exact metoda
     permisă de Google în termenii reCAPTCHA. */
  .grecaptcha-badge {
    visibility: hidden !important;
  }
}

/* ---------------------------------------------------------------------------
   6. Ecran foarte jos (peisaj pe telefon): stivuim orizontal, nu vertical
   --------------------------------------------------------------------------- */
@media (max-height: 460px) and (orientation: landscape) {
  :root {
    --wa-bottom: var(--fab-gutter);
  }
  /* WhatsApp se mută la stânga badge-ului, pe acelaşi rând */
  .wa-fab {
    right: calc(var(--fab-gutter) + var(--recaptcha-w) + var(--fab-gap));
  }
  .grecaptcha-badge {
    visibility: visible !important;
  }
}

/* ---------------------------------------------------------------------------
   7. Atribuirea reCAPTCHA — obligatorie când badge-ul e ascuns
   --------------------------------------------------------------------------- */
.recaptcha-notice {
  font-size: .78rem;
  color: var(--ink-soft, #5b564e);
  margin-top: .8rem;
  line-height: 1.45;
}

.recaptcha-notice a {
  color: inherit;
  text-decoration: underline;
}

/* ---------------------------------------------------------------------------
   8. Accesibilitate
   --------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .wa-fab,
  .wa-fab .wa-label,
  .grecaptcha-badge {
    transition: none !important;
  }
  .wa-fab:hover {
    transform: none;
  }
}

@media print {
  .wa-fab,
  .grecaptcha-badge {
    display: none !important;
  }
}