/* Cookie bar */
#cookie-banner-container { position: fixed; z-index: 101; width: 100%; max-width: 400px; bottom: 0; transition: opacity 1.5s ease; opacity: 0; visibility: hidden; display: flex; flex-direction: column-reverse; }
#cookie-banner-container.active { visibility: visible; opacity: 1; }
#cookie-inner-container { box-shadow: 0 -5px 55px 0 rgb(255 255 255 / 33%); }
#banner-button-wrapper {display: flex;flex-direction: row;align-items: center;margin-top: 20px;}
#cookie-banner-container #banner-button-settings { border: 0; margin-top: 12px; margin-top: 5px; background: transparent !IMPORTANT; outline: none; box-shadow: none; }
#cookie-banner-container a { color: #ffffff; }
#cookie-banner-container a:hover { color: #FDCC62; }

/* Cookie modal */
#modal-settings-wrapper { visibility: hidden; opacity: 0; transition: opacity 1s ease; position: relative; }
#modal-settings-wrapper.active { visibility: visible; opacity: 1; }
#modal-sub-wrapper-cookie { max-height: 520px; overflow-y: scroll; padding-right: 25px; }
#tab-button-wrapper button.active-button { background: #F2F2F2 !important; color: #e63329; border-color: #e63329; outline: none !important; }

#modal-sub-wrapper-cookie::-webkit-scrollbar { width: 3px; }
#modal-sub-wrapper-cookie::-webkit-scrollbar-track { background-color: #334048; }
#modal-sub-wrapper-cookie::-webkit-scrollbar-thumb { background-color: #fdcc62; }
#modal-body { overflow: hidden; position: relative; }
#tab-button-wrapper { max-width: 100%; }
.csm-tab { align-items: flex-end; display: flex; justify-content: space-between; position: relative; }
.csm-description { display: none; margin-top: 20px; }
.active-tab .csm-description { display: block; }

#tab-button-wrapper button { padding: 18px 20px 18px 0; width: calc(100% - 60px); border: 0; outline: none; border-radius: 0; text-align: left; position: relative; margin-bottom: 4px; background: transparent; display: inline-block; }
#tab-button-wrapper #modal-tab-performance-button { border: 0 }
#tab-button-wrapper button:after { content: ''; width: 0; height: 0; margin-left: 15px; transition: transform .6s ease; border: solid #fdcc62; border-width: 0 2px 2px 0; display: inline-block; padding: 5px; transform: rotate(45deg); -webkit-transform: rotate(45deg); margin-right: 10px; }
#tab-button-wrapper button.active:after { transform: rotate(225deg) translate(-4px, -2px); }
#tab-button-wrapper button:hover,
#tab-button-wrapper button.active { background: transparent; color: #f6b85e; border: 0; box-shadow: none; }
#tab-button-wrapper button.active-button:after { transform: rotate(180deg) }
#tab-content-wrapper { display: inline-block; max-width: 70%; margin-left: 6%; height: 100%; overflow-y: auto; padding-right: 22px; max-height: 260px; }

.modal-tab-title { display: none; }
.cookies-used-header { font-weight: 600; }
#modal-sub-wrapper-cookie .accordion-header { display: flex; border-bottom: 1px solid #999; }

.csm-switch { position: relative; width: 60px; height: 30px; padding-right: 50px; top: 12px; }
.csm-switch[disabled] { opacity: .5; }
.csm-switch input { display: none; }
.csm-switch-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; width: 60px; background-color: #334048; -webkit-transition: .4s; transition: .4s; border-radius: 34px; }
.csm-switch-slider:before { position: absolute; content: ""; height: 26px; width: 26px; left: 4px; bottom: 2px; background-color: white; -webkit-transition: .4s; transition: .4s; border-radius: 50%; }
.csm-input-checkbox:checked + .csm-switch-slider { background-color: #509ea6; }
.csm-input-checkbox:focus + .csm-switch-slider { box-shadow: 0 0 1px #31bab5; }
.csm-input-checkbox:checked + .csm-switch-slider:before { -webkit-transform: translateX(28px); -ms-transform: translateX(28px); transform: translateX(28px); }
#modal-button-accept { border-color: #fff; padding: 8px 25px 8px 25px !important; }

#modal-button-accept span { color: #000000; }
#modal-button-accept:hover span { color: #fff !important; }
#modal-button-accept:hover { background: #509EA6; border-color: #fff; }

#banner-button-accept span, #banner-button-reject span { color: #000000; }
#banner-button-accept:hover span, #banner-button-reject:hover span { color: #fff !important; }
#banner-button-accept:hover, #banner-button-reject:hover { Background: #525D66; }
.cookie-bar-button { padding: 8px 25px 8px 25px !important; }

#banner-button-reject {/* background: transparent; */}

#banner-text {font-size: 17px;}

@media (min-width: 768px) { /* Cookies */
    #cookie-banner-container { max-width: 630px; font-size: 15px; }
    #banner-content-wrapper {display: flex;flex-direction: column;}
    #banner-button-wrapper {flex-shrink: 0;margin: 15px 0 0 0;}
    #cookie-banner-container #banner-button-settings {padding-bottom: 0;margin-top: 0;margin-bottom: 0;background: transparent !IMPORTANT;outline: none;box-shadow: none;}
    .cookie-bar-button { padding: 8px 25px 8px 25px !important; }
    
    #banner-button-accept {margin-bottom: 0;}
    #banner-button-reject {margin-left: 15px;margin-bottom: 0;}
}


@media (min-width: 992px) {

    /* Cookies */
    #cookie-banner-container { max-width: 640px; }
    .cookie-bar-button { padding: 8px 25px 8px 25px !important; }
}


@media (min-width: 1200px) {

    /* Cookies */
    #cookie-banner-container { max-width: 740px; }
    #cookie-banner-container button:hover span { color: #334048 }
    #cookie-banner-container #banner-button-settings:hover,
    #cookie-banner-container #banner-button-settings:active { background: transparent; }
    #cookie-banner-container #banner-button-settings:hover span,
    #cookie-banner-container #banner-button-settings:active span { color: #FDCC62 }
}