/** Universal Language Selector */
.bc-language-selector {
    --bc-language-bg: #fff8e8;
    --bc-language-text: #253129;
    --bc-language-accent: #35613f;
    --bc-language-icon: #fff;
    --bc-language-border-width: 2px;
    --bc-language-float-offset: 20px;
    --bc-language-float-max-width: 180px;
    align-items: center;
    color: var(--bc-language-text);
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .6rem;
    max-width: 100%;
}

.bc-language-selector__label {
    align-items: center;
    color: var(--bc-language-accent);
    display: inline-flex;
    font: inherit;
    font-weight: 650;
    gap: .32rem;
    margin: 0;
}

.bc-language-selector__globe {
    align-items: center;
    background: var(--bc-language-accent);
    border-radius: 999px;
    box-sizing: border-box;
    color: var(--bc-language-icon);
    display: inline-flex;
    flex: 0 0 auto;
    height: 2rem;
    justify-content: center;
    line-height: 1;
    width: 2rem;
}

.bc-language-selector__globe svg {
    fill: none;
    height: 1.2rem;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
    width: 1.2rem;
}

.bc-language-selector__globe--integrated {
    display: none;
}

.bc-language-selector__control {
    display: inline-block;
    max-width: 100%;
    position: relative;
}

.bc-language-selector__select {
    appearance: auto;
    background: var(--bc-language-bg);
    border: var(--bc-language-border-width) solid var(--bc-language-accent);
    border-radius: .5rem;
    box-sizing: border-box;
    color: var(--bc-language-text);
    cursor: pointer;
    font: inherit;
    line-height: 1.35;
    max-width: 100%;
    min-height: 2.35rem;
    padding: .38rem .55rem;
}

.bc-language-selector__select:focus-visible {
    outline: 2px solid var(--bc-language-accent);
    outline-offset: 2px;
}

/* Progressive enhancement for FLOAT. Until JS initializes, the native select
   remains visible and fully usable. */
.bc-language-selector__display {
    display: none;
}

.bc-language-selector__display-text {
    min-width: 0;
}

.bc-language-selector__display-primary,
.bc-language-selector__display-secondary {
    display: block;
    overflow-wrap: anywhere;
}

.bc-language-selector__display-primary {
    font-weight: 650;
}

.bc-language-selector__display-secondary {
    font-size: .82em;
    line-height: 1.12;
    margin-top: .08rem;
    opacity: .8;
}

.bc-language-selector__display-secondary[hidden] {
    display: none;
}

.bc-language-selector__caret {
    align-self: center;
    flex: 0 0 auto;
    font-size: .82em;
    line-height: 1;
    margin-left: .4rem;
}

.bc-language-selector__status {
    color: #8a2e24;
    flex-basis: 100%;
    font-size: .85em;
    line-height: 1.35;
}

/* FLOAT mirrors the useful placement model of the original GTranslate module,
   while keeping the UI text-based and template-neutral. */
.bc-language-selector--float {
    background: var(--bc-language-bg);
    border: var(--bc-language-border-width) solid var(--bc-language-accent);
    border-radius: .75rem;
    box-shadow: 0 5px 18px rgba(0, 0, 0, .18);
    box-sizing: border-box;
    flex-wrap: nowrap;
    max-width: calc(100vw - var(--bc-language-float-offset) - var(--bc-language-float-offset));
    padding: .42rem .5rem;
    position: fixed;
    width: max-content;
    z-index: 999999;
}

.bc-language-selector--bottom-left {
    bottom: calc(var(--bc-language-float-offset) + env(safe-area-inset-bottom, 0px));
    left: calc(var(--bc-language-float-offset) + env(safe-area-inset-left, 0px));
}

.bc-language-selector--bottom-right {
    bottom: calc(var(--bc-language-float-offset) + env(safe-area-inset-bottom, 0px));
    right: calc(var(--bc-language-float-offset) + env(safe-area-inset-right, 0px));
}

.bc-language-selector--top-left {
    left: calc(var(--bc-language-float-offset) + env(safe-area-inset-left, 0px));
    top: calc(var(--bc-language-float-offset) + env(safe-area-inset-top, 0px));
}

.bc-language-selector--top-right {
    right: calc(var(--bc-language-float-offset) + env(safe-area-inset-right, 0px));
    top: calc(var(--bc-language-float-offset) + env(safe-area-inset-top, 0px));
}

.bc-language-selector--float .bc-language-selector__control {
    max-width: min(var(--bc-language-float-max-width), 68vw);
}

.bc-language-selector--float .bc-language-selector__select {
    max-width: min(var(--bc-language-float-max-width), 68vw);
}

/* In enhanced FLOAT mode the native select remains the interactive/focusable
   control, invisibly layered over a compact two-line visual representation. */
.bc-language-selector--float.bc-language-selector--enhanced .bc-language-selector__control {
    width: min(var(--bc-language-float-max-width), 68vw);
}

.bc-language-selector--float.bc-language-selector--enhanced .bc-language-selector__display {
    align-items: center;
    background: var(--bc-language-bg);
    border: var(--bc-language-border-width) solid var(--bc-language-accent);
    border-radius: .5rem;
    box-sizing: border-box;
    color: var(--bc-language-text);
    display: flex;
    justify-content: space-between;
    line-height: 1.18;
    min-height: 2.45rem;
    padding: .35rem .5rem;
    width: 100%;
}

