/**
 * CookieYes consent banner - GlamDerm brand colour.
 *
 * CookieYes renders the banner client-side from its CDN and applies its own
 * palette as INLINE styles, so these overrides need !important to win.
 *
 * The same colour is also set in the CookieYes cloud banner config, but that
 * only takes effect once the banner is republished from the CookieYes
 * dashboard. Until then this stylesheet is what visitors actually see. Both
 * carry the same value, so they agree either way.
 */

:root {
  --gd-consent-accent: #7d73b6;
}

/* Solid buttons - notice bar and preference centre */
[data-cky-tag="accept-button"],
[data-cky-tag="reject-button"],
[data-cky-tag="detail-accept-button"],
[data-cky-tag="detail-reject-button"],
[data-cky-tag="detail-save-button"],
[data-cky-tag="optout-confirm-button"] {
  background-color: var(--gd-consent-accent) !important;
  border-color: var(--gd-consent-accent) !important;
}

/* Outlined button ("Customise") */
[data-cky-tag="settings-button"] {
  color: var(--gd-consent-accent) !important;
  border-color: var(--gd-consent-accent) !important;
}

/* Text links - show/hide description, read more, do-not-sell, policy link */
[data-cky-tag="show-desc-button"],
[data-cky-tag="hide-desc-button"],
[data-cky-tag="readmore-button"],
[data-cky-tag="donotsell-button"],
.cky-policy {
  color: var(--gd-consent-accent) !important;
}

/* Floating "Consent Preferences" revisit widget */
[data-cky-tag="revisit-consent"] {
  background-color: var(--gd-consent-accent) !important;
}

/* Category toggles, on state */
.cky-switch input[type="checkbox"]:checked {
  background-color: var(--gd-consent-accent) !important;
}

/* Privacy Policy link injected by js/cookie-consent-link.js */
.gd-cky-policy-line {
  margin-top: 10px;
}

.gd-cky-policy-line .cky-policy {
  font-size: 13px;
  text-decoration: underline;
}

/* ---------------------------------------------------------------------------
 * Compact notice.
 *
 * CookieYes' default notice was 440x308px - 38.6% of viewport height on a
 * 1897x798 screen - and sat over the hero content. These rules roughly halve
 * it. The banner's layout comes from the CookieYes CDN stylesheet, so sizes
 * need !important to win.
 *
 * Deliberately NOT reduced: all three buttons stay visible and identically
 * weighted, so Reject remains exactly as prominent as Accept, and body text
 * stays at 13px. A consent notice still has to be conspicuous and offer a
 * real choice - "less intrusive" has a floor.
 * ------------------------------------------------------------------------- */

.cky-consent-container {
  max-width: 400px !important;
  width: 400px !important;
}

.cky-consent-bar {
  padding: 16px 18px !important;
  box-shadow: 0 2px 14px rgba(30, 25, 60, 0.14) !important;
  border-radius: 8px !important;
}

/* Title: smaller, tighter to the text below it */
.cky-consent-bar [data-cky-tag="title"] {
  font-size: 15px !important;
  line-height: 20px !important;
  margin-bottom: 6px !important;
}

/* Body copy: the single biggest saving, paired with the shorter wording */
.cky-consent-bar .cky-notice-des,
.cky-consent-bar .cky-notice-des p {
  font-size: 13px !important;
  line-height: 19px !important;
}

.cky-consent-bar .cky-notice-des p {
  margin-bottom: 8px !important;
}

.cky-consent-bar .gd-cky-policy-line {
  margin-top: 4px !important;
}

.cky-consent-bar .gd-cky-policy-line .cky-policy {
  font-size: 12px !important;
}

/* Buttons: shorter and closer, but still full width and equal to each other */
.cky-consent-bar [data-cky-tag="notice-buttons"] {
  margin-top: 12px !important;
}

.cky-consent-bar [data-cky-tag="notice-buttons"],
.cky-consent-bar .cky-notice-btn-wrapper {
  gap: 6px !important;
}

.cky-consent-bar .cky-btn {
  font-size: 13px !important;
  line-height: 18px !important;
  padding: 7px 8px !important;
  border-radius: 4px !important;
}

/* CookieYes attribution - required on the Pro plan, so just make it quieter */
.cky-consent-bar [data-cky-tag="powered-by"] {
  font-size: 11px !important;
  line-height: 14px !important;
  margin-top: 8px !important;
}

@media (max-width: 480px) {
  .cky-consent-container {
    width: auto !important;
    max-width: none !important;
    left: 12px !important;
    right: 12px !important;
  }
}

/* CookieYes nests its own 24px/12px padding inside the card, on top of the
   card padding above - collapse it and let .cky-consent-bar own the spacing. */
.cky-consent-bar .cky-notice-content-wrapper {
  padding: 0 !important;
}

/* The attribution block reserves 40px for one line of 11px text. */
.cky-consent-bar [data-cky-tag="powered-by"] {
  margin-top: 6px !important;
}

.cky-consent-bar [data-cky-tag="powered-by"] {
  padding-bottom: 0 !important;
}

.cky-consent-bar > div:last-child:not(.cky-notice-content-wrapper) {
  padding-bottom: 0 !important;
}

/* CookieYes styles the policy link like a button (border-style: solid with no
   colour), so it picks up currentColor and renders as a boxed link. */
.cky-consent-bar .cky-policy,
.cky-modal .cky-policy {
  border: 0 !important;
}