/* ======================================================================
   site-notice.css (già cookie-consent.css: rinominato per non essere
   bloccato dai filtri "anti-cookie-banner" di alcuni ad-blocker)
   Banner informativo sui cookie (un solo cookie tecnico di lingua).

   MODIFICA (revisione corrente): il banner è stato ingrandito su
   desktop, dove ora occupa una fascia più ampia e allungata in basso
   (non più una piccola scheda stretta), per essere più leggibile e
   più in evidenza. Su mobile resta invece compatto, come richiesto,
   ma con un carattere più grande rispetto alla versione precedente
   perché il testo risultava troppo piccolo per essere letto
   comodamente su schermo piccolo.
   ====================================================================== */

.site-notice-banner {
  position: fixed;
  left: 20px;
  right: 20px;
  bottom: 20px;
  z-index: 9999;
  /* Desktop: fascia larga e allungata invece della piccola scheda
     stretta di prima. */
  max-width: 900px;
  margin: 0 auto;
  background: #1f2f31;
  color: #ffffff;
  border-radius: 18px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
  transform: translateY(140%);
  opacity: 0;
  transition: transform 0.35s ease, opacity 0.35s ease;
}

.site-notice-banner.is-visible {
  transform: translateY(0);
  opacity: 1;
}

.site-notice-banner-inner {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 24px 28px;
}

.site-notice-banner-icon {
  flex: 0 0 auto;
  font-size: 30px;
  color: var(--accent-color, #94371c);
}

.site-notice-banner-text {
  flex: 1 1 auto;
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
}

.site-notice-banner-btn {
  flex: 0 0 auto;
  background: var(--accent-color, #94371c);
  color: #ffffff;
  border: none;
  padding: 12px 26px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: filter 0.2s ease, transform 0.2s ease;
}

.site-notice-banner-btn:hover {
  filter: brightness(1.12);
  transform: translateY(-2px);
}

/* Tablet: fascia leggermente più stretta ma sempre allungata. */
@media (max-width: 900px) and (min-width: 481px) {
  .site-notice-banner {
    max-width: 640px;
  }
}

/* Su schermi piccoli (mobile) il banner torna a essere una scheda
   compatta, ancorata in basso e con testo/pulsante impilati per non
   occupare troppo spazio verticale: qui però il carattere resta
   grande e ben leggibile, a differenza della versione precedente. */
@media (max-width: 480px) {
  .site-notice-banner {
    left: 10px;
    right: 10px;
    bottom: 12px;
    max-width: none;
    border-radius: 16px;
  }

  .site-notice-banner-inner {
    flex-wrap: wrap;
    padding: 18px 16px;
    gap: 12px;
  }

  .site-notice-banner-icon {
    font-size: 24px;
  }

  .site-notice-banner-text {
    flex-basis: 100%;
    font-size: 15px;
    line-height: 1.55;
  }

  .site-notice-banner-btn {
    flex-basis: 100%;
    text-align: center;
    padding: 12px 18px;
    font-size: 15px;
  }
}