var e={wrapper:"wrapper_2b693ebf6d",checkbox:"checkbox_02e7bd5595",icon:"icon_3c0668f496",label:"label_46249c9ef8",input:"input_b3801abef6",checkboxGrowAnimation:"checkboxGrowAnimation_30c2ff358f"};!function(e){const n="s_id-3c767214051a_3_70_1";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const r=document.createElement("style");r.id=n,o.firstChild?o.insertBefore(r,o.firstChild):o.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('/* stylelint-disable selector-class-pattern */\n.wrapper_2b693ebf6d {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  height: min-content;\n}\n.checkbox_02e7bd5595 {\n  cursor: pointer;\n  visibility: visible;\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  height: 16px;\n  width: 16px;\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  border-radius: 2px;\n  transition: transform var(--motion-productive-short) var(--motion-timing-enter);\n  position: relative;\n  overflow: hidden;\n  background-color: var(--secondary-background-color);\n}\n.checkbox_02e7bd5595:after {\n  content: " ";\n  background-color: transparent;\n  position: absolute;\n  height: 16px;\n  z-index: 2;\n  left: 0;\n  right: 0;\n  width: 100%;\n}\n.checkbox_02e7bd5595:hover {\n  border-color: var(--secondary-text-color);\n}\n.icon_3c0668f496 {\n  width: 100%;\n  color: var(--text-color-on-primary);\n  visibility: hidden;\n}\n.label_46249c9ef8 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  cursor: pointer;\n  user-select: none;\n  margin-inline-start: var(--spacing-small);\n}\n/* Since it is not possible to change the design of the checkbox according to the requirements using css, */\n/* we hide the checkbox and draw a new one instead. */\n/* In order to allow accessibility, all operations will be performed on the hidden checkbox and be reflected */\n.input_b3801abef6 {\n  opacity: 0;\n  width: 0;\n  height: 0;\n  position: absolute;\n}\n/* For any active attribute in the hidden checkbox, we will change the appearance of the checkbox we drew in its place. */\n.input_b3801abef6:focus + .checkbox_02e7bd5595 {\n  border-color: var(--secondary-text-color);\n}\n.input_b3801abef6:focus:checked + .checkbox_02e7bd5595 {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input_b3801abef6:focus-visible + .checkbox_02e7bd5595 {\n  outline: none;\n  border: 1px solid;\n  border-color: var(--primary-color);\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5);\n  border-radius: 2px;\n}\n.input_b3801abef6:checked:focus + .checkbox_02e7bd5595:after,\n.input_b3801abef6:indeterminate:focus + .checkbox_02e7bd5595:after {\n  background-color: var(--primary-hover-color);\n}\n.input_b3801abef6:checked + .checkbox_02e7bd5595,\n.input_b3801abef6:indeterminate + .checkbox_02e7bd5595 {\n  animation: checkboxGrowAnimation_30c2ff358f var(--motion-productive-short);\n  background-color: var(--primary-color);\n  border-color: transparent;\n}\n.input_b3801abef6:checked + .checkbox_02e7bd5595:hover,\n.input_b3801abef6:indeterminate + .checkbox_02e7bd5595:hover {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input_b3801abef6:checked + .checkbox_02e7bd5595:hover:after,\n.input_b3801abef6:indeterminate + .checkbox_02e7bd5595:hover:after {\n  background-color: var(--primary-hover-color);\n}\n.input_b3801abef6:checked + .checkbox_02e7bd5595:after,\n.input_b3801abef6:indeterminate + .checkbox_02e7bd5595:after {\n  content: " ";\n  background-color: var(--primary-color);\n  height: 16px;\n  transform: scaleX(0);\n  transition: transform var(--motion-productive-long);\n  transform-origin: right;\n  left: 0;\n}\n.input_b3801abef6:checked + .checkbox_02e7bd5595 > .icon_3c0668f496,\n.input_b3801abef6:indeterminate + .checkbox_02e7bd5595 > .icon_3c0668f496 {\n  visibility: visible;\n}\n.input_b3801abef6:checked:disabled + .checkbox_02e7bd5595:after,\n.input_b3801abef6:indeterminate:disabled + .checkbox_02e7bd5595:after {\n  background-color: var(--disabled-background-color);\n}\n.input_b3801abef6:disabled + .checkbox_02e7bd5595 .icon_3c0668f496,\n.input_b3801abef6:disabled + .checkbox_02e7bd5595:hover .icon_3c0668f496 {\n  color: var(--disabled-text-color);\n}\n.input_b3801abef6:disabled + .checkbox_02e7bd5595,\n.input_b3801abef6:disabled + .checkbox_02e7bd5595:hover {\n  cursor: not-allowed;\n  background-color: var(--disabled-background-color);\n  border-color: var(--ui-border-color);\n}\n.input_b3801abef6:disabled ~ .label_46249c9ef8 {\n  cursor: not-allowed;\n  color: var(--disabled-text-color);\n}\n@keyframes checkboxGrowAnimation_30c2ff358f {\n  0% {\n    transform: scale(0.8);\n  }\n  100% {\n    transform: scale(1);\n  }\n}');export{e as default};
//# sourceMappingURL=Checkbox.module.scss.js.map
