/*
 * tealium-consent.css
 *
 * WHY THIS FILE EXISTS:
 * Tealium's utag.js injects two <style> blocks at runtime WITHOUT a CSP nonce,
 * and sets style="display:none" as an inline attribute on #__tealiumImplicitmodal.
 * Both are blocked when Content-Security-Policy omits 'unsafe-inline' from
 * style-src / style-src-attr, causing the cookie consent popup to render
 * unstyled at the bottom of the page instead of as a fixed overlay.
 *
 * SOLUTION:
 * All CSS rules from Tealium's two injected <style> blocks are mirrored here.
 * This file is served from 'self', covered by "style-src 'self'" in the CSP.
 * Tealium's injected <style> blocks are redundant and blocked by CSP (no nonce),
 * but since this file already contains the same rules, the UI is unaffected.
 *
 * SHOW / HIDE BEHAVIOUR:
 * Tealium shows and hides #__tealiumImplicitmodal via element.style.display
 * (JS DOM property assignment). JS DOM style manipulation is NOT governed by
 * CSP at all, so the popup opens and closes correctly without unsafe-inline.
 * The rule below hides the modal on load exactly as the blocked inline
 * style="display:none" attribute used to do.
 *
 * MAINTENANCE:
 * If Tealium changes its popup markup class names or adds new layout rules,
 * open the browser DevTools > Elements panel while the consent popup is open,
 * find the two <style> blocks Tealium injected, and update this file to match.
 */

/* =========================================================
   1. IMPLICIT COOKIE BANNER  (#__tealiumImplicitmodal)
      Replaces the blocked inline style="display:none" on
      the container and provides all banner layout rules.
   ========================================================= */

#__tealiumImplicitmodal {
    display: none;
}

@media (min-width: 768px) {
    .implicit_privacy_prompt.implicit_consent {
        position: fixed;
        width: 75%;
        left: 50%;
        text-align: left;
        background-color: #F7F6F5;
        font-size: 1.3rem;
        z-index: 99998;
        font-family: Tahoma, helvetica, arial, sans-serif;
        color: #242424;
        border: 1px solid #757575;
        transform: translate(-50%, 0);
        bottom: 0;
        max-width: 1400px;
        box-shadow: 0 0px 15px #0005;
    }
}

@media (min-width: 320px) and (max-width: 767px) {
    .implicit_privacy_prompt.implicit_consent {
        position: fixed;
        width: 100%;
        left: 0%;
        text-align: left;
        background-color: #F7F6F5;
        font-size: 1.3rem;
        z-index: 99998;
        font-family: Tahoma, helvetica, arial, sans-serif;
        color: #242424;
        border: 1px solid #757575;
        transform: none;
        bottom: 0;
        max-width: 1400px;
        box-shadow: 0 0px 15px #0005;
    }
}

.ups-readerTxt {
    position: absolute !important;
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0 !important;
    border: 0 !important;
    height: 1px !important;
    width: 1px !important;
    overflow: hidden;
}

.__tealiumPrivacyBackdrop {
    display: block !important;
    opacity: 0.75;
    filter: opacity(75%);
    z-index: 10005;
    background-color: #000;
    position: fixed;
}

.implicit_privacy_prompt.implicit_consent .implicit_privacy_prompt_content {
    width: 100%;
    max-width: 85%;
    margin: 0 auto;
    padding: 10px;
    font-size: 14px;
    position: relative;
}

@media (min-width: 320px) and (max-width: 767px) {
    .implicit_privacy_prompt.implicit_consent .implicit_privacy_prompt_content {
        max-width: 100%;
        padding: 15px;
    }
}

.implicit_privacy_prompt.implicit_consent .implicit_consent_title {
    font-family: Tahoma, helvetica, arial, sans-serif;
    font-size: 1.1em;
    font-weight: bold;
    line-height: 1.25;
    color: #242424;
    margin: 0;
}

.implicit_privacy_prompt.implicit_consent .implicit_consent_title_right {
    font-family: Tahoma, helvetica, arial, sans-serif;
    font-size: 1.1em;
    font-weight: bold;
    line-height: 1.25;
    color: #242424;
    margin: 0;
    text-align: left !important;
}

.implicit_privacy_prompt.implicit_consent .implicit_consent__inner {
    display: table;
    width: 100%;
}

