/* Gagoo Translate — front-end language switcher */
.st-switcher { position: relative; display: inline-block; font-family: inherit; z-index: 9999; }
.st-flag { display: inline-flex; align-items: center; line-height: 1; }
.st-flag svg { width: 1.25em; height: .95em; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,.08); flex: none; }
.st-floating-switcher { position: fixed; bottom: 24px; right: 24px; z-index: 99999; }
.st-floating-switcher.st-pos-bottom-left { right: auto; left: 24px; }
.st-floating-switcher.st-pos-top-right { bottom: auto; top: 24px; }
.st-floating-switcher.st-pos-top-left { bottom: auto; top: 24px; right: auto; left: 24px; }
/* Inline/shortcode use (e.g. in a header): the list opens DOWNWARD by
   default. Only the bottom-corner floating variants open upward. */
.st-pos-bottom-right .st-switcher-list, .st-pos-bottom-left .st-switcher-list { top: auto; bottom: calc(100% + 6px); }
.st-pos-bottom-right .st-switcher-list, .st-pos-top-right .st-switcher-list { left: auto; right: 0; }
@media (max-width: 600px) {
    .st-floating-switcher { bottom: 12px; right: 12px; }
    .st-floating-switcher.st-pos-bottom-left { left: 12px; }
    .st-floating-switcher.st-pos-top-right { top: 12px; }
    .st-floating-switcher.st-pos-top-left { top: 12px; left: 12px; }
    .st-switcher-toggle { padding: 7px 11px; font-size: 13px; }
}
.st-switcher-toggle { display: flex; align-items: center; gap: 6px; padding: 8px 14px; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; cursor: pointer; font-size: 14px; box-shadow: 0 2px 8px rgba(0,0,0,.08); transition: all .15s; }
.st-switcher-toggle:hover { box-shadow: 0 4px 12px rgba(0,0,0,.12); }
.st-chevron { transition: transform .2s; }
.st-switcher-toggle[aria-expanded="true"] .st-chevron { transform: rotate(180deg); }
.st-switcher-list { position: absolute; top: calc(100% + 6px); left: 0; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.12); list-style: none; margin: 0; padding: 6px; min-width: 160px; display: none; }
.st-switcher[data-open] .st-switcher-list { display: block; }
.st-lang-option { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 6px; text-decoration: none; color: #374151; font-size: 14px; transition: background .1s; }
.st-lang-option:hover, .st-lang-option.st-active { background: #f3f4f6; }
.st-lang-option.st-active { font-weight: 600; }
.st-flag { font-size: 16px; }
/* Open direction/alignment decided at click time by the switcher JS
   (data-drop / data-align) — these beat the static st-pos-* fallbacks. */
.st-switcher[data-drop="up"] .st-switcher-list { top: auto; bottom: calc(100% + 6px); }
.st-switcher[data-drop="down"] .st-switcher-list { bottom: auto; top: calc(100% + 6px); }
.st-switcher[data-align="right"] .st-switcher-list { left: auto; right: 0; }
.st-switcher[data-align="left"] .st-switcher-list { right: auto; left: 0; }
/* Flag-only display */
.st-flag-only .st-lang-name { display: none; }
.st-flag-only .st-switcher-toggle { padding: 8px 10px; }
/* Dark theme */
.st-theme-dark .st-switcher-toggle { background: #1e293b; border-color: #334155; color: #f1f5f9; }
.st-theme-dark .st-switcher-list { background: #1e293b; border-color: #334155; }
.st-theme-dark .st-lang-option { color: #e2e8f0; }
.st-theme-dark .st-lang-option:hover, .st-theme-dark .st-lang-option.st-active { background: #334155; }
/* No background — inherits the site's own colors and font */
.st-theme-none .st-switcher-toggle { background: transparent; border-color: transparent; box-shadow: none; color: inherit; font-family: inherit; }
.st-theme-none .st-switcher-toggle:hover { box-shadow: none; opacity: .75; }