// /**
//  * Copyright © Magento, Inc. All rights reserved.
//  * See COPYING.txt for license details.
//  */

//
//  Variables
//  _____________________________________________

//  Checkbox & radio
.admin__control-radio,
.admin__control-checkbox {
    cursor: pointer;
    opacity: .01; // hack for successful selenium tests
    overflow: hidden;
    position: absolute;
    vertical-align: top;

    &:after { // ToDo UI: Should be deleted with old styles that generate styles for this element
        display: none;
    }

    + label {
        cursor: pointer;
        display: inline-block;

        &:before {
            background-color: @control-checkbox-radio__background-color;
            border: 1px solid @field-control__border-color;
            color: transparent;
            float: left;
            height: @control-checkbox-radio__size;
            text-align: center;
            vertical-align: top;
            width: @control-checkbox-radio__size;
        }
    }

    //  Label with text content
    + .admin__field-label {
        padding-left: @control-checkbox-radio__size + @field-label__indent;

        &:before {
            margin: 1px @field-label__indent 0 -(@control-checkbox-radio__size + @field-label__indent);
        }
    }

    //  Checked state
    &:checked {
        + label {
            &:before {
                color: @control-checkbox-radio-mark__color;
            }
        }
    }

    //  Disabled state
    &.disabled,
    &[disabled] {
        + label {
            color: @field-control__color;
            cursor: default;
            opacity: .5;

            &:before {
                background-color: @field-control__disabled__background-color;
                border-color: @field-control__border-color;
                cursor: default;
            }
        }
    }

    &:not([disabled]),
    &:not(.disabled) {
        //  Focus state
        &:focus {
            + label {
                &:before {
                    ._keyfocus & {
                        border-color: @field-control__focus__border-color;
                    }
                }
            }
        }

        //  Hover state
        &:hover {
            + label {
                &:before {
                    border-color: @field-control__hover__border-color;
                }
            }
        }
    }
}

//  Radio
.admin__control-radio {
    + label {
        &:before {
            border-radius: @control-checkbox-radio__size;
            content: '';
            transition: @smooth__border-color, color .1s ease-in;
        }
    }

    //  Discard extend line-height 1, to fix animation
    &.admin__control-radio {
        + label {
            &:before {
                line-height: 140%;
            }
        }
    }

    //  Radio checked state
    &:checked {
        + label {
            position: relative;

            &:after {
                background-color: @control-checkbox-radio-mark__color;
                border-radius: 50%;
                content: '';
                height: 10px;
                left: 3px;
                position: absolute;
                top: 4px;
                width: 10px;
            }
        }

        &:not([disabled]),
        &:not(.disabled) {
            //  Prevent hover effects for checked radio
            &:hover {
                cursor: default;

                + label {
                    cursor: default;

                    &:before {
                        border-color: @field-control__border-color;
                    }
                }
            }
        }
    }
}

//  Checkbox
.admin__control-checkbox {
    + label {
        &:before {
            &:extend(.abs-icon all);
            border-radius: 1px;
            content: '';
            font-size: 0;
            transition: font-size .1s ease-out, color .1s ease-out, @smooth__border-color;
        }
    }

    &:checked {
        + label {
            &:before {
                content: @icon-check-mage__content;
                font-size: 1.1rem;
                line-height: 125%;
            }
        }
    }

    &:not(:checked) {
        &._indeterminate,
        &:indeterminate {
            + label {
                &:before {
                    color: @control-checkbox-radio-mark__color;
                    content: '-';
                    font-family: @font-family__base;
                    font-size: @font-size__base;
                    font-weight: @font-weight__bold;
                }
            }
        }
    }
}

//
//  ToDo UI: Delete with old scope
//  ---------------------------------------------

input[type='checkbox'],
input[type='radio'] {
    &.admin__control-checkbox {
        margin: 0;
        position: absolute;
    }
}