@import '../base/states';
@import '../button/theme';
@import '../animation/effect';
@import './layout';

$window-header-color: $selected-text-color !default;
$window-border-color: rgba(0, 0, 0, .08) !default;
$window-shadow-color: rgba(0, 0, 0, .3) !default;
$window-shadow: 0 3px 3px 0 rgba(0, 0, 0, .06) !default;
$window-focused-box-shadow: 1px 1px 7px 1px $window-shadow-color !default;
$window-border-radius: $border-radius !default;

$dialog-button-background: $background !default;
$dialog-button-hover-background: $hover-background !default;
$dialog-button-focus-box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .1) !default;
$dialog-button-active-gradient: $button-active-gradient;
$dialog-button-active-box-shadow: $button-active-box-shadow;

$dialog-primary-color: $accent !default;
$dialog-primary-hover-color: $selected-text-color !default;
$dialog-primary-hover-background: $accent !default;
$dialog-primary-hover-before-background: $accent !default;
$dialog-primary-hover-focus-before-background: rgba(0, 0, 0, .1) !default;
$dialog-primary-focus-box-shadow: inset 0 0 0 2px lighten($accent, 23%) !default;
$dialog-primary-focus-before-background: lighten($accent, 23%) !default;
$dialog-primary-focus-hover-box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .08) !default;
$dialog-primary-active-gradient: linear-gradient(desaturate($accent, 3%), adjust-hue($accent, 3)) !default;

@include exports('action-buttons/theme') {
.k-action-buttons {
    border-top-color: $window-border-color;

    .k-button {
        position: relative;
        background-color: $dialog-button-background;
        background-image: none;
        border-radius: 0;
        border: 0;

        &:hover {
            background-color: $dialog-button-hover-background;
        }

        &:focus {
            box-shadow: $dialog-button-focus-box-shadow;
        }

        &:active {
            background-image: $dialog-button-active-gradient;
            box-shadow: $dialog-button-active-box-shadow;
        }

        &::before {
            background-color: $window-border-color;
        }
    }

    .k-primary {
        color: $dialog-primary-color;

        &:hover {
            color: $dialog-primary-hover-color;
            background-color: $dialog-primary-hover-background;
        }

        &:hover::before {
            background-color: $dialog-primary-hover-before-background;
        }

        &:focus {
            box-shadow: $dialog-primary-focus-box-shadow;
        }

        &:focus:hover {
            box-shadow: $dialog-primary-focus-hover-box-shadow;
        }

        &:active {
            background-image: $dialog-primary-active-gradient;
        }
    }
}
}
