/* Complianz cookie banner in the design system (LOCKED 31.10.2026, theme 0.12.22, DS 2.7 / RULES 60).
   Complianz prints its colors as `#cmplz-cookiebanner-container ... !important`, so every rule here is
   prefixed with the same ID plus the banner class to win on specificity. Plugin settings stay as they are. */
#cmplz-cookiebanner-container .cmplz-cookiebanner {
  font-family: var(--borsite-font-ui) !important;
  background: var(--borsite-color-bg-elevated) !important;
  color: var(--borsite-color-text) !important;
  border: 1px solid var(--borsite-color-border) !important;
  border-radius: var(--borsite-radius-lg) !important;
  box-shadow: var(--borsite-shadow-soft) !important;
  padding: var(--borsite-space-6) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-title {
  font-family: var(--borsite-font-display) !important;
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  color: var(--borsite-color-text) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message p {
  font-family: var(--borsite-font-display) !important;
  font-size: 1rem !important;
  line-height: 1.45 !important;
  color: var(--borsite-color-text-muted) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category {
  background: color-mix(in srgb, var(--borsite-color-text) 4%, transparent) !important;
  border-radius: var(--borsite-radius-sm) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner :is(.cmplz-category-title, .cmplz-always-active, .cmplz-description) {
  font-family: var(--borsite-font-ui) !important;
  color: var(--borsite-color-text) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-divider {
  border-color: var(--borsite-color-border) !important;
  background: var(--borsite-color-border) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons {
  gap: var(--borsite-space-2) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn {
  font-family: var(--borsite-font-ui) !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  min-height: 44px !important;
  height: auto !important;
  border-radius: var(--borsite-radius-pill) !important;
  padding: 0 var(--borsite-space-5) !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 1px solid color-mix(in srgb, var(--borsite-color-text) 28%, transparent) !important;
  color: var(--borsite-color-text) !important;
}
/* Order: Отказвам + Настройки left, Приемам right (stacked on mobile: Приемам bottom). */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-deny { order: 1; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn:is(.cmplz-view-preferences, .cmplz-save-preferences, .cmplz-manage-options) { order: 2; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-accept {
  order: 3;
  background-color: var(--borsite-c-btn--primary-bg) !important;
  background-image: linear-gradient(105deg, #23484a, #274d4e) !important;
  border-color: transparent !important;
  color: var(--borsite-c-white) !important;
}
html[data-theme="dark"] #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-accept {
  background-color: var(--borsite-c-btn--primary-bg-dark) !important; /* #345f5b */
  background-image: none !important;
  border-color: var(--borsite-c-btn--primary-bg-dark) !important;
  color: var(--borsite-c-white-dark) !important;
}
/* Close: plain X, no stroke/ring, 44x44 hit area; ring only for keyboard focus. */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close {
  width: 44px !important;
  height: 44px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin: -12px -12px 0 0;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  color: var(--borsite-color-text) !important;
  border-radius: var(--borsite-radius-pill);
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close svg {
  width: 14px !important;
  height: 14px !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close:hover {
  background: color-mix(in srgb, var(--borsite-color-text) 8%, transparent) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close:focus-visible {
  outline: 2px solid var(--borsite-color-focus) !important;
  outline-offset: 2px;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links a {
  font-family: var(--borsite-font-ui) !important;
  font-size: 0.875rem !important;
  color: var(--borsite-color-text) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* Hover / active (0.12.23): same tokens as the DS buttons. Primary = .borsite-btn--primary:hover (lift
   --borsite-s-btn--primary-tf); secondary = .borsite-btn--secondary:hover (bg-elevated + lift
   --borsite-s-btn--secondary-tf). Active = pressed (lift removed). Light and dark. */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn {
  transition: transform var(--borsite-duration-base) ease, box-shadow var(--borsite-duration-base) ease, background-color var(--borsite-duration-base) ease !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-accept:hover {
  transform: var(--borsite-s-btn--primary-tf);
  box-shadow: var(--borsite-s-btn--primary-shadow) !important;
}
html[data-theme="dark"] #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-accept:hover {
  box-shadow: var(--borsite-s-btn--primary-shadow-2) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn:not(.cmplz-accept):hover {
  background-color: var(--borsite-color-bg-elevated) !important;
  transform: var(--borsite-s-btn--secondary-tf);
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn:active {
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn:hover {
    transform: none;
  }
}
