:root {
    --wcag-button-color: #007bff;
    --wcag-contast-yellow: #FFEE00;
}

.wcag-settings .wcag-button {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 3rem;
    height: 3rem;
    background-color: var(--wcag-button-color);
    color: #fff;
    border-radius: 50%;
    box-shadow: none;
    cursor: pointer;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: 0.2rem solid var(--wcag-button-color);
    outline-offset: 0.15rem;
    transition: transform 0.3s ease-in-out;
    border: none;
}

.wcag-settings .wcag-button:hover {
    transform: scale(1.2);
}

.wcag-settings .wcag-button:focus {
    background-color: #fff;
    color: var(--wcag-button-color);
    outline: 0.25rem solid var(--wcag-button-color);
    outline-offset: 0.2rem;
}

.wcag-settings .wcag-button i {
    font-size: 2rem;
}

.wcag-settings.wcag-settings-dialog {
    width: auto;
}

.wcag-settings.wcag-settings-dialog .rz-dialog-side-content {
    width: 100%;
}

.wcag-settings .rz-toggle-button {
    padding: .5rem 0.1rem;
}

.wcag-settings .rz-toggle-button span.toggle-button-text {
    font-size: 0.6rem;
}

html.wcag-high-contrast {
    --rz-white: #000;
    --rz-black: #000;
    --rz-base-50: var(--wcag-contast-yellow);
    --rz-base-100: var(--wcag-contast-yellow);
    --rz-base-200: var(--wcag-contast-yellow);
    --rz-base-300: var(--wcag-contast-yellow);
    --rz-base-400: var(--wcag-contast-yellow);
    --rz-base-500: var(--wcag-contast-yellow);
    --rz-base-600: var(--wcag-contast-yellow);
    --rz-base-700: var(--wcag-contast-yellow);
    --rz-base-800: var(--wcag-contast-yellow);
    --rz-base-900: var(--wcag-contast-yellow);
    --rz-primary: var(--wcag-contast-yellow);
    --rz-primary-light: var(--wcag-contast-yellow);
    --rz-primary-lighter: var(--wcag-contast-yellow);
    --rz-primary-dark: var(--wcag-contast-yellow);
    --rz-primary-darker: var(--wcag-contast-yellow);
    --rz-secondary: var(--wcag-contast-yellow);
    --rz-secondary-light: var(--wcag-contast-yellow);
    --rz-secondary-lighter: var(--wcag-contast-yellow);
    --rz-secondary-dark: var(--wcag-contast-yellow);
    --rz-secondary-darker: var(--wcag-contast-yellow);
    --rz-info: var(--wcag-contast-yellow);
    --rz-info-light: var(--wcag-contast-yellow);
    --rz-info-lighter: var(--wcag-contast-yellow);
    --rz-info-dark: var(--wcag-contast-yellow);
    --rz-info-darker: var(--wcag-contast-yellow);
    --rz-success: var(--wcag-contast-yellow);
    --rz-success-light: var(--wcag-contast-yellow);
    --rz-success-lighter: var(--wcag-contast-yellow);
    --rz-success-dark: var(--wcag-contast-yellow);
    --rz-success-darker: var(--wcag-contast-yellow);
    --rz-warning: var(--wcag-contast-yellow);
    --rz-warning-light: var(--wcag-contast-yellow);
    --rz-warning-lighter: var(--wcag-contast-yellow);
    --rz-warning-dark: var(--wcag-contast-yellow);
    --rz-warning-darker: var(--wcag-contast-yellow);
    --rz-danger: var(--wcag-contast-yellow);
    --rz-danger-light: var(--wcag-contast-yellow);
    --rz-danger-lighter: var(--wcag-contast-yellow);
    --rz-danger-dark: var(--wcag-contast-yellow);
    --rz-danger-darker: var(--wcag-contast-yellow);
    --rz-on-primary: #000;
    --rz-on-primary-light: #000;
    --rz-on-primary-lighter: #000;
    --rz-on-primary-dark: #000;
    --rz-on-primary-darker: #000;
    --rz-on-secondary: #000;
    --rz-on-secondary-light: #000;
    --rz-on-secondary-lighter: #000;
    --rz-on-secondary-dark: #000;
    --rz-on-secondary-darker: #000;
    --rz-on-info: #000;
    --rz-on-info-light: #000;
    --rz-on-info-lighter: #000;
    --rz-on-info-dark: #000;
    --rz-on-info-darker: #000;
    --rz-on-success: #000;
    --rz-on-success-light: #000;
    --rz-on-success-lighter: #000;
    --rz-on-success-dark: #000;
    --rz-on-success-darker: #000;
    --rz-on-warning: #000;
    --rz-on-warning-light: #000;
    --rz-on-warning-lighter: #000;
    --rz-on-warning-dark: #000;
    --rz-on-warning-darker: #000;
    --rz-on-danger: #000;
    --rz-on-danger-light: #000;
    --rz-on-danger-lighter: #000;
    --rz-on-danger-dark: #000;
    --rz-on-danger-darker: #000;
    --rz-series-1: var(--wcag-contast-yellow);
    --rz-series-2: var(--wcag-contast-yellow);
    --rz-series-3: var(--wcag-contast-yellow);
    --rz-series-4: var(--wcag-contast-yellow);
    --rz-series-5: var(--wcag-contast-yellow);
    --rz-series-6: var(--wcag-contast-yellow);
    --rz-series-7: var(--wcag-contast-yellow);
    --rz-series-8: var(--wcag-contast-yellow);
    --rz-series-9: var(--wcag-contast-yellow);
    --rz-series-10: var(--wcag-contast-yellow);
    --rz-series-11: var(--wcag-contast-yellow);
    --rz-series-12: var(--wcag-contast-yellow);
    --rz-series-13: var(--wcag-contast-yellow);
    --rz-series-14: var(--wcag-contast-yellow);
    --rz-series-15: var(--wcag-contast-yellow);
    --rz-series-16: var(--wcag-contast-yellow);
    --rz-series-17: var(--wcag-contast-yellow);
    --rz-series-18: var(--wcag-contast-yellow);
    --rz-series-19: var(--wcag-contast-yellow);
    --rz-series-20: var(--wcag-contast-yellow);
    --rz-series-21: var(--wcag-contast-yellow);
    --rz-series-22: var(--wcag-contast-yellow);
    --rz-series-23: var(--wcag-contast-yellow);
    --rz-series-24: var(--wcag-contast-yellow);
    --bs-body-color: var(--wcag-contast-yellow);
    --rz-form-field-label-focus-color: #000;
    --rz-input-focus-border: #000;
    --rz-dropdown-item-hover-background-color: #000;
    --rz-dropdown-item-hover-color: var(--wcag-contast-yellow);
    --rz-layout-background-color: #000;
    --rz-slider-background-color: #000;
    --rz-slider-range-background-color: var(--wcag-contast-yellow);
    --rz-slider-handle-hover-background-color: var(--wcag-contast-yellow);
    --rz-slider-handle-background-color: var(--wcag-contast-yellow);
}

