/**
 * profile-toggle.css - stilul de radio buton tip "toggle", pentru
 * intrebarile cu raspuns unic din profilul standard/avansat.
 *
 * REScris complet - varianta anterioara folosea un pseudo-element
 * (:before) scalat de 56x pentru efectul de "umplere" la selectare,
 * care putea "scapa" din clipping-ul overflow:hidden in anumite
 * combinatii de browser/randare (bug real confirmat vizual - aparea ca
 * o bara intunecata masiva peste restul continutului, posibil chiar
 * peste butonul de submit, blocand click-urile). Varianta noua obtine
 * acelasi efect vizual (fundal colorat la selectare) direct pe label,
 * fara niciun element care sa poata iesi din containerul lui.
 */
.inputGroup {
  background-color: #fff;
  display: block;
  margin: 6px 0;
  position: relative;
}
.inputGroup label {
  display: block;
  padding: 10px 50px 10px 14px;
  border: 2px solid #D1D7DC;
  border-radius: 6px;
  color: #222C3B;
  cursor: pointer;
  position: relative;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.inputGroup label:after {
  content: '';
  width: 20px;
  height: 20px;
  border: 2px solid #D1D7DC;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  transition: background-color 150ms ease, border-color 150ms ease;
}
.inputGroup input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}
.inputGroup input:checked ~ label {
  background-color: #B2243C;
  border-color: #B2243C;
  color: #fff;
}
.inputGroup input:checked ~ label:after {
  background-color: #fff;
  border-color: #fff;
}
.inputGroup input:focus-visible ~ label {
  outline: 2px solid #B2243C;
  outline-offset: 2px;
}
.rowline { border-bottom: 1px dotted #D5A657; }
