/* ============================================================
   COOKIE BANNER — GDPR-FRIENDLY MODAL VERSION
   ============================================================ */

/* Hidden by default — JS adds .is-visible */
#cookie-banner {
  display: none;
  opacity: 0;
  transform: translateY(40px);
  pointer-events: none;
  transition: opacity 0.35s ease, transform 0.35s ease;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;
}

/* When visible */
#cookie-banner.is-visible {
  display: block;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Dim background */
#cookie-banner.is-visible::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.35);
  z-index: -1;
}

/* Banner container */
.cookie-banner-inner {
  background: #FFF4C2; /* soft neutral yellow */
  border-top: 6px solid #F1C40F; /* accent stripe */
  padding: 32px;
  min-height: 40vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-shadow: 0 -6px 18px rgba(0,0,0,0.15);
  font-family: "Segoe UI", sans-serif;
  color: #333333;
  border-radius: 12px 12px 0 0;
}

/* ------------------------------------------------------------
   BUTTONS — NEUTRAL, BALANCED, GDPR-FRIENDLY
------------------------------------------------------------ */

.cookie-banner-inner .btn {
  all: unset;
  display: inline-block;
  padding: 12px 18px;
  border-radius: 6px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  user-select: none;
  transition: background 0.2s ease, transform 0.15s ease;
}

/* Accept — neutral green */
.cookie-banner-inner .btn.accept {
  background: #4A9F6A;
  color: #FFFFFF;
}
.cookie-banner-inner .btn.accept:hover {
  background: #3F8B5C;
  transform: translateY(-2px);
}

/* Reject — neutral muted red */
.cookie-banner-inner .btn.reject {
  background: #B85C5C;
  color: #FFFFFF;
}
.cookie-banner-inner .btn.reject:hover {
  background: #A44F4F;
  transform: translateY(-2px);
}

/* Manage — neutral gold */
.cookie-banner-inner .btn.info {
  background: #D9C46A;
  color: #000000;
}
.cookie-banner-inner .btn.info:hover {
  background: #C7B45F;
  transform: translateY(-2px);
}

/* Save preferences — neutral blue */
.cookie-banner-inner .btn.save {
  background: #5A8CCB;
  color: #FFFFFF;
}
.cookie-banner-inner .btn.save:hover {
  background: #4C7AB3;
  transform: translateY(-2px);
}

/* ------------------------------------------------------------
   ACTION ROW
------------------------------------------------------------ */

.cookie-banner-inner .cookie-actions {
  margin-top: 20px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* ------------------------------------------------------------
   PREFERENCES PANEL (hidden until clicked)
------------------------------------------------------------ */

.cookie-preferences {
  display: none;
  margin-top: 20px;
  padding: 16px;
  background: #FAFAFA;
  border-radius: 8px;
  border: 1px solid #EEEEEE;
}

.cookie-preferences[aria-hidden="false"] {
  display: block;
}

.cookie-preferences label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0;
  font-size: 1rem;
  color: #333333;
}

.cookie-preferences input[type="checkbox"] {
  width: 20px;
  height: 20px;
}

/* ------------------------------------------------------------
   FOOTER DOT + SETTINGS (always visible)
------------------------------------------------------------ */

.cookie-footer-controls {
  position: fixed;
  bottom: 12px;
  right: 12px;
  display: flex;
  gap: 10px;
  align-items: center;
  z-index: 9999;
}

.cookie-status-dot {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: gray;
  cursor: pointer;
}

.cookie-status-note {
  font-size: 0.9rem;
  color: #666666;
}

#cookieSettingsLink {
  all: unset;
  cursor: pointer;
  padding: 8px 12px;
  background: #F1C40F;
  border-radius: 4px;
  font-size: 0.9rem;
  font-weight: 600;
  color: #000000;
  transition: background 0.2s ease;
}

#cookieSettingsLink:hover {
  background: #E2B90D;
}