#portu-ml-switcher-root {
position: fixed;
z-index: 99990;
top: 18px;
right: max(18px, calc((100vw - 1240px) / 2));
font-family: "Bebas Neue", sans-serif;
letter-spacing: 0;
}
.admin-bar #portu-ml-switcher-root {
top: 50px;
}
.portu-ml-switcher {
display: block;
}
.portu-ml-switcher__field {
position: relative;
display: block;
}
.portu-ml-switcher .screen-reader-text {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0 0 0 0);
white-space: nowrap;
border: 0;
}
.portu-ml-switcher__field::after {
content: "";
position: absolute;
top: 50%;
right: 1px;
width: 5px;
height: 5px;
border-right: 1px solid currentColor;
border-bottom: 1px solid currentColor;
color: rgba(20, 20, 20, 0.52);
pointer-events: none;
transform: translateY(-72%) rotate(45deg);
}
.portu-ml-switcher__select {
min-width: 44px;
height: 28px;
margin: 0;
padding: 2px 15px 2px 0;
appearance: none;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
color: rgba(20, 20, 20, 0.62);
font-family: "Bebas Neue", sans-serif;
font-size: 15px;
font-weight: 400;
line-height: 1;
letter-spacing: 0;
cursor: pointer;
transition: color 180ms ease, opacity 180ms ease;
}
.portu-ml-switcher__select:hover,
.portu-ml-switcher__select:focus-visible {
color: rgba(20, 20, 20, 0.9);
}
.portu-ml-switcher__select:focus-visible {
outline: 1px solid rgba(20, 20, 20, 0.28);
outline-offset: 3px;
}
.portu-ml-preview #portu-ml-switcher-root::after {
content: "PREVIEW";
position: absolute;
top: calc(100% + 5px);
right: 0;
padding: 3px 6px;
border-radius: 3px;
background: #111;
color: #fff;
font-size: 8px;
font-weight: 700;
letter-spacing: 0;
}
@media (max-width: 767px) {
#portu-ml-switcher-root {
top: 20px;
right: 62px;
}
.admin-bar #portu-ml-switcher-root {
top: 66px;
}
.portu-ml-switcher {
display: block;
}
.portu-ml-switcher__select {
min-width: 42px;
height: 28px;
padding-right: 14px;
padding-left: 0;
font-size: 14px;
}
.portu-ml-switcher__field::after {
right: 1px;
}
}
@media (prefers-reduced-motion: reduce) {
.portu-ml-switcher__select {
transition: none;
}
}