/* Banner e preferenze cookie */
.cookie-banner[hidden],
.cookie-prefs[hidden],
.cookie-fab[hidden],
.cookie-close[hidden],
.map-frame iframe[hidden],
.consent-placeholder[hidden] { display: none !important; }

.cookie-banner {
  position: fixed;
  left: var(--sp-4);
  right: var(--sp-4);
  bottom: var(--sp-4);
  z-index: 1000;
  max-width: 1080px;
  margin-inline: auto;
  background: var(--white);
  color: var(--ink);
  border: 1px solid var(--taupe-light);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: var(--sp-5) var(--sp-6);
  max-height: calc(100vh - 2 * var(--sp-4));
  overflow-y: auto;
}
.cookie-banner:focus { outline: none; }
.cookie-banner-inner { display: flex; gap: var(--sp-6); align-items: flex-end; justify-content: space-between; flex-wrap: wrap; }
.cookie-main { flex: 1 1 420px; min-width: 0; }
.cookie-main h2 { font-size: var(--fs-md); margin: 0 0 var(--sp-2); }
.cookie-main p { font-size: var(--fs-sm); margin: 0; color: var(--ink-soft); }
.cookie-main a { color: var(--primary); text-decoration: underline; }
.cookie-actions { display: flex; gap: var(--sp-3); flex-wrap: wrap; flex: 0 0 auto; }

.cookie-prefs { margin-top: var(--sp-4); display: grid; gap: var(--sp-3); }
.cookie-pref {
  display: flex; gap: var(--sp-3); align-items: flex-start;
  padding: var(--sp-3) var(--sp-4);
  background: var(--bg-alt);
  border-radius: var(--radius-md);
}
.cookie-pref input { margin-top: 0.25em; width: 18px; height: 18px; accent-color: var(--primary); flex-shrink: 0; }
.cookie-pref strong { display: block; font-size: var(--fs-sm); }
.cookie-pref span { display: block; font-size: var(--fs-xs); color: var(--ink-soft); margin-top: 2px; }
.cookie-prefs .btn { justify-self: start; }

/* Icona fissa per riaprire le preferenze in qualsiasi momento */
.cookie-fab {
  position: fixed;
  left: var(--sp-4);
  bottom: var(--sp-4);
  z-index: 999;
  width: 48px; height: 48px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0;
  border: 0; border-radius: 50%;
  background: var(--primary);
  color: var(--white);
  box-shadow: var(--shadow-md);
  cursor: pointer;
  transition: transform .2s ease, background .2s ease;
}
.cookie-fab:hover { background: var(--primary-dark); transform: translateY(-2px); }
.cookie-fab:focus-visible { outline: 3px solid var(--primary-dark); outline-offset: 3px; }

.cookie-close {
  position: absolute;
  top: var(--sp-2); right: var(--sp-3);
  width: 32px; height: 32px;
  border: 0; border-radius: 50%;
  background: transparent;
  color: var(--ink-soft);
  font-size: 1.6rem; line-height: 1;
  cursor: pointer;
}
.cookie-close:hover { background: var(--bg-alt); color: var(--ink); }

/* Segnaposto per i contenuti di terze parti bloccati finché non si acconsente */
.consent-placeholder {
  min-height: 260px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  gap: var(--sp-3);
  padding: var(--sp-6);
  background: var(--bg-alt);
}
.consent-placeholder p { margin: 0; font-size: var(--fs-sm); max-width: 46ch; }
.consent-placeholder-actions { display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
.consent-placeholder small { color: var(--ink-soft); font-size: var(--fs-xs); max-width: 46ch; }

.link-button { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-decoration: underline; cursor: pointer; }

@media (max-width: 640px) {
  .cookie-banner { left: var(--sp-2); right: var(--sp-2); bottom: var(--sp-2); padding: var(--sp-4); }
  .cookie-fab { left: var(--sp-3); bottom: var(--sp-3); width: 44px; height: 44px; }
  .cookie-actions { width: 100%; }
  .cookie-actions .btn { flex: 1 1 100%; }
}