.implicit_privacy_prompt.implicit_consent .implicit_consent__inner-left,
.implicit_privacy_prompt.implicit_consent .implicit_consent__inner-right {
    display: table-cell;
    vertical-align: left;
}

.implicit_privacy_prompt.implicit_consent .implicit_consent__inner-left p {
    margin: 0 0 10px;
    font-size: 14px;
    font-family: Tahoma, helvetica, arial, sans-serif;
    line-height: 1.25;
    color: #242424;
}

.implicit_privacy_prompt.implicit_consent .implicit_consent__inner-left a,
.implicit_privacy_prompt.implicit_consent .implicit_consent__inner-right a {
    text-decoration: underline;
    color: #426DA9;
}

.implicit_privacy_prompt.implicit_consent .implicit_consent__inner-right {
    width: 100px;
    padding-left: .5rem;
    text-align: left !important;
    vertical-align: middle;
}

.implicit_privacy_prompt #implicit_consent_prompt_submit:hover {
    transition: background-color 0.2s ease;
    background-color: #016862;
}

#__tealiumImplicitmodal .implicit_privacy_prompt > .close_btn_thick {
    position: absolute;
    display: block;
    top: 10px;
    right: 10px;
    text-decoration: none;
    text-shadow: none;
    color: #4A4A4A;
    font: 20px/100% arial, sans-serif;
    font-weight: normal;
    cursor: pointer;
    background: none;
    padding: 0 5px;
    border: 0px solid #000000;
    z-index: 99;
}

.implicit_privacy_prompt.implicit_consent .implicit_consent__inner-left a:focus,
.implicit_privacy_prompt.implicit_consent .implicit_consent__inner-right a:focus,
#__tealiumImplicitmodal .implicit_privacy_prompt > .close_btn_thick:focus {
    outline: 1px solid #4d90fe !important;
}

#__tealiumImplicitmodal .implicit_privacy_prompt > .close_btn_thick:after {
    content: "\00d7";
    font-size: 1.8em;
}

/* =========================================================
   2. GDPR CONSENT PREFERENCES POPUP  (#__tealiumGDPRcpPrefs)
      Full popup overlay, toggle switches, modal, and all
      inner layout — mirrors #__tealiumGDPRcpStyle exactly.
   ========================================================= */

html, body {
    height: 100%;
}

#__tealiumGDPRcpPrefs *,
#__tealiumGDPRcpPrefs *:before,
#__tealiumGDPRcpPrefs *:after {
    background-image: none !important;
}

#__tealiumGDPRcpPrefs,
.__tealiumPrivacyBackdrop {
    width: 100%;
    height: 100vh;
    top: 0px;
    display: table;
}

#__tealiumGDPRcpPrefs {
    position: absolute;
    z-index: 1000;
}


.privacy_prompt_middle {
    vertical-align: middle;
    display: table-cell;
}

.consent_preferences {
    position: relative;
    text-align: left;
    border: 1px solid #CCC;
    border-radius: 4px;
    background-color: #FFF;
    color: #242424;
    margin: auto;
    z-index: 10010;
    padding: 10px;
    font-size: 14px;
    margin-top: 5%;
}

#advanced_consent_options {
    cursor: pointer;
}

@media (min-width: 768px) {
    .consent_preferences {
        width: 640px;
    }
}

@media (max-width: 767px) {
    .consent_preferences {
        width: 100%;
        padding: 0;
        max-width: 360px;
    }
}

.privacy_prompt a {
    text-decoration: none;
    color: #0077bf;
}

.privacy_prompt_content {
    padding: 20px;
    font-size: 0.9em;
}

.privacy_prompt h1 {
    font-size: 1.3em;
    color: #000;
    font-weight: 400;
}

.option {
    margin: 10px 0px;
    color: #242424;
}

.consent_preferences_buttons {
    padding: 0px 20px 20px 20px;
    overflow: auto;
}

.consent_preferences_buttons a {
    font-size: 0.9em;
}

.privacy_prompt_content .privacy_prompt_title {
    font-size: 1.5em;
    -webkit-font-smoothing: antialiased;
    letter-spacing: 0.01em;
    margin: 0 0 0.12em 0;
    word-spacing: -0.05em;
    font-weight: bold;
    font-family: Tahoma, Helvetica, Arial, sans-serif;
    margin-bottom: 1rem;
}

