/* BW Language Switcher - scoped to #bw-lang-modal so it can't leak into the theme.
   --bw-lang-font is set inline by the plugin (filter: bw_lang_font_family) and is
   applied to every text node here, including the custom dropdown rows, because a
   native <option> list is drawn by the OS and would ignore the brand font. */
.bw-lang-modal{--bw-lang-font:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:24px;font-family:var(--bw-lang-font);}
.bw-lang-modal[hidden]{display:none;}
.bw-lang-modal,.bw-lang-modal *{font-family:var(--bw-lang-font)!important;}
.bw-lang-overlay{position:absolute;inset:0;background:rgba(0,0,0,.45);}
.bw-lang-panel{position:relative;width:100%;max-width:535px;background:#fff;border-radius:12px;padding:40px 44px 32px;box-shadow:0 20px 60px rgba(0,0,0,.18);animation:bw-lang-in .18s ease;}
@keyframes bw-lang-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.bw-lang-x{position:absolute;top:22px;right:22px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:none;border:0;color:#7A7A78;cursor:pointer;padding:0;}
.bw-lang-x:hover{color:#2B2B2B;}
.bw-lang-title{margin:0 0 6px;font-size:22px;line-height:30px;font-weight:400;color:#2B2B2B;}
.bw-lang-sub{margin:0 0 26px;font-size:16px;line-height:20px;font-weight:400;color:#2B2B2B;}
.bw-lang-label{display:block;margin:0 0 6px;font-size:14px;line-height:18px;font-weight:400;color:#2B2B2B;}
.bw-lang-field{position:relative;margin-bottom:22px;}

/* --- The picker button (replaces the native <select>) --- */
.bw-lang-control{display:flex;align-items:center;gap:10px;width:100%;height:48px;box-sizing:border-box;margin:0;padding:12px 40px;font-size:16px;line-height:20px;font-weight:400;text-align:left;color:#2B2B2B;background:#fff;border:1px solid #4A4A49;border-radius:8px;-webkit-appearance:none;appearance:none;cursor:pointer;}
.bw-lang-control{padding-left:12px;}                 /* no flag = normal inset */
.bw-lang-control--flag{padding-left:40px;}           /* room for the flag */
.bw-lang-control:hover{background:#fff;border-color:#2B2B2B;}
.bw-lang-control:focus-visible{outline:2px solid #004B93;outline-offset:1px;}
.bw-lang-control[aria-expanded="true"]{border-color:#004B93;}
.bw-lang-value{flex:1 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.bw-lang-flag{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:22px;height:22px;font-size:20px;line-height:22px;pointer-events:none;}
.bw-lang-chev{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:#2B2B2B;pointer-events:none;}

/* --- The dropdown list --- */
.bw-lang-list{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:5;margin:0;padding:4px;max-height:264px;overflow-y:auto;list-style:none;background:#fff;border:1px solid #4A4A49;border-radius:8px;box-shadow:0 12px 32px rgba(0,0,0,.14);}
.bw-lang-list[hidden]{display:none;}
/* gap 8 + flag 20 + padding 12 = 40px, so a row's label lines up exactly with
   the flagged button's text above it. */
.bw-lang-option{display:flex;align-items:center;gap:8px;margin:0;padding:10px 12px;font-size:16px;line-height:20px;font-weight:400;color:#2B2B2B;border-radius:6px;cursor:pointer;}
.bw-lang-option.is-active{background:#F1F1F0;}
.bw-lang-option[aria-selected="true"]{font-weight:500;}
.bw-lang-option[aria-selected="true"].is-active{background:#E6EDF5;}
.bw-lang-option-flag{flex:0 0 auto;width:20px;font-size:20px;line-height:22px;}
.bw-lang-option-label{flex:1 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
/* WordPress' emoji script swaps flag emoji for <img>; keep those aligned. */
.bw-lang-flag img.emoji,.bw-lang-option-flag img.emoji{width:20px;height:20px;margin:0;vertical-align:-.15em;}

.bw-lang-save{display:flex;align-items:center;justify-content:center;width:100%;margin-top:8px;padding:12px 24px;font-size:16px;line-height:20px;font-weight:500;color:#004B93;background:#fff;border:1px solid #004B93;border-radius:8px;cursor:pointer;transition:background .15s ease,color .15s ease;}
.bw-lang-save:hover{background:#004B93;color:#fff;}
@media(max-width:560px){.bw-lang-panel{padding:32px 20px 24px;}}

/* --- [bw_lang_trigger] header pill: current language flag + code ----------
   Rendered outside the modal, so it inherits the theme (Figtree) font.
   Sized ~20% up so it reads close to the cart icon beside it. */
.bw-lang-pill{display:inline-flex;align-items:center;gap:5px;max-width:33%;margin:0 20px 0 0;padding:4px 6px;background:none;border:0;line-height:1;color:#004B93;cursor:pointer;font:inherit;-webkit-appearance:none;appearance:none;}
/* The flag is a self-hosted circular SVG inlined by the plugin (already a
   circle). The container clips as a safety net. */
.bw-lang-pill-flag{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:21px;height:21px;border-radius:50%;overflow:hidden;font-size:21px;line-height:1;}
.bw-lang-pill-flag svg{display:block;width:21px;height:21px;border-radius:50%;}
/* Emoji fallback only (when no bundled SVG matches the language): the Twemoji
   flag art fills ~72% of its square canvas, so scale it up to fill the circle. */
.bw-lang-pill-flag--emoji img.emoji{width:21px;height:21px;margin:0;transform:scale(1.4);}
.bw-lang-pill-code{font-size:15px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:#004B93;}
.bw-lang-pill-chev{flex:0 0 auto;width:16px;height:16px;color:#004B93;}
.bw-lang-pill:hover .bw-lang-pill-code{text-decoration:underline;}
.bw-lang-pill:focus-visible{outline:2px solid #004B93;outline-offset:2px;border-radius:6px;}