import n from"style-inject";var o=".l3-style-radio-button-component {\n  display: grid;\n  grid-template-columns: 1.5em auto;\n  grid-gap: 0.5em;\n  cursor: pointer;\n}\n.l3-style-radio-button-component__radio-input-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.l3-style-radio-button-component__radio-input-container__radio-input {\n  opacity: 0;\n  width: 0;\n  height: 0;\n  margin: 0;\n}\n.l3-style-radio-button-component__radio-input-container__radio-control {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  border: 3.5px solid #000000;\n  box-sizing: border-box;\n  border-radius: 50%;\n  transition: border-width var(--motion-productive-medium) var(--motion-timing-enter);\n}\n.l3-style-radio-button-component__radio-input-container__radio-control--size-small {\n  width: 12px;\n  height: 12px;\n  border-width: 2px;\n}\n.l3-style-radio-button-component__radio-input-container__radio-control:active {\n  outline: 2.5px solid rgba(0, 0, 0, 0.2);\n}\n.l3-style-radio-button-component__radio-input-container--kind-secondary .l3-style-radio-button-component__radio-input-container__radio-control {\n  border-color: rgba(255, 255, 255, 0.8);\n}\n.l3-style-radio-button-component__radio-input-container--kind-secondary .l3-style-radio-button-component__radio-input-container__radio-control:active {\n  outline: 2.5px solid rgba(255, 255, 255, 0.2);\n}\ninput:checked + .l3-style-radio-button-component__radio-input-container__radio-control {\n  border-color: #4ca6f8;\n  border-width: 6px;\n}\ninput:checked + .l3-style-radio-button-component__radio-input-container__radio-control--label-animation {\n  animation-name: radio-checked-animation;\n  animation-duration: var(--motion-productive-medium);\n  animation-timing-function: var(--motion-timing-enter);\n  animation-fill-mode: forwards;\n}\ninput:checked + .l3-style-radio-button-component__radio-input-container__radio-control--label-animation--size-small {\n  animation-name: radio-checked-animation-small;\n}\ninput:checked + .l3-style-radio-button-component__radio-input-container__radio-control--size-small {\n  border-width: 4px;\n}\ninput:disabled + .l3-style-radio-button-component__radio-input-container__radio-control {\n  border-color: rgba(255, 255, 255, 0.2);\n}\ninput:checked:disabled + .l3-style-radio-button-component__radio-input-container__radio-control {\n  border-color: rgba(255, 255, 255, 0.2);\n}\n.l3-style-radio-button-component__radio-label {\n  color: #000000;\n  font-style: normal;\n  font-weight: 500;\n  font-size: 16px;\n  line-height: 20px;\n}\n.l3-style-radio-button-component__radio-label--size-small {\n  font-size: 12px;\n  line-height: 16px;\n}\n.l3-style-radio-button-component__radio-label--kind-secondary {\n  color: #ffffff;\n}\n.l3-style-radio-button-component__description {\n  font-weight: 450;\n  font-size: 12px;\n  color: rgba(0, 0, 0, 0.3);\n  max-width: 200px;\n  margin-left: 32px;\n}\n.l3-style-radio-button-component__description--size-small {\n  margin-left: 32px;\n}\n.l3-style-radio-button-component__description--kind-secondary {\n  color: rgba(255, 255, 255, 0.6);\n}\n.l3-style-radio-button-component.disabled {\n  cursor: not-allowed;\n}\n.l3-style-radio-button-component.disabled .l3-style-radio-button-component__radio-label {\n  color: var(--disabled-text-color);\n}\n.l3-style-radio-button-component__radio-input-container input:focus-visible + .l3-style-radio-button-component__radio-input-container__radio-control {\n  outline: none;\n  border-color: #000000;\n  border-color: #000000;\n  box-shadow: 0 0 0 3px hsla(209deg, 100%, 50%, 0.5);\n  border-radius: 50%;\n}\n.l3-style-radio-button-component:hover .l3-style-radio-button-component__radio-input-container input:enabled:not(:checked) + .l3-style-radio-button-component__radio-input-container__radio-control, .l3-style-radio-button-component:focus-within .l3-style-radio-button-component__radio-input-container input:enabled:not(:checked) + .l3-style-radio-button-component__radio-input-container__radio-control {\n  border-color: #4ca6f8;\n}\n.wrapper {\n  display: flex;\n  flex-direction: column;\n}\n.wrapper--size-large {\n  gap: 18px;\n}\n.wrapper--size-small {\n  gap: 8px;\n}\n@keyframes radio-checked-animation {\n  100% {\n    height: 1.1em;\n    width: 1.1em;\n  }\n}\n@keyframes radio-checked-animation-small {\n  100% {\n    height: 0.7em;\n    width: 0.7em;\n  }\n}";n(o,{insertAt:"top"});export{o as default};
