@use "sass:map";
@use "../core/_index.scss" as *;
@use "../core/functions/index.scss" as *;
@use "./_variables.scss" as *;
@use "@progress/kendo-theme-core/scss/components/input/_theme.scss" as *;

@mixin kendo-input--theme() {

    @include kendo-input--theme-base();

    .k-input {

        &:focus,
        &.k-focus,
        &:focus-within {

            &::after {
                border-color: $kendo-input-focus-border;
            }
        }

        &.k-invalid,
        &.ng-invalid.ng-touched,
        &.ng-invalid.ng-dirty {

            &:focus,
            &.k-focus,
            &:focus-within {

                &::after {
                    border-color: $kendo-input-invalid-border;
                }
            }
        }

        &:disabled,
        &[disabled],
        &.k-disabled {

            .k-input-prefix {
                color: $kendo-input-prefix-disabled-text;
            }

            .k-input-suffix {
                color: $kendo-input-suffix-disabled-text;
            }

            .k-input-button {
                color: inherit;
                background: none;
            }
        }

        #{k-when-default($kendo-input-default-fill-mode, "solid")}
        &.k-input-solid {
            border-bottom-color: k-color(border);

            &:hover,
            &.k-hover {
                border-bottom-color: k-color(border);
            }

            &:focus,
            &.k-focus,
            &:focus-within {
                border-color: $kendo-input-border;
                border-bottom-color: $kendo-input-focus-border;

            }

            &.k-invalid,
            &.ng-invalid.ng-touched,
            &.ng-invalid.ng-dirty {
                border-color: $kendo-input-border;
                border-bottom-color: $kendo-input-invalid-border;
            }
        }


        #{k-when-default($kendo-input-default-fill-mode, "outline")}
        &.k-input-outline {
            &:disabled,
            &[disabled],
            &.k-disabled {
                color: $kendo-input-outline-disabled-text;
                background: $kendo-input-outline-disabled-bg;
                border-color: $kendo-input-outline-disabled-border;
            }
        }

        #{k-when-default($kendo-input-default-fill-mode, "flat")}
        &.k-input-flat {
            &:disabled,
            &[disabled],
            &.k-disabled {
                color: $kendo-input-flat-disabled-text;
                background: $kendo-input-flat-disabled-bg;
                border-color: $kendo-input-flat-disabled-border;
            }
        }
    }


    .k-picker {

        &:focus,
        &.k-focus,
        &:focus-within {
            &::after {
                border-color: $kendo-picker-focus-border;
            }
        }

        // Invalid
        &.k-invalid,
        &.ng-invalid.ng-touched,
        &.ng-invalid.ng-dirty {
            .k-input-validation-icon {
                color: $kendo-input-invalid-text;
            }

        }

        #{k-when-default($kendo-picker-default-fill-mode, "solid")}
        &.k-picker-solid {
            border-bottom-color: k-color(border);

            &:hover,
            &.k-hover {
                border-bottom-color: k-color(border);
            }

            &:focus,
            &.k-focus,
            &:focus-within {
                border-color: $kendo-input-border;
                border-bottom-color: $kendo-input-focus-border;

            }

            &.k-invalid,
            &.ng-invalid.ng-touched,
            &.ng-invalid.ng-dirty {
                border-color: $kendo-input-border;
                border-bottom-color: $kendo-input-invalid-border;
            }
        }

        #{k-when-default($kendo-picker-default-fill-mode, ("solid", "flat"))}
        &.k-picker-solid,
        &.k-picker-flat {
            // Invalid
            &.k-invalid,
            &.ng-invalid.ng-touched,
            &.ng-invalid.ng-dirty {
                border-color: $kendo-input-border;
                border-bottom-color: $kendo-input-invalid-border;

                &::after {
                    border-color: $kendo-input-invalid-border;
                }
            }
        }

        #{k-when-default($kendo-picker-default-fill-mode, "outline")}
        &.k-picker-outline {
            &:disabled,
            &[disabled],
            &.k-disabled {
                color: $kendo-picker-outline-disabled-text;
                background: $kendo-picker-outline-disabled-bg;
                border-color: $kendo-picker-outline-disabled-border;
            }
        }

        #{k-when-default($kendo-picker-default-fill-mode, "flat")}
        &.k-picker-flat {
            &:disabled,
            &[disabled],
            &.k-disabled {
                color: $kendo-picker-flat-disabled-text;
                background: $kendo-picker-flat-disabled-bg;
                border-color: $kendo-picker-flat-disabled-border;
            }
        }

    }

}