.sft-switcher{
  display:inline-flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.sft-btn{
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  cursor:pointer;
  line-height:1;
  display:inline-flex;
  align-items:center;
  transition:opacity .2s ease, transform .2s ease;
}

.sft-btn:disabled{
  cursor:wait;
  opacity:.6;
}

.sft-flag-img{
  display:block;
  width:24px;
  height:16px;
  border-radius:2px;
}

.sft-btn:hover{ opacity:0.85; }
.sft-btn:hover .sft-flag-img{ transform:translateY(-1px); }

.sft-btn.is-active{
  outline:2px solid rgba(0,0,0,0.35);
  outline-offset:2px;
  border-radius:4px;
}

.sft-switcher.is-loading .sft-btn{
  pointer-events:none;
}

.sft-status{
  display:none;
  font-size:13px;
  line-height:1.4;
  padding:6px 10px;
  border-radius:999px;
  background:#f6f7f7;
  border:1px solid #dcdcde;
}

.sft-status.is-visible{
  display:inline-flex;
  align-items:center;
}

.sft-status.is-loading::before{
  content:"";
  width:12px;
  height:12px;
  margin-right:8px;
  border-radius:50%;
  border:2px solid currentColor;
  border-right-color:transparent;
  animation:sft-spin .7s linear infinite;
}

.sft-status.is-success{
  background:#edfaef;
  border-color:#00a32a;
}

.sft-status.is-error{
  background:#fcf0f1;
  border-color:#d63638;
}

@keyframes sft-spin{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(360deg); }
}
