bulmil
Version:

594 lines • 24.2 kB
CSS
.switch[type=checkbox] {
outline: 0;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
display: inline-block;
position: absolute;
opacity: 0;
}
.switch[type=checkbox]:focus + label::before, .switch[type=checkbox]:focus + label:before, .switch[type=checkbox]:focus + label::after, .switch[type=checkbox]:focus + label:after {
outline: 1px dotted #b5b5b5;
}
.switch[type=checkbox][disabled] {
cursor: not-allowed;
}
.switch[type=checkbox][disabled] + label {
opacity: 0.5;
}
.switch[type=checkbox][disabled] + label::before, .switch[type=checkbox][disabled] + label:before {
opacity: 0.5;
}
.switch[type=checkbox][disabled] + label::after, .switch[type=checkbox][disabled] + label:after {
opacity: 0.5;
}
.switch[type=checkbox][disabled] + label:hover {
cursor: not-allowed;
}
.switch[type=checkbox] + label {
position: relative;
display: initial;
font-size: 1rem;
line-height: initial;
padding-left: 3.5rem;
padding-top: 0.2rem;
cursor: pointer;
}
.switch[type=checkbox] + label::before, .switch[type=checkbox] + label:before {
position: absolute;
display: block;
top: 0;
left: 0;
width: 3rem;
height: 1.5rem;
border: 0.1rem solid transparent;
border-radius: 4px;
background: #b5b5b5;
content: "";
}
.switch[type=checkbox] + label::after, .switch[type=checkbox] + label:after {
display: block;
position: absolute;
top: 0.25rem;
left: 0.25rem;
width: 1rem;
height: 1rem;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
border-radius: 4px;
background: white;
transition: all 0.25s ease-out;
content: "";
}
.switch[type=checkbox].is-rtl + label {
padding-left: 0;
padding-right: 3.5rem;
}
.switch[type=checkbox].is-rtl + label::before, .switch[type=checkbox].is-rtl + label:before {
left: auto;
right: 0;
}
.switch[type=checkbox].is-rtl + label::after, .switch[type=checkbox].is-rtl + label:after {
left: auto;
right: 0.25rem;
}
.switch[type=checkbox]:checked + label::before, .switch[type=checkbox]:checked + label:before {
background: #5851ff;
}
.switch[type=checkbox]:checked + label::after {
left: 1.625rem;
}
.switch[type=checkbox]:checked.is-rtl + label::after, .switch[type=checkbox]:checked.is-rtl + label:after {
left: auto;
right: 1.625rem;
}
.switch[type=checkbox].is-outlined + label::before, .switch[type=checkbox].is-outlined + label:before {
background-color: transparent;
border-color: #b5b5b5;
}
.switch[type=checkbox].is-outlined + label::after, .switch[type=checkbox].is-outlined + label:after {
background: #b5b5b5;
}
.switch[type=checkbox].is-outlined:checked + label::before, .switch[type=checkbox].is-outlined:checked + label:before {
background-color: transparent;
border-color: #5851ff;
}
.switch[type=checkbox].is-outlined:checked + label::after, .switch[type=checkbox].is-outlined:checked + label:after {
background: #5851ff;
}
.switch[type=checkbox].is-thin + label::before, .switch[type=checkbox].is-thin + label:before {
top: 0.5454545455rem;
height: 0.375rem;
}
.switch[type=checkbox].is-thin + label::after, .switch[type=checkbox].is-thin + label:after {
box-shadow: 0px 0px 3px #7a7a7a;
}
.switch[type=checkbox].is-rounded + label::before, .switch[type=checkbox].is-rounded + label:before {
border-radius: 24px;
}
.switch[type=checkbox].is-rounded + label::after, .switch[type=checkbox].is-rounded + label:after {
border-radius: 50%;
}
.switch[type=checkbox].is-small + label {
position: relative;
display: initial;
font-size: 0.75rem;
line-height: initial;
padding-left: 2.75rem;
padding-top: 0.2rem;
cursor: pointer;
}
.switch[type=checkbox].is-small + label::before, .switch[type=checkbox].is-small + label:before {
position: absolute;
display: block;
top: 0;
left: 0;
width: 2.25rem;
height: 1.125rem;
border: 0.1rem solid transparent;
border-radius: 4px;
background: #b5b5b5;
content: "";
}
.switch[type=checkbox].is-small + label::after, .switch[type=checkbox].is-small + label:after {
display: block;
position: absolute;
top: 0.25rem;
left: 0.25rem;
width: 0.625rem;
height: 0.625rem;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
border-radius: 4px;
background: white;
transition: all 0.25s ease-out;
content: "";
}
.switch[type=checkbox].is-small.is-rtl + label {
padding-left: 0;
padding-right: 2.75rem;
}
.switch[type=checkbox].is-small.is-rtl + label::before, .switch[type=checkbox].is-small.is-rtl + label:before {
left: auto;
right: 0;
}
.switch[type=checkbox].is-small.is-rtl + label::after, .switch[type=checkbox].is-small.is-rtl + label:after {
left: auto;
right: 0.25rem;
}
.switch[type=checkbox].is-small:checked + label::before, .switch[type=checkbox].is-small:checked + label:before {
background: #5851ff;
}
.switch[type=checkbox].is-small:checked + label::after {
left: 1.25rem;
}
.switch[type=checkbox].is-small:checked.is-rtl + label::after, .switch[type=checkbox].is-small:checked.is-rtl + label:after {
left: auto;
right: 1.25rem;
}
.switch[type=checkbox].is-small.is-outlined + label::before, .switch[type=checkbox].is-small.is-outlined + label:before {
background-color: transparent;
border-color: #b5b5b5;
}
.switch[type=checkbox].is-small.is-outlined + label::after, .switch[type=checkbox].is-small.is-outlined + label:after {
background: #b5b5b5;
}
.switch[type=checkbox].is-small.is-outlined:checked + label::before, .switch[type=checkbox].is-small.is-outlined:checked + label:before {
background-color: transparent;
border-color: #5851ff;
}
.switch[type=checkbox].is-small.is-outlined:checked + label::after, .switch[type=checkbox].is-small.is-outlined:checked + label:after {
background: #5851ff;
}
.switch[type=checkbox].is-small.is-thin + label::before, .switch[type=checkbox].is-small.is-thin + label:before {
top: 0.4090909091rem;
height: 0.28125rem;
}
.switch[type=checkbox].is-small.is-thin + label::after, .switch[type=checkbox].is-small.is-thin + label:after {
box-shadow: 0px 0px 3px #7a7a7a;
}
.switch[type=checkbox].is-small.is-rounded + label::before, .switch[type=checkbox].is-small.is-rounded + label:before {
border-radius: 24px;
}
.switch[type=checkbox].is-small.is-rounded + label::after, .switch[type=checkbox].is-small.is-rounded + label:after {
border-radius: 50%;
}
.switch[type=checkbox].is-medium + label {
position: relative;
display: initial;
font-size: 1.25rem;
line-height: initial;
padding-left: 4.25rem;
padding-top: 0.2rem;
cursor: pointer;
}
.switch[type=checkbox].is-medium + label::before, .switch[type=checkbox].is-medium + label:before {
position: absolute;
display: block;
top: 0;
left: 0;
width: 3.75rem;
height: 1.875rem;
border: 0.1rem solid transparent;
border-radius: 4px;
background: #b5b5b5;
content: "";
}
.switch[type=checkbox].is-medium + label::after, .switch[type=checkbox].is-medium + label:after {
display: block;
position: absolute;
top: 0.25rem;
left: 0.25rem;
width: 1.375rem;
height: 1.375rem;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
border-radius: 4px;
background: white;
transition: all 0.25s ease-out;
content: "";
}
.switch[type=checkbox].is-medium.is-rtl + label {
padding-left: 0;
padding-right: 4.25rem;
}
.switch[type=checkbox].is-medium.is-rtl + label::before, .switch[type=checkbox].is-medium.is-rtl + label:before {
left: auto;
right: 0;
}
.switch[type=checkbox].is-medium.is-rtl + label::after, .switch[type=checkbox].is-medium.is-rtl + label:after {
left: auto;
right: 0.25rem;
}
.switch[type=checkbox].is-medium:checked + label::before, .switch[type=checkbox].is-medium:checked + label:before {
background: #5851ff;
}
.switch[type=checkbox].is-medium:checked + label::after {
left: 2rem;
}
.switch[type=checkbox].is-medium:checked.is-rtl + label::after, .switch[type=checkbox].is-medium:checked.is-rtl + label:after {
left: auto;
right: 2rem;
}
.switch[type=checkbox].is-medium.is-outlined + label::before, .switch[type=checkbox].is-medium.is-outlined + label:before {
background-color: transparent;
border-color: #b5b5b5;
}
.switch[type=checkbox].is-medium.is-outlined + label::after, .switch[type=checkbox].is-medium.is-outlined + label:after {
background: #b5b5b5;
}
.switch[type=checkbox].is-medium.is-outlined:checked + label::before, .switch[type=checkbox].is-medium.is-outlined:checked + label:before {
background-color: transparent;
border-color: #5851ff;
}
.switch[type=checkbox].is-medium.is-outlined:checked + label::after, .switch[type=checkbox].is-medium.is-outlined:checked + label:after {
background: #5851ff;
}
.switch[type=checkbox].is-medium.is-thin + label::before, .switch[type=checkbox].is-medium.is-thin + label:before {
top: 0.6818181818rem;
height: 0.46875rem;
}
.switch[type=checkbox].is-medium.is-thin + label::after, .switch[type=checkbox].is-medium.is-thin + label:after {
box-shadow: 0px 0px 3px #7a7a7a;
}
.switch[type=checkbox].is-medium.is-rounded + label::before, .switch[type=checkbox].is-medium.is-rounded + label:before {
border-radius: 24px;
}
.switch[type=checkbox].is-medium.is-rounded + label::after, .switch[type=checkbox].is-medium.is-rounded + label:after {
border-radius: 50%;
}
.switch[type=checkbox].is-large + label {
position: relative;
display: initial;
font-size: 1.5rem;
line-height: initial;
padding-left: 5rem;
padding-top: 0.2rem;
cursor: pointer;
}
.switch[type=checkbox].is-large + label::before, .switch[type=checkbox].is-large + label:before {
position: absolute;
display: block;
top: 0;
left: 0;
width: 4.5rem;
height: 2.25rem;
border: 0.1rem solid transparent;
border-radius: 4px;
background: #b5b5b5;
content: "";
}
.switch[type=checkbox].is-large + label::after, .switch[type=checkbox].is-large + label:after {
display: block;
position: absolute;
top: 0.25rem;
left: 0.25rem;
width: 1.75rem;
height: 1.75rem;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
border-radius: 4px;
background: white;
transition: all 0.25s ease-out;
content: "";
}
.switch[type=checkbox].is-large.is-rtl + label {
padding-left: 0;
padding-right: 5rem;
}
.switch[type=checkbox].is-large.is-rtl + label::before, .switch[type=checkbox].is-large.is-rtl + label:before {
left: auto;
right: 0;
}
.switch[type=checkbox].is-large.is-rtl + label::after, .switch[type=checkbox].is-large.is-rtl + label:after {
left: auto;
right: 0.25rem;
}
.switch[type=checkbox].is-large:checked + label::before, .switch[type=checkbox].is-large:checked + label:before {
background: #5851ff;
}
.switch[type=checkbox].is-large:checked + label::after {
left: 2.375rem;
}
.switch[type=checkbox].is-large:checked.is-rtl + label::after, .switch[type=checkbox].is-large:checked.is-rtl + label:after {
left: auto;
right: 2.375rem;
}
.switch[type=checkbox].is-large.is-outlined + label::before, .switch[type=checkbox].is-large.is-outlined + label:before {
background-color: transparent;
border-color: #b5b5b5;
}
.switch[type=checkbox].is-large.is-outlined + label::after, .switch[type=checkbox].is-large.is-outlined + label:after {
background: #b5b5b5;
}
.switch[type=checkbox].is-large.is-outlined:checked + label::before, .switch[type=checkbox].is-large.is-outlined:checked + label:before {
background-color: transparent;
border-color: #5851ff;
}
.switch[type=checkbox].is-large.is-outlined:checked + label::after, .switch[type=checkbox].is-large.is-outlined:checked + label:after {
background: #5851ff;
}
.switch[type=checkbox].is-large.is-thin + label::before, .switch[type=checkbox].is-large.is-thin + label:before {
top: 0.8181818182rem;
height: 0.5625rem;
}
.switch[type=checkbox].is-large.is-thin + label::after, .switch[type=checkbox].is-large.is-thin + label:after {
box-shadow: 0px 0px 3px #7a7a7a;
}
.switch[type=checkbox].is-large.is-rounded + label::before, .switch[type=checkbox].is-large.is-rounded + label:before {
border-radius: 24px;
}
.switch[type=checkbox].is-large.is-rounded + label::after, .switch[type=checkbox].is-large.is-rounded + label:after {
border-radius: 50%;
}
.switch[type=checkbox].is-white:checked + label::before, .switch[type=checkbox].is-white:checked + label:before {
background: white;
}
.switch[type=checkbox].is-white.is-outlined:checked + label::before, .switch[type=checkbox].is-white.is-outlined:checked + label:before {
background-color: transparent;
border-color: white ;
}
.switch[type=checkbox].is-white.is-outlined:checked + label::after, .switch[type=checkbox].is-white.is-outlined:checked + label:after {
background: white;
}
.switch[type=checkbox].is-white.is-thin.is-outlined + label::after, .switch[type=checkbox].is-white.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-white + label::before, .switch[type=checkbox].is-unchecked-white + label:before {
background: white;
}
.switch[type=checkbox].is-unchecked-white.is-outlined + label::before, .switch[type=checkbox].is-unchecked-white.is-outlined + label:before {
background-color: transparent;
border-color: white ;
}
.switch[type=checkbox].is-unchecked-white.is-outlined + label::after, .switch[type=checkbox].is-unchecked-white.is-outlined + label:after {
background: white;
}
.switch[type=checkbox].is-black:checked + label::before, .switch[type=checkbox].is-black:checked + label:before {
background: #0a0a0a;
}
.switch[type=checkbox].is-black.is-outlined:checked + label::before, .switch[type=checkbox].is-black.is-outlined:checked + label:before {
background-color: transparent;
border-color: #0a0a0a ;
}
.switch[type=checkbox].is-black.is-outlined:checked + label::after, .switch[type=checkbox].is-black.is-outlined:checked + label:after {
background: #0a0a0a;
}
.switch[type=checkbox].is-black.is-thin.is-outlined + label::after, .switch[type=checkbox].is-black.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-black + label::before, .switch[type=checkbox].is-unchecked-black + label:before {
background: #0a0a0a;
}
.switch[type=checkbox].is-unchecked-black.is-outlined + label::before, .switch[type=checkbox].is-unchecked-black.is-outlined + label:before {
background-color: transparent;
border-color: #0a0a0a ;
}
.switch[type=checkbox].is-unchecked-black.is-outlined + label::after, .switch[type=checkbox].is-unchecked-black.is-outlined + label:after {
background: #0a0a0a;
}
.switch[type=checkbox].is-light:checked + label::before, .switch[type=checkbox].is-light:checked + label:before {
background: whitesmoke;
}
.switch[type=checkbox].is-light.is-outlined:checked + label::before, .switch[type=checkbox].is-light.is-outlined:checked + label:before {
background-color: transparent;
border-color: whitesmoke ;
}
.switch[type=checkbox].is-light.is-outlined:checked + label::after, .switch[type=checkbox].is-light.is-outlined:checked + label:after {
background: whitesmoke;
}
.switch[type=checkbox].is-light.is-thin.is-outlined + label::after, .switch[type=checkbox].is-light.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-light + label::before, .switch[type=checkbox].is-unchecked-light + label:before {
background: whitesmoke;
}
.switch[type=checkbox].is-unchecked-light.is-outlined + label::before, .switch[type=checkbox].is-unchecked-light.is-outlined + label:before {
background-color: transparent;
border-color: whitesmoke ;
}
.switch[type=checkbox].is-unchecked-light.is-outlined + label::after, .switch[type=checkbox].is-unchecked-light.is-outlined + label:after {
background: whitesmoke;
}
.switch[type=checkbox].is-dark:checked + label::before, .switch[type=checkbox].is-dark:checked + label:before {
background: #363636;
}
.switch[type=checkbox].is-dark.is-outlined:checked + label::before, .switch[type=checkbox].is-dark.is-outlined:checked + label:before {
background-color: transparent;
border-color: #363636 ;
}
.switch[type=checkbox].is-dark.is-outlined:checked + label::after, .switch[type=checkbox].is-dark.is-outlined:checked + label:after {
background: #363636;
}
.switch[type=checkbox].is-dark.is-thin.is-outlined + label::after, .switch[type=checkbox].is-dark.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-dark + label::before, .switch[type=checkbox].is-unchecked-dark + label:before {
background: #363636;
}
.switch[type=checkbox].is-unchecked-dark.is-outlined + label::before, .switch[type=checkbox].is-unchecked-dark.is-outlined + label:before {
background-color: transparent;
border-color: #363636 ;
}
.switch[type=checkbox].is-unchecked-dark.is-outlined + label::after, .switch[type=checkbox].is-unchecked-dark.is-outlined + label:after {
background: #363636;
}
.switch[type=checkbox].is-primary:checked + label::before, .switch[type=checkbox].is-primary:checked + label:before {
background: #5851ff;
}
.switch[type=checkbox].is-primary.is-outlined:checked + label::before, .switch[type=checkbox].is-primary.is-outlined:checked + label:before {
background-color: transparent;
border-color: #5851ff ;
}
.switch[type=checkbox].is-primary.is-outlined:checked + label::after, .switch[type=checkbox].is-primary.is-outlined:checked + label:after {
background: #5851ff;
}
.switch[type=checkbox].is-primary.is-thin.is-outlined + label::after, .switch[type=checkbox].is-primary.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-primary + label::before, .switch[type=checkbox].is-unchecked-primary + label:before {
background: #5851ff;
}
.switch[type=checkbox].is-unchecked-primary.is-outlined + label::before, .switch[type=checkbox].is-unchecked-primary.is-outlined + label:before {
background-color: transparent;
border-color: #5851ff ;
}
.switch[type=checkbox].is-unchecked-primary.is-outlined + label::after, .switch[type=checkbox].is-unchecked-primary.is-outlined + label:after {
background: #5851ff;
}
.switch[type=checkbox].is-link:checked + label::before, .switch[type=checkbox].is-link:checked + label:before {
background: #5851ff;
}
.switch[type=checkbox].is-link.is-outlined:checked + label::before, .switch[type=checkbox].is-link.is-outlined:checked + label:before {
background-color: transparent;
border-color: #5851ff ;
}
.switch[type=checkbox].is-link.is-outlined:checked + label::after, .switch[type=checkbox].is-link.is-outlined:checked + label:after {
background: #5851ff;
}
.switch[type=checkbox].is-link.is-thin.is-outlined + label::after, .switch[type=checkbox].is-link.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-link + label::before, .switch[type=checkbox].is-unchecked-link + label:before {
background: #5851ff;
}
.switch[type=checkbox].is-unchecked-link.is-outlined + label::before, .switch[type=checkbox].is-unchecked-link.is-outlined + label:before {
background-color: transparent;
border-color: #5851ff ;
}
.switch[type=checkbox].is-unchecked-link.is-outlined + label::after, .switch[type=checkbox].is-unchecked-link.is-outlined + label:after {
background: #5851ff;
}
.switch[type=checkbox].is-info:checked + label::before, .switch[type=checkbox].is-info:checked + label:before {
background: #3298dc;
}
.switch[type=checkbox].is-info.is-outlined:checked + label::before, .switch[type=checkbox].is-info.is-outlined:checked + label:before {
background-color: transparent;
border-color: #3298dc ;
}
.switch[type=checkbox].is-info.is-outlined:checked + label::after, .switch[type=checkbox].is-info.is-outlined:checked + label:after {
background: #3298dc;
}
.switch[type=checkbox].is-info.is-thin.is-outlined + label::after, .switch[type=checkbox].is-info.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-info + label::before, .switch[type=checkbox].is-unchecked-info + label:before {
background: #3298dc;
}
.switch[type=checkbox].is-unchecked-info.is-outlined + label::before, .switch[type=checkbox].is-unchecked-info.is-outlined + label:before {
background-color: transparent;
border-color: #3298dc ;
}
.switch[type=checkbox].is-unchecked-info.is-outlined + label::after, .switch[type=checkbox].is-unchecked-info.is-outlined + label:after {
background: #3298dc;
}
.switch[type=checkbox].is-success:checked + label::before, .switch[type=checkbox].is-success:checked + label:before {
background: #48c774;
}
.switch[type=checkbox].is-success.is-outlined:checked + label::before, .switch[type=checkbox].is-success.is-outlined:checked + label:before {
background-color: transparent;
border-color: #48c774 ;
}
.switch[type=checkbox].is-success.is-outlined:checked + label::after, .switch[type=checkbox].is-success.is-outlined:checked + label:after {
background: #48c774;
}
.switch[type=checkbox].is-success.is-thin.is-outlined + label::after, .switch[type=checkbox].is-success.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-success + label::before, .switch[type=checkbox].is-unchecked-success + label:before {
background: #48c774;
}
.switch[type=checkbox].is-unchecked-success.is-outlined + label::before, .switch[type=checkbox].is-unchecked-success.is-outlined + label:before {
background-color: transparent;
border-color: #48c774 ;
}
.switch[type=checkbox].is-unchecked-success.is-outlined + label::after, .switch[type=checkbox].is-unchecked-success.is-outlined + label:after {
background: #48c774;
}
.switch[type=checkbox].is-warning:checked + label::before, .switch[type=checkbox].is-warning:checked + label:before {
background: #ffdd57;
}
.switch[type=checkbox].is-warning.is-outlined:checked + label::before, .switch[type=checkbox].is-warning.is-outlined:checked + label:before {
background-color: transparent;
border-color: #ffdd57 ;
}
.switch[type=checkbox].is-warning.is-outlined:checked + label::after, .switch[type=checkbox].is-warning.is-outlined:checked + label:after {
background: #ffdd57;
}
.switch[type=checkbox].is-warning.is-thin.is-outlined + label::after, .switch[type=checkbox].is-warning.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-warning + label::before, .switch[type=checkbox].is-unchecked-warning + label:before {
background: #ffdd57;
}
.switch[type=checkbox].is-unchecked-warning.is-outlined + label::before, .switch[type=checkbox].is-unchecked-warning.is-outlined + label:before {
background-color: transparent;
border-color: #ffdd57 ;
}
.switch[type=checkbox].is-unchecked-warning.is-outlined + label::after, .switch[type=checkbox].is-unchecked-warning.is-outlined + label:after {
background: #ffdd57;
}
.switch[type=checkbox].is-danger:checked + label::before, .switch[type=checkbox].is-danger:checked + label:before {
background: #f14668;
}
.switch[type=checkbox].is-danger.is-outlined:checked + label::before, .switch[type=checkbox].is-danger.is-outlined:checked + label:before {
background-color: transparent;
border-color: #f14668 ;
}
.switch[type=checkbox].is-danger.is-outlined:checked + label::after, .switch[type=checkbox].is-danger.is-outlined:checked + label:after {
background: #f14668;
}
.switch[type=checkbox].is-danger.is-thin.is-outlined + label::after, .switch[type=checkbox].is-danger.is-thin.is-outlined + label:after {
box-shadow: none;
}
.switch[type=checkbox].is-unchecked-danger + label::before, .switch[type=checkbox].is-unchecked-danger + label:before {
background: #f14668;
}
.switch[type=checkbox].is-unchecked-danger.is-outlined + label::before, .switch[type=checkbox].is-unchecked-danger.is-outlined + label:before {
background-color: transparent;
border-color: #f14668 ;
}
.switch[type=checkbox].is-unchecked-danger.is-outlined + label::after, .switch[type=checkbox].is-unchecked-danger.is-outlined + label:after {
background: #f14668;
}