.bc-language-selector--float.bc-language-selector--enhanced .bc-language-selector__select {
    cursor: pointer;
    height: 100%;
    inset: 0;
    margin: 0;
    max-width: none;
    opacity: 0;
    position: absolute;
    width: 100%;
    z-index: 2;
}

.bc-language-selector--float.bc-language-selector--enhanced .bc-language-selector__control:focus-within .bc-language-selector__display {
    outline: 2px solid var(--bc-language-accent);
    outline-offset: 2px;
}

.bc-language-selector__engine,
#bc-google-translate-element,
.goog-te-banner-frame.skiptranslate,
body > .skiptranslate {
    display: none !important;
}

/* Google Translate can inject a separate loading spinner while the Website
   Element initializes. Keep it hidden so it cannot remain rotating over
   interactive applications or page content. */
.goog-te-spinner-pos,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf-ti6hGc,
.VIpgJd-ZVi9od-aZ2wEe-OiiCO,
.VIpgJd-ZVi9od-aZ2wEe {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Google may add an inline top offset when its hidden Website Element initializes. */
html body {
    top: 0 !important;
}

@media (max-width: 768px) {
    /* RESPONSIVE: keep the globe/label outside the native select, but allow
       the select itself to shrink to the width that is actually available.
       This avoids the globe being pushed onto its own row in narrow headers. */
    .bc-language-selector--inline.bc-language-selector--mobile-responsive {
        align-items: center;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: .35rem;
        width: 100%;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-responsive .bc-language-selector__globe,
    .bc-language-selector--inline.bc-language-selector--mobile-responsive .bc-language-selector__label {
        flex: 0 0 auto;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-responsive .bc-language-selector__control {
        flex: 1 1 0;
        min-width: 0;
        width: auto;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-responsive .bc-language-selector__select {
        max-width: 100%;
        min-width: 0;
        width: 100%;
    }

    /* INTEGRATED: keep the globe visually inside the same control without
       overlaying the native <select>. Some Android browsers do not reliably
       honor left padding on a native select, so the icon gets its own grid
       column and the language text gets a separate flexible column. */
    .bc-language-selector--inline.bc-language-selector--mobile-integrated {
        align-items: stretch;
        display: grid;
        gap: .3rem 0;
        grid-template-columns: minmax(0, 1fr);
        max-width: 100%;
        width: 100%;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated .bc-language-selector__label {
        grid-column: 1;
        grid-row: 1;
        justify-self: start;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated .bc-language-selector__globe--external {
        display: none;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated .bc-language-selector__control {
        grid-column: 1;
        grid-row: 2;
        min-width: 0;
        width: 100%;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated.bc-language-selector--has-globe .bc-language-selector__control {
        align-items: center;
        background: var(--bc-language-bg);
        border: var(--bc-language-border-width) solid var(--bc-language-accent);
        border-radius: .5rem;
        box-sizing: border-box;
        display: grid;
        grid-template-columns: 2.65rem minmax(0, 1fr);
        overflow: hidden;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated .bc-language-selector__globe--integrated {
        display: inline-flex;
        grid-column: 1;
        grid-row: 1;
        justify-self: center;
        margin: .18rem 0 .18rem .18rem;
        pointer-events: none;
        position: static;
        z-index: auto;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated .bc-language-selector__select {
        max-width: 100%;
        min-width: 0;
        width: 100%;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated.bc-language-selector--has-globe .bc-language-selector__select {
        background: transparent;
        border: 0;
        border-radius: 0;
        grid-column: 2;
        grid-row: 1;
        min-height: 2.5rem;
        padding: .38rem .55rem .38rem .12rem;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated.bc-language-selector--has-globe .bc-language-selector__select:focus-visible {
        outline: none;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated.bc-language-selector--has-globe .bc-language-selector__control:focus-within {
        outline: 2px solid var(--bc-language-accent);
        outline-offset: 2px;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-integrated .bc-language-selector__status {
        grid-column: 1;
        grid-row: 3;
    }

    /* STACKED preserves the 1.1.3 mobile presentation for sites that prefer
       the icon/label above a full-width selector. */
    .bc-language-selector--inline.bc-language-selector--mobile-stacked {
        align-items: stretch;
        flex-direction: column;
    }

    .bc-language-selector--inline.bc-language-selector--mobile-stacked .bc-language-selector__select {
        width: 100%;
    }

    .bc-language-selector--float {
        gap: .35rem;
        max-width: calc(100vw - 24px);
        padding: .35rem .42rem;
    }

    .bc-language-selector--float .bc-language-selector__control {
        max-width: min(var(--bc-language-float-max-width), 62vw);
    }

    .bc-language-selector--float.bc-language-selector--enhanced .bc-language-selector__control {
        width: min(var(--bc-language-float-max-width), 62vw);
    }

    .bc-language-selector--float .bc-language-selector__select {
        max-width: min(var(--bc-language-float-max-width), 62vw);
    }

    .bc-language-selector__globe {
        height: 1.9rem;
        width: 1.9rem;
    }
}