.klaro {
    --border-radius: 3px;
    --border-width: 2px;
    --font-size: 14px;
    --font-family: Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --title-font-family: Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --button-text-color: #fff;
    --dark1: #fff;
    --dark2: #bc1414;
    --dark3: #666;
    --light1: #000;
    --light2: #f0f0f0;
    --light3: #666;
    --green1: #bc1414;
    --green2: #8d1010;
    --green3: rgba(188, 20, 20, 0.35);
    --blue1: #000;
    --blue2: #bc1414;
    --blue3: #bc1414;
    --notice-max-width: min(34rem, calc(100vw - 2rem));
}

.klaro .cookie-modal .cm-modal.cm-klaro {
    border: 2px solid #bc1414;
    border-radius: 3px;
    box-shadow: 0 2rem 4rem rgba(0, 0, 0, 0.2);
}

.klaro .cookie-modal .cm-modal .cm-header,
.klaro .cookie-modal .cm-modal .cm-body,
.klaro .cookie-modal .cm-modal .cm-footer {
    background: #fff;
}

.klaro .cookie-modal .cm-modal .cm-header {
    padding: 1.5rem 1.5rem 1rem;
}

.klaro .cookie-modal .cm-modal .cm-header h1,
.klaro .cookie-modal .cm-modal .cm-header h2 {
    font-size: clamp(1.5rem, 2vw, 2rem);
    line-height: 1.1;
}

.klaro .cookie-modal .cm-modal .cm-body {
    padding: 1rem 1.5rem 1.5rem;
}

.klaro .cookie-modal .cm-modal .cm-footer {
    padding: 1rem 1.5rem 1.5rem;
}

.klaro .cookie-modal .cm-modal .cm-footer-buttons {
    gap: 0.75rem;
    flex-wrap: wrap;
}

.klaro .cm-btn {
    min-height: 2.75rem;
    padding: 0.5rem 1.5rem;
    border: 1px solid transparent;
    border-radius: 3px;
    font-weight: 500;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.klaro .cm-btn:hover,
.klaro .cm-btn:focus-visible {
    background: #8d1010;
    color: #fff;
    outline: none;
}

.klaro .cm-btn.cm-btn-close {
    border-color: #000;
    background: #fff;
    color: #000;
}

.klaro .cm-btn.cm-btn-close:hover,
.klaro .cm-btn.cm-btn-close:focus-visible {
    border-color: #bc1414;
    color: #bc1414;
    background: #fff;
}

.klaro .cm-btn.cm-btn-success-var,
.klaro .cm-btn.cm-btn-info {
    background: #000;
}

.klaro .cookie-notice {
    border: 0;
    border-radius: 3px;
    background: #000;
    box-shadow: 0 0 0 2px #f0f0f0, 0 1.25rem 2.5rem rgba(0, 0, 0, 0.25);
}

.klaro .cookie-notice h1,
.klaro .cookie-notice h2,
.klaro .cookie-notice a {
    color: #bc1414;
}

.klaro .cookie-notice p,
.klaro .cookie-notice li,
.klaro .cookie-notice strong,
.klaro .cookie-notice p{
    color: #000;
}

.klaro .cookie-notice a:hover,
.klaro .cookie-notice a:focus-visible {
    color: #bc1414;
}

.klaro .cookie-notice .cm-btn.cm-btn-close {
    border-color: rgba(255, 255, 255, 0.75);
    background: transparent;
    color: #fff;
}

.klaro .cookie-notice .cm-btn.cm-btn-close:hover,
.klaro .cookie-notice .cm-btn.cm-btn-close:focus-visible {
    border-color: #bc1414;
    color: #bc1414;
}

.klaro .cm-list-title,
.klaro .cm-purpose-title {
    font-weight: 600;
}

.klaro .cm-list-description,
.klaro .cm-purpose-desc,
.klaro .cm-powered-by,
.klaro .cm-cookie-data {
    color: #666;
}

.klaro .cm-powered-by a,
.klaro .cm-modal a,
.klaro .context-notice a {
    color: #bc1414;
}

.klaro .cm-powered-by a:hover,
.klaro .cm-powered-by a:focus-visible,
.klaro .cm-modal a:hover,
.klaro .cm-modal a:focus-visible,
.klaro .context-notice a:hover,
.klaro .context-notice a:focus-visible {
    color: #8d1010;
}

.klaro .slider,
.klaro .slider:before {
    transition-duration: 0.2s;
}

.klaro-settings-btn {
    position: fixed;
    bottom: 1rem;
    left: 1rem;
    z-index: 998;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 50%;
    background: #fff;
    color: #000;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.klaro-settings-btn:hover,
.klaro-settings-btn:focus-visible {
    background: #bc1414;
    color: #fff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    outline: none;
}

@media (max-width: 767.98px) {
    .klaro .cookie-modal .cm-modal.cm-klaro {
        width: calc(100vw - 1rem);
    }

    .klaro .cookie-notice {
        max-width: calc(100vw - 1rem);
    }

    .klaro .cookie-modal .cm-modal .cm-header,
    .klaro .cookie-modal .cm-modal .cm-body,
    .klaro .cookie-modal .cm-modal .cm-footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}
