/*
 * MediTrans in-page switcher (shortcode / block / JS mount / banner inner markup).
 *
 * floating-switcher.css styles the SAME BEM classes for the bottom-fixed
 * floating widget and both files can load on one page (distinct handles since
 * v0.4.2), so every rule here is scoped to the in-page variants
 * (--dropdown / --inline) and must never match the --floating widget.
 *
 * Scoping conventions:
 * - Cosmetic rules use :where(<variant>) so specificity stays identical to the
 *   old generic selectors — the theme override file (L2) and the Settings
 *   custom CSS (L3, e.g. `.meditrans-switcher__trigger{border-radius:4px}`)
 *   keep winning by cascade order at equal specificity.
 * - The dropdown geometry rule uses a plain descendant selector on purpose:
 *   the extra specificity hardens it against stray generic rules.
 */
.meditrans-switcher--dropdown,
.meditrans-switcher--inline {
    display: inline-block;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.4;
}

.meditrans-switcher--dropdown ul,
.meditrans-switcher--inline ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.meditrans-switcher--dropdown a,
.meditrans-switcher--inline a {
    text-decoration: none;
    color: inherit;
}

/* Dropdown variant */
.meditrans-switcher--dropdown {
    position: relative;
}

:where(.meditrans-switcher--dropdown) .meditrans-switcher__trigger {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    color: #222;
    cursor: pointer;
    font: inherit;
}

:where(.meditrans-switcher--dropdown) .meditrans-switcher__trigger:hover {
    background: #f5f5f5;
    border-color: #999;
}

/* Geometry: opens DOWNWARD under the trigger. Scoped with full specificity so
   it can never leak onto the floating widget's upward-opening dropdown. */
.meditrans-switcher--dropdown .meditrans-switcher__dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    min-width: 100%;
    margin: 0;
    padding: 4px 0;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    z-index: 9999;
}

.meditrans-switcher__dropdown[hidden] {
    display: none;
}

:where(.meditrans-switcher--dropdown) .meditrans-switcher__dropdown li {
    margin: 0;
}

:where(.meditrans-switcher--dropdown) .meditrans-switcher__dropdown a {
    display: block;
    padding: 6px 14px;
    white-space: nowrap;
}

:where(.meditrans-switcher--dropdown) .meditrans-switcher__dropdown a:hover {
    background: #f0f0f0;
}

/* Inline-list variant */
.meditrans-switcher--inline ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    align-items: center;
}

.meditrans-switcher--inline li {
    margin: 0;
}

.meditrans-switcher--inline a {
    padding: 2px 4px;
}

.meditrans-switcher--inline a:hover {
    text-decoration: underline;
}