.radio {
  display: inline-block;
  vertical-align: middle; }

.radio + .radio {
  margin: 0 0 0 5px; }

.radio--focus .radio__icon,
.radio__control:focus + label .radio__icon {
  stroke: #adadad; }

.radio__control:checked + label .radio__svg-check {
  visibility: visible; }

.radio__control:checked:disabled + label .radio__svg-check,
.radio__control:checked[readonly] + label .radio__svg-check {
  fill: #9e9e9e;
  visibility: visible; }

.radio__control:disabled + label .radio__icon,
.radio__control[readonly] + label .radio__icon {
  fill: #f3f3f3; }

.radio__control[readonly],
.radio__control[readonly] + label {
  cursor: not-allowed; }

.radio__control:disabled + .radio__label {
  cursor: default; }

.radio__label {
  display: inline-block;
  vertical-align: top;
  font-size: 0;
  cursor: pointer; }

.radio__label--wide {
  width: 80px;
  text-align: center; }

@media (min-width: 768px) {
  .radio__label--wide {
    width: 92px; } }

.radio__label--big {
  padding: 10px 16px; }

.radio__label--inline .radio__icon {
  float: left;
  margin-left: 0; }

.radio__label--inline .radio__text {
  display: block;
  margin-left: 36px; }

.radio--button .radio__label {
  padding: 6px 16px;
  border-radius: 8px;
  -webkit-transition: background 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86), border 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: background 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86), border 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  background: var(--bg-alt-secondary);
  border: 1px solid var(--other-lines); }

@media (max-width: 767px) {
  .radio--button .radio__label {
    padding: 6px 9px; } }

.radio--button .radio__label--tiny {
  padding: 6px 10px; }

.radio--button .radio__label--big {
  padding: 10px 16px; }

.form--gray .radio--button .radio__label {
  background: var(--bg-primary);
  border: 1px solid var(--other-lines); }

.radio--button .radio__control:checked + .radio__label {
  background: var(--bg-alt-secondary);
  border: 1px solid var(--other-lines); }

.form--gray .radio--button .radio__control:checked + .radio__label {
  background: var(--bg-primary);
  border: 1px solid var(--other-lines); }

.radio--button .radio__control:checked + .radio__label .radio__text {
  color: #ce253d;
  font-weight: 600; }

.radio--button .radio__control:hover:not([readonly]) + .radio__label {
  background: var(--bg-tertiary); }

.form--gray .radio--button .radio__control:hover:not([readonly]) + .radio__label {
  background: var(--bg-tertiary); }

.radio__control.is-error + .radio__label {
  border-color: #e27c8b; }

.radio__control.is-error + .radio__label .hint svg {
  stroke: inherit; }

.radio__control.is-error + .radio__label svg {
  stroke: #ce253d; }

.radio__icon {
  display: inline-block;
  vertical-align: top;
  width: 24px;
  height: 24px;
  stroke: #dbdbdb;
  fill: var(--old-radio-9);
  -webkit-transition: stroke 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86), fill 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: stroke 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86), fill 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  margin: 0 10px 0 0; }

.radio__svg-check {
  stroke: none;
  fill: #ce253d;
  visibility: hidden; }

.radio__text {
  display: inline-block;
  vertical-align: middle;
  font-size: 16px;
  line-height: 1.7143; }

.radio--button .radio__text {
  line-height: 22px;
  color: var(--old-radio-8); }
