/* Buzznerd Consent - frontend banner & preference center */

#bznrd-consent-root {
    --bznrd-primary: #0a3d70;
    --bznrd-text: #3a3a3a;
    --bznrd-bg: #ffffff;
    --bznrd-btn-text: #ffffff;
    --bznrd-radius: 10px;
    --bznrd-shadow: 0 10px 40px rgba(0, 0, 0, .18);
    font-family: var(--bznrd-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
    font-size: var(--bznrd-font-size, 14px);
    line-height: 1.5;
}

#bznrd-consent-root[hidden] { display: none; }

.bznrd-consent * { box-sizing: border-box; }

/* ---------- Banner ----------
 * All frontend rules are scoped under the #bznrd-consent-root ID so they win
 * against theme styles (an ID beats any number of theme classes/elements).
 * The few properties a theme most aggressively overrides (button colors,
 * position, clickability) also use !important as a belt-and-braces guard. */

#bznrd-consent-root .bznrd-consent-banner {
    position: fixed !important;
    z-index: 2147483000;
    background: var(--bznrd-bg) !important;
    color: var(--bznrd-text);
    box-shadow: var(--bznrd-shadow);
    border-radius: var(--bznrd-radius);
    padding: 22px 24px;
    margin: 0;
    width: 420px;
    max-width: calc(100vw - 40px);
    pointer-events: auto;
}

/* Must use !important: the full-width bar rules below set `display: flex` at
   the same specificity, and being later in the file they would otherwise win
   and keep the banner visible even after banner.hidden = true is set in JS. */
#bznrd-consent-root .bznrd-consent-banner[hidden] { display: none !important; }

/* Box positions (small floating card). Each resets the other edges so a
   previously-selected position never leaks in. */
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-bottom-left {
    top: auto; right: auto; bottom: 20px; left: 20px; transform: none;
}
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-bottom-right {
    top: auto; left: auto; bottom: 20px; right: 20px; transform: none;
}
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-center {
    top: 50%; left: 50%; right: auto; bottom: auto; transform: translate(-50%, -50%);
}

/* Full-width sticky bar. Triggered by the "Banner" layout AND by the bar
   positions ("Bottom (bar)" / "Top (bar)"), so the bar sticks to the edge of
   the viewport regardless of the Layout choice. */
#bznrd-consent-root .bznrd-consent-banner.bznrd-layout-banner,
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-bottom,
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-top {
    width: 100%;
    max-width: 100%;
    left: 0;
    right: 0;
    top: auto;
    border-radius: 0;
    transform: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
/* Bar defaults to the bottom unless the top position is explicitly chosen. */
#bznrd-consent-root .bznrd-consent-banner.bznrd-layout-banner,
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-bottom { bottom: 0; top: auto; }
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-top { top: 0; bottom: auto; }
#bznrd-consent-root .bznrd-consent-banner.bznrd-layout-banner .bznrd-consent-banner__body,
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-bottom .bznrd-consent-banner__body,
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-top .bznrd-consent-banner__body { flex: 1 1 420px; }
#bznrd-consent-root .bznrd-consent-banner.bznrd-layout-banner .bznrd-consent-banner__actions,
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-bottom .bznrd-consent-banner__actions,
#bznrd-consent-root .bznrd-consent-banner.bznrd-pos-top .bznrd-consent-banner__actions { margin-top: 0; }

#bznrd-consent-root .bznrd-consent-banner__title {
    margin: 0 0 8px;
    padding: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--bznrd-text);
    text-transform: none;
    letter-spacing: normal;
}

#bznrd-consent-root .bznrd-consent-banner__message { margin-bottom: 16px; }
#bznrd-consent-root .bznrd-consent-banner__message p { margin: 0 0 8px; }
#bznrd-consent-root .bznrd-consent-banner__policy { color: var(--bznrd-primary); text-decoration: underline; }

#bznrd-consent-root .bznrd-consent-banner__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

/* ---------- Buttons ---------- */

#bznrd-consent-root .bznrd-btn {
    display: inline-block;
    font: inherit;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer !important;
    border-radius: 6px;
    padding: 10px 18px;
    margin: 0;
    border: 1px solid transparent;
    width: auto !important;
    min-width: 0;
    max-width: none;
    height: auto;
    text-transform: none !important;
    letter-spacing: normal;
    text-shadow: none;
    box-shadow: none;
    text-decoration: none;
    transition: opacity .15s ease, background .15s ease;
    position: relative;
    z-index: 1;
    pointer-events: auto;
}
#bznrd-consent-root .bznrd-btn:hover { opacity: .9; }

#bznrd-consent-root .bznrd-btn--primary {
    background: var(--bznrd-primary) !important;
    color: var(--bznrd-btn-text) !important;
    border-color: var(--bznrd-primary) !important;
}
#bznrd-consent-root .bznrd-btn--secondary {
    background: transparent !important;
    color: var(--bznrd-primary) !important;
    border-color: var(--bznrd-primary) !important;
}
#bznrd-consent-root .bznrd-btn--link {
    background: transparent !important;
    color: var(--bznrd-primary) !important;
    border: none !important;
    text-decoration: underline !important;
    padding: 10px 6px;
}

/* ---------- Preference center ---------- */

#bznrd-consent-root .bznrd-consent-prefs[hidden] { display: none; }

/* The overlay + modal must sit ABOVE the banner (which uses a very high
   z-index so it can win over themes). Keep them a step higher here. */
#bznrd-consent-root .bznrd-consent-prefs__overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 2147483400;
}

#bznrd-consent-root .bznrd-consent-prefs__modal {
    position: fixed;
    z-index: 2147483401;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 640px;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    background: var(--bznrd-bg);
    color: var(--bznrd-text);
    border-radius: var(--bznrd-radius);
    box-shadow: var(--bznrd-shadow);
    overflow: hidden;
}