.privacy_prompt_content table tbody tr {
    border-bottom: 1px solid #FFD100;
    word-break: normal;
    overflow-wrap: break-word;
}

.privacy_prompt_content table tr td.category_header,
.privacy_prompt_content table tr td.category_header .title {
    text-align: left !important;
    font-weight: 600 !important;
    font-family: "BerlinkseSans", Georgia, Times, serif;
    padding-bottom: 5px;
    font-size: 24px;
    word-break: normal;
    overflow-wrap: break-word;
    margin: 0;
    color: #000;
}

.privacy_prompt_content table tr.category_details {
    border-image: none;
    border-left: 0 solid #EEEEEE;
    border-right: 0 solid #EEEEEE;
    border-bottom: 0 solid #EEEEEE;
    border-top: 0 solid #FFD100;
    border-style: solid;
    border-width: 1px 0 0 0;
    font-family: Tahoma, Helvetica, Arial, sans-serif;
}

.consent_preferences_buttons .button {
    font-size: 1.0em;
    border: 1px solid #CCC;
    padding: 4px 15px;
    min-width: 50px;
    text-align: center;
    border-radius: 4px;
    background-color: #EEE;
    color: #000;
    cursor: pointer;
}

.consent_preferences_buttons .confirm_button {
    font-size: 1.1em;
    padding: 10px 30px 10px;
    margin: 2px 10px 0px 0px;
    text-align: center;
    border-radius: 25px;
    background-color: #00857D;
    cursor: pointer;
    font-family: Tahoma, helvetica, arial, sans-serif;
    transition: background-color 0.2s ease;
    color: #ffffff;
    white-space: nowrap;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    text-decoration: none;
    text-transform: none;
    -webkit-writing-mode: horizontal-tb !important;
    box-shadow: none;
    text-shadow: none;
}

.consent_preferences_buttons .confirm_button:hover,
.consent_preferences_buttons .confirm_button:focus {
    transition: background-color 0.2s ease;
    background-color: #016862;
}

.consent_preferences_buttons .confirm_button:focus {
    transition: box-shadow 0.2s ease;
    box-shadow: 0 0 6px #C67D30;
    outline: 2px solid #C67D30;
}

.privacy_prompt .button.right {
    float: right;
}

.privacy_prompt .button.left {
    float: left;
}

.privacy_prompt > .close_btn_thick {
    position: absolute;
    display: block;
    top: 10px;
    right: 10px;
    text-decoration: none;
    text-shadow: 0 1px 0 #fff;
    color: #777;
    font: 14px/100% arial, sans-serif;
    cursor: pointer;
}

.privacy_prompt > .close_btn_thick:after {
    content: "\2716";
}

.privacy_prompt .logo {
    float: right;
    width: unset !important;
    max-width: 100px !important;
    max-height: 100px !important;
    min-width: 50px !important;
    min-height: 50px !important;
    display: none;
}

.privacy_prompt table {
    padding: 0px;
    border-collapse: collapse;
    width: 100%;
}

.privacy_prompt table th {
    background-color: #FAFAFA;
    border-bottom: 1px solid #EEE;
    margin: 0px;
    padding: 5px 8px;
    font-weight: 400;
    text-align: center;
}

.privacy_prompt table td {
    vertical-align: top;
    padding: 10px 1px 5px 1px;
}

.privacy_prompt table tr td:last-child {
    text-align: center;
    min-width: 100px;
}

.privacy_prompt table tr td:first-child {
    font-weight: normal;
    color: #000;
}

/* Toggle switches */
.privacy_prompt input[type="checkbox"].toggle {
    opacity: 0;
    position: absolute;
}

.privacy_prompt input[type="checkbox"].toggle + label {
    height: 26px;
    line-height: 26px;
    background-color: #fff;
    color: #000;
    padding: 0px 16px;
    border-radius: 26px;
    border: 1px solid #75757500;
    display: inline-block;
    position: relative;
    cursor: pointer;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    transition: all 0.25s ease;
    -moz-box-shadow: inset 0px 0px 1px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: inset 0px 0px 1px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0px 0px 1px rgba(0, 0, 0, 0.5);
    font-family: Tahoma, Helvetica, Arial, sans-serif;
    white-space: nowrap;
}

.privacy_prompt input[type="checkbox"].toggle:not(:checked) + label {
    border: 1px solid #757575;
}

/* White dot inside toggle */
.privacy_prompt input[type="checkbox"].toggle + label:before,
.privacy_prompt input[type="checkbox"].toggle + label:hover:before {
    content: " ";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 22px;
    height: 22px;
    background: #fff;
    z-index: 2;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    -moz-border-radius: 14px;
    -webkit-border-radius: 14px;
    border-radius: 14px;
    -moz-box-shadow: 0 0 4px #757575;
    -webkit-box-shadow: 0 0 4px #757575;
    box-shadow: 0 0 4px #757575;
}

.privacy_prompt input[type="checkbox"].toggle + label .off,
.privacy_prompt input[type="checkbox"].toggle + label .on {
    font-weight: bold;
}

.privacy_prompt input[type="checkbox"].toggle + label .off {
    margin-left: 26px;
    display: inline-block;
    text-align: right;
    color: #000;
}

.privacy_prompt input[type="checkbox"].toggle + label .on {
    display: none;
    text-align: right;
}

.privacy_prompt input[type="checkbox"].toggle:checked + label .off {
    display: none;
    text-align: left;
    color: #000;
    -moz-box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.5);
}

.privacy_prompt input[type="checkbox"].toggle:checked + label .on {
    margin-right: 26px;
    display: inline-block;
    text-align: right;
    color: #fff;
}

.privacy_prompt input[type="checkbox"].toggle:checked + label {
    background-color: #00857D;
}

.privacy_prompt input[type="checkbox"].toggle:focus + label {
    transition: box-shadow 0.2s ease;
    box-shadow: 0 0 6px #C67D30;
    outline: 2px solid #C67D30;
}

.privacy_prompt input[type="checkbox"].toggle:focus:checked + label {
    background-color: #016862;
}

/* Mandatory category toggle locked appearance */
div.privacy_prompt_content > table > tbody > tr:nth-child(2) > td:nth-child(2) > label {
    background-color: #CCC !important;
}

.privacy_prompt input[type="checkbox"].toggle:checked + label:before,
.privacy_prompt input[type="checkbox"].toggle:checked + label:hover:before,
.privacy_prompt input[type="checkbox"].toggle:focus:checked + label:before,
.privacy_prompt input[type="checkbox"].toggle:focus:checked + label:hover:before {
    background-position: 0 0;
    top: 2px;
    left: 100%;
    margin-left: -24px;
}

/* Footer */
.privacy_prompt_footer {
    padding: 20px;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 0.9em;
}

.consent_preferences_message {
    padding-top: 20px;
    padding-bottom: 12px;    
    border-bottom-width: 1px;
    margin-top: 0px;
    margin-bottom: 0px;
    border-color: #EEEEEE;
    border-image: none;
    border-left: 0 solid #EEEEEE;
    border-right: 0 solid #EEEEEE;
    border-style: solid;
    border-top-width: 1px 0 0 0;
    font-family: Tahoma, Helvetica, Arial, sans-serif;
    font-weight: 100;
    line-height: 1.5rem;
}

/* Privacy policy modal */
#consent_preferences_privacy_policy_modal {
    display: none;
    margin-top: 0rem;
    position: fixed;
    z-index: 10012;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.4);
}

.footer-disclaimer {
    font-size: .7rem;
}

.modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    width: 80%;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s;
}

@keyframes animatetop {
    from { top: -300px; opacity: 0; }
    to   { top: 0;      opacity: 1; }
}

.consent_preferences_close_privacy_policy_btn {
    color: black;
    float: right;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
}

#consent_preferences_privacy_policy_btn {
    cursor: pointer;
}

.consent_preferences_close_privacy_policy_btn:hover,
.consent_preferences_close_privacy_policy_btn:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

.modal-header {
    padding: 2px 16px;
    background-color: #fed100;
    color: black;
    font-size: 1.5rem;
    text-transform: uppercase;
    padding-top: .5rem;
    padding-bottom: 1rem;
}

.modal-body {
    padding: 2px 16px;
    margin-bottom: 5rem;
}

.modal-footer {
    padding: 2px 16px;
    background-color: #fed100;
    color: black;
}