/**
 * RC Consent banner — light/warm, on-brand (robbo-green), px-only, scoped.
 * Fixed bottom bar; on mobile it sits ABOVE the app-style tab bar so both stay
 * visible. Rendered hidden by default; consent.js reveals it.
 */

.rc-consent {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1001;
  padding: 14px 16px;
  background: #ffffff;
  border-top: 1px solid #ececf0;
  box-shadow: 0 -8px 28px rgba(15, 23, 42, 0.10);
  font-family: 'ProximaNova', 'Proxima Nova', 'Noto Sans', sans-serif;
  color: #1d2127;
  animation: rc-consent-up 0.28s ease;
}
.rc-consent[hidden] { display: none; }

@keyframes rc-consent-up {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

.rc-consent__inner {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 18px 24px;
  flex-wrap: wrap;
}

.rc-consent__text { flex: 1 1 420px; min-width: 0; }
.rc-consent__title {
  display: block;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 3px;
}
.rc-consent__text p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.55;
  color: #5b626c;
}
.rc-consent__text a {
  color: #00a957;
  text-decoration: underline;
}

.rc-consent__actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
}

.rc-consent__btn {
  cursor: pointer;
  border-radius: 9px;
  padding: 11px 20px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.1;
  border: 1.5px solid transparent;
  transition: 0.15s ease all;
  white-space: nowrap;
}
.rc-consent__btn--primary {
  background: #00BF63;
  color: #ffffff;
}
.rc-consent__btn--primary:hover { background: #04a957; }
.rc-consent__btn--ghost {
  background: #ffffff;
  color: #1d2127;
  border-color: #d1d5db;
}
.rc-consent__btn--ghost:hover { background: #f3f4f6; border-color: #c3c8cf; }

/* Mobile: stack text over full-width buttons, and lift above the tab bar. */
@media (max-width: 1199px) {
  .rc-consent {
    bottom: calc(62px + env(safe-area-inset-bottom, 0px));
    padding: 12px 14px;
  }
  .rc-consent__inner { gap: 12px; }
  .rc-consent__actions { width: 100%; }
  .rc-consent__btn { flex: 1 1 0; padding: 12px 14px; text-align: center; }
}

@media (max-width: 420px) {
  .rc-consent__text p { font-size: 13px; }
}
