_base.scss

$widget-border-width: 1px !default;

@include exports( "common/asp-fallback-class" ) {

    .k-theme-test-class,
    .k-common-test-class {
        opacity: 0;
    }

}

@include exports( "common/layout" ) {

    // Layout
    .k-reset {
        margin: 0;
        padding: 0;
        border-width: 0;
        outline: 0;
        text-decoration: none;
        font: inherit;
        list-style: none;
    }

    kendo-sortable {
        display: block;
    }


    // RTL
    .k-rtl {
        direction: rtl;
    }


    // Links
    .k-link,
    .k-link:hover {
        color: inherit;
        text-decoration: none;
        outline: 0;
        cursor: pointer;
    }

    // Outline
    .k-content {
        outline: 0;
    }


    // Centering
    .k-centered {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }


    // Disable mouse events
    .k-no-click {
        pointer-events: none;
    }


    // Off-screen container used during PDF export
    .k-pdf-export-shadow {
        position: absolute;
        overflow: hidden;
        left: -15000px;
        width: 14400px;
    }

    // PDF export icons fix
    .kendo-pdf-hide-pseudo-elements::before,
    .kendo-pdf-hide-pseudo-elements::after {
        // sass-lint:disable-block no-important
        display: none !important;
    }

    // Hide Script tags
    // see https://github.com/telerik/kendo-themes/issues/2360
    script {
        display: none !important; // sass-lint:disable-line no-important
    }
}


@include exports( "common/theme" ) {

    // Text selection
    .k-text-selection {
        ::selection {
            background-color: $primary;
            color: $primary-contrast;
        }
    }

    // Panels
    .k-block,
    .k-panel {
        @extend .k-text-selection !optional;
        @include border-radius( $border-radius );
        @include fill(
            $panel-text,
            $panel-bg,
            $panel-border
        );
        padding: $panel-padding-y $panel-padding-x;
        border-width: 1px;
        border-style: solid;
        box-sizing: border-box;

        > .k-header {
            @include border-top-radius( $border-radius );
            @include fill(
                $header-text,
                $header-bg,
                $header-border,
                $header-gradient
            );
            margin: #{-$panel-padding-y} #{-$panel-padding-x} $panel-padding-y;
            padding: $header-padding-y $header-padding-x;
        }
    }
    .k-content {
        @include fill(
            $panel-text,
            $panel-bg,
            $panel-border
        );
    }

}


@include exports( "common/disabled" ) {

    // Disabled state
    .k-state-disabled,
    .k-widget[disabled] {
        @include disabled( $disabled-styling );


        .k-link,
        .k-button {
            cursor: default;
            outline: 0;
        }


        // Nested disabled
        [disabled],
        .k-state-disabled {
            opacity: 1;
            filter: grayscale(0);
        }
    }

}


@include exports( "common/misc/hr" ) {

    .k-hr {
        margin: $spacer-y auto;
        padding: 0;
        height: 0;
        border-width: 1px 0 0;
        border-style: solid;
        border-color: $panel-border;
        display: block;
        float: none;
        clear: both;
    }

    // Horizontal rule
    .k-d-flex-row > .k-hr {
        margin: 0;
        width: 0;
        height: auto;
        border-width: 0 0 0 1px;
        flex: 0 0 auto;
    }

    // Vertical rule
    .k-d-flex-col > .k-hr {
        margin: 0;
        flex: 0 0 auto;
    }

}


@include exports( "common/misc/dirty" ) {

    // Dirty indicator
    .k-dirty {
        margin: 0;
        padding: 0;
        width: 0;
        height: 0;
        border-width: 3px;
        border-style: solid;
        border-color: $error $error transparent transparent;
        position: absolute;
        top: 0;
        right: 0;
    }

    [dir = "rtl"],
    .k-rtl {
        .k-dirty {
            border-color: transparent transparent $error $error;
            right: auto;
            left: 0;
        }
    }

}

@include exports( "common/placeholder" ) {

    .k-placeholder-line {
        width: $placeholder-line-width;
        height: $placeholder-line-height;
        background-color: $placeholder-bg;
        display: inline-block;
    }
}

@include exports( "common/drop-hint" ) {

    .k-drop-hint {
        display: flex;
        gap: $drop-hint-arrow-spacing;
        justify-content: space-between;
        align-items: center;
        position: absolute;
        z-index: 1000;
        transform: translate(-50%, -50%);
    }

    .k-drop-hint-start,
    .k-drop-hint-end {
        flex-shrink: 0;
        border-width: ($drop-hint-arrow-size / 2);
        border-style: solid;
        border-color: transparent;
    }

    .k-drop-hint-line {
        flex-grow: 1;
        background-color: $drop-hint-bg;
    }

    .k-drop-hint-h {
        .k-drop-hint-start {
            border-left-width: (($drop-hint-arrow-size / 2) * $equilateral-index);
            border-left-color: $drop-hint-bg;
            border-right-width: 0;
        }

        .k-drop-hint-line {
            width: $drop-hint-line-h-width;
            height: $drop-hint-line-h-height;
        }

        .k-drop-hint-end {
            border-right-width: (($drop-hint-arrow-size / 2) * $equilateral-index);
            border-right-color: $drop-hint-bg;
            border-left-width: 0;
        }
    }

    .k-drop-hint-v {
        flex-direction: column;

        .k-drop-hint-start {
            border-top-width: (($drop-hint-arrow-size / 2) * $equilateral-index);
            border-top-color: $drop-hint-bg;
            border-bottom-width: 0;
        }

        .k-drop-hint-line {
            width: $drop-hint-line-v-width;
            height: $drop-hint-line-v-height;
        }

        .k-drop-hint-end {
            border-bottom-width: (($drop-hint-arrow-size / 2) * $equilateral-index);
            border-bottom-color: $drop-hint-bg;
            border-top-width: 0;
        }
    }

}