/* HC Multilingual — Frontend v1.4.0 */

:root { --hc-ml-offset-x: 24px; --hc-ml-offset-y: 24px; }

.hc-ml-switcher { position:relative; display:inline-flex; flex-direction:column; align-items:flex-end; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; font-size:14px; line-height:1.4; z-index:99990; box-sizing:border-box; gap:8px; }
.hc-ml-switcher *, .hc-ml-switcher *::before, .hc-ml-switcher *::after { box-sizing:inherit; }

/* ── Floating positions (non-FAB) ───────────────────────── */
.hc-ml-switcher--floating { position:fixed; z-index:99999; }
.hc-ml-pos--bottom-left  { bottom:var(--hc-ml-offset-y); left:var(--hc-ml-offset-x);  align-items:flex-start; }
.hc-ml-pos--bottom-right { bottom:var(--hc-ml-offset-y); right:var(--hc-ml-offset-x); align-items:flex-end; }
.hc-ml-pos--top-left     { top:var(--hc-ml-offset-y);    left:var(--hc-ml-offset-x);  align-items:flex-start; }
.hc-ml-pos--top-right    { top:var(--hc-ml-offset-y);    right:var(--hc-ml-offset-x); align-items:flex-end; }

/* ── Trigger ────────────────────────────────────────────── */
.hc-ml-trigger { display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border:1px solid rgba(0,0,0,.12); border-radius:50px; background:#fff; color:#333; cursor:pointer; font-size:14px; font-weight:500; line-height:1; box-shadow:0 2px 12px rgba(0,0,0,.1); transition:box-shadow .2s,transform .15s; white-space:nowrap; user-select:none; }
.hc-ml-trigger:hover { box-shadow:0 4px 20px rgba(0,0,0,.15); transform:translateY(-1px); }
.hc-ml-trigger:active { transform:translateY(0); }

/* ── FAB combo pill (bottom-right position) ─────────────── */
.hc-ml-fab-combo {
    position: fixed;
    bottom: var(--hc-ml-offset-y);
    right:  var(--hc-ml-offset-x);
    z-index: 99999;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
}
.hc-ml-fab-combo *, .hc-ml-fab-combo *::before, .hc-ml-fab-combo *::after { box-sizing: border-box; }

/* The combined pill container */
.hc-ml-combo-pill {
    display: inline-flex;
    align-items: center;
    background: #fff;
    /* border: 1px solid rgba(0,0,0,.12); */
    border-radius: 50px;
    box-shadow: 0 2px 12px rgba(0,0,0,.1);
    overflow: hidden;
    transition: box-shadow .2s;
}
.hc-ml-combo-pill:hover { box-shadow: 0 4px 20px rgba(0,0,0,.15); }

/* Trigger inside pill — inherits pill's card styles, strips its own */
.hc-ml-fab-combo .hc-ml-trigger {
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 10px 14px;
    transition: background .15s;
    margin-right: -1px;
}
.hc-ml-fab-combo .hc-ml-trigger:hover { box-shadow: none; transform: none; }
.hc-ml-fab-combo .hc-ml-trigger:active { transform: none; }

/* Vertical divider — fades in when BTT section expands */
.hc-ml-combo-sep {
    width: 1px;
    height: 22px;
    background: rgba(0,0,0,.12);
    flex-shrink: 0;
    opacity: 0;
    transition: opacity .3s;
}
.hc-ml-fab-combo.btt-visible .hc-ml-combo-sep { opacity: 1; }

/* BTT button — hidden (max-width:0), slides in on scroll */
.hc-ml-fab-combo .hc-ml-btt-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 0;
    height: 44px;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    border: none;
    background: transparent;
    color: #333;
    cursor: pointer;
    flex-shrink: 0;
    transition: max-width .3s ease, opacity .25s ease, padding .3s ease;
}
.hc-ml-fab-combo.btt-visible .hc-ml-btt-btn {
    max-width: 44px;
    padding: 0 12px;
    opacity: 1;
    pointer-events: auto;
    border-radius: 0;
}
.hc-ml-fab-combo .hc-ml-btt-btn:hover { 
    background: var(--ast-global-color-0);
    color: var(--ast-global-color-5);
    border-radius: 0;
 }

/* Dropdown list opens upward from the combo pill */
.hc-ml-fab-combo .hc-ml-list {
    position: absolute;
    bottom: calc(100% + 8px);
    right: 0;
    top: auto;
    left: auto;
    margin: 0;
}
/* Wider dropdown when BTT button is visible (pill is wider) */
.hc-ml-fab-combo.btt-visible .hc-ml-list { min-width: 140px; margin-right: 40px; }

/* ── Flags ──────────────────────────────────────────────── */
.hc-ml-flag { width:24px; height:24px; flex-shrink:0; object-fit:cover; }
.hc-ml-switcher--round .hc-ml-flag,
.hc-ml-fab-combo.hc-ml-switcher--round .hc-ml-flag { border-radius:50%; }
.hc-ml-switcher--rect .hc-ml-flag,
.hc-ml-fab-combo.hc-ml-switcher--rect .hc-ml-flag { border-radius:3px; }

/* ── Arrow ──────────────────────────────────────────────── */
.hc-ml-arrow { flex-shrink:0; transition:transform .2s; }
.hc-ml-switcher.open .hc-ml-arrow { transform:rotate(180deg); }

/* ── Dropdown list ──────────────────────────────────────── */
.hc-ml-list { position:absolute; display:none; list-style:none; margin:0; padding:6px 0; min-width:140px; background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:12px; box-shadow:0 8px 30px rgba(0,0,0,.12); overflow:hidden; animation:hcMlFadeIn .15s ease; }
.hc-ml-switcher.open .hc-ml-list { display:block; }

.hc-ml-pos--bottom-right .hc-ml-list,
.hc-ml-pos--bottom-left  .hc-ml-list { bottom:100%; margin-bottom:8px; }
.hc-ml-pos--top-right .hc-ml-list,
.hc-ml-pos--top-left  .hc-ml-list { top:100%; margin-top:8px; }
.hc-ml-pos--bottom-right .hc-ml-list,
.hc-ml-pos--top-right    .hc-ml-list { right:0; }
.hc-ml-pos--bottom-left .hc-ml-list,
.hc-ml-pos--top-left    .hc-ml-list { left:0; }
.hc-ml-switcher:not(.hc-ml-switcher--floating):not(.hc-ml-fab-combo) .hc-ml-list { top:100%; left:0; margin-top:6px; }

/* ── Items ──────────────────────────────────────────────── */
.hc-ml-list li { margin:0; padding:0; }
.hc-ml-list a { display:flex; align-items:center; gap:10px; padding:10px 16px; color:#333; text-decoration:none; font-size:14px; transition:background .12s; }
.hc-ml-list a:hover { background:#f5f5f5; }

/* ── Flags-only ─────────────────────────────────────────── */
.hc-ml-switcher--flags-only .hc-ml-trigger { padding:8px 12px; }
.hc-ml-switcher--flags-only .hc-ml-name { display:none; }
.hc-ml-switcher--flags-only .hc-ml-list a span { display:none; }
.hc-ml-switcher--flags-only .hc-ml-list { min-width:auto; }

/* ── List style ─────────────────────────────────────────── */
.hc-ml-switcher--list .hc-ml-trigger { display:none; }
.hc-ml-switcher--list .hc-ml-list { display:flex; flex-wrap:wrap; position:static; border:none; box-shadow:none; padding:0; gap:4px; background:transparent; animation:none; }
.hc-ml-switcher--list .hc-ml-list a { border-radius:50px; border:1px solid rgba(0,0,0,.1); background:#fff; padding:6px 14px; font-size:13px; }

/* ── Animation ──────────────────────────────────────────── */
@keyframes hcMlFadeIn { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} }

/* ── Mobile ─────────────────────────────────────────────── */
@media (max-width:600px) {
    .hc-ml-switcher--floating { bottom:var(--hc-ml-offset-y)!important; left:var(--hc-ml-offset-x)!important; right:auto!important; top:auto!important; }
    .hc-ml-pos--bottom-right.hc-ml-switcher--floating { right:var(--hc-ml-offset-x)!important; left:auto!important; }
    .hc-ml-pos--top-right.hc-ml-switcher--floating,
    .hc-ml-pos--top-left.hc-ml-switcher--floating { top:var(--hc-ml-offset-y)!important; bottom:auto!important; }

    .hc-ml-fab-combo { bottom:var(--hc-ml-offset-y); right:var(--hc-ml-offset-x); }
    .hc-ml-fab-combo .hc-ml-trigger { padding:10px 12px; font-size:13px; }
    .hc-ml-fab-combo.btt-visible .hc-ml-btt-btn { max-width:40px; padding:0 10px; }

    .hc-ml-list { min-width:100px; }
    .hc-ml-fab-combo.btt-visible .hc-ml-list { min-width: 100px; }
    .hc-ml-trigger { padding:8px 14px; font-size:13px; }
}