/* Baner zgody - warstwa marki na styl biblioteki (ADR-002).

   Biblioteka wstrzykuje własny arkusz z kolorami z `theme`, więc tutaj są
   tylko te rzeczy, których `theme` nie obejmuje: typografia Poppins, oddech
   paska, układ na telefonie i przycisk „Ustawienia cookies" w stopce.

   Osobny plik, nie `app.css`: pakiet zgody ma własny budżet transferu i wchodzi
   na stronę wyłącznie wtedy, gdy analityka jest skonfigurowana. Tokeny marki
   przyjeżdżają z `app.css` (`:root`), a wartości zapasowe stoją obok - arkusz
   banera bywa jedynym, który zdążył się wczytać. */

#cconsent-bar,
#cconsent-modal,
#cconsent-init-modal {
  font-family: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
}

#cconsent-bar {
  display: flex;
  align-items: center;
  padding: 20px 16px;
  font-size: 15px;
  line-height: 1.55;
  box-shadow: 0 -4px 16px rgb(31 36 48 / 16%);
}

#cconsent-bar .ccb__wrapper {
  width: 100%;
  align-items: center;
  gap: 16px;
  max-width: 1120px;
  margin: 0 auto;
}

#cconsent-bar .cc-text {
  color: var(--ink, #1f2430);
  font-size: 15px;
  line-height: 1.55;
}

#cconsent-bar button.ccb__edit,
#cconsent-bar a.ccb__policy {
  color: var(--ink-soft, #394255);
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  margin-right: 15px;
}

#cconsent-bar a.ccb__policy:hover,
#cconsent-bar a.ccb__policy:focus-visible,
#cconsent-bar button.ccb__edit:hover {
  text-decoration: none;
}

/* Odmowa ma wyglądać na równorzędny wybór, a nie na wyjście awaryjne:
   ten sam rozmiar co zgoda, tylko obrys zamiast wypełnienia (DES-1). */
#cconsent-bar button.consent-decline {
  border: 1px solid var(--ink, #1f2430);
  color: var(--ink, #1f2430);
  background: transparent;
  font-weight: 600;
}

#cconsent-bar button.consent-decline:hover {
  background: var(--ink, #1f2430);
  color: #fff;
}

#cconsent-bar button.consent-give {
  font-weight: 600;
}

/* Odnośnik w stopce - otwiera ten sam panel, którym baner zbiera zgodę.
   Wygląda jak reszta linków stopki, bo tym właśnie jest. */
.consent-settings {
  appearance: none;
  border: 0;
  padding: 0;
  background: none;
  font: inherit;
  color: inherit;
  text-decoration: underline;
  cursor: pointer;
}

.consent-settings:hover,
.consent-settings:focus-visible {
  text-decoration: none;
}

@media (max-width: 768px) {
  #cconsent-bar {
    padding: 16px;
  }

  #cconsent-bar .ccb__wrapper {
    flex-direction: column;
    align-items: stretch;
  }

  #cconsent-bar .ccb__left {
    margin: 0 0 12px;
  }

  #cconsent-bar .ccb__right {
    white-space: normal;
    text-align: center;
  }
}