@import "button";
@import "toolbar";

/**************
 ! Action-bar *
***************/

@include exports("actionbar") {
    .action-bar {
        @include linear-gradient($bg_color);

        padding: $spacing;
        border-width: 1px 0 0;
        border-style: solid;
        border-color: border_normal($bg_color);
        color: $fg_color;

        .button {
            &.text-button { padding: $spacing - 1px; }

            &.image-button { padding: $spacing + 1px; }
        }

        .title {
            font: bold;
            padding: 0 ($spacing * 2);
        }

        .subtitle {
            font: smaller;
            padding: 0 ($spacing * 2);
        }
    }
}


/***************
 ! Search bars *
****************/

@include exports("searchbar") {
    .search-bar {
        @include linear-gradient(shade($bg_color, .98));

        border-width: 0 0 1px;
        border-style: solid;
        border-color: border_normal($bg_color);
        color: $fg_color;

        .button.close-button { padding: $spacing; }
    }
}


/******************
 ! Action buttons *
*******************/

@include exports("actionbuttons") {
    $types: (
        suggested: $success_color,
        destructive: $error-color
    );

    @each $type, $color in $types {
        .#{$type}-action.button {
            @include button($color, $selected_fg_color);
        }
    }
}


/******************
* selection mode *
******************/

@include exports("selectionmode") {
    .selection-mode {
        &.header-bar, &.toolbar {
            @include toolbar($selected_bg_color, $selected_fg_color);

            .button {
                @include button($selected_bg_color, $selected_fg_color);

                &.suggested-action { @extend .suggested-action.button; }
            }

            .selection-menu.button {
                border: 0;
                background-color: transparent;
                background-image: none;
                color: shade($selected_bg_color, $contrast);

                &:hover { color: shade($selected_bg_color, ($contrast - .1)); }

                &:active { color: shade($selected_bg_color, ($contrast - .05)); }
            }

            .dim-label, {
                &, .selection-menu.button & { color: shade($selected_bg_color, ($contrast - .1)); }
            }
        }

        &.toolbar { padding: $spacing; }
    }
}