/* Cookie consent banner. Docked to the top (not the bottom) so it never
 * collides with .bhikshu-cta-bar, which already owns the bottom edge on
 * every breakpoint (full-width bar on phone, corner stack on desktop). */

/* Pushes the page down by the banner's real (measured) height instead of
   letting the fixed banner sit on top of the hero H1/CTA — see
   CookieConsent.jsx's ResizeObserver. */
body.cookie-consent-open {
  padding-top: var(--cookie-consent-h, 90px);
}

.cookie-consent {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10500;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px 24px;
  padding: 14px 20px;
  background: #151515;
  color: rgba(255, 255, 255, 0.85);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.28);
}

.cookie-consent__text {
  margin: 0;
  font-family: var(--font-family-base, "Sora", sans-serif);
  font-size: 13.5px;
  line-height: 1.5;
  max-width: 640px;
  text-align: center;
}

.cookie-consent__text a {
  /* Not var(--color-one): that's a dark sage, nearly invisible against this
     banner's near-black background. */
  color: #fff;
  text-decoration: underline;
}

.cookie-consent__actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}

.cookie-consent__btn {
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 9px 22px;
  font-family: var(--font-family-base, "Sora", sans-serif);
  font-size: 13px;
  font-weight: var(--fw-medium, 500);
  cursor: pointer;
  transition: transform 0.2s ease, filter 0.2s ease;
}

.cookie-consent__btn:hover { transform: translateY(-1px); }

.cookie-consent__btn--primary {
  background: var(--color-one, #4a554d);
  color: #fff;
}

.cookie-consent__btn--ghost {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.35);
  color: #fff;
}

@media (max-width: 575px) {
  .cookie-consent {
    justify-content: flex-start;
    text-align: left;
  }
  .cookie-consent__actions {
    width: 100%;
  }
  .cookie-consent__btn {
    flex: 1 1 0;
  }
}