.nj-checkbox{--checkbox-border-color: var(--nj-color-base-gray-600);position:relative;padding-left:2.25rem}[data-theme="dark"] .nj-checkbox,.nj-checkbox[data-theme="dark"]{--checkbox-border-color: var(--nj-color-base-gray-100)}.nj-checkbox__decorator{position:absolute;top:2px;left:0;margin:-0.5rem -1rem;padding:0.5rem 1rem;line-height:.7;vertical-align:middle;border-radius:100%;cursor:pointer}.nj-checkbox__check{position:relative;z-index:1;display:inline-block;width:1.25rem;height:1.25rem;overflow:hidden;color:var(--checkbox-border-color);border:.125rem solid;border-radius:var(--nj-size-border-radius)}.nj-checkbox__check::before{position:absolute;display:block;width:0;height:0;margin-top:-4px;margin-left:6px;box-shadow:0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0 inset;transform:rotate(45deg);animation:checkbox-off;content:""}.nj-checkbox label{cursor:pointer}.nj-checkbox input[type="checkbox"]{position:absolute;left:0;z-index:-1;width:0;height:0;margin:0;overflow:hidden;opacity:0;pointer-events:none}.nj-checkbox input[type="checkbox"]:checked+.nj-checkbox__decorator .nj-checkbox__check{color:#009de9}.nj-checkbox input[type="checkbox"]:checked+.nj-checkbox__decorator .nj-checkbox__check::before{box-shadow:0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 032px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px;animation:checkbox-on .2s forwards}.nj-checkbox input[type="checkbox"]:invalid+.nj-checkbox__decorator .nj-checkbox__check,.has-danger .nj-checkbox input[type="checkbox"]+.nj-checkbox__decorator .nj-checkbox__check{border-color:#c03}.nj-checkbox input[type="checkbox"]:invalid+.nj-checkbox__decorator .nj-checkbox__check::after,.has-danger .nj-checkbox input[type="checkbox"]+.nj-checkbox__decorator .nj-checkbox__check::after{background-color:#c03;transform:rotate(-45deg)}.has-warning .nj-checkbox input[type="checkbox"]+.nj-checkbox__decorator .nj-checkbox__check{border-color:#e07602}.has-warning .nj-checkbox input[type="checkbox"]+.nj-checkbox__decorator .nj-checkbox__check::after{background-color:#e07602;transform:rotate(-45deg)}.has-success .nj-checkbox input[type="checkbox"]+.nj-checkbox__decorator .nj-checkbox__check{border-color:#009934}.has-success .nj-checkbox input[type="checkbox"]+.nj-checkbox__decorator .nj-checkbox__check::after{background-color:#009934;transform:rotate(-45deg)}.nj-checkbox input[type="checkbox"][disabled]+.nj-checkbox__decorator,.nj-checkbox input[type="checkbox"]:disabled+.nj-checkbox__decorator,fieldset[disabled] .nj-checkbox input[type="checkbox"]+.nj-checkbox__decorator{cursor:not-allowed}.nj-checkbox input[type="checkbox"][disabled]+.nj-checkbox__decorator .nj-checkbox__check,.nj-checkbox input[type="checkbox"]:disabled+.nj-checkbox__decorator .nj-checkbox__check,fieldset[disabled] .nj-checkbox input[type="checkbox"]+.nj-checkbox__decorator .nj-checkbox__check{color:var(--nj-color-base-disabled)}[data-theme="dark"] .nj-checkbox input[type="checkbox"]:disabled+.nj-checkbox__decorator .nj-checkbox__check{color:var(--nj-color-base-white);opacity:.2}.nj-checkbox--disabled label{color:var(--nj-color-base-disabled);cursor:not-allowed}.nj-checkbox--inline{display:inline-flex;margin-right:1.5rem}@keyframes checkbox-on{0%{box-shadow:0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px}50%{box-shadow:0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px 2px 0 11px}100%{box-shadow:0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px}}@keyframes checkbox-off{0%{box-shadow:0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset}25%{box-shadow:0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset}50%{width:0;height:0;margin-top:-4px;margin-left:6px;box-shadow:0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px, 0 0 0 0 inset;transform:rotate(45deg)}51%{width:20px;height:20px;margin-top:-2px;margin-left:-2px;box-shadow:0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 10px inset;transform:rotate(0deg)}100%{width:20px;height:20px;margin-top:-2px;margin-left:-2px;box-shadow:0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0 inset;transform:rotate(0deg)}}
