.translation-menu {
    position: relative;
    width: fit-content;
    max-width: 100%;
    margin-block: .5rem;
}
.translation-menu[open] { z-index: 15; }
.translation-menu > summary {
    list-style: none;
    display: flex;
    align-items: center;
    gap: .55rem;
    min-height: 44px;
    padding: .35rem .8rem;
    border: 1px solid var(--line);
    border-radius: var(--theme-radius, 9px);
    background: var(--surface, white);
    cursor: pointer;
}
.translation-menu > summary::-webkit-details-marker { display: none; }
.translation-menu > summary::after {
    content: "";
    width: .4rem;
    height: .4rem;
    margin-inline-start: .4rem;
    border: solid currentColor;
    border-width: 0 1px 1px 0;
    transform: rotate(45deg);
}
.translation-menu[open] > summary::after { transform: rotate(225deg); }
.translation-menu-options {
    position: absolute;
    inset-block-start: calc(100% + .25rem);
    inset-inline-start: 0;
    width: min(15rem, calc(100vw - 2rem));
    max-height: 65vh;
    overflow: auto;
    background: var(--surface, white);
    border: 1px solid var(--line);
    border-radius: var(--theme-radius, 9px);
    box-shadow: 0 .45rem 1.3rem #172b3c24;
    padding: .5rem;
}
.translation-menu-options ul { margin: 0; padding: 0; list-style: none; }
.translation-menu-options li a {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-height: 44px;
    padding-inline: .45rem;
    border-radius: .25rem;
}
.translation-menu-options li a:hover,
.translation-menu-options li a:focus-visible { background: var(--paper); }
.translation-menu-options small { display: block; padding: .45rem; }
.site-widget-right .translation-menu-options { inset-inline-start: auto; inset-inline-end: 0; }
@media (max-width: 760px) {
    .translation-menu-options { position: static; margin-top: .25rem; }
}
