/**
 * The KADABRA banner inside this store — what this site needs from it, not a
 * change to KADABRA's files. kadabra-consent.css is left as KADABRA sent it
 * (its colours are the DMC skin, its direction RTL); this file loads after it
 * (inc/consent.php makes that file this one's dependency) and:
 *
 *  1. Re-skins it in the store palette — black and white, no logo colours —
 *     through KADABRA's own --kc-* variables.
 *  2. Turns it LTR: the store is English. KADABRA's file sets direction: rtl
 *     and text-align: right on both the banner and the dialog.
 *  3. Restores KADABRA's button values over the parent theme's reset
 *     (Hello Elementor's reset.css styles every [type=button] with a pink #c36
 *     border, 3px radius and a pink hover fill, and its selector outranks
 *     .kc-btn — measured on DMC, 2026-10-12).
 *  4. Places the banner above the store's own floating layers (drawer 90,
 *     product sticky bar, chat).
 */

:root {
  --kc-bg: #FFFFFF;
  --kc-fg: #0A0A0A;
  --kc-muted: #3A3A3A;
  --kc-accent: #0A0A0A;
  --kc-link: #0A0A0A;
  --kc-pill: #F2F2F2;
  --kc-pill-border: #CFCFCF;
  --kc-pill-fg: #0A0A0A;
  --kc-line: #E5E5E5;
  --kc-switch-off: #CFCFCF;
  --kc-radius: 18px;
  --kc-shadow: 0 18px 40px -12px rgba(10, 10, 10, .28), 0 0 0 1px rgba(10, 10, 10, .06);
}

/* 2. LTR */
.kc-banner,
.kc-dialog {
  direction: ltr;
  text-align: left;
}

/* 4. Above the drawer and the sticky bar */
.kc-banner { z-index: 9990; }
.kc-overlay { z-index: 9991; background: rgba(10, 10, 10, .5); }

/* 3. Buttons, restated with enough specificity to beat the parent reset */
.kc-banner .kc-btn,
.kc-dialog .kc-btn {
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--kc-pill-border);
  border-radius: 999px;
  background: var(--kc-pill);
  color: var(--kc-pill-fg);
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  text-transform: none;
  width: auto;
}

/* "Accept all" — the first button — reads as the primary action, in ink */
.kc-banner .kc-actions .kc-btn:first-child {
  background: var(--kc-accent);
  border-color: var(--kc-accent);
  color: #FFFFFF;
  font-weight: 600;
}

.kc-banner .kc-btn:hover,
.kc-banner .kc-btn:focus,
.kc-dialog .kc-btn:hover,
.kc-dialog .kc-btn:focus {
  background: var(--kc-pill);
  color: var(--kc-pill-fg);
  border-color: var(--kc-accent);
}
.kc-banner .kc-actions .kc-btn:first-child:hover,
.kc-banner .kc-actions .kc-btn:first-child:focus {
  background: #262626;
  border-color: #262626;
  color: #FFFFFF;
}

.kc-dialog .kc-close,
.kc-dialog .kc-close:hover,
.kc-dialog .kc-close:focus {
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--kc-fg);
  font-size: 20px;
}
.kc-dialog .kc-close:hover { background: #F2F2F2; }

.kc-dialog .kc-switch,
.kc-dialog .kc-switch:hover,
.kc-dialog .kc-switch:focus {
  width: 40px;
  height: 22px;
  padding: 0;
  border: 1px solid var(--kc-pill-border);
  border-radius: 999px;
  background: var(--kc-switch-off);
}

.kc-dialog .kc-switch[aria-checked="true"],
.kc-dialog .kc-switch[aria-checked="true"]:hover,
.kc-dialog .kc-switch[aria-checked="true"]:focus {
  background: var(--kc-accent);
  border-color: var(--kc-accent);
}

.kc-banner .kc-text a,
.kc-banner .kc-text a:hover {
  color: var(--kc-link);
}

/* Global Privacy Control note under "Marketing" (consent-bridge.js adds it) */
.kc-cat .kc-gpc {
  grid-column: 1 / -1;
  margin-top: 4px;
  color: var(--kc-fg);
  font-size: 12.5px;
}

/* "Change cookie settings" on the privacy and cookie pages */
.kadabra-cookie-settings {
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--kc-line);
}
.kadabra-cookie-settings p { margin: 0 0 12px; }

@media (max-width: 600px) {
  .kc-banner .kc-btn,
  .kc-dialog .kc-btn {
    min-height: 44px;
    padding: 6px 8px;
  }

  .kc-dialog .kc-switch,
  .kc-dialog .kc-switch:hover,
  .kc-dialog .kc-switch:focus {
    width: 44px;
    height: 26px;
  }
}