/*
 * Comutatorul de limbă din antet.
 *
 * Stă lângă convertorul valutar și arată la fel cu el: aceeași înălțime,
 * același contur, aceeași pastilă colorată la capăt. Două unelte care fac
 * același fel de lucru — schimbă cum vezi magazinul — trebuie să arate ca o
 * pereche, nu ca două plugin-uri lipite unul lângă altul.
 */

.sttr-comutator { position: relative; display: inline-flex; align-items: center; }

/* ── Butonul, croit după .stn-currency__toggle din temă ── */
.sttr-comutator .sttr-curenta,
.sttr-comutator .sttr-buton {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 11px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 9px;
  background: rgba(255, 255, 255, .06);
  color: #fff;
  cursor: pointer;
  font: inherit;
  line-height: 1;
  text-decoration: none;
  transition: background .15s ease, border-color .15s ease;
}
.sttr-comutator .sttr-curenta:hover,
.sttr-comutator .sttr-buton:hover { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .22); }
.sttr-comutator .sttr-curenta:focus-visible,
.sttr-comutator .sttr-buton:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

.sttr-comutator .sttr-nume { color: #fff; font-size: 10px; font-weight: 900; white-space: nowrap; letter-spacing: .02em; }
.sttr-comutator .sttr-glob { flex: 0 0 auto; opacity: .85; }

/* Pastila cu codul limbii, ca badge-ul RON de la convertor. */
.sttr-comutator .sttr-cod {
  padding: 3px 6px;
  border-radius: 6px;
  background: var(--stn-accent-ink, #c2452b); /* accentul „bright” din header (#ff5b39) nu trece contrastul AA cu text alb */
  color: #fff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .04em;
  white-space: nowrap;
}

.sttr-lista .sttr-sageata { flex: 0 0 auto; display: block; opacity: .7; transition: transform .16s ease; }
.sttr-lista.is-deschis .sttr-sageata { transform: rotate(180deg); }

/* ── Lista care se deschide ── */
.sttr-optiuni {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 1350;
  margin: 0; padding: 6px; list-style: none;
  min-width: 200px;
  border: 1px solid var(--stn-line, #e2e6ee);
  border-radius: 12px;
  background: var(--stn-surface, #fff);
  color: var(--stn-text, #101828);
  box-shadow: var(--stn-shadow, 0 12px 30px rgba(16, 24, 40, .18));
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.sttr-lista.is-deschis .sttr-optiuni { opacity: 1; visibility: visible; transform: translateY(0); }
.sttr-optiuni a {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 11px; border-radius: 8px;
  color: var(--stn-text, #101828);
  font-size: 13px; font-weight: 700; text-decoration: none;
}
.sttr-optiuni a:hover { background: var(--stn-surface-2, #f2f5fa); }
.sttr-optiuni a.is-activ { background: color-mix(in srgb, var(--stn-accent, #e8542f) 12%, transparent); }
.sttr-optiuni .sttr-steag { font-size: 16px; }

/* ── Varianta cu butoane ── */
.sttr-butoane { gap: 6px; }
.sttr-butoane .sttr-buton.is-activ {
  background: var(--stn-accent, #e8542f);
  border-color: var(--stn-accent, #e8542f);
}

/* În meniuri deschise la culoare, textul alb n-ar avea contrast. */
.sttr-in-meniu .sttr-curenta,
.sttr-in-meniu .sttr-buton { background: rgba(16, 24, 40, .06); border-color: rgba(16, 24, 40, .12); color: #101828; }
.sttr-in-meniu .sttr-nume { color: #101828; }

@media (max-width: 1100px) {
  .sttr-comutator .sttr-nume { display: none; }
}

/* Perechea din antet: comutatorul de limbă și convertorul valutar.

   Coloana a treia a antetului e fixată la 190px — atât cerea convertorul
   singur. Cu doua unelte in ea, sageata comutatorului iesea peste textul
   convertorului. Ii dam coloanei latimea de care are nevoie si lasam
   convertorul sa ocupe restul. */
.stn-header__nav-inner:has(> .stn-header__unelte) {
  grid-template-columns: 190px minmax(0, 1fr) auto;
}
.stn-header__unelte {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: 0;
}
.stn-header__unelte .stn-currency { flex: 0 1 auto; min-width: 168px; }
.stn-header__unelte .sttr-comutator { flex: 0 0 auto; }

/* Fara `:has` coloana ramane de 190px; atunci renuntam la cuvantul „Limba"
   ca sa incapa amandoua. */
@media (max-width: 1280px) {
  .sttr-comutator .sttr-nume { display: none; }
  .stn-header__unelte .stn-currency { min-width: 150px; }
}

@media (max-width: 960px) {
  .stn-header__unelte { justify-content: flex-end; }
}

/* Codul limbii în listă: aceeași pastilă, dar potolită — acolo nu e starea
   curentă, e doar eticheta rândului. */
.sttr-optiuni .sttr-cod-mic {
  flex: 0 0 auto;
  min-width: 26px;
  padding: 3px 5px;
  border-radius: 5px;
  background: color-mix(in srgb, var(--stn-accent, #e8542f) 14%, transparent);
  color: var(--stn-accent-ink, #c2452b);
  font-size: 10px;
  font-weight: 900;
  text-align: center;
}
.sttr-optiuni .sttr-nume-optiune { flex: 1 1 auto; }
.sttr-optiuni .sttr-bifat { flex: 0 0 auto; color: var(--stn-accent, #e8542f); }
.sttr-optiuni a.is-activ .sttr-cod-mic { background: var(--stn-accent-ink, #c2452b); color: #fff; }