/* Klaro cookie-consent overrides.
 *
 * Bug 23: GDPR principle — Decline must carry the same visual weight as
 * Accept. Klaro's default paints the accept button green and leaves decline
 * as a dim gray, which is a nudge regulators (and German DPAs) frown on.
 *
 * Bug 24c: At sub-384px viewports the bar buttons get
 * `width: calc(50% - 0.5em)`. Long localized labels ("Optionale ablehnen",
 * "Только необходимые") clip to ellipsis. Allow the label to wrap onto two
 * lines instead of truncating.
 *
 * Scope: only the bottom bar (`.cookie-notice:not(.cookie-modal-notice)`).
 * The full settings modal keeps Klaro's default look — it is a deliberate
 * second screen, not a primary surface.
 */

.klaro .cookie-notice:not(.cookie-modal-notice) .cn-buttons button.cm-btn,
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-ok button.cm-btn {
  /* 24c: wrap, do not truncate; keep both buttons the same comfortable height */
  white-space: normal;
  line-height: 1.25;
  min-height: 2.4em;
  font-weight: 600;
  border-radius: 6px;
  padding: 0.55em 0.85em;
  border: 1px solid transparent;
  text-align: center;
}

/* 23: Accept and Decline at equal visual weight, both in the brass theme. */
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-buttons button.cm-btn.cm-btn-success,
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-ok button.cm-btn.cm-btn-success {
  background-color: var(--brass, #b8893a);
  border-color: var(--brass, #b8893a);
  color: #ffffff;
}
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-buttons button.cm-btn.cm-btn-success:hover,
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-ok button.cm-btn.cm-btn-success:hover {
  background-color: #a37730;
  border-color: #a37730;
}

.klaro .cookie-notice:not(.cookie-modal-notice) .cn-buttons button.cm-btn.cm-btn-decline,
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-ok button.cm-btn.cm-btn-decline {
  background-color: #ffffff;
  border-color: var(--brass, #b8893a);
  color: var(--ink, #15161a);
}
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-buttons button.cm-btn.cm-btn-decline:hover,
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-ok button.cm-btn.cm-btn-decline:hover {
  background-color: #f5ecdb;
  border-color: var(--brass, #b8893a);
  color: var(--ink, #15161a);
}

/* Focus ring for keyboard users — visible on both light and dark backgrounds. */
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-buttons button.cm-btn:focus-visible,
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-ok button.cm-btn:focus-visible {
  outline: 2px solid var(--brass, #b8893a);
  outline-offset: 2px;
}

/* Learn-more link styling: brass underline matches the rest of the marketing site. */
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-body a.cn-learn-more {
  color: #ffffff;
  border-bottom: 1px solid var(--brass, #b8893a);
  text-decoration: none;
}
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-body a.cn-learn-more:hover {
  color: var(--brass, #b8893a);
}