/* Cookie consent banner + settings (Layout::parts.cookie-consent). Design: login canvas boards 9–11.
   Brand comes from --hv2-brand (custom-css), so white-label sites get their own colour. */
.sfc-banner, .sfc-modal, .sfc-toast {
    --sfc-brand: var(--hv2-brand, #FF2F00);
    --sfc-soft: #FFF1EC;
    --sfc-line: #FFD3C4;
    --sfc-ink: #B42800;
    --sfc-text: #1F2937;
    --sfc-muted: #4B5563;
    --sfc-border: #E4E6EB;
    font-family: inherit;
    color: var(--sfc-text);
    box-sizing: border-box;
}
@supports (color: color-mix(in srgb, red 50%, white)) {
    .sfc-banner, .sfc-modal, .sfc-toast {
        --sfc-soft: color-mix(in srgb, var(--sfc-brand) 8%, #fff);
        --sfc-line: color-mix(in srgb, var(--sfc-brand) 26%, #fff);
        --sfc-ink: color-mix(in srgb, var(--sfc-brand) 70%, #000);
    }
}
.sfc-banner *, .sfc-modal *, .sfc-toast * { box-sizing: border-box; }
.sfc-banner[hidden], .sfc-modal[hidden], .sfc-toast[hidden] { display: none !important; }
.sfc-banner a, .sfc-modal a { color: var(--sfc-ink); text-decoration: underline; font-weight: 600; }
.sfc-banner a:hover, .sfc-modal a:hover { color: var(--sfc-brand); }
.sfc-banner :focus, .sfc-modal :focus { outline: none; box-shadow: none; }
.sfc-banner :focus-visible, .sfc-modal :focus-visible { outline: 2px solid var(--sfc-line); outline-offset: 2px; }

/* buttons */
.sfc-btn {
    height: 44px; padding: 0 20px; border-radius: 22px; border: 0; background: transparent;
    font: inherit; font-size: 14px; font-weight: 600; line-height: 1; cursor: pointer; white-space: nowrap;
    display: inline-flex; align-items: center; justify-content: center;
}
.sfc-btn--text { color: var(--sfc-ink); padding: 0 14px; }
.sfc-btn--text:hover { color: var(--sfc-brand); }
.sfc-btn--outline { border: 1.5px solid var(--sfc-line); background: #fff; color: var(--sfc-text); min-width: 132px; }
.sfc-btn--outline:hover { background: var(--sfc-soft); }
.sfc-btn--fill { background: var(--sfc-brand); color: #fff; min-width: 132px; }
.sfc-btn--fill:hover { filter: brightness(.94); }
.sfc-btn--soft { border: 1.5px solid var(--sfc-line); background: var(--sfc-soft); color: var(--sfc-ink); }
.sfc-btn--soft:hover { border-color: var(--sfc-brand); }

/* banner: floating card, page stays usable (no overlay) */
.sfc-banner {
    position: fixed; left: 40px; right: 40px; bottom: 24px; z-index: 1040;
    max-width: 1200px; margin: 0 auto;
    display: flex; align-items: center; gap: 24px;
    padding: 22px 24px; background: #fff; border: 1.5px solid var(--sfc-line); border-radius: 18px;
    box-shadow: 0 18px 50px rgba(17, 24, 39, .16);
}
.sfc-banner__icon {
    width: 48px; height: 48px; flex-shrink: 0; border-radius: 14px; background: var(--sfc-soft); color: var(--sfc-ink);
    display: flex; align-items: center; justify-content: center;
}
.sfc-banner__text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.sfc-banner__title { font-size: 16px; font-weight: 700; }
.sfc-banner__body { font-size: 13.5px; line-height: 1.55; color: var(--sfc-muted); }
.sfc-banner__actions { display: flex; gap: 10px; flex-shrink: 0; }
.sfc-banner__settings-m { display: none; }

/* settings popup */
.sfc-modal { position: fixed; inset: 0; z-index: 1065; display: flex; align-items: center; justify-content: center; padding: 24px 16px; }
.sfc-modal__backdrop { position: absolute; inset: 0; background: rgba(17, 24, 39, .45); }
.sfc-dialog {
    position: relative; width: 600px; max-width: 100%; max-height: calc(100vh - 48px);
    display: flex; flex-direction: column; overflow: hidden;
    background: #fff; border-radius: 22px; box-shadow: 0 24px 60px rgba(0, 0, 0, .25);
}
.sfc-dialog:focus { outline: none; }
.sfc-dialog__head { display: flex; align-items: flex-start; gap: 14px; padding: 22px 26px 16px; border-bottom: 1px solid #F1F2F4; }
.sfc-dialog__intro { flex: 1 1 auto; display: flex; flex-direction: column; gap: 6px; }
.sfc-dialog__title { margin: 0; font-size: 20px; font-weight: 700; color: var(--sfc-text); }
.sfc-dialog__lead { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--sfc-muted); }
.sfc-dialog__close {
    width: 40px; height: 40px; flex-shrink: 0; border-radius: 20px; border: 1.5px solid var(--sfc-line); background: #fff; color: var(--sfc-text);
    display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
}
.sfc-dialog__close:hover { background: var(--sfc-soft); }
.sfc-dialog__body { flex: 1 1 auto; overflow-y: auto; padding: 14px 26px; display: flex; flex-direction: column; gap: 12px; }
.sfc-dialog__foot { display: flex; gap: 10px; padding: 16px 26px 20px; border-top: 1px solid #F1F2F4; }
.sfc-dialog__foot .sfc-btn { flex: 1 1 0; min-width: 0; height: 46px; }

.sfc-group { border: 1.5px solid var(--sfc-border); border-radius: 16px; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.sfc-group.is-on { border-color: var(--sfc-line); }
.sfc-group__row { display: flex; align-items: center; gap: 12px; }
.sfc-group__text { flex: 1 1 auto; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.sfc-group__title { font-size: 15px; font-weight: 700; }
.sfc-group__desc { font-size: 12.5px; line-height: 1.5; color: var(--sfc-muted); }

.sfc-always { font-size: 12px; font-weight: 700; color: #15803D; background: #F0FDF4; border: 1px solid #86EFAC; border-radius: 12px; padding: 4px 10px; white-space: nowrap; }

.sfc-switch { position: relative; display: flex; align-items: center; gap: 8px; margin: 0; cursor: pointer; flex-shrink: 0; }
.sfc-switch__label { font-size: 12px; font-weight: 600; color: var(--sfc-muted); min-width: 22px; text-align: right; }
.sfc-switch__input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.sfc-switch__track { width: 46px; height: 28px; border-radius: 14px; background: #D1D5DB; position: relative; display: inline-block; transition: background .15s; }
.sfc-switch__knob { position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: 11px; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: left .15s; }
.sfc-switch__input:checked + .sfc-switch__track { background: var(--sfc-brand); }
.sfc-switch__input:checked + .sfc-switch__track .sfc-switch__knob { left: 21px; }
.sfc-switch__input:focus-visible + .sfc-switch__track { outline: 2px solid var(--sfc-line); outline-offset: 2px; }

.sfc-toast {
    position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 1070;
    padding: 10px 16px; border-radius: 14px; background: #374151; color: #F9FAFB; font-size: 13px; font-weight: 600;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .2);
}
html.sfc-lock, html.sfc-lock body { overflow: hidden; }

/* footer link */
.sfc-footer-link { display: inline-block; margin-top: 6px; color: inherit; text-decoration: underline; font-weight: 600; cursor: pointer; background: none; border: 0; padding: 0; font: inherit; }
.sfc-footer-link:hover { opacity: .8; }

/* tablet */
@media (max-width: 991px) {
    .sfc-banner { left: 16px; right: 16px; bottom: 16px; flex-wrap: wrap; gap: 14px 18px; }
    .sfc-banner__text { flex-basis: calc(100% - 66px); }
    .sfc-banner__actions { width: 100%; justify-content: flex-end; }
}

/* phone: bottom sheet + full-height settings */
@media (max-width: 640px) {
    .sfc-banner {
        left: 0; right: 0; bottom: 0; border: 0; border-radius: 22px 22px 0 0;
        box-shadow: 0 -12px 36px rgba(17, 24, 39, .18);
        padding: 20px 16px calc(16px + env(safe-area-inset-bottom, 0px));
        flex-direction: column; align-items: stretch; gap: 14px;
    }
    .sfc-banner__icon { position: absolute; top: 18px; left: 16px; width: 38px; height: 38px; border-radius: 12px; }
    .sfc-banner__icon svg { width: 22px; height: 22px; }
    .sfc-banner__text { flex-basis: auto; gap: 14px; }
    .sfc-banner__title { min-height: 38px; display: flex; align-items: center; padding-left: 48px; }
    .sfc-banner__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .sfc-banner__actions .sfc-btn { min-width: 0; height: 48px; border-radius: 24px; font-size: 15px; }
    .sfc-banner__settings { display: none; }
    .sfc-banner__settings-m { display: inline-flex; grid-column: 1 / -1; height: 44px !important; }

    .sfc-modal { padding: 0; align-items: stretch; }
    .sfc-modal__backdrop { display: none; }
    .sfc-dialog { width: 100%; max-height: none; height: 100%; border-radius: 0; box-shadow: none; }
    .sfc-dialog__head { padding: 14px 8px 12px 16px; }
    .sfc-dialog__title { font-size: 17px; line-height: 44px; }
    .sfc-dialog__lead { font-size: 13px; }
    .sfc-dialog__close { border: 0; width: 44px; height: 44px; }
    .sfc-dialog__body { padding: 14px 16px; }
    .sfc-dialog__foot { display: grid; grid-template-columns: 1fr 1fr; padding: 12px 16px calc(20px + env(safe-area-inset-bottom, 0px)); }
    .sfc-dialog__foot .sfc-btn { height: 48px; border-radius: 24px; font-size: 15px; }
    .sfc-dialog__foot [data-sfc-save] { grid-column: 1 / -1; order: -1; }
    .sfc-toast { bottom: 16px; }
}