:root {
  --consent-primary: #0b5fff;
  --consent-bg: #fff;
  --consent-text: #22272f;
  --consent-radius: 10px;
}
.consent-privacy-link { color: #14161a; font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
.consent-privacy-link:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.consent-banner,
.consent-modal {
  font: inherit;
  /* Fixed px: host sites set different root/body font sizes. */
  font-size: 16px;
  line-height: 1.5;
  color: var(--consent-text);
  border: 0;
  border-radius: var(--consent-radius);
  padding: 32px;
  inset-block-start: unset;
  inset-block-end: unset;
  max-height: unset;
  inset-inline-start: unset;
  inset-inline-end: unset;
  right: 48px;
  bottom: 48px;
  width: 660px;
  max-width: calc(100vw - 96px);
  box-sizing: border-box;
}
.consent-banner {
  --consent-cookie-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='44 34 20 20'%3E%3Cpath d='M53.2149 35.7159C48.9878 36.1115 45.6794 39.6694 45.6794 44C45.6794 48.5953 49.4047 52.3206 54 52.3206C58.3306 52.3206 61.8885 49.0122 62.2841 44.7851C59.8311 44.4782 57.7071 42.9032 57.3013 40.6987C55.0968 40.2929 53.5218 38.1689 53.2149 35.7159ZM44 44C44 38.4772 48.4772 34 54 34C54.4637 34 54.8397 34.3759 54.8397 34.8397C54.8397 37.3711 56.4517 39.0891 58.0712 39.0891C58.535 39.0891 58.9109 39.465 58.9109 39.9288C58.9109 41.5483 60.6289 43.1603 63.1603 43.1603C63.6241 43.1603 64 43.5363 64 44C64 49.5228 59.5228 54 54 54C48.4772 54 44 49.5228 44 44ZM48.0712 41.9644C48.0712 41.5006 48.4472 41.1247 48.9109 41.1247H48.9211C49.3849 41.1247 49.7608 41.5006 49.7608 41.9644C49.7608 42.4281 49.3849 42.8041 48.9211 42.8041H48.9109C48.4472 42.8041 48.0712 42.4281 48.0712 41.9644ZM53.1603 42.9822C53.1603 42.5184 53.5363 42.1425 54 42.1425H54.0102C54.4739 42.1425 54.8499 42.5184 54.8499 42.9822C54.8499 43.4459 54.4739 43.8219 54.0102 43.8219H54C53.5363 43.8219 53.1603 43.4459 53.1603 42.9822ZM50.1069 48.0712C50.1069 47.6075 50.4828 47.2316 50.9466 47.2316H50.9567C51.4205 47.2316 51.7964 47.6075 51.7964 48.0712C51.7964 48.535 51.4205 48.9109 50.9567 48.9109H50.9466C50.4828 48.9109 50.1069 48.535 50.1069 48.0712ZM56.2137 48.0712C56.2137 47.6075 56.5897 47.2316 57.0534 47.2316H57.0636C57.5274 47.2316 57.9033 47.6075 57.9033 48.0712C57.9033 48.535 57.5274 48.9109 57.0636 48.9109H57.0534C56.5897 48.9109 56.2137 48.535 56.2137 48.0712Z'/%3E%3C/svg%3E");
  position: fixed;
  z-index: 10001;
  margin: 0;
  padding: 32px;
  overflow-y: auto;
  max-height: calc(100vh - 96px);
  background: var(--consent-bg);
  border: 1px solid #fff;
  border-radius: 16px;
  box-shadow: 0 4px 6px -2px #0000000d, 0 10px 15px -3px #0000001a;
}
.consent-banner[hidden] {
  display: none;
}
@media (max-width: 600px) {
  .consent-banner {
    right: 16px;
    bottom: 16px;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 32px);
    padding: 24px;
  }
}
.consent-banner h2,
.consent-modal h2 {
  margin: 0 0 24px;
  color: #14161a;
  font-weight: 600;
  font-size: 20px;
  line-height: 1.3;
}
.consent-banner h2 {
  display: flex;
  align-items: center;
  gap: 12px;
}
.consent-banner h2::before {
  content: "";
  flex: none;
  width: 20px;
  height: 20px;
  background: currentColor;
  -webkit-mask: var(--consent-cookie-icon) center / contain no-repeat;
  mask: var(--consent-cookie-icon) center / contain no-repeat;
}
.consent-banner p {
  margin: 0 0 32px;
  color: #4e555f;
  font-size: 15px;
  line-height: 22px;
}
.consent-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.consent-actions button {
  flex: 1 1 auto;
  min-height: 44px;
  padding: 10px 24px;
  border: 0;
  border-radius: 8px;
  background: #22272f;
  color: #dddfe4;
  font: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  cursor: pointer;
  transition: background 0.15s ease;
}
.consent-actions button:hover {
  background: #14161a;
}
.consent-actions button:focus-visible {
  outline: 2px solid #22272f;
  outline-offset: 2px;
}
.consent-floating {
  font: inherit;
  cursor: pointer;
}
.consent-modal {
  border: 0;
  border-radius: var(--consent-radius);
  padding: 32px;
}
.consent-modal::backdrop {
  background: #0009;
}
.consent-option {
  display: flex;
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid #e5e7eb;
}
.consent-floating {
  position: fixed;
  z-index: 10002;
  bottom: -28px;
  right: 48px;
  border-radius: 7px;
  width: auto;
  max-width: calc(100vw - 32px);
  height: auto;
  padding: 10px 10px;
  background: white;
  color: black;
  font-size: 14px;
  transition: bottom .2s linear;
  border-radius: 12px 12px 0 0;

  &:hover {
    bottom: 0;
  }
}

.consent-intro {
  margin: 0 0 16px;
  line-height: 1.45;
}
.consent-category {
  margin: 12px 0;
  padding: 16px;
  background: #f5f5f5;
  border-radius: 8px;
}
.consent-category-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.consent-category-heading strong {
  margin-right: auto;
}
.consent-category-description {
  margin: 12px 0 0;
  line-height: 1.5;
  font-size: 14px;
}
.consent-category-expand {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.consent-category-expand::before {
  content: "";
  width: 10px;
  height: 10px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform 0.2s ease;
}
.consent-category-expand.is-open::before {
  transform: rotate(225deg) translate(-2px, -2px);
}
.consent-category-expand:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 2px;
}
.consent-always {
  color: #198c31;
  font-size: 14px;
  font-weight: 600;
}
.consent-switch {
  appearance: none;
  position: relative;
  width: 40px;
  height: 22px;
  margin: 0;
  border: 0;
  border-radius: 999px;
  background: #949494;
  cursor: pointer;
  transition: background 0.2s;
}
.consent-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  transition: transform 0.2s;
}
.consent-switch:checked {
  background: var(--consent-primary);
}
.consent-switch:checked::after {
  transform: translateX(18px);
}
.consent-switch:focus-visible {
  outline: 3px solid #111;
  outline-offset: 3px;
}