/* Compact cookie banner — overrides the base .cookie-banner block in portal.css
   (this file is linked after it). The banner is a thin strip pinned to the
   bottom edge and is shown only in opt-in consent regions (EEA/UK/CH, see
   isConsentRequiredRegion in portal.js).

   While it is visible portal.js sets `html.has-cookie-banner` and
   `--cookie-banner-h` (the banner's live height), so:
   - the landing sticky download bar (.lp-sticky) rides above the banner
     instead of being covered by it;
   - the page gets bottom padding so the footer is still reachable. */

.cookie-banner {
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0 12px calc(10px + env(safe-area-inset-bottom));
  pointer-events: none;
}

.cookie-banner__inner {
  pointer-events: auto;
  max-width: 1100px;
  align-items: center;
  gap: 14px;
  padding: 10px 14px;
  border-radius: var(--radius-lg);
}

.cookie-banner__copy {
  min-width: 0;
}

.cookie-banner__title {
  font-size: 13px;
}

.cookie-banner__text {
  margin: 2px 0 0;
  font-size: 12.5px;
  line-height: 1.4;
}

.cookie-banner__actions {
  flex-wrap: nowrap;
  gap: 8px;
}

.cookie-banner__actions .btn {
  white-space: nowrap;
}

html.has-cookie-banner body {
  padding-bottom: var(--cookie-banner-h, 0px);
}

/* Landing sticky App Store bar: sit just above the banner. */
html.has-cookie-banner .lp-sticky {
  bottom: calc(var(--cookie-banner-h, 0px) + 8px);
}

@media (max-width: 820px) {
  .cookie-banner {
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 8px calc(8px + env(safe-area-inset-bottom));
  }

  .cookie-banner__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 8px 10px;
  }

  /* Title is redundant on a phone; the copy itself says what this is. */
  .cookie-banner__title {
    display: none;
  }

  /* Long locales (ru/de/…) would grow the strip to ~250px: cap the copy at
     four lines and let it scroll — the full text stays reachable. */
  .cookie-banner__copy {
    max-height: calc(11.5px * 1.35 * 4);
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .cookie-banner__copy p {
    display: inline;
  }

  .cookie-banner__text {
    margin: 0;
    font-size: 11.5px;
    line-height: 1.35;
    color: var(--text-secondary, var(--muted));
  }

  .cookie-banner__actions {
    flex-wrap: wrap;
    justify-content: stretch;
    gap: 6px;
  }

  .cookie-banner__actions .btn {
    flex: 1 1 auto;
    min-height: 32px;
    padding: 6px 7px;
    font-size: 10.5px;
    letter-spacing: 0;
  }
}