[data-assembly-focus-control] *:focus {
  outline: 0;
}

[data-assembly-focus-control='visible'] *:focus {
  box-shadow: var(--focus-shadow);
  transition: box-shadow var(--transition);
}

/* Shared form component focus states */
[data-assembly-focus-control='visible'] input:focus + .checkbox,
[data-assembly-focus-control='visible'] input:focus + .radio,
[data-assembly-focus-control='visible'] input:focus + .switch,
[data-assembly-focus-control='visible'] input:focus + .toggle {
  box-shadow: var(--focus-shadow);
}

/* Range focus */
[data-assembly-focus-control='visible'] .range input[type=range] {
  box-shadow: none;
}
[data-assembly-focus-control='visible'] .range input[type=range]:focus::-webkit-slider-thumb {
  box-shadow: var(--focus-shadow);
}
[data-assembly-focus-control='visible'] .range input[type=range]:focus::-ms-fill-upper {
  box-shadow: var(--focus-shadow);
}
[data-assembly-focus-control='visible'] .range input[type=range]:focus::-ms-fill-lower {
  box-shadow: var(--focus-shadow);
}
[data-assembly-focus-control='visible'] .range input[type=range]:focus::-ms-thumb {
  box-shadow: var(--focus-shadow);
}
[data-assembly-focus-control='visible'] .range input[type=range]:focus::-moz-range-thumb {
  box-shadow: var(--focus-shadow);
}

[data-assembly-focus-control] .range::-moz-focus-outer { border: 0; }