/* ═══════════════════════════════════════════════════════
   BRICODY Language Switcher — Professional Dropdown
   ═══════════════════════════════════════════════════════ */

/* ── Flag Icons ── */
.bricody-lang-flag {
    width: 20px;
    height: 14px;
    border-radius: 2px;
    display: inline-block;
    flex-shrink: 0;
    background-size: cover;
    background-position: center;
    box-shadow: 0 0 0 .5px rgba(0,0,0,.12);
}
.bricody-lang-flag.flag-es {
    background: linear-gradient(to bottom,
        #c60b1e 0%, #c60b1e 25%,
        #ffc400 25%, #ffc400 75%,
        #c60b1e 75%, #c60b1e 100%);
}
.bricody-lang-flag.flag-en {
    background: #012169;
    position: relative;
    overflow: hidden;
}
.bricody-lang-flag.flag-en::before {
    content: '✚';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    font-size: 11px;
    line-height: 1;
}
.bricody-lang-flag.flag-zh {
    background: #de2910;
    position: relative;
    overflow: hidden;
}
.bricody-lang-flag.flag-zh::after {
    content: '★';
    position: absolute;
    top: 50%; left: 25%;
    transform: translate(-50%,-50%);
    color: #ffde00;
    font-size: 8px;
    line-height: 1;
}

/* ── Dropdown Container ── */
.bricody-lang-dropdown {
    position: relative;
    display: inline-flex;
    margin-left: 16px;
    flex-shrink: 0;
    z-index: 1000;
}

/* ── Trigger Button (topbar) ── */
.bricody-lang-trigger {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 8px;
    background: rgba(255,255,255,.07);
    color: rgba(255,255,255,.85);
    font-size: 12px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all .2s ease;
    letter-spacing: .3px;
    line-height: 1;
    white-space: nowrap;
}
.bricody-lang-trigger:hover {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.3);
}
.bricody-lang-trigger[aria-expanded="true"] {
    background: rgba(255,255,255,.16);
    border-color: rgba(255,255,255,.35);
}
.bricody-globe-icon {
    opacity: .7;
    flex-shrink: 0;
}
.bricody-lang-trigger:hover .bricody-globe-icon {
    opacity: 1;
}
.bricody-chevron {
    opacity: .5;
    transition: transform .2s ease;
    flex-shrink: 0;
}
.bricody-lang-trigger[aria-expanded="true"] .bricody-chevron {
    transform: rotate(180deg);
}

/* ── Dropdown Menu ── */
.bricody-lang-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 160px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.06);
    border: 1px solid rgba(0,0,0,.06);
    padding: 6px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px) scale(.97);
    transition: all .18s ease;
    pointer-events: none;
}
.bricody-lang-dropdown.open .bricody-lang-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

/* ── Menu Options ── */
.bricody-lang-option {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 12px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #1a1a1a;
    font-size: 13.5px;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: background .15s ease;
    text-align: left;
    line-height: 1;
}
.bricody-lang-option:hover {
    background: #f5f5f5;
}
.bricody-lang-option .bricody-lang-name {
    flex: 1;
}
.bricody-lang-option .bricody-check {
    opacity: 0;
    color: #2c5aa0;
    flex-shrink: 0;
    transition: opacity .15s;
}
.bricody-lang-option.active .bricody-check {
    opacity: 1;
}
.bricody-lang-option.active {
    color: #2c5aa0;
    font-weight: 600;
}

/* ── Navbar Dropdown (visible on all screens) ── */
.bricody-lang-dropdown--navbar {
    margin-left: 0;
}
.bricody-lang-trigger--navbar {
    width: 40px;
    height: 40px;
    padding: 0;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: var(--muted, #6b7280);
    justify-content: center;
    transition: all .15s ease;
}
.bricody-lang-trigger--navbar:hover {
    border: none;
    background: var(--light-gray, #f3f4f6);
    color: var(--text, #17212f);
}
.bricody-lang-trigger--navbar .bricody-globe-icon {
    opacity: .7;
    color: var(--primary-blue, #2c5aa0);
}
.bricody-lang-trigger--navbar:hover .bricody-globe-icon {
    opacity: 1;
}
.bricody-lang-menu--navbar {
    right: 0;
}

/* ── Mobile Menu Switcher (inline in header) ── */
.mobile-lang-switcher {
    display: inline-flex;
    gap: 2px;
    background: #f2f3f5;
    border-radius: 8px;
    padding: 2px;
}
.mobile-lang-switcher .bricody-lang-option {
    color: #888;
    border: none;
    background: transparent;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all .15s ease;
    letter-spacing: .2px;
    line-height: 1.2;
}
.mobile-lang-switcher .bricody-lang-option:hover {
    color: #555;
}
.mobile-lang-switcher .bricody-lang-option.active {
    color: #1a1a1a;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.1);
}

/* ── Topbar hidden on small screens ── */
@media (max-width: 768px) {
    .bricody-lang-dropdown:not(.bricody-lang-dropdown--navbar) {
        display: none;
    }
}