/*
 * BERNINI Suites — Cookie Consent banner v2 (granular)
 *
 * Styles for #cookie-consent-overlay (the initial banner) and
 * #bernini-cookie-panel (the granular preferences panel shown after
 * the user clicks "Personalizza"). Selectors are kept stable so that
 * the blog HTML pages (generated by scripts/build-blog.cjs) can load
 * this same stylesheet and get a consistent banner without needing
 * a regeneration pass.
 *
 * Colors mirror the main site palette:
 *   nero        #0A0A0A   banner bg
 *   nero-200    #1A1A1A   panel bg alt
 *   ivory-100   #FAF8F5   body text
 *   oro-400     #B8944D   accent + primary CTA
 *   oro-300     #C9A962   hover
 *   oro-500     #9A7A3D   active
 */

#cookie-consent-overlay,
#bernini-cookie-panel {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99999;
  background: #0A0A0A;
  color: #FAF8F5;
  font-family: 'Montserrat', system-ui, -apple-system, Segoe UI, sans-serif;
  font-size: 14px;
  line-height: 1.55;
  box-shadow: 0 -2px 24px rgba(0, 0, 0, 0.5);
  border-top: 1px solid rgba(184, 148, 77, 0.35);
  box-sizing: border-box;
}

#cookie-consent-overlay {
  /* Right padding is larger (56px) to leave room for the absolutely
     positioned X close button in the top-right corner. */
  padding: 18px 56px 18px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}

#cookie-consent-overlay .bernini-cb-text {
  flex: 1 1 340px;
  margin: 0;
  color: rgba(250, 248, 245, 0.82);
}

#cookie-consent-overlay .bernini-cb-text strong {
  display: block;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.08em;
  margin-bottom: 4px;
  color: #FAF8F5;
}

#cookie-consent-overlay a,
#bernini-cookie-panel a {
  color: #B8944D;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.15s ease;
}

#cookie-consent-overlay a:hover,
#bernini-cookie-panel a:hover {
  color: #C9A962;
}

.bernini-cb-btns {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
  flex-wrap: wrap;
}

.bernini-cb-btn {
  border: 1px solid transparent;
  cursor: pointer;
  padding: 11px 20px;
  border-radius: 2px;
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

/*
 * Italian Garante (Provvedimento 9677876) requires Accept and Reject
 * buttons to have IDENTICAL visual weight — no dark patterns, no
 * visual hierarchy nudging the user toward Accept. Both use a solid
 * background, identical padding/font, same hover treatment. Only the
 * hue differs (oro vs ivory) to convey semantic meaning without
 * affecting prominence. The Customize button is deliberately lower
 * in hierarchy (secondary action) which the Garante permits.
 *
 * All button color rules are scoped under the #cookie-consent-overlay
 * and #bernini-cookie-panel ID selectors so their specificity beats
 * the default `color: #FAF8F5` inherited from the banner root. Without
 * this scoping the class-level color overrides would lose to the ID
 * selector and the button text would render ivory on ivory (Reject
 * invisible) or ivory on gold (Accept low-contrast).
 */
#cookie-consent-overlay .bernini-cb-accept,
#bernini-cookie-panel .bernini-cb-accept {
  background: #B8944D;
  color: #0A0A0A;
  border-color: #B8944D;
}
#cookie-consent-overlay .bernini-cb-accept:hover,
#bernini-cookie-panel .bernini-cb-accept:hover {
  background: #C9A962;
  border-color: #C9A962;
}

#cookie-consent-overlay .bernini-cb-reject,
#bernini-cookie-panel .bernini-cb-reject {
  background: #FAF8F5;
  color: #0A0A0A;
  border-color: #FAF8F5;
}
#cookie-consent-overlay .bernini-cb-reject:hover,
#bernini-cookie-panel .bernini-cb-reject:hover {
  background: #E8E3D8;
  border-color: #E8E3D8;
}

#cookie-consent-overlay .bernini-cb-customize {
  background: transparent;
  color: rgba(250, 248, 245, 0.85);
  border-color: rgba(250, 248, 245, 0.35);
}
#cookie-consent-overlay .bernini-cb-customize:hover {
  color: #B8944D;
  border-color: #B8944D;
}

/*
 * X close button in top-right — Garante requires this. Closing via
 * X is a non-decision (no consent set, no rejection recorded), so the
 * banner will re-appear on the next page load until the user makes
 * an explicit choice via Accept/Reject/Customize.
 */
.bernini-cb-close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 32px;
  height: 32px;
  padding: 0;
  background: transparent;
  border: none;
  color: rgba(250, 248, 245, 0.65);
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  border-radius: 2px;
  transition: color 0.15s ease, background 0.15s ease;
}
.bernini-cb-close:hover,
.bernini-cb-close:focus-visible {
  color: #FAF8F5;
  background: rgba(250, 248, 245, 0.08);
  outline: none;
}


#bernini-cookie-panel {
  padding: 26px 28px 22px;
  max-height: 80vh;
  overflow-y: auto;
}

#bernini-cookie-panel h2 {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.1em;
  margin: 0 0 16px;
  color: #FAF8F5;
}

#bernini-cookie-panel .bernini-cp-row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 0;
  border-top: 1px solid rgba(184, 148, 77, 0.18);
}
#bernini-cookie-panel .bernini-cp-row:first-of-type {
  border-top: none;
}

#bernini-cookie-panel .bernini-cp-toggle {
  flex-shrink: 0;
  margin-top: 3px;
}
#bernini-cookie-panel .bernini-cp-toggle input {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: #B8944D;
}
#bernini-cookie-panel .bernini-cp-toggle input[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
}

#bernini-cookie-panel .bernini-cp-text {
  flex: 1 1 auto;
}
#bernini-cookie-panel .bernini-cp-text strong {
  display: block;
  color: #FAF8F5;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  margin-bottom: 3px;
}
#bernini-cookie-panel .bernini-cp-text span {
  display: block;
  color: rgba(250, 248, 245, 0.7);
  font-size: 12.5px;
}

#bernini-cookie-panel .bernini-cp-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 20px;
}

@media (max-width: 640px) {
  #cookie-consent-overlay {
    padding: 16px;
    flex-direction: column;
    align-items: stretch;
  }
  .bernini-cb-btns {
    justify-content: stretch;
  }
  .bernini-cb-btn {
    flex: 1 1 30%;
    text-align: center;
    padding: 12px 8px;
  }
  #bernini-cookie-panel {
    padding: 20px 18px 18px;
  }
}