#sbr-floating-btn,
.sbr-floating-btn {
--sbr-floating-size: var(--sdb-floating-action-size, 56px);
--sbr-floating-offset: var(--sdb-floating-action-offset, 24px);
position: fixed;
right: max(20px, env(safe-area-inset-right));
bottom: calc(var(--sbr-floating-offset) + env(safe-area-inset-bottom));
z-index: var(--sdb-floating-action-z-index, 9990);
display: inline-flex;
align-items: center;
justify-content: center;
gap: var(--sdb-space-sm, 0.75rem);
width: auto !important;
inline-size: auto !important;
height: auto !important;
block-size: auto !important;
min-width: var(--sbr-floating-size);
min-inline-size: var(--sbr-floating-size);
min-height: var(--sbr-floating-size);
min-block-size: var(--sbr-floating-size);
max-width: calc(100vw - 40px);
max-inline-size: calc(100vw - 40px);
overflow: visible;
padding: 0 var(--sdb-space-md, 1.25rem);
border: 1px solid var(--sdb-color-outline-variant, var(--sdb-color-border, #eef3f8));
border-radius: var(--sdb-shape-pill, var(--sdb-radius-pill, 999px));
background: var(--sdb-color-surface-lowest, var(--sdb-color-surface, #fff));
color: var(--sdb-color-on-surface-muted, var(--sdb-color-text, #6b7785));
box-shadow: var(--sdb-elevation-2, var(--sdb-shadow-element, 0 10px 24px rgba(31, 42, 54, 0.08)));
font-family: var(--sdb-font-body, inherit);
font-size: var(--sdb-type-label-md-size, 0.875rem);
font-weight: var(--sdb-font-weight-semibold, 600);
line-height: 1;
white-space: nowrap;
cursor: pointer;
transition:
transform var(--sdb-motion-duration-base, 180ms) var(--sdb-motion-easing-standard, ease),
background-color var(--sdb-motion-duration-base, 180ms) var(--sdb-motion-easing-standard, ease),
color var(--sdb-motion-duration-base, 180ms) var(--sdb-motion-easing-standard, ease),
right var(--sdb-motion-duration-base, 180ms) var(--sdb-motion-easing-standard, ease);
box-sizing: border-box;
}
#sbr-floating-btn:hover,
.sbr-floating-btn:hover {
background: var(--sdb-state-hover-bg, rgba(0, 88, 183, 0.06));
color: var(--sdb-color-primary, #0058b7);
transform: translateY(-2px);
}
#sbr-floating-btn:focus-visible,
.sbr-floating-btn:focus-visible {
outline: none;
box-shadow:
var(--sdb-state-focus-ring, 0 0 0 3px rgba(0, 155, 216, 0.22)),
var(--sdb-elevation-2, 0 10px 24px rgba(31, 42, 54, 0.08));
}
#sbr-floating-btn svg,
.sbr-floating-btn svg {
width: 20px;
height: 20px;
flex-shrink: 0;
}
#sbr-floating-btn .sbr-text,
.sbr-floating-btn .sbr-text {
display: inline-block;
max-width: 12rem;
max-inline-size: 12rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#sbr-floating-btn.sbr-scrolled,
.sbr-floating-btn.sbr-scrolled {
right: max(80px, env(safe-area-inset-right));
width: var(--sbr-floating-size) !important;
inline-size: var(--sbr-floating-size) !important;
height: var(--sbr-floating-size) !important;
block-size: var(--sbr-floating-size) !important;
max-width: var(--sbr-floating-size);
max-inline-size: var(--sbr-floating-size);
overflow: hidden;
padding: 0;
border-radius: 50%;
gap: 0;
}
#sbr-floating-btn.sbr-scrolled .sbr-text,
.sbr-floating-btn.sbr-scrolled .sbr-text {
display: none;
}
.sbr-hidden,
[hidden].sbr-modal-backdrop {
display: none !important;
}
#sbr-modal-overlay,
.sbr-modal-backdrop {
position: fixed;
inset: 0;
z-index: var(--sdb-modal-z-index, 10000);
display: flex;
align-items: center;
justify-content: center;
width: 100%;
min-height: 100%;
padding: var(--sdb-space-md, 1.25rem);
background: var(--sdb-modal-backdrop-bg, rgba(17, 24, 39, 0.56));
backdrop-filter: blur(2px);
box-sizing: border-box;
}
#sbr-modal,
.sbr-modal {
--sbr-modal-padding: var(--sdb-modal-padding, clamp(16px, 2.4vw, 24px));
width: min(100%, var(--sdb-modal-width-md, 640px));
max-width: 560px;
max-height: min(90vh, 720px);
overflow: auto;
border-radius: var(--sdb-shape-lg, var(--sdb-radius-lg, 20px));
background: var(--sdb-color-surface-lowest, var(--sdb-color-surface, #fff));
color: var(--sdb-color-on-surface-muted, var(--sdb-color-text, #6b7785));
box-shadow: var(--sdb-elevation-4, var(--sdb-modal-shadow, 0 24px 60px rgba(31, 42, 54, 0.18)));
animation: sbr-modal-in var(--sdb-motion-duration-enter, 180ms) var(--sdb-motion-easing-standard, ease);
}
@keyframes sbr-modal-in {
from {
opacity: 0;
transform: translateY(8px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.sbr-modal-content,
.sdb-modal__content.sbr-modal-content {
display: block;
}
.sbr-header,
.sdb-modal__header.sbr-header {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: var(--sdb-space-sm, 0.75rem);
padding: var(--sbr-modal-padding) var(--sbr-modal-padding) 0;
border: 0;
background: transparent;
}
.sbr-header--clean,
.sdb-modal__header.sbr-header--clean {
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
.sbr-header h3,
.sdb-modal__title {
margin: 0;
color: var(--sdb-color-on-surface, var(--sdb-color-title, #364048));
font-family: var(--sdb-font-heading, inherit);
font-size: clamp(1.45rem, 2.1vw, 1.9rem);
font-weight: var(--sdb-font-weight-bold, 700);
line-height: 1.2;
}
#sbr-close-btn,
.sbr-close-btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
margin: -4px -4px 0 0;
padding: 0;
border: 1px solid var(--sdb-color-outline-variant, var(--sdb-color-border, #eef3f8));
border-radius: var(--sdb-shape-pill, var(--sdb-radius-pill, 999px));
background: var(--sdb-color-surface-lowest, var(--sdb-color-surface, #fff));
color: var(--sdb-color-muted, #8e9aa7);
cursor: pointer;
box-shadow: none;
transition:
background-color var(--sdb-motion-duration-base, 180ms) var(--sdb-motion-easing-standard, ease),
border-color var(--sdb-motion-duration-base, 180ms) var(--sdb-motion-easing-standard, ease),
color var(--sdb-motion-duration-base, 180ms) var(--sdb-motion-easing-standard, ease),
transform var(--sdb-motion-duration-fast, 120ms) var(--sdb-motion-easing-standard, ease);
}
#sbr-close-btn:hover,
.sbr-close-btn:hover {
background: var(--sdb-state-hover-bg, rgba(0, 88, 183, 0.06));
border-color: var(--sdb-color-primary, #0058b7);
color: var(--sdb-color-primary, #0058b7);
}
#sbr-close-btn:focus-visible,
.sbr-close-btn:focus-visible {
outline: none;
box-shadow: var(--sdb-state-focus-ring, 0 0 0 3px rgba(0, 155, 216, 0.22));
}
#sbr-close-btn svg,
.sbr-close-btn svg {
width: 20px;
height: 20px;
}
.sbr-body,
.sdb-modal__body.sbr-body {
padding: calc(var(--sbr-modal-padding) * 0.75) var(--sbr-modal-padding) var(--sbr-modal-padding);
}
.sbr-desc {
margin: 0 0 var(--sdb-space-sm, 0.75rem);
color: var(--sdb-color-on-surface-muted, var(--sdb-color-text, #6b7785));
font-size: var(--sdb-type-body-sm-size, 0.925rem);
line-height: 1.5;
}
#sbr-form,
.sbr-form {
display: grid;
gap: var(--sdb-form-field-gap, 1rem);
}
.sbr-field,
.sdb-field.sbr-field {
display: grid;
gap: 0.45rem;
}
#sbr-form label,
.sbr-form .sdb-field__label {
color: var(--sdb-color-on-surface, var(--sdb-color-title, #364048));
font-size: var(--sdb-type-label-md-size, 0.875rem);
font-weight: var(--sdb-font-weight-semibold, 600);
line-height: 1.35;
}
#sbr-form input[type="url"],
#sbr-form textarea,
.sbr-form .sdb-field__control {
width: 100%;
min-height: 42px;
padding: 10px 12px;
border: 1px solid var(--sdb-comp-field-border, var(--sdb-field-border, var(--sdb-color-outline, #d6e0ea)));
border-radius: var(--sdb-shape-md, var(--sdb-radius-md, 12px));
background: var(--sdb-comp-field-bg, var(--sdb-field-bg, var(--sdb-color-surface-lowest, #fff)));
color: var(--sdb-color-on-surface-muted, var(--sdb-color-text, #6b7785));
font-family: var(--sdb-font-body, inherit);
font-size: var(--sdb-type-body-sm-size, 0.925rem);
line-height: 1.45;
box-sizing: border-box;
}
#sbr-form input[readonly] {
background: var(--sdb-color-surface-low, var(--sdb-color-background, #f5f8fb));
color: var(--sdb-color-muted, #8e9aa7);
}
#sbr-form textarea,
.sbr-form textarea.sdb-field__control {
min-height: 104px;
resize: vertical;
}
#sbr-form input[type="url"]:focus,
#sbr-form textarea:focus,
.sbr-form .sdb-field__control:focus-visible {
border-color: var(--sdb-field-focus-border, var(--sdb-color-primary, #0058b7));
outline: none;
box-shadow: var(--sdb-state-focus-ring, 0 0 0 3px rgba(0, 155, 216, 0.22));
}
.sbr-field-message,
.sdb-field-message.sbr-field-message {
margin: 0;
color: var(--sdb-color-muted, #8e9aa7);
font-size: 0.8125rem;
line-height: 1.45;
}
.sbr-verification,
.sdb-verification-block.sbr-verification {
display: flex;
align-items: center;
justify-content: flex-start;
min-height: 65px;
padding: 4px 0;
overflow-x: auto;
overflow-y: visible;
scrollbar-width: thin;
}
.sbr-verification .cf-turnstile {
min-width: 300px;
max-width: 100%;
}
#sbr-response-msg,
.sbr-status-message {
margin: 0;
padding: 10px 12px;
border-radius: var(--sdb-shape-md, var(--sdb-radius-md, 12px));
font-size: var(--sdb-type-body-sm-size, 0.925rem);
line-height: 1.4;
text-align: center;
}
#sbr-response-msg.sbr-success,
.sbr-status-message.sbr-success {
border: 1px solid var(--sdb-state-success-border, var(--sdb-color-success, #2f8f4e));
background: var(--sdb-sem-color-feedback-success-bg, var(--sdb-color-success-bg, #e9f6ee));
color: var(--sdb-color-success-text, #1e5f34);
}
#sbr-response-msg.sbr-error,
.sbr-status-message.sbr-error {
border: 1px solid var(--sdb-state-error-border, var(--sdb-color-error, #c53030));
background: var(--sdb-sem-color-feedback-error-bg, var(--sdb-color-error-bg, #fdecec));
color: var(--sdb-color-error-text, #7f1d1d);
}
.sbr-actions,
.sdb-modal__actions.sbr-actions {
display: flex;
justify-content: stretch;
}
#sbr-submit-btn,
.sbr-submit-btn {
width: 100%;
min-height: 44px;
padding: 10px 18px;
border: 0;
border-radius: var(--sdb-shape-md, var(--sdb-radius-md, 12px));
background: var(--sdb-sem-color-action-primary-bg, var(--sdb-color-primary, #0058b7));
color: var(--sdb-sem-color-action-primary-text, var(--sdb-color-on-primary, #fff));
font-family: var(--sdb-font-body, inherit);
font-size: var(--sdb-type-body-md-size, 1rem);
font-weight: var(--sdb-font-weight-semibold, 600);
line-height: 1.2;
cursor: pointer;
transition:
background-color var(--sdb-motion-duration-base, 180ms) var(--sdb-motion-easing-standard, ease),
opacity var(--sdb-motion-duration-fast, 120ms) var(--sdb-motion-easing-standard, ease);
}
#sbr-submit-btn:hover,
.sbr-submit-btn:hover {
background: var(--sdb-color-secondary, #009bd8);
}
#sbr-submit-btn:focus-visible,
.sbr-submit-btn:focus-visible {
outline: none;
box-shadow: var(--sdb-state-focus-ring, 0 0 0 3px rgba(0, 155, 216, 0.22));
}
#sbr-submit-btn:disabled,
.sbr-submit-btn:disabled {
opacity: var(--sdb-state-disabled-opacity, 0.56);
cursor: not-allowed;
}
@media (prefers-reduced-motion: reduce) {
#sbr-floating-btn,
.sbr-floating-btn,
#sbr-modal,
.sbr-modal,
#sbr-close-btn,
.sbr-close-btn,
#sbr-submit-btn,
.sbr-submit-btn {
animation: none;
transition: none;
}
}
@media (max-width: 600px) {
#sbr-floating-btn,
.sbr-floating-btn {
--sbr-floating-size: max(var(--sdb-floating-action-size, 56px), var(--sdb-touch-target-min, 44px));
right: max(16px, env(safe-area-inset-right)) !important;
bottom: calc(20px + env(safe-area-inset-bottom)) !important;
width: var(--sbr-floating-size) !important;
inline-size: var(--sbr-floating-size) !important;
height: var(--sbr-floating-size) !important;
block-size: var(--sbr-floating-size) !important;
max-width: var(--sbr-floating-size) !important;
max-inline-size: var(--sbr-floating-size) !important;
overflow: hidden !important;
padding: 0 !important;
border-radius: 50% !important;
gap: 0 !important;
}
#sbr-floating-btn .sbr-text,
.sbr-floating-btn .sbr-text {
display: none !important;
}
#sbr-floating-btn.sbr-scrolled,
.sbr-floating-btn.sbr-scrolled {
right: max(74px, env(safe-area-inset-right)) !important;
}
#sbr-modal-overlay,
.sbr-modal-backdrop {
align-items: flex-end;
padding: 12px;
}
#sbr-modal,
.sbr-modal {
--sbr-modal-padding: 20px;
width: 100%;
max-height: calc(100vh - 24px - env(safe-area-inset-bottom));
}
}
@media (max-width: 380px) {
#sbr-modal,
.sbr-modal {
--sbr-modal-padding: 14px;
}
}#sacm-wrapper,
.sacm-privacy-page,
.sacm-iframe-placeholder {
--sacm-color-primary: var(--sdb-sys-color-primary, var(--sdb-color-primary, #0058b7));
--sacm-color-secondary: var(--sdb-sys-color-secondary, var(--sdb-color-secondary, #009bd8));
--sacm-color-title: var(--sdb-color-on-surface, var(--sdb-color-title, #364048));
--sacm-color-text: var(--sdb-color-on-surface-muted, var(--sdb-color-text, #6b7785));
--sacm-color-muted: var(--sdb-color-muted, #8e9aa7);
--sacm-color-border: var(--sdb-color-outline-variant, var(--sdb-color-border, #eef3f8));
--sacm-color-surface: var(--sdb-color-surface, #fff);
--sacm-color-surface-low: var(--sdb-color-surface-low, #fafcfe);
--sacm-color-background: var(--sdb-color-surface-high, var(--sdb-color-background, #f5f8fb));
--sacm-color-success: var(--sdb-color-success, #2f8f4e);
--sacm-font-body: var(--sdb-font-body, Archivo, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
--sacm-font-heading: var(--sdb-font-heading, "Neo Sans", Archivo, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
--sacm-radius-sm: var(--sdb-shape-sm, var(--sdb-radius-sm, 6px));
--sacm-radius-md: var(--sdb-shape-md, var(--sdb-radius-md, 10px));
--sacm-radius-lg: var(--sdb-shape-lg, var(--sdb-radius-lg, 16px));
--sacm-radius-pill: var(--sdb-shape-pill, var(--sdb-radius-pill, 999px));
--sacm-shadow-surface: var(--sdb-elevation-2, var(--sdb-shadow-card, 0 10px 24px rgba(31, 42, 54, .08)));
--sacm-shadow-modal: var(--sdb-elevation-4, 0 24px 60px rgba(31, 42, 54, .18));
--sacm-focus-ring: var(--sdb-state-focus-ring, 0 0 0 3px rgba(0, 155, 216, .22));
--sacm-motion-duration: var(--sdb-motion-duration-base, 180ms);
--sacm-motion-easing: var(--sdb-motion-easing-standard, cubic-bezier(.2, 0, 0, 1));
--sacm-choice-size: var(--sdb-choice-size, 16px);
--sacm-choice-gap: var(--sdb-choice-gap, .7rem);
--sacm-modal-width: var(--sdb-modal-width-md, 640px);
--sacm-modal-padding: var(--sdb-modal-padding, clamp(16px, 2.4vw, 24px));
font-family: var(--sacm-font-body);
}
#sacm-wrapper *,
#sacm-wrapper *::before,
#sacm-wrapper *::after,
.sacm-privacy-page,
.sacm-privacy-page *,
.sacm-privacy-page *::before,
.sacm-privacy-page *::after,
.sacm-iframe-placeholder,
.sacm-iframe-placeholder *,
.sacm-iframe-placeholder *::before,
.sacm-iframe-placeholder *::after { box-sizing: border-box; }
#sacm-wrapper button,
.sacm-privacy-page button,
.sacm-iframe-placeholder button { font-family: inherit; }
#sacm-wrapper a:focus-visible,
#sacm-wrapper button:focus-visible,
.sacm-privacy-page a:focus-visible,
.sacm-privacy-page button:focus-visible,
.sacm-iframe-placeholder button:focus-visible {
outline: 0;
box-shadow: var(--sacm-focus-ring);
}
#sacm-float-btn.sdb-consent-trigger {
position: fixed;
bottom: 20px;
left: 20px;
width: var(--sdb-floating-action-size, 56px);
height: var(--sdb-floating-action-size, 56px);
background: var(--sacm-color-primary);
color: var(--sdb-color-on-primary, #fff);
border-radius: 50%;
box-shadow: var(--sacm-shadow-surface);
cursor: pointer;
z-index: var(--sdb-floating-action-z-index, 999998);
border: 0;
display: none;
align-items: center;
justify-content: center;
padding: 0 !important;
transition: transform var(--sacm-motion-duration) var(--sacm-motion-easing), box-shadow var(--sacm-motion-duration) var(--sacm-motion-easing);
}
#sacm-float-btn:hover { transform: translateY(-1px); }
#sacm-float-btn svg { width: 22px !important; height: 22px !important; fill: currentColor; display: block; }
#sacm-banner.sdb-consent-banner {
position: fixed;
bottom: 30px;
left: 50%;
transform: translateX(-50%);
width: min(1000px, 90vw);
background: var(--sdb-consent-banner-bg, var(--sacm-color-surface));
color: var(--sacm-color-text);
border-radius: var(--sacm-radius-lg);
box-shadow: var(--sacm-shadow-surface);
z-index: 999999;
display: none;
padding: var(--sacm-modal-padding);
border: 1px solid var(--sacm-color-border);
}
#sacm-wrapper.sacm-layout-modal #sacm-banner.sdb-consent-banner {
top: 50%;
bottom: auto;
max-width: 720px;
transform: translate(-50%, -50%);
}
#sacm-wrapper.sacm-layout-side #sacm-banner.sdb-consent-banner {
right: 30px;
left: auto;
bottom: 30px;
transform: none;
max-width: 430px;
}
.sdb-consent-banner__inner { display: flex; flex-direction: column; gap: var(--sdb-space-md, 1.25rem); position: relative; }
.sdb-consent-banner__close,
.sdb-consent-panel__close {
background: transparent;
border: 0;
color: var(--sacm-color-muted);
cursor: pointer;
line-height: 1;
border-radius: var(--sacm-radius-sm);
}
.sdb-consent-banner__close { position: absolute; top: -12px; right: -8px; font-size: 26px; padding: 6px; }
.sdb-consent-banner__close:hover,
.sdb-consent-panel__close:hover { color: var(--sacm-color-title); background: var(--sdb-state-hover-bg, rgba(0, 88, 183, .06)); }
.sdb-consent-banner__header { display: flex; gap: 15px; align-items: flex-start; padding-right: 22px; }
.sdb-consent-banner__icon { color: var(--sacm-color-primary); width: 32px; height: 32px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.sdb-consent-banner__icon svg { width: 32px !important; height: 32px !important; fill: currentColor; }
.sdb-consent-banner__content h3 { margin: 0 0 8px; font-family: var(--sacm-font-heading); font-size: var(--sdb-type-title-md-size, 1.125rem); line-height: var(--sdb-type-title-md-line-height, 1.3); color: var(--sacm-color-title); font-weight: var(--sdb-font-weight-bold, 700); }
.sdb-consent-banner__content p { margin: 0; font-size: var(--sdb-type-body-sm-size, .925rem); color: var(--sacm-color-text); line-height: 1.55; }
.sdb-consent-banner__actions { display: flex; gap: 10px; justify-content: flex-end; align-items: center; flex-wrap: wrap; }
.sdb-consent-banner__links { margin-right: auto; font-size: .8125rem; line-height: 1.4; }
.sdb-consent-banner__links a { color: var(--sacm-color-primary); text-decoration: none; margin-right: 15px; font-weight: var(--sdb-font-weight-semibold, 600); }
.sdb-consent-banner__links a:hover,
.sdb-consent-banner__links a:focus-visible { text-decoration: underline; }
#sacm-wrapper .sacm-btn,
.sacm-privacy-page .sacm-btn,
.sacm-iframe-placeholder .sacm-btn {
min-height: var(--sdb-touch-target-min, 44px);
padding: 10px 22px;
border-radius: var(--sacm-radius-md);
font-weight: var(--sdb-font-weight-semibold, 600);
font-size: var(--sdb-type-label-md-size, .875rem);
cursor: pointer;
transition: transform var(--sacm-motion-duration) var(--sacm-motion-easing), box-shadow var(--sacm-motion-duration) var(--sacm-motion-easing), background var(--sacm-motion-duration) var(--sacm-motion-easing), border-color var(--sacm-motion-duration) var(--sacm-motion-easing);
text-align: center;
text-decoration: none;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid transparent;
line-height: 1.2;
}
#sacm-wrapper .sacm-btn:hover,
.sacm-privacy-page .sacm-btn:hover,
.sacm-iframe-placeholder .sacm-btn:hover { transform: translateY(-1px); }
#sacm-wrapper .sacm-btn-primary,
.sacm-privacy-page .sacm-btn-primary,
.sacm-iframe-placeholder .sacm-btn-primary { background: var(--sdb-sem-color-action-primary-bg, var(--sacm-color-primary)); color: var(--sdb-sem-color-action-primary-text, #fff); border-color: var(--sacm-color-primary); }
#sacm-wrapper .sacm-btn-secondary,
.sacm-privacy-page .sacm-btn-secondary { background: var(--sacm-color-surface); color: var(--sacm-color-primary); border-color: var(--sacm-color-primary); }
#sacm-wrapper .sacm-btn-outline,
.sacm-privacy-page .sacm-btn-outline { background: transparent; color: var(--sacm-color-title); border-color: var(--sacm-color-muted); }
#sacm-wrapper .sacm-btn-primary:hover,
.sacm-privacy-page .sacm-btn-primary:hover,
.sacm-iframe-placeholder .sacm-btn-primary:hover { box-shadow: var(--sdb-elevation-1, 0 4px 12px rgba(31,42,54,.05)); }
#sacm-wrapper .sacm-btn-secondary:hover,
#sacm-wrapper .sacm-btn-outline:hover,
.sacm-privacy-page .sacm-btn-secondary:hover,
.sacm-privacy-page .sacm-btn-outline:hover { background: var(--sdb-state-hover-bg, rgba(0, 88, 183, .06)); }
#sacm-wrapper.sacm-modal-is-open #sacm-banner.sdb-consent-banner {
display: none !important;
}
#sacm-modal[aria-hidden="true"] {
display: none !important;
}
#sacm-modal[aria-hidden="false"].sdb-modal-backdrop.sdb-consent-panel {
display: flex !important;
}
#sacm-modal.sdb-modal-backdrop.sdb-consent-panel {
display: none;
position: fixed !important;
inset: 0 !important;
width: 100vw;
min-height: 100vh;
background: var(--sdb-modal-backdrop-bg, rgba(31, 42, 54, .64));
backdrop-filter: blur(2px);
z-index: var(--sdb-modal-z-index, 9999999);
align-items: center;
justify-content: center;
padding: 16px;
}
.sdb-consent-panel__card.sdb-modal {
background: var(--sacm-color-surface);
color: var(--sacm-color-text);
width: min(var(--sacm-modal-width), 95vw);
border-radius: var(--sacm-radius-lg);
box-shadow: var(--sacm-shadow-modal);
display: flex;
flex-direction: column;
max-height: 90vh;
border: 1px solid var(--sacm-color-border);
overflow: hidden;
} #sacm-wrapper #sacm-modal .sacm-modal-card.sdb-modal {
position: relative !important;
inset: auto !important;
top: auto !important;
right: auto !important;
bottom: auto !important;
left: auto !important;
transform: none !important;
margin: auto !important;
max-width: 95vw !important;
min-height: 0 !important;
height: auto !important;
padding: 0 !important;
box-sizing: border-box;
}
.sdb-consent-panel__header { padding: var(--sacm-modal-padding); border-bottom: 1px solid var(--sacm-color-border); display: flex; justify-content: space-between; align-items: center; }
.sdb-consent-panel__title h2 { font-family: var(--sacm-font-heading); font-size: var(--sdb-type-title-md-size, 1.125rem); margin: 0; color: var(--sacm-color-title); line-height: var(--sdb-type-title-md-line-height, 1.3); }
.sdb-consent-panel__close { font-size: 26px; padding: 4px 8px; }
.sdb-consent-panel__body { padding: 0; overflow-y: auto; }
.sdb-consent-category { border-bottom: 1px solid var(--sacm-color-border); padding: var(--sdb-consent-padding, clamp(13px, 1.8vw, 18px)); display: flex; flex-direction: column; }
.sdb-consent-category--last { border-bottom: 0; }
.sdb-consent-category__row { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; width: 100%; }
.sdb-consent-category__content { flex: 1; min-width: 0; }
.sdb-consent-category__title { font-family: var(--sacm-font-heading); font-weight: var(--sdb-font-weight-bold, 700); color: var(--sacm-color-title); font-size: .95rem; margin-bottom: 5px; }
.sdb-consent-category__description { font-size: .85rem; color: var(--sacm-color-text); line-height: 1.45; }
.sdb-consent-category__details-toggle { color: var(--sacm-color-primary); font-size: .8125rem; font-weight: var(--sdb-font-weight-bold, 700); cursor: pointer; margin-top: 8px; display: inline-block; background: none; border: 0; padding: 2px 0; border-radius: var(--sacm-radius-sm); }
.sdb-consent-category__details-toggle:hover,
.sdb-consent-category__details-toggle:focus-visible { text-decoration: underline; }
.sdb-cookie-list.sacm-cookie-list-details { margin-top: 15px; padding: 15px; background: var(--sacm-color-background); border-radius: var(--sacm-radius-md); font-size: .8rem; color: var(--sacm-color-text); border: 1px solid var(--sacm-color-border); }
.sdb-cookie-list__item { margin-bottom: 8px; border-bottom: 1px dashed var(--sacm-color-border); padding-bottom: 8px; }
.sdb-cookie-list__item:last-child { margin-bottom: 0; border-bottom: 0; padding-bottom: 0; }
.sdb-cookie-list__item strong { color: var(--sacm-color-title); font-size: .85rem; }
.sacm-locked-wrap { text-align: right; }
.sdb-consent-toggle { position: relative; display: inline-block; width: 44px; height: 24px; flex-shrink: 0; margin-top: 2px; }
.sdb-consent-toggle input { opacity: 0; width: 0; height: 0; }
.sdb-consent-toggle__control { position: absolute; cursor: pointer; inset: 0; background-color: var(--sacm-color-muted); transition: background-color var(--sacm-motion-duration) var(--sacm-motion-easing); border-radius: var(--sacm-radius-pill); }
.sdb-consent-toggle__control::before { position: absolute; content: ""; height: 18px; width: 18px; left: 3px; bottom: 3px; background-color: #fff; transition: transform var(--sacm-motion-duration) var(--sacm-motion-easing); border-radius: 50%; box-shadow: 0 1px 3px rgba(0,0,0,.2); }
.sdb-consent-toggle input:checked + .sdb-consent-toggle__control { background-color: var(--sdb-state-checked-bg, var(--sacm-color-primary)); }
.sdb-consent-toggle input:checked + .sdb-consent-toggle__control::before { transform: translateX(20px); }
.sdb-consent-toggle input:focus-visible + .sdb-consent-toggle__control { box-shadow: var(--sacm-focus-ring); }
.sdb-consent-toggle input:disabled + .sdb-consent-toggle__control { opacity: var(--sdb-state-disabled-opacity, .56); cursor: not-allowed; }
.sdb-consent-toggle { background: none !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; -webkit-appearance: none; appearance: none; }
.sdb-consent-toggle::before,
.sdb-consent-toggle::after,
.sdb-consent-toggle__control::after { content: none !important; display: none !important; }
.sdb-consent-toggle__control { background-image: none !important; box-sizing: border-box; }
.sdb-consent-toggle__control::before { right: auto; top: 3px; }
.sdb-consent-toggle input:not(:checked) + .sdb-consent-toggle__control { background-color: var(--sdb-state-off-bg, var(--sacm-color-muted)); }
.sdb-consent-toggle input:not(:checked) + .sdb-consent-toggle__control::before { transform: translateX(0); }
.sdb-consent-toggle input:checked + .sdb-consent-toggle__control::before { transform: translateX(20px); }
.sdb-consent-toggle__locked { display: inline-flex; align-items: center; min-height: 24px; font-size: .75rem; font-weight: var(--sdb-font-weight-bold, 700); color: var(--sacm-color-success); text-transform: uppercase; letter-spacing: .04em; }
.sdb-consent-panel__footer { padding: var(--sacm-modal-padding); border-top: 1px solid var(--sacm-color-border); display: flex; justify-content: space-between; align-items: center; background: var(--sdb-surface-subtle, var(--sacm-color-background)); margin: 0 !important; width: 100%; box-sizing: border-box; }
.sdb-consent-panel__secondary-actions { display: flex; gap: 10px; }
.sacm-hidden { display: none !important; }
#sacm-wrapper.sacm-layout-side .sdb-consent-banner__actions { justify-content: stretch; }
#sacm-wrapper.sacm-layout-side .sdb-consent-banner__actions button { width: 100%; }
#sacm-wrapper.sacm-layout-side .sdb-consent-banner__links { width: 100%; margin: 0 0 8px; }
.sacm-privacy-page.sdb-privacy-surface {
border: 1px solid var(--sacm-color-border);
border-radius: var(--sacm-radius-lg);
padding: var(--sdb-confirmation-padding, clamp(18px, 2.5vw, 28px));
background: var(--sdb-privacy-surface-bg, var(--sacm-color-surface));
color: var(--sacm-color-text);
box-shadow: var(--sdb-elevation-1, 0 4px 12px rgba(31,42,54,.05));
}
.sacm-privacy-page h2,
.sacm-privacy-page h3 { font-family: var(--sacm-font-heading); color: var(--sacm-color-title); }
.sacm-public-cookie-table { overflow-x: auto; margin-top: 18px; }
.sacm-public-cookie-table table { width: 100%; min-width: 720px; border-collapse: separate; border-spacing: 0; font-size: .875rem; border: 1px solid var(--sacm-color-border); border-radius: var(--sacm-radius-md); overflow: hidden; }
.sacm-public-cookie-table th,
.sacm-public-cookie-table td { border-bottom: 1px solid var(--sacm-color-border); padding: 12px; text-align: left; vertical-align: top; }
.sacm-public-cookie-table th { background: var(--sacm-color-background); color: var(--sacm-color-title); font-weight: var(--sdb-font-weight-bold, 700); }
.sacm-public-cookie-table tr:last-child td { border-bottom: 0; }
.sacm-iframe-placeholder.sdb-sensitive-panel {
border: 1px solid var(--sacm-color-border);
border-radius: var(--sacm-radius-lg);
background: var(--sdb-sensitive-bg, #f8fbff);
padding: var(--sdb-consent-padding, 18px);
text-align: center;
}
.sacm-iframe-placeholder__box { max-width: 520px; margin: 0 auto; }
.sacm-iframe-placeholder__title { margin: 0 0 6px; color: var(--sacm-color-title); font-weight: var(--sdb-font-weight-bold, 700); }
.sacm-iframe-placeholder__text { margin: 0 0 16px; color: var(--sacm-color-text); font-size: .875rem; }
@media (max-width: 600px) {
#sacm-banner.sdb-consent-banner { bottom: 0; width: 100%; max-width: none; border-radius: var(--sacm-radius-lg) var(--sacm-radius-lg) 0 0; }
#sacm-wrapper.sacm-layout-side #sacm-banner.sdb-consent-banner { right: 0; left: 0; bottom: 0; max-width: none; }
.sdb-consent-banner__header { flex-direction: column; gap: 10px; }
.sdb-consent-banner__actions { justify-content: space-between; width: 100%; gap: 10px; }
.sdb-consent-banner__actions button { flex: 1 1 100%; }
.sdb-consent-banner__links { width: 100%; text-align: center; margin-bottom: 10px; }
.sdb-consent-category__row { gap: 12px; }
.sdb-consent-panel__footer { flex-direction: column-reverse; gap: 15px; }
.sdb-consent-panel__secondary-actions { width: 100%; display: flex; flex-direction: column; }
.sdb-consent-panel__footer button { width: 100%; }
.sacm-public-cookie-table table { min-width: 640px; }
}
@media (prefers-reduced-motion: reduce) {
#sacm-wrapper *,
.sacm-privacy-page *,
.sacm-iframe-placeholder * { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
@media (max-width: 640px) {
.sdb-consent-panel__footer { flex-direction: column; align-items: stretch; gap: 12px; }
.sdb-consent-panel__secondary-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sdb-consent-panel__footer > .sdb-btn { width: 100%; }
} #sacm-wrapper #sacm-modal.sdb-modal-backdrop.sdb-consent-panel {
padding: clamp(16px, 3vw, 32px) !important;
background: var(--sdb-modal-backdrop-bg, rgba(31, 42, 54, .68));
backdrop-filter: blur(3px);
}
#sacm-wrapper #sacm-modal .sacm-modal-card.sdb-modal {
width: min(640px, calc(100vw - 32px)) !important;
max-height: min(90vh, calc(100dvh - 32px)) !important;
border-radius: var(--sdb-radius-lg, var(--sacm-radius-lg));
overflow: hidden !important;
padding: 0 !important;
background: var(--sdb-color-surface, #fff);
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__header {
padding: clamp(22px, 3vw, 32px) clamp(24px, 3.4vw, 36px) clamp(18px, 2.5vw, 26px);
align-items: flex-start;
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__title h2 {
font-size: clamp(1.9rem, 3vw, 2.45rem);
line-height: 1.12;
letter-spacing: -0.025em;
color: var(--sdb-color-primary, var(--sacm-color-primary));
font-weight: var(--sdb-font-weight-bold, 700);
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__close {
margin-top: 2px;
width: 38px;
height: 38px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: var(--sdb-radius-pill, 999px);
color: var(--sdb-color-muted, var(--sacm-color-muted));
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__body {
flex: 1 1 auto;
min-height: 0;
padding-inline: clamp(18px, 2.8vw, 28px);
overflow-y: auto;
scrollbar-gutter: stable;
}
#sacm-wrapper #sacm-modal .sdb-consent-category {
padding: clamp(15px, 2.2vw, 20px) 0;
}
#sacm-wrapper #sacm-modal .sdb-consent-category__row {
align-items: center;
gap: clamp(14px, 2vw, 24px);
}
#sacm-wrapper #sacm-modal .sdb-consent-category__title {
font-size: 1rem;
line-height: 1.3;
margin-bottom: 7px;
}
#sacm-wrapper #sacm-modal .sdb-consent-category__description {
max-width: 50rem;
font-size: .92rem;
line-height: 1.55;
}
#sacm-wrapper #sacm-modal .sdb-consent-category__details-toggle {
margin-top: 10px;
color: var(--sdb-color-primary, var(--sacm-color-primary));
}
#sacm-wrapper #sacm-modal .sacm-locked-wrap,
#sacm-wrapper #sacm-modal .sacm-switch {
margin-left: auto;
} #sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle {
position: relative !important;
display: inline-flex !important;
width: 48px !important;
height: 28px !important;
flex: 0 0 48px !important;
margin-top: 0 !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
cursor: pointer;
line-height: 1;
-webkit-appearance: none !important;
appearance: none !important;
}
#sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle::before,
#sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle::after {
content: none !important;
display: none !important;
}
#sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle input {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
margin: 0 !important;
opacity: 0 !important;
z-index: 2;
cursor: pointer;
-webkit-appearance: none !important;
appearance: none !important;
}
#sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle .sacm-slider.sdb-consent-toggle__control {
position: absolute !important;
inset: 0 !important;
display: block !important;
width: 48px !important;
height: 28px !important;
border-radius: var(--sdb-radius-pill, 999px) !important;
background: var(--sdb-color-muted, #8E9AA7) !important;
border: 1px solid rgba(31, 42, 54, .08) !important;
box-shadow: inset 0 1px 2px rgba(31, 42, 54, .12) !important;
background-image: none !important;
pointer-events: none;
transition: background-color var(--sacm-motion-duration) var(--sacm-motion-easing), border-color var(--sacm-motion-duration) var(--sacm-motion-easing);
}
#sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle .sacm-slider.sdb-consent-toggle__control::before {
content: "" !important;
position: absolute !important;
top: 3px !important;
left: 3px !important;
right: auto !important;
bottom: auto !important;
display: block !important;
width: 22px !important;
height: 22px !important;
border-radius: 50% !important;
background: #fff !important;
box-shadow: 0 2px 5px rgba(31, 42, 54, .22) !important;
transform: translateX(0) !important;
transition: transform var(--sacm-motion-duration) var(--sacm-motion-easing);
}
#sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle .sacm-slider.sdb-consent-toggle__control::after {
content: none !important;
display: none !important;
}
#sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle input:checked + .sacm-slider.sdb-consent-toggle__control {
background: var(--sdb-state-checked-bg, var(--sdb-color-primary, var(--sacm-color-primary))) !important;
border-color: var(--sdb-state-checked-border, var(--sdb-color-primary, var(--sacm-color-primary))) !important;
}
#sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle input:checked + .sacm-slider.sdb-consent-toggle__control::before {
transform: translateX(20px) !important;
}
#sacm-wrapper #sacm-modal .sacm-switch.sdb-consent-toggle input:focus-visible + .sacm-slider.sdb-consent-toggle__control {
box-shadow: var(--sdb-state-focus-ring, var(--sacm-focus-ring)), inset 0 1px 2px rgba(31, 42, 54, .12) !important;
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__footer {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px;
width: 100% !important;
margin: 0 !important;
padding: clamp(18px, 2.7vw, 24px) clamp(24px, 3.4vw, 36px) !important;
background: var(--sdb-color-surface-high, var(--sacm-color-background));
border-top: 1px solid var(--sdb-color-outline-variant, var(--sacm-color-border));
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__secondary-actions {
display: contents !important;
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__footer .sacm-btn {
width: 100%;
min-height: 44px;
padding-inline: 14px;
white-space: nowrap;
}
#sacm-wrapper #sacm-modal #sacm-modal-save {
background: var(--sdb-color-surface, #fff);
border-color: var(--sdb-color-outline-variant, var(--sacm-color-border));
color: var(--sdb-color-on-surface-muted, var(--sacm-color-text));
}
@media (max-width: 640px) {
#sacm-wrapper #sacm-modal.sdb-modal-backdrop.sdb-consent-panel {
align-items: flex-end;
padding: 12px;
}
#sacm-wrapper #sacm-modal .sacm-modal-card.sdb-modal {
width: 100% !important;
max-width: none !important;
max-height: calc(100dvh - 24px) !important;
border-radius: var(--sdb-radius-lg, 16px);
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__header {
padding: 22px 22px 16px;
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__title h2 {
font-size: clamp(1.55rem, 7vw, 2rem);
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__body {
padding-inline: 20px;
}
#sacm-wrapper #sacm-modal .sdb-consent-category__row {
align-items: flex-start;
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__footer {
grid-template-columns: 1fr;
padding: 16px 20px 20px !important;
}
#sacm-wrapper #sacm-modal .sdb-consent-panel__secondary-actions {
display: contents !important;
}
}