@include exports("sreadsheet/theme") {

    // Spreadsheet
    .k-spreadsheet {
        @extend .k-text-selection;
        @include fill(
            $spreadsheet-text,
            $spreadsheet-bg,
            $spreadsheet-border
        );
    }


    // Header
    .k-spreadsheet .k-tabstrip-wrapper {}


    // Quick access toolbar
    .k-spreadsheet-quick-access-toolbar {}


    // Row / column headers
    .k-spreadsheet-top-corner,
    .k-spreadsheet-row-header,
    .k-spreadsheet-column-header {
        @include fill(
            $header-text,
            $header-bg,
            $header-border,
            $header-gradient
        );
    }


    // Formula bar
    .k-spreadsheet-formula-list {}
    .k-syntax-ref { color: #ff8822; }
    .k-syntax-num { color: #0099ff; }
    .k-syntax-str { color: #38b714; }
    .k-syntax-error { color: red; }
    .k-syntax-bool { color: #a9169c; }
    .k-syntax-paren-match { background-color: #caf200; }


    // Cell editor
    .k-spreadsheet-cell-editor {
        color: $panel-text;
        background-color: $panel-bg;
    }


    // Cells
    .k-spreadsheet-merged-cell {
        background-color: $panel-bg;
    }


    // Selection
    .k-spreadsheet .k-selection-full,
    .k-spreadsheet .k-selection-partial {
        // TODO: consider extracting variables
        // border-color: rgba( $header-selected-border, .25 );
        background-color: rgba( $header-selected-bg, .25 );
    }
    .k-spreadsheet-selection {
        border-color: $selected-bg;
        background-color: rgba( $selected-bg, .25 );
        box-shadow: inset 0 0 0 1px $selected-bg;
    }
    .k-spreadsheet .k-single-selection::after {
        border-color: $panel-bg;
        background-color: $selected-bg;
    }
    .k-spreadsheet-active-cell {
        box-shadow: inset 0 0 0 1px $selected-bg;
        background-color: $panel-bg;

        &.k-right {
            box-shadow: inset 0 0 0 1px $selected-bg, inset -1px 0 0 1px $selected-bg;
        }

        &.k-bottom {
            box-shadow: inset 0 0 0 1px $selected-bg, inset 0 -1px 0 1px $selected-bg;
        }

        &.k-bottom.k-right {
            box-shadow: inset 0 0 0 1px $selected-bg, inset -1px -1px 0 1px $selected-bg;
        }
    }

    .k-spreadsheet .k-auto-fill {
        border-color: $selected-bg;
        background-color: rgba( $selected-bg, .25 );
        box-shadow: inset 0 0 0 1px $selected-bg;
    }
    .k-spreadsheet .k-auto-fill-punch {
        background-color: rgba( $panel-bg, .5 );
    }


    // Resize handle
    .k-spreadsheet .k-resize-handle,
    .k-spreadsheet .k-resize-hint-handle,
    .k-spreadsheet .k-resize-hint-marker {
        background-color: $primary;
    }

    // Comments
    .k-spreadsheet-has-comment::after {
        border-color: $primary $primary transparent transparent;
    }

    // Validation
    .k-dirty {
        border-color: $error transparent transparent $error;
    }

}




@include exports( "spreadsheet/filter/theme" ) {

    // Filter button
    .k-spreadsheet .k-filter-range {
        border-color: $primary;
    }
    .k-spreadsheet-filter {
        @include fill(
            $button-text,
            $button-bg,
            $button-border,
            $button-gradient
        );
        box-shadow: inset 0 0 0 1px $button-border;

        &.k-state-active {
            @include fill(
                $button-pressed-text,
                $button-pressed-bg,
                $button-pressed-border,
                $button-pressed-gradient
            );
            @include box-shadow( $button-pressed-shadow );
        }

        &:hover {
            @include fill(
                $button-hovered-text,
                $button-hovered-bg,
                $button-hovered-border,
                $button-hovered-gradient
            );
        }
    }


    // Filter menu
    .k-spreadsheet-filter-menu {

        > .k-menu,
        > .k-menu:not(.k-context-menu) {

            .k-item.k-state-hover {
                @include fill(
                    $list-item-hovered-text,
                    $list-item-hovered-bg
                );
            }
        }

        .k-spreadsheet-value-treeview-wrapper {
            @include fill(
                $panel-text,
                $panel-bg,
                $panel-border
            );
        }
    }

}




@include exports( "spreadsheet/tools/theme" ) {

    .k-spreadsheet-popup {

        // Buttons
        .k-button {}

        .k-button:hover,
        .k-button.k-state-hover {
            @include fill(
                $list-item-hovered-text,
                $list-item-hovered-bg
            );
        }
        .k-button:active,
        .k-button.k-state-active,
        .k-button.k-state-selected {
            @include fill(
                $list-item-selected-text,
                $list-item-selected-bg
            );
        }

    }

}




@include exports( "spreadsheet/drawing/theme" ) {

    .k-spreadsheet-insert-image-dialog {
        border-color: $spreadsheet-insert-image-dialog-preview-border;

        .k-spreadsheet-has-image {
            &:hover,
            &.k-state-hovered {
                box-shadow: $spreadsheet-insert-image-dialog-preview-overlay-shadow;
            }

            &:hover div,
            &.k-state-hovered div {
                color: $spreadsheet-insert-image-dialog-overlay-hovered-text;
            }
        }
    }

    .k-spreadsheet-drawing {
        &.k-spreadsheet-active-drawing {
            outline-color: $spreadsheet-drawing-handle-outline-color;
        }

        .k-spreadsheet-drawing-handle {
            border-color: $spreadsheet-drawing-handle-border-color;
            background-color: $spreadsheet-drawing-handle-bg;
        }
    }

    .k-spreadsheet-drawing-anchor-cell {
        background: $spreadsheet-drawing-anchor-bg;
    }

}




@include exports("spreadsheet/rtl/theme") {

    .k-rtl .k-spreadsheet,
    .k-spreadsheet[dir="rtl"],
    [dir="rtl"] .k-spreadsheet {

        .k-spreadsheet-has-comment::after {
            border-color: $primary transparent transparent $primary;
        }

        .k-dirty {
            border-color: $error $error transparent transparent;
        }

    }

}