#bznrd-consent-root .bznrd-consent-prefs__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    border-bottom: 1px solid rgba(0, 0, 0, .08);
}
#bznrd-consent-root .bznrd-consent-prefs__header h2 { margin: 0; padding: 0; font-size: 18px; color: var(--bznrd-text); }

/* The close (x) is a <button>; neutralise the theme's button styling so it
   is a plain icon, not a solid coloured box. */
#bznrd-consent-root .bznrd-consent-prefs__close {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0;
    width: auto !important;
    min-width: 0;
    font-size: 26px;
    line-height: 1;
    cursor: pointer !important;
    color: inherit !important;
    text-transform: none !important;
}

#bznrd-consent-root .bznrd-consent-prefs__intro { padding: 16px 22px; }
#bznrd-consent-root .bznrd-consent-prefs__intro p { margin: 0 0 8px; }

#bznrd-consent-root .bznrd-consent-prefs__categories {
    padding: 0 22px;
    overflow-y: auto;
    flex: 1;
}

#bznrd-consent-root .bznrd-cat {
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 8px;
    padding: 12px 14px;
    margin-bottom: 12px;
}
#bznrd-consent-root .bznrd-cat__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
/* The category label is a <button> that toggles the description (accordion).
   Reset the theme's button styling so it reads as a plain, expandable row
   header instead of a solid coloured button. */
#bznrd-consent-root .bznrd-cat__toggle-desc {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    font: inherit;
    font-weight: 700;
    color: var(--bznrd-text) !important;
    text-align: left;
    text-transform: none !important;
    letter-spacing: normal;
    text-shadow: none;
    padding: 0 !important;
    margin: 0;
    width: auto !important;
    min-width: 0;
    max-width: none;
    height: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
}
#bznrd-consent-root .bznrd-cat__toggle-desc::before {
    content: "\25B6";
    font-size: 10px;
    transition: transform .15s ease;
    color: var(--bznrd-primary);
    flex: 0 0 auto;
}
#bznrd-consent-root .bznrd-cat__toggle-desc[aria-expanded="true"]::before { transform: rotate(90deg); }
#bznrd-consent-root .bznrd-cat__name { font-weight: 700; }
#bznrd-consent-root .bznrd-cat__desc { padding-top: 10px; color: var(--bznrd-text); opacity: .85; }
#bznrd-consent-root .bznrd-cat__desc p { margin: 0 0 6px; }

/* Switch */
.bznrd-switch {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}
.bznrd-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.bznrd-switch__slider {
    width: 42px;
    height: 22px;
    border-radius: 22px;
    background: #c7c7c7;
    position: relative;
    transition: background .15s ease;
    cursor: pointer;
}
.bznrd-switch__slider::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    transition: transform .15s ease;
}
.bznrd-switch input:checked + .bznrd-switch__slider { background: var(--bznrd-primary); }
.bznrd-switch input:checked + .bznrd-switch__slider::before { transform: translateX(20px); }
.bznrd-switch__slider--locked { opacity: .6; cursor: not-allowed; }
.bznrd-switch__always { font-size: 12px; color: var(--bznrd-primary); font-weight: 600; }

.bznrd-consent-prefs__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding: 16px 22px;
    border-top: 1px solid rgba(0, 0, 0, .08);
}

/* ---------- Revisit floating button ---------- */

.bznrd-consent-revisit {
    position: fixed;
    z-index: 999998;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    background: var(--bznrd-primary);
    color: var(--bznrd-btn-text);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
}
.bznrd-consent-revisit[hidden] { display: none; }
.bznrd-consent-revisit.bznrd-pos-bottom-left { bottom: 20px; left: 20px; }
.bznrd-consent-revisit.bznrd-pos-bottom-right { bottom: 20px; right: 20px; }

/* ---------- Dark theme ----------
 * Scoped as #bznrd-consent-root.bznrd-theme-dark (specificity 1,1,0) so it
 * overrides the base #bznrd-consent-root variables (1,0,0). Without the ID
 * here the base ID rule would win and the Theme selector would do nothing. */

#bznrd-consent-root.bznrd-theme-dark {
    --bznrd-text: #eaeaea;
    --bznrd-bg: #1f2530;
}
#bznrd-consent-root.bznrd-theme-dark .bznrd-cat { border-color: rgba(255, 255, 255, .14); }
#bznrd-consent-root.bznrd-theme-dark .bznrd-consent-prefs__header,
#bznrd-consent-root.bznrd-theme-dark .bznrd-consent-prefs__actions { border-color: rgba(255, 255, 255, .12); }

@media (max-width: 480px) {
    #bznrd-consent-root .bznrd-consent-banner.bznrd-layout-box { left: 10px; right: 10px; width: auto; }
    #bznrd-consent-root .bznrd-consent-banner__actions .bznrd-btn { flex: 1 1 auto; text-align: center; }
}

/* ---------- Do Not Sell / Share link ---------- */

.bznrd-do-not-sell { cursor: pointer; }

/* ---------- Confirmation toast (GPC / Do Not Sell) ---------- */

.bznrd-consent-toast {
    position: fixed;
    z-index: 2147483600;
    left: 50%;
    bottom: 24px;
    transform: translate(-50%, 20px);
    max-width: calc(100vw - 32px);
    background: #1f2530;
    color: #fff;
    padding: 12px 18px;
    border-radius: 8px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, .3);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.4;
    opacity: 0;
    transition: opacity .35s ease, transform .35s ease;
    pointer-events: none;
}
.bznrd-consent-toast.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
}