html.wcag-high-contrast .rz-dropdown-clear-icon {
    opacity: 1;
}

html.wcag-high-contrast .rz-autocomplete-items, .rz-multiselect-items, .rz-dropdown-items {
    border: 1px solid var(--wcag-contast-yellow);
}

html.wcag-high-contrast .hero-text {
    background: #000;
    color: var(--wcag-contast-yellow);;
}

html.wcag-high-contrast .valid.modified:not([type=checkbox]) {
    outline: var(--wcag-contast-yellow);
}

html.wcag-high-contrast .invalid {
    outline: var(--wcag-contast-yellow);
}

html.wcag-high-contrast .validation-message {
    color: var(--wcag-contast-yellow);
}

html.wcag-high-contrast .rz-form-field-content > :not(:disabled):not(.rz-state-disabled):focus-within, .rz-form-field-content input:not(:disabled):not(.rz-state-disabled):focus-within, .rz-form-field-content .rz-inputtext:not(:disabled):not(.rz-state-disabled):focus-within {
    border: 1px solid #fff;
    box-shadow: none;
}

html.wcag-high-contrast .wcag-settings .wcag-button, html.wcag-high-contrast .wcag-settings .wcag-button:hover, html.wcag-high-contrast .wcag-settings .wcag-button:focus {
    background-color: #000;
    color: var(--wcag-contast-yellow);;
    outline-color: var(--wcag-contast-yellow);
}

html.wcag-links-highlighted a {
    border: none;
    outline: 2px solid #ff0000;
    outline-offset: 2px;
}

html.wcag-links-highlighted a:hover,
html.wcag-links-highlighted a:focus {
    outline: 2px dashed #ff0000;
    outline-offset: 2px;
}

html.wcag-links-highlighted button {
    border: none;
    outline: 2px solid #ff0000;
    outline-offset: 2px;
}

html.wcag-links-highlighted button:hover,
html.wcag-links-highlighted button:focus {
    outline: 2px dashed #ff0000;
    outline-offset: 2px;
}