@import "../../../../styles/colors";
@import "../../../../styles/variables";

input {
    display:none;

    & + label {
        color: #1d1d1d;
        font-family: @notoFont;
        font-size: 14px;
        font-weight: 300;
        cursor: pointer;

        span{
            display:inline-block;
            width:14px;
            height:14px;
            border: solid 2px @mainColor;
            border-radius: 7px;
            background-color: #fff;
            transition: all 0.05s;
            margin: -1px 4px 0 0;
            vertical-align: middle;
            cursor: pointer;
        }
    }

    &:checked {
        & + label {
            span {
                border-color: @mainColor;

                &:after{
                    content: '';
                    display: block;
                    height: 6px;
                    width: 6px;
                    border-radius: 3px;
                    background-color: @mainColor;
                    margin: 2px;
                }
            }
        }
    }

    &[disabled] + label {
        cursor: not-allowed;

        span {
            cursor: not-allowed;
            opacity: 0.4;
        }

    }
}
