103 lines
2.8 KiB
SCSS
103 lines
2.8 KiB
SCSS
/*
|
|
* Cookie Consent Styling
|
|
* Position the cookie consent container in the center of the viewport
|
|
*/
|
|
|
|
.satag--cookie-consent-container {
|
|
position: fixed !important;
|
|
top: 50% !important;
|
|
left: 50% !important;
|
|
z-index: 9999 !important; /* Ensure it appears above other content */
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
|
|
/*
|
|
* Direct targeting of Usercentrics elements
|
|
* These selectors target various elements that Usercentrics might create
|
|
*/
|
|
#usercentrics-root,
|
|
[class*="usercentrics"],
|
|
[id*="usercentrics"],
|
|
.uc-banner-content,
|
|
.uc-container,
|
|
[class*="banner"],
|
|
[class*="consent"],
|
|
[class*="cookie"] {
|
|
top: 50% !important;
|
|
left: 50% !important;
|
|
bottom: auto !important;
|
|
position: fixed !important;
|
|
z-index: 9999 !important;
|
|
}
|
|
|
|
/* Specific targeting for the center container */
|
|
#uc-center-container {
|
|
position: fixed !important;
|
|
top: 50% !important;
|
|
left: 50% !important;
|
|
margin: 0 auto !important;
|
|
text-align: left !important;
|
|
}
|
|
|
|
[id*="center-container"]:not(#uc-center-container),
|
|
[class*="center-container"] {
|
|
top: 50% !important;
|
|
left: 50% !important;
|
|
position: fixed !important;
|
|
}
|
|
|
|
/*
|
|
* Special styling for landscape mode on smaller height screens
|
|
* This targets the Usercentrics container element
|
|
*/
|
|
@media (max-height: 768px) and (orientation: landscape) {
|
|
.gtPQAC,
|
|
[class*="usercentrics"],
|
|
[id*="usercentrics"],
|
|
.uc-banner-content,
|
|
.uc-container,
|
|
#uc-center-container {
|
|
border-bottom: 0 !important;
|
|
max-height: 100vh !important;
|
|
max-width: 625px !important;
|
|
top: 50% !important;
|
|
left: 50% !important;
|
|
position: fixed !important;
|
|
}
|
|
}
|
|
|
|
/*
|
|
* Usercentrics Privacy Button - HIGHEST PRIORITY
|
|
* Must stay fixed at bottom-left on ALL pages, especially home page
|
|
* This rule MUST come FIRST to ensure proper specificity
|
|
*/
|
|
html body iframe#usercentrics-cmp-ui,
|
|
html body.home iframe#usercentrics-cmp-ui,
|
|
html body iframe[id^="usercentrics"][id*="button"],
|
|
html body.home iframe[id^="usercentrics"][id*="button"],
|
|
body iframe#usercentrics-cmp-ui,
|
|
body.home iframe#usercentrics-cmp-ui,
|
|
body iframe[id^="usercentrics"][id*="button"],
|
|
body.home iframe[id^="usercentrics"][id*="button"] {
|
|
position: fixed !important;
|
|
bottom: 50px !important;
|
|
left: 24px !important;
|
|
top: auto !important;
|
|
right: auto !important;
|
|
transform: none !important;
|
|
margin: 0 !important;
|
|
z-index: 9999 !important;
|
|
}
|
|
|
|
/* Additional styling to ensure the cookie consent banner is centered */
|
|
/* Exclude Privacy Button using :not() selector */
|
|
body iframe[id^="usercentrics-"]:not(#usercentrics-cmp-ui):not([id*="button"]),
|
|
body [class*="usercentrics"]:not(iframe),
|
|
body [id*="usercentrics"]:not(iframe):not(#usercentrics-cmp-ui) {
|
|
top: 50% !important;
|
|
left: 50% !important;
|
|
bottom: auto !important;
|
|
position: fixed !important;
|
|
}
|