/* Bigkuma Site Translator – Front-end Styles */

/* ---- CSS Custom Property defaults (overridable via shortcode inline style) ---- */
.bk-language-switcher {
    --bks-color:        #374151;
    --bks-active-color: #2563eb;
    --bks-active-text:  #ffffff;
    --bks-bg:           #ffffff;
    --bks-hover-bg:     #f3f4f6;
    --bks-font-size:    0.9rem;
    --bks-font-family:  inherit;
    --bks-font-weight:  inherit;
    --bks-radius:       6px;
    --bks-padding:      6px 14px;
    --bks-border-color: #d1d5db;
    --bks-gap:          6px;

    display:     inline-block;
    font-family: var(--bks-font-family);
    font-size:   var(--bks-font-size);
    font-weight: var(--bks-font-weight);
}

/* ---- Divider ---- */
.bk-switcher__divider {
    display:     inline-flex;
    align-items: center;
    color:       var(--bks-border-color);
    user-select: none;
    padding:     0 2px;
}

/* ---- Buttons ---- */
.bk-switcher__buttons {
    display:   flex;
    flex-wrap: wrap;
    gap:       var(--bks-gap);
    align-items: center;
}

.bk-switcher__btn {
    display:         inline-flex;
    align-items:     center;
    gap:             5px;
    padding:         var(--bks-padding);
    border-radius:   var(--bks-radius);
    border:          1px solid var(--bks-border-color);
    background:      var(--bks-bg);
    color:           var(--bks-color);
    text-decoration: none;
    font-size:       inherit;
    font-family:     inherit;
    font-weight:     inherit;
    cursor:          pointer;
    transition:      background 0.15s, border-color 0.15s, color 0.15s;
    line-height:     1.4;
    white-space:     nowrap;
}

.bk-switcher__btn:hover {
    background:      var(--bks-hover-bg);
    border-color:    #9ca3af;
    color:           #111827;
    text-decoration: none;
}

.bk-switcher__btn--active {
    background:   var(--bks-active-color);
    border-color: var(--bks-active-color);
    color:        var(--bks-active-text);
    font-weight:  600;
}

.bk-switcher__btn--active:hover {
    background:   var(--bks-active-color);
    border-color: var(--bks-active-color);
    color:        var(--bks-active-text);
    filter:       brightness(0.9);
}

/* ---- Dropdown ---- */
.bk-switcher__select {
    padding:       var(--bks-padding);
    border-radius: var(--bks-radius);
    border:        1px solid var(--bks-border-color);
    font-size:     inherit;
    font-family:   inherit;
    color:         var(--bks-color);
    background:    var(--bks-bg);
    cursor:        pointer;
    appearance:    auto;
}

.bk-switcher__select:focus {
    outline:        2px solid var(--bks-active-color);
    outline-offset: 2px;
}

/* ---- List ---- */
.bk-switcher__list {
    list-style:     none;
    margin:         0;
    padding:        0;
    display:        flex;
    flex-direction: column;
    gap:            2px;
}

.bk-switcher__list li {
    margin:      0;
    padding:     0;
    display:     flex;
    align-items: center;
    gap:         4px;
}

.bk-switcher__list a {
    display:         block;
    padding:         5px 10px;
    border-radius:   calc(var(--bks-radius) - 2px);
    color:           var(--bks-color);
    text-decoration: none;
    font-family:     inherit;
    font-size:       inherit;
    transition:      background 0.15s;
}

.bk-switcher__list a:hover {
    background:      var(--bks-hover-bg);
    color:           #111827;
    text-decoration: none;
}

.bk-switcher__item--active a {
    background:  var(--bks-active-color);
    color:       var(--bks-active-text);
    font-weight: 600;
}

.bk-switcher__item--active a:hover {
    background: var(--bks-active-color);
    color:      var(--bks-active-text);
    filter:     brightness(0.9);
}

/* ---- BK Translate Text widget ---- */
.bk-translate-text {
    /* Inherits all theme styles; no opinionated defaults */
}