@use 'sass:map';
@use '../../config';
@use '../../functions' as *;
@use '../../schemas/' as *;
@use '../../../utils/map' as *;
@use '../../../color/functions' as *;
@use '../../../elevations/' as *;

////
/// @package theming
/// @group themes
/// @access public
/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
////

/// Input Group Theme
///
/// PRIMARY TOKENS:
/// - `$box-background` — Box type input background.
/// - `$search-background` — Search type input background.
/// - `$border-color` — Border color for border/fluent types.
/// - `$idle-bottom-line-color` — Bottom line color (material).
/// - `$focused-border-color` — Focused state accent color.
///
/// For Material variant, set `$box-background` for box type inputs.
///
/// @param {Map} $schema [$light-material-schema] - The schema used as basis for styling the component.
/// @param {Color} $idle-text-color [null] - The input text color in the idle state. Auto-derived from box/search-background.
/// @param {Color} $filled-text-color [null] - The input text color in the filled state. Auto-derived from box/search-background.
/// @param {Color} $filled-text-hover-color [null] - The input text color in the filled state on hover.
/// @param {Color} $focused-text-color [null] - The input text color in the focused state. Auto-derived from box-background-focus or search-background.
/// @param {Color} $disabled-text-color [null] - The input text color in the disabled state. Auto-derived from disabled background.
/// @param {Color} $helper-text-color [null] - The helper text color.
/// @param {Color} $text-error-color [null] - The color used for the error message.
/// @param {Color} $icon-error-color [null] - The color used for the error icon.
/// @param {Color} $input-prefix-color [null] - The input prefix color in the idle state. Auto-derived from box/search-background.
/// @param {Color} $input-prefix-background [null] - The background color of an input prefix in the idle state. Synced with suffix-background.
/// @param {Color} $input-prefix-color--filled [null] - The input prefix color in the filled state. Auto-derived from prefix-color or background.
/// @param {Color} $input-prefix-background--filled - The background color of an input prefix in the filled state.
/// @param {Color} $input-prefix-color--focused [null] - The input prefix color in the focused state. Auto-derived from prefix-color--filled or background.
/// @param {Color} $input-prefix-background--focused [null] - The background color of an input prefix in the focused state.
/// @param {Color} $input-suffix-color [null] - The input suffix color in the idle state. Auto-derived from box/search-background. Synced with prefix-color.
/// @param {Color} $input-suffix-background [null] - The background color of an input suffix in the idle state. Synced with prefix-background.
/// @param {Color} $input-suffix-color--filled [null] - The input suffix color in the filled state.
/// @param {Color} $input-suffix-background-filled [null] - The background color of an input suffix in the filled state.
/// @param {Color} $input-suffix-color--focused [null] - The input suffix color in the focused state.
/// @param {Color} $input-suffix-background--focused [null] - The background color of an input suffix in the focused state.
/// @param {Color} $idle-secondary-color [null] - The label color in the idle state. Auto-derived from box-background or placeholder-color.
/// @param {Color} $focused-secondary-color [null] - The label color in the focused state. Auto-derived from focused-bottom-line-color or focused-border-color.
/// @param {Color} $idle-bottom-line-color [null] - The bottom line and border colors in the idle state. PRIMARY for material bottom line.
/// @param {Color} $hover-bottom-line-color [null] - The bottom line and border colors in the hover state. Auto-derived from idle-bottom-line-color.
/// @param {Color} $focused-bottom-line-color [null] - The bottom line and border colors in the focused state. Auto-derived from hover-bottom-line-color.
/// @param {Color} $disabled-bottom-line-color [null] - The bottom line and border colors in the disabled state.
/// @param {Color} $border-color [null] - The border color for input groups of type border and fluent. PRIMARY for border inputs.
/// @param {Color} $hover-border-color [null] - The hover input border for input groups of type border and fluent. Auto-derived from border-color.
/// @param {Color} $focused-border-color [null] - The focused input border color for input groups of type border and fluent. Auto-derived from hover-border-color.
/// @param {Color} $disabled-border-color [null] - The disabled border color for input groups of type border and fluent.
/// @param {Color} $box-background [null] - The background color of an input group of type box. PRIMARY for material box inputs.
/// @param {Color} $box-background-hover [null] - The background color on hover of an input group of type box. Auto-derived from box-background.
/// @param {Color} $box-background-focus [null] - The background color on focus of an input group of type box. Auto-derived from box-background.
/// @param {Color} $box-disabled-background [null] - The background color of an input group of type box in the disabled state. Auto-derived from box-background.
/// @param {Color} $border-background [null] - The background color of an input group of type border.
/// @param {Color} $border-disabled-background [null] - The background color of an input group of type border in the disabled state.
/// @param {Color} $search-background [null] - The background color of an input group of type search. PRIMARY for search inputs.
/// @param {Color} $search-disabled-background [null] - The background color of an input group of type search in the disabled state. Auto-derived from search-background.
/// @param {List} $search-resting-shadow [null] - The shadow color of an input group of type search in its resting state.
/// @param {List} $search-hover-shadow [null] - The shadow color of an input group of type search in its hover state.
/// @param {List} $search-disabled-shadow [null] - The shadow color of an input group of type search in its disabled state.
/// @param {Color} $success-secondary-color [null] - The success color used in the valid state.
/// @param {Color} $warning-secondary-color [null] - The warning color used in the warning state.
/// @param {Color} $error-secondary-color [null] - The error color used in the error state.
/// @param {List} $box-border-radius [null] - The border radius used for box input.
/// @param {List} $border-border-radius [null] - The border radius used for border input.
/// @param {List} $search-border-radius [null] - The border radius used for search input.
/// @param {Color} $placeholder-color [null] - The placeholder color of an input group. Auto-derived from box/search-background.
/// @param {Color} $hover-placeholder-color [null] - The placeholder color of an input group on hover. Auto-derived from box-background-hover or placeholder-color.
/// @param {Color} $disabled-placeholder-color [null] - The disabled placeholder color of an input group. Auto-derived from disabled background.
/// @example scss - Change the focused border and label colors
///   $my-input-group-theme: input-group-theme($focused-secondary-color: pink, $focused-bottom-line-color: pink);
///   // Pass the theme to the css-vars() mixin
///   @include css-vars($my-input-group-theme);
@function input-group-theme(
    $schema: $light-material-schema,

    $box-background: null,
    $box-background-hover: null,
    $box-background-focus: null,
    $box-disabled-background: null,
    $box-border-radius: null,

    $idle-text-color: null,
    $filled-text-color: null,
    $filled-text-hover-color: null,
    $focused-text-color: null,
    $helper-text-color: null,
    $text-error-color: null,
    $icon-error-color: null,
    $disabled-text-color: null,

    $idle-secondary-color: null,
    $focused-secondary-color: null,

    $idle-bottom-line-color: null,
    $hover-bottom-line-color: null,
    $focused-bottom-line-color: null,
    $disabled-bottom-line-color: null,

    $border-color: null,
    $hover-border-color: null,
    $focused-border-color: null,
    $disabled-border-color: null,

    $border-border-radius: null,
    $border-background: null,
    $border-disabled-background: null,

    $search-background: null,
    $search-disabled-background: null,
    $search-border-radius: null,
    $search-resting-shadow: null,
    $search-hover-shadow: null,
    $search-disabled-shadow: null,

    $success-secondary-color: null,
    $warning-secondary-color: null,
    $error-secondary-color: null,
    $success-shadow-color: null,
    $error-shadow-color: null,

    $placeholder-color: null,
    $hover-placeholder-color: null,
    $disabled-placeholder-color: null,

    $input-prefix-color: null,
    $input-prefix-background: null,
    $input-prefix-color--filled: null,
    $input-prefix-background--filled: null,
    $input-prefix-color--focused: null,
    $input-prefix-background--focused: null,

    $input-suffix-color: null,
    $input-suffix-background: null,
    $input-suffix-color--filled: null,
    $input-suffix-background--filled: null,
    $input-suffix-color--focused: null,
    $input-suffix-background--focused: null,
    $size: null
) {
    $selector: (
        #{config.element-prefix() + '-' + 'input-group'},
        #{config.element-prefix() + '-' + 'date-range-start'},
        #{config.element-prefix() + '-' + 'date-range-end'},
        #{config.element-prefix() + '-' + 'date-time-input'}
    );
    $input-group-schema: ();

    @if map.has-key($schema, 'input-group') {
        $input-group-schema: map.get($schema, 'input-group');
    } @else {
        $input-group-schema: $schema;
    }

    $theme: digest-schema($input-group-schema);
    $variant: map.get($theme, '_meta', 'theme');
    $search-resting-elevation: map.get($input-group-schema, 'search-resting-elevation');
    $search-hover-elevation: map.get($input-group-schema, 'search-hover-elevation');
    $search-disabled-elevation: map.get($input-group-schema, 'search-disabled-elevation');

    // if idle-text-color is set but no box/search background, derive all text states from it
    @if $idle-text-color {
        @if not($filled-text-color) {
            $filled-text-color: var(--idle-text-color);
        }

        @if not($filled-text-hover-color) {
            $filled-text-hover-color: var(--idle-text-color);
        }

        @if not($focused-text-color) {
            $focused-text-color: var(--idle-text-color);
        }

        @if $variant == 'material' or $variant == 'indigo' {
            @if not($input-prefix-color) {
                $input-prefix-color: var(--idle-text-color);
            }

            @if not($input-prefix-color--filled) {
                $input-prefix-color--filled: var(--idle-text-color);
            }

            @if not($input-prefix-color--focused) {
                $input-prefix-color--focused: var(--idle-text-color);
            }

            @if not($input-suffix-color) {
                $input-suffix-color: var(--idle-text-color);
            }

            @if not($input-suffix-color--filled) {
                $input-suffix-color--filled: var(--idle-text-color);
            }

            @if not($input-suffix-color--focused) {
                $input-suffix-color--focused: var(--idle-text-color);
            }
        }

        @if not($disabled-text-color) {
            $disabled-text-color: hsl(from var(--idle-text-color) h s l / 0.7);
        }
    }

    @if $placeholder-color {
        @if not($hover-placeholder-color) {
            $hover-placeholder-color: var(--placeholder-color);
        }

        @if not($disabled-placeholder-color) {
            $disabled-placeholder-color: hsl(from var(--placeholder-color) h s l / 0.7);
        }
    }

    @if $variant == 'material' {
        @if not($box-background-hover) and $box-background {
            $box-background-hover: var(--box-background);
        }

        @if not($box-background-focus) and $box-background {
            $box-background-focus: dynamic-shade(var(--box-background));
        }

        @if not($placeholder-color) and $box-background {
            $placeholder-color: hsl(from adaptive-contrast(var(--box-background)) h s l / 0.9);
        }

        @if not($hover-placeholder-color) and $box-background-hover {
            $hover-placeholder-color: hsl(from adaptive-contrast(var(--box-background-hover)) h s l / 0.9);
        }

        @if not($idle-text-color) and $box-background {
            $idle-text-color: adaptive-contrast(var(--box-background));
        }

        @if not($filled-text-color) and $box-background {
            $filled-text-color: adaptive-contrast(var(--box-background));
        }

        @if not($filled-text-hover-color) and $box-background {
            $filled-text-hover-color: adaptive-contrast(var(--box-background));
        }

        @if not($focused-text-color) and $box-background-focus {
            $focused-text-color: adaptive-contrast(var(--box-background-focus));
        }

        @if not($idle-secondary-color) and $box-background {
            $idle-secondary-color: hsl(from adaptive-contrast(var(--box-background)) h s l / 0.9);
        }

        @if not($input-prefix-color) and $box-background {
            $input-prefix-color: hsl(from adaptive-contrast(var(--box-background)) h s l / 0.9);
        }

        @if not($input-prefix-color--filled) and $box-background {
            $input-prefix-color--filled: adaptive-contrast(var(--box-background));
        }

        @if not($input-prefix-color--focused) and $box-background-focus {
            $input-prefix-color--focused: adaptive-contrast(var(--box-background-focus));
        }

        @if not($input-suffix-color) and $box-background {
            $input-suffix-color: hsl(from adaptive-contrast(var(--box-background)) h s l / 0.9);
        }

        @if not($input-suffix-color--filled) and $box-background {
            $input-suffix-color--filled: adaptive-contrast(var(--box-background));
        }

        @if not($input-suffix-color--focused) and $box-background-focus {
            $input-suffix-color--focused: adaptive-contrast(var(--box-background-focus));
        }

        @if $box-background != transparent {
            @if not($box-disabled-background) and $box-background {
                $box-disabled-background: hsl(from var(--box-background) h s l / 0.4);
            }

            @if not($disabled-placeholder-color) and $box-disabled-background {
                $disabled-placeholder-color: adaptive-contrast(var(--box-disabled-background));
            }

            @if not($disabled-text-color) and $box-disabled-background {
                $disabled-text-color: adaptive-contrast(var(--box-disabled-background));
            }
        } @else {
            @if not($box-disabled-background) and $box-background {
                $box-disabled-background: var(--box-background);
            }

            @if not($disabled-placeholder-color) and $placeholder-color {
                $disabled-placeholder-color: hsl(from var(--placeholder-color) h s l / 0.7);
            }

            @if not($disabled-text-color) and $idle-text-color {
                $disabled-text-color: hsl(from var(--idle-text-color) h s l / 0.7);
            }
        }
    }

    @if $variant == 'fluent' or $variant == 'bootstrap' {
        @if not($input-prefix-background) and $input-suffix-background {
            $input-prefix-background: var(--input-suffix-background);
        }

        @if not($input-suffix-background) and $input-prefix-background {
            $input-suffix-background: var(--input-prefix-background);
        }
    }

    @if $variant == 'material' or $variant == 'indigo' {
        // bottom line color
        @if not($hover-bottom-line-color) and $idle-bottom-line-color {
            $hover-bottom-line-color: dynamic-shade(var(--idle-bottom-line-color), $offset: 10);
        }

        @if not($focused-bottom-line-color) and $hover-bottom-line-color {
            $focused-bottom-line-color: var(--hover-bottom-line-color);
        }

        @if not($disabled-bottom-line-color) and $idle-bottom-line-color {
            $disabled-bottom-line-color: hsl(from var(--idle-bottom-line-color) h s l / 0.5);
        }

        @if $variant == 'material' {
            @if not($focused-secondary-color) and $focused-bottom-line-color {
                $focused-secondary-color: var(--focused-bottom-line-color);
            }

            @if not($border-color) and $idle-bottom-line-color {
                $border-color: var(--idle-bottom-line-color);
            }
        }
    }

    // border-color
    @if $variant == 'bootstrap' {
        @if not($focused-border-color) and $border-color {
            $focused-border-color: dynamic-shade(var(--border-color), $offset: 10);
        }

        @if not($focused-secondary-color) and $focused-border-color {
            $focused-secondary-color: hsl(from var(--focused-border-color) h s l / 0.4);
        }
    } @else {
        @if not($hover-border-color) and $border-color {
            $hover-border-color: dynamic-shade(var(--border-color), $offset: 10);
        }

        @if not($focused-border-color) and $hover-border-color {
            $focused-border-color: var(--hover-border-color);
        }

        @if $variant != 'indigo' {
            @if not($focused-secondary-color) and $focused-border-color {
                $focused-secondary-color: var(--focused-border-color);
            }
        }
    }

    @if $variant == 'material' {
        @if not($focused-bottom-line-color) and $focused-border-color {
            $focused-bottom-line-color: var(--focused-border-color);
        }
    }

    // search input
    @if not($placeholder-color) and $search-background {
        $placeholder-color: hsl(from adaptive-contrast(var(--search-background)) h s l / 0.9);
    }

    @if not($hover-placeholder-color) and $placeholder-color {
        $hover-placeholder-color: var(--placeholder-color);
    }

    @if $variant == 'indigo' {
        @if not($box-background-hover) and $search-background {
            $box-background-hover: var(--search-background);
        }
    } @else {
        @if not($idle-secondary-color) and $placeholder-color {
            $idle-secondary-color: var(--placeholder-color);
        }
    }

    @if not($idle-text-color) and $search-background {
        $idle-text-color: adaptive-contrast(var(--search-background));
    }

    @if not($filled-text-color) and $search-background {
        $filled-text-color: adaptive-contrast(var(--search-background));
    }

    @if not($filled-text-hover-color) and $search-background {
        $filled-text-hover-color: adaptive-contrast(var(--search-background));
    }

    @if not($focused-text-color) and $search-background {
        $focused-text-color: adaptive-contrast(var(--search-background));
    }

    @if not($input-prefix-color) and $search-background {
        $input-prefix-color: hsl(from adaptive-contrast(var(--search-background)) h s l / 0.9);
    }

    @if not($input-suffix-color) and $search-background {
        $input-suffix-color: hsl(from adaptive-contrast(var(--search-background)) h s l / 0.9);
    }

    @if $variant != 'indigo' {
        @if not($input-prefix-color--filled) and $search-background {
            $input-prefix-color--filled: adaptive-contrast(var(--search-background));
        }

        @if not($input-prefix-color--focused) and $search-background {
            $input-prefix-color--focused: adaptive-contrast(var(--search-background));
        }

        @if not($input-suffix-color--filled) and $search-background {
            $input-suffix-color--filled: adaptive-contrast(var(--search-background));
        }

        @if not($input-suffix-color--focused) and $search-background {
            $input-suffix-color--focused: adaptive-contrast(var(--search-background));
        }
    }

    @if $search-background != transparent {
        @if not($search-disabled-background) and $search-background {
            $search-disabled-background: hsl(from var(--search-background) h s l / 0.4);
        }

        @if not($disabled-placeholder-color) and $search-disabled-background {
            $disabled-placeholder-color: adaptive-contrast(var(--search-disabled-background));
        }

        @if not($disabled-text-color) and $search-disabled-background {
            $disabled-text-color: adaptive-contrast(var(--search-disabled-background));
        }
    } @else {
        @if not($search-disabled-background) and $search-background {
            $search-disabled-background: var(--search-background);
        }

        @if not($disabled-placeholder-color) and $placeholder-color {
            $disabled-placeholder-color: hsl(from var(--placeholder-color) h s l / 0.7);
        }

        @if not($disabled-text-color) and $idle-text-color {
            $disabled-text-color: hsl(from var(--idle-text-color) h s l / 0.7);
        }
    }

    @if not($search-resting-shadow) {
        $search-resting-shadow: elevation($search-resting-elevation);
    }

    @if not($search-hover-shadow) {
        $search-hover-shadow: elevation($search-hover-elevation);
    }

    @if not($search-disabled-shadow) {
        $search-disabled-shadow: elevation($search-disabled-elevation);
    }

    // end search input

    @if not($input-prefix-color) and $input-suffix-color {
        $input-prefix-color: var(--input-suffix-color);
    }

    @if not($input-suffix-color) and $input-prefix-color {
        $input-suffix-color: var(--input-prefix-color);
    }

    @if not($input-prefix-background--filled) and $input-prefix-background {
        $input-prefix-background--filled: var(--input-prefix-background);
    }

    @if not($input-prefix-background--focused) and $input-prefix-background {
        $input-prefix-background--focused: var(--input-prefix-background);
    }

    @if not($input-prefix-color) and $input-prefix-background {
        $input-prefix-color: adaptive-contrast(var(--input-prefix-background));
    }

    @if not($input-prefix-color--filled) and $input-prefix-color {
        $input-prefix-color--filled: var(--input-prefix-color);
    }

    @if not($input-prefix-color--focused) and $input-prefix-color--filled {
        $input-prefix-color--focused: var(--input-prefix-color--filled);
    }

    @if not($input-prefix-color--filled) and $input-prefix-background--filled {
        $input-prefix-color--filled: adaptive-contrast(var(--input-prefix-background--filled));
    }

    @if not($input-prefix-color--focused) and $input-prefix-background--focused {
        $input-prefix-color--focused: adaptive-contrast(var(--input-prefix-background--focused));
    }

    @if not($input-suffix-background--filled) and $input-suffix-background {
        $input-suffix-background--filled: var(--input-suffix-background);
    }

    @if not($input-suffix-background--focused) and $input-suffix-background {
        $input-suffix-background--focused: var(--input-suffix-background);
    }

    @if not($input-suffix-color) and $input-suffix-background {
        $input-suffix-color: adaptive-contrast(var(--input-suffix-background));
    }

    @if not($input-suffix-color--filled) and $input-suffix-color {
        $input-suffix-color--filled: var(--input-suffix-color);
    }

    @if not($input-suffix-color--focused) and $input-suffix-color--filled {
        $input-suffix-color--focused: var(--input-suffix-color--filled);
    }

    @if not($input-suffix-color--filled) and $input-suffix-background--filled {
        $input-suffix-color--filled: adaptive-contrast(var(--input-suffix-background--filled));
    }

    @if not($input-suffix-color--focused) and $input-suffix-background--focused {
        $input-suffix-color--focused: adaptive-contrast(var(--input-suffix-background--focused));
    }

    @if not($box-border-radius) {
        $box-border-radius: map.get($theme, 'box-border-radius');
    }

    @if not($border-border-radius) {
        $border-border-radius: map.get($theme, 'border-border-radius');
    }

    @if not($search-border-radius) {
        $search-border-radius: map.get($theme, 'search-border-radius');
    }

    @return extend(
        $theme,
        (
            selector: $selector,
            idle-text-color: $idle-text-color,
            filled-text-color: $filled-text-color,
            filled-text-hover-color: $filled-text-hover-color,
            focused-text-color: $focused-text-color,
            disabled-text-color: $disabled-text-color,
            helper-text-color: $helper-text-color,
            text-error-color: $text-error-color,
            icon-error-color: $icon-error-color,
            box-border-radius: $box-border-radius,
            border-border-radius: $border-border-radius,
            search-border-radius: $search-border-radius,
            idle-secondary-color: $idle-secondary-color,
            focused-secondary-color: $focused-secondary-color,
            idle-bottom-line-color: $idle-bottom-line-color,
            hover-bottom-line-color: $hover-bottom-line-color,
            focused-bottom-line-color: $focused-bottom-line-color,
            disabled-bottom-line-color: $disabled-bottom-line-color,
            border-color: $border-color,
            hover-border-color: $hover-border-color,
            focused-border-color: $focused-border-color,
            disabled-border-color: $disabled-border-color,
            box-background: $box-background,
            box-background-hover: $box-background-hover,
            box-background-focus: $box-background-focus,
            box-disabled-background: $box-disabled-background,
            border-background: $border-background,
            border-disabled-background: $border-disabled-background,
            search-background: $search-background,
            search-disabled-background: $search-disabled-background,
            search-resting-elevation: $search-resting-shadow,
            search-hover-elevation: $search-hover-shadow,
            search-disabled-elevation: $search-disabled-shadow,
            success-secondary-color: $success-secondary-color,
            warning-secondary-color: $warning-secondary-color,
            error-secondary-color: $error-secondary-color,
            success-shadow-color: $success-shadow-color,
            error-shadow-color: $error-shadow-color,
            placeholder-color: $placeholder-color,
            hover-placeholder-color: $hover-placeholder-color,
            disabled-placeholder-color: $disabled-placeholder-color,
            input-prefix-color: $input-prefix-color,
            input-prefix-background: $input-prefix-background,
            input-prefix-color--filled: $input-prefix-color--filled,
            input-prefix-background--filled: $input-prefix-background--filled,
            input-prefix-color--focused: $input-prefix-color--focused,
            input-prefix-background--focused: $input-prefix-background--focused,
            input-suffix-color: $input-suffix-color,
            input-suffix-background: $input-suffix-background,
            input-suffix-color--filled: $input-suffix-color--filled,
            input-suffix-background--filled: $input-suffix-background--filled,
            input-suffix-color--focused: $input-suffix-color--focused,
            input-suffix-background--focused: $input-suffix-background--focused,
            size: $size,
        )
    );
}

/// Date Time Input Theme
///
/// PRIMARY TOKENS:
/// - `$box-background` — Box type input background.
/// - `$search-background` — Search type input background.
/// - `$border-color` — Border color for border/fluent types.
/// - `$idle-bottom-line-color` — Bottom line color (material).
/// - `$focused-border-color` — Focused state accent color.
///
/// For Material variant, set `$box-background` for box type inputs.
///
/// @alias input-group-theme
@function date-time-input-theme($args...) {
    @return input-group-theme($args...);
}