/*
 *  Copyright 2019 Adobe
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */

@cmp-clean-dark-accordion-button-border-color: @cmp-clean-color-gray-700;
@cmp-clean-dark-accordion-button-color: @cmp-clean-color-gray-400;
@cmp-clean-dark-accordion-button-expanded-color: @cmp-clean-color-gray-100;
@cmp-clean-dark-accordion-button-hover-color: @cmp-clean-color-gray-100;

.t-cmp-clean--dark {
    .cmp-accordion__button {
        border-color: @cmp-clean-dark-accordion-button-border-color;
        color: @cmp-clean-dark-accordion-button-color;

        .cmp-accordion__icon {
            background-image: url("../../../resources/images/chevron_right--dark-skin.svg");
            position: absolute;
            top: 10*@px;
            right: 8*@px;
            width: 18px;
            height: 18px;
        }

        &--expanded {
            color: @cmp-clean-dark-accordion-button-expanded-color;
            .cmp-accordion__icon {
                background-image: url("../../../resources/images/expand_more--dark-skin.svg");
            }
        }

        &:hover {
            color: @cmp-clean-dark-accordion-button-hover-color;
        }

        &:not(.cmp-accordion__button--expanded) {
            &:hover {
                .cmp-accordion__icon {
                    background-image: url("../../../resources/images/chevron_right_hovered--dark-skin.svg");
                }
            }
        }
    }
}
