/* =====================================================================
   WellnessMedica — Consenso ai cookie (2026-10-29)
   Markup in includes/consenso.php, logica in assets/js/consenso.js.
   Prende il colore della pagina (--acc delle aree); Wedding lo passa
   con --wmc-acc. «Rifiuta» e «Accetta tutti» hanno lo stesso aspetto
   di proposito: il Garante chiede che rifiutare non sia più scomodo.
   ===================================================================== */

#wmc, .wmc-mappa {
  --wmc-acc: var(--acc, #a07a36);
  --wmc-ink: #2b2622;
  --wmc-testo: #5b524a;
  --wmc-fondo: #fffdf9;
  --wmc-filo: rgba(43, 38, 34, .11);
  --wmc-serif: 'Cormorant Garamond', 'Times New Roman', serif;
  font-size: 16px;
  line-height: 1.5;
}

/* ── Banner ── */
.wmc-banner {
  position: fixed;
  left: 24px;
  bottom: calc(24px + env(safe-area-inset-bottom));
  z-index: 2600;
  width: min(430px, calc(100vw - 48px));
  padding: 24px 24px 18px;
  background: var(--wmc-fondo);
  color: var(--wmc-testo);
  border: 1px solid var(--wmc-filo);
  border-radius: 22px;
  box-shadow: 0 24px 60px rgba(30, 22, 14, .22), 0 2px 8px rgba(30, 22, 14, .08);
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .45s ease, transform .55s cubic-bezier(.16, 1, .3, 1);
}
.wmc-banner[hidden] { display: none; }
.wmc-banner.wmc-dentro { opacity: 1; transform: none; }
.wmc-banner::before {
  content: '';
  position: absolute; left: 24px; right: 24px; top: 0; height: 3px;
  border-radius: 0 0 3px 3px;
  background: linear-gradient(90deg, var(--wmc-acc), color-mix(in srgb, var(--wmc-acc) 30%, transparent));
}

.wmc-testa { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; padding-right: 30px; }
.wmc-ico {
  width: 40px; height: 40px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--wmc-acc) 12%, #fff);
  color: var(--wmc-acc);
  font-size: 1rem;
}
.wmc-titolo {
  margin: 0;
  font-family: var(--wmc-serif);
  font-size: 1.6rem; font-weight: 500; line-height: 1.1;
  color: var(--wmc-ink);
  letter-spacing: 0;
  text-transform: none;
}
.wmc-titolo em { font-style: italic; color: var(--wmc-acc); }
.wmc-testo { margin: 0 0 16px; font-size: .86rem; line-height: 1.65; color: var(--wmc-testo); }
.wmc-testo a, .wmc-piede a {
  color: var(--wmc-ink); font-weight: 600;
  text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--wmc-acc) 60%, transparent);
  text-underline-offset: 3px;
}

.wmc-azioni { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.wmc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; padding: 11px 18px;
  border-radius: 999px;
  border: 1.5px solid var(--wmc-ink);
  background: var(--wmc-ink);
  color: #fff;
  font-family: inherit; font-size: .84rem; font-weight: 600; letter-spacing: .02em;
  cursor: pointer;
  transition: background .25s, border-color .25s, color .25s, transform .2s;
}
.wmc-btn:hover { background: var(--wmc-acc); border-color: var(--wmc-acc); }
.wmc-btn:active { transform: scale(.98); }
.wmc-btn--linea { background: transparent; color: var(--wmc-ink); }
.wmc-btn--linea:hover { color: #fff; }
.wmc-btn:focus-visible, .wmc-scegli:focus-visible, .wmc-x:focus-visible,
.wmc-interruttore input:focus-visible + span, .wmc-mappa-link:focus-visible {
  outline: 2px solid var(--wmc-acc); outline-offset: 3px;
}

.wmc-scegli {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 12px auto 0; padding: 6px 4px;
  width: 100%; justify-content: center;
  border: 0; background: none; cursor: pointer;
  font-family: inherit; font-size: .8rem; font-weight: 600; color: var(--wmc-acc);
}
.wmc-scegli i { font-size: .72rem; transition: transform .25s; }
.wmc-scegli:hover i { transform: translateX(4px); }

.wmc-x {
  position: absolute; top: 14px; right: 14px;
  width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; border: 1px solid var(--wmc-filo);
  background: transparent; color: var(--wmc-testo);
  cursor: pointer;
  transition: background .2s, color .2s, transform .3s;
}
.wmc-x:hover { background: var(--wmc-ink); color: #fff; transform: rotate(90deg); }

/* ── Pannello delle preferenze ── */
.wmc-pannello { position: fixed; inset: 0; z-index: 4000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.wmc-pannello[hidden] { display: none; }
.wmc-velo { position: absolute; inset: 0; background: rgba(20, 15, 10, .55); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); animation: wmc-velo .3s ease; }
.wmc-scheda {
  position: relative;
  width: min(100%, 560px);
  max-height: calc(100vh - 40px); overflow: auto;
  padding: 30px 30px 22px;
  background: var(--wmc-fondo); color: var(--wmc-testo);
  border-radius: 24px;
  box-shadow: 0 40px 100px rgba(0, 0, 0, .35);
  outline: none;
  animation: wmc-entra .45s cubic-bezier(.16, 1, .3, 1);
}
.wmc-voci { border-top: 1px solid var(--wmc-filo); margin-bottom: 20px; }
.wmc-voce {
  display: flex; align-items: center; gap: 18px;
  padding: 16px 2px;
  border-bottom: 1px solid var(--wmc-filo);
  cursor: pointer;
}
div.wmc-voce { cursor: default; }
.wmc-voce-testo { flex: 1; min-width: 0; }
.wmc-voce-testo strong { display: block; font-size: .92rem; color: var(--wmc-ink); margin-bottom: 3px; }
.wmc-voce-testo span { display: block; font-size: .8rem; line-height: 1.55; }
.wmc-sempre {
  flex-shrink: 0;
  font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: color-mix(in srgb, var(--wmc-acc) 80%, #000);
  background: color-mix(in srgb, var(--wmc-acc) 11%, #fff);
  padding: 5px 10px; border-radius: 999px;
}
.wmc-interruttore { position: relative; flex-shrink: 0; width: 48px; height: 28px; }
.wmc-interruttore input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 1; }
.wmc-interruttore span {
  position: absolute; inset: 0; border-radius: 999px;
  background: #d9d2c9;
  transition: background .25s;
}
.wmc-interruttore span::after {
  content: ''; position: absolute; top: 3px; left: 3px;
  width: 22px; height: 22px; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
  transition: transform .3s cubic-bezier(.34, 1.4, .64, 1);
}
.wmc-interruttore input:checked + span { background: var(--wmc-acc); }
.wmc-interruttore input:checked + span::after { transform: translateX(20px); }
.wmc-azioni--tre { grid-template-columns: repeat(3, 1fr); }
.wmc-piede { margin: 14px 0 0; text-align: center; font-size: .78rem; }
html.wmc-aperto { overflow: hidden; }

/* ── La mappa prima del consenso ── */
.wmc-mappa {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  padding: 28px; text-align: center;
  color: #5b524a;
  background:
    linear-gradient(rgba(255, 253, 249, .86), rgba(255, 253, 249, .86)),
    repeating-linear-gradient(0deg, transparent 0 39px, rgba(43, 38, 34, .07) 39px 40px),
    repeating-linear-gradient(90deg, transparent 0 39px, rgba(43, 38, 34, .07) 39px 40px),
    #efe9df;
}
.wmc-mappa p { margin: 0; max-width: 36ch; font-size: .88rem; line-height: 1.6; }
.wmc-mappa strong { color: #2b2622; }
.wmc-mappa-ico {
  width: 56px; height: 56px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: #fff; color: var(--acc, #a07a36);
  box-shadow: 0 8px 24px rgba(43, 38, 34, .12);
  font-size: 1.3rem;
}
.wmc-mappa-azioni { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 18px; }
.wmc-mappa .wmc-btn { min-height: 42px; padding: 9px 20px; }
.wmc-mappa .wmc-btn:hover { background: var(--acc, #a07a36); border-color: var(--acc, #a07a36); }
.wmc-mappa-link { font-size: .8rem; font-weight: 600; color: #2b2622; text-decoration: none; display: inline-flex; align-items: center; gap: 7px; }
.wmc-mappa-link i { font-size: .7rem; color: var(--acc, #a07a36); }
.wmc-mappa-link:hover { text-decoration: underline; text-underline-offset: 3px; }

@keyframes wmc-velo { from { opacity: 0; } }
@keyframes wmc-entra { from { opacity: 0; transform: translateY(24px) scale(.98); } }

@media (max-width: 600px) {
  .wmc-banner {
    left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom));
    width: auto; padding: 20px 18px 14px; border-radius: 20px;
  }
  .wmc-titolo { font-size: 1.4rem; }
  .wmc-pannello { align-items: flex-end; padding: 0; }
  .wmc-scheda { width: 100%; max-height: 90vh; border-radius: 22px 22px 0 0; padding: 26px 20px calc(18px + env(safe-area-inset-bottom)); }
  .wmc-azioni--tre { grid-template-columns: 1fr 1fr; }
  .wmc-azioni--tre .wmc-btn--linea { grid-column: 1 / -1; order: 3; }
}
@media (prefers-reduced-motion: reduce) {
  .wmc-banner, .wmc-scheda, .wmc-velo, .wmc-interruttore span::after { transition: none; animation: none; }
  .wmc-banner { transform: none; }
}
