igniteui-angular 20.0.7 → 20.0.9

package/lib/core/styles/components/calendar/_calendar-theme.scss

@@ -1,1081 +1,6 @@
 @use 'sass:map';
-@use 'sass:meta';
 @use 'sass:math';
 @use '../../base' as *;
-@use '../../themes/schemas' as *;
-
-////
-/// @group themes
-/// @access public
-/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
-/// @author <a href="https://github.com/desig9stein" target="_blank">Marin Popov</a>
-////
-
-/// If only header background color is specified, that color will be
-/// used as the leading color for all accented elements, such as:
-/// - current date color
-/// - selected date background
-/// - picker elements hover colors
-/// - year/month hover/selected colors
-/// If only background colors are specified, text/icon colors
-/// will be assigned automatically to a contrasting color.
-/// @param {Map} $schema [$light-material-schema] - The schema used as basis for styling the component.
-///
-/// @param {Color} $content-foreground [null] - The foreground of the days, months and years views.
-/// @param {Color} $content-background [null] - The background of the days, months and years views.
-/// @param {Color} $border-size [null] - The border size of all calendar views.
-///
-/// @param {Color} $header-foreground [null] - The header foreground.
-/// @param {Color} $header-background [null] - The header background.
-///
-/// @param {Color} $picker-foreground [null]- The foreground of the month and year pickers.
-/// @param {Color} $picker-background [null] - The background of the month and year pickers.
-/// @param {Color} $picker-hover-foreground [null]-  The :hover color of the month and year pickers.
-///
-/// @param {Color} $weekday-color [null] - The color for weekday labels.
-/// @param {Color} $inactive-color [null] - The color for previous and next month dates (visible only if [hideOutsideDays] is set to false(default)).
-/// @param {Color} $weekend-color [null] - The color for weekend days.
-///
-/// @param {Color} $week-number-foreground [null] - The foreground of the week number column.
-/// @param {Color} $week-number-background [null] - The background of the week number column.
-///
-/// @param {Color} $ym-selected-current-hover-foreground [null] - The :hover foreground for the current selected month/year.
-/// @param {Color} $ym-selected-current-hover-background [null] - The :hover background on hover for the current month/year.
-///
-/// @param {Color} $navigation-color [null] - The color of the icon button responsible for month navigation.
-/// @param {Color} $navigation-hover-color [null] - The :hover color of the icon button responsible for month navigation.
-/// @param {Color} $navigation-focus-color [null] - The :focus color of the icon button responsible for month navigation.
-///
-/// @param {Color} $ym-hover-foreground [null] - The :hover foreground of the month/year.
-/// @param {Color} $ym-hover-background [null] - The :hover background of the month/year.
-///
-/// @param {Color} $ym-current-foreground [null]- The foreground of the current month/year.
-/// @param {Color} $ym-current-background [null]- The background of the current month/year.
-/// @param {Color} $ym-current-hover-foreground [null]- The :hover foreground of the current month/year.
-/// @param {Color} $ym-current-hover-background [null]- The :hover background of the current month/year.
-///
-/// @param {Color} $ym-selected-foreground [null]- The foreground color of the selected month/year.
-/// @param {Color} $ym-selected-background [null]- The background color of the selected month/year.
-/// @param {Color} $ym-selected-hover-foreground [null] - The :hover foreground color of the currently selected month/year.
-/// @param {Color} $ym-selected-hover-background [null] - The :hover background color of the currently selected month/year.
-///
-/// @param {Color} $ym-selected-current-foreground [null]- The foreground color of the selected current month/year.
-/// @param {Color} $ym-selected-current-background [null]- The background color of the selected current month/year.
-/// @param {Color} $ym-selected-current-hover-foreground [null] - The :hover foreground color of the current selected month/year.
-/// @param {Color} $ym-selected-current-hover-background [null] - The :hover background color of the current selected month/year.
-///
-/// @param {Color} $ym-current-outline-color [null] - The outline color of the current month/year.
-/// @param {Color} $ym-current-outline-hover-color [null] - The :hover outline color of the current month/year.
-/// @param {Color} $ym-current-outline-focus-color [null] - The :focus outline color of the current month/year.
-///
-/// @param {Color} $ym-selected-outline-color [null] - The outline color of the selected month/year.
-/// @param {Color} $ym-selected-hover-outline-color [null] - The :hover outline color of the selected month/year.
-/// @param {Color} $ym-selected-focus-outline-color [null] - The :focus outline color of the selected month/year.
-///
-/// @param {Color} $ym-selected-current-outline-color [null] - The outline color of the selected current month/year.
-/// @param {Color} $ym-selected-current-outline-hover-color [null] - The :hover outline color of the selected current month/year.
-/// @param {Color} $ym-selected-current-outline-focus-color [null] - The :focus outline color of the selected current month/year.
-///
-/// @param {Color} $date-hover-foreground [null] - The :hover foreground in idle state of a date.
-/// @param {Color} $date-hover-background [null] - The :hover background in idle state of a date.
-/// @param {Color} $date-focus-foreground [null] - The :focus foreground in idle state of a date.
-/// @param {Color} $date-focus-background [null] - The :focus background in idle state of a date.
-///
-/// @param {Color} $date-selected-foreground [null] - The text color for the selected date.
-/// @param {Color} $date-selected-background [null] - The background color for the selected date.
-/// @param {Color} $date-selected-hover-background [null] - The hover background color for the selected date.
-/// @param {Color} $date-selected-focus-background [null] - The focus background color for the selected date.
-/// @param {Color} $date-selected-hover-foreground [null] - The hover text color for the selected date.
-/// @param {Color} $date-selected-focus-foreground [null] - The focus text color for the selected date.
-/// @param {Color} $date-selected-current-background [null] - The background color for the selected/current date.
-/// @param {Color} $date-selected-current-hover-background [null] - The hover background color for the selected/current date.
-/// @param {Color} $date-selected-current-focus-background [null] - The focus background color for the selected/current date.
-/// @param {Color} $date-selected-current-foreground [null] - The text color for the selected/current date.
-/// @param {Color} $date-selected-current-hover-foreground [null] - The hover text color for the selected/current date.
-/// @param {Color} $date-selected-current-focus-foreground [null] - The focus text color for the selected/current date.
-///
-/// @param {Color} $date-selected-range-foreground [null] - The foreground of the dates in the selected range.
-/// @param {Color} $date-selected-range-background [null] - The background of the dates in the selected range.
-/// @param {Color} $date-selected-range-hover-foreground [null] - The :hover foreground of the dates in the selected range.
-/// @param {Color} $date-selected-range-hover-background [null] - The :hover background of the dates in the selected range.
-/// @param {Color} $date-selected-range-focus-foreground [null] - The :focus foreground of the dates in the selected range.
-/// @param {Color} $date-selected-range-focus-background [null] - The :focus background of the dates in the selected range.
-///
-/// @param {Color} $date-selected-current-range-foreground [null] - The foreground of the current date in the selected range.
-/// @param {Color} $date-selected-current-range-background [null] - The background of the current date in the selected range.
-/// @param {Color} $date-selected-current-range-hover-foreground [null] - The :hover foreground of the current date in the selected range.
-/// @param {Color} $date-selected-current-range-hover-background [null] - The :hover background of the current date in the selected range.
-/// @param {Color} $date-selected-current-range-focus-foreground [null] - The :focus foreground of the current date in the selected range.
-/// @param {Color} $date-selected-current-range-focus-background [null] - The :focus background of the current date in the selected range.
-///
-/// @param {Color} $date-selected-special-border-color: [null] - The border color of the selected special date,
-/// @param {Color} $date-selected-special-hover-border-color: [null] - The :hover border color of the selected special date,
-/// @param {Color} $date-selected-special-focus-border-color: [null] - The :focus border color of the selected special date,
-///
-/// @param {Color} $date-current-foreground [null] - The foreground of the current date.
-/// @param {Color} $date-current-background [null] - The background color of the current date.
-/// @param {Color} $date-current-hover-foreground [null] - The :hover text color of the current date.
-/// @param {Color} $date-current-hover-background [null] - The :hover background color of the current date.
-/// @param {Color} $date-current-focus-foreground [null] - The :focus text color of the current date.
-/// @param {Color} $date-current-focus-background [null] - The :focus background color of the current date.
-///
-/// @param {Color} $date-special-background [null] - The background of the dates marked as special.
-/// @param {Color} $date-special-foreground [null] - The foreground of the dates marked as special.
-/// @param {Color} $date-special-hover-background [null] - The background of the dates marked as special.
-/// @param {Color} $date-special-hover-foreground [null] - The foreground of the dates marked as special.
-/// @param {Color} $date-special-focus-background [null] - The background of the dates marked as special.
-/// @param {Color} $date-special-focus-foreground [null] - The foreground of the dates marked as special.
-/// @param {Color} $date-special-border-color [null] - The outline of the dates marked as special.
-///
-/// @param {Color} $date-special-range-background [null] - The background of the dates inside a range and marked as special.
-/// @param {Color} $date-special-range-hover-background [null] - The :hover background of the dates inside a range and marked as special.
-/// @param {Color} $date-special-range-focus-background [null] - The :focus background of the dates inside a range and marked as special.
-/// @param {Color} $date-special-range-foreground [null] - The foreground of the dates inside a range and marked as special.
-/// @param {Color} $date-special-range-border-color [null] - The outline of the dates inside a range and marked as special.
-///
-/// @param {Color} $border-color [null] - The calendar border color.
-///
-/// @param {Color} $date-border-color [null] - The border color of the date.
-/// @param {Color} $date-hover-border-color [null] - The :hover border color of the date.
-/// @param {Color} $date-focus-border-color [null] - The :focus border color of the date.
-///
-/// @param {Color} $date-selected-border-color [null] - The border color of the selected date.
-/// @param {Color} $date-selected-hover-border-color [null] - The :hover border color of the selected date.
-/// @param {Color} $date-selected-focus-border-color [null] - The :focus border color of the selected date.
-/// @param {Color} $date-current-border-color [null] - The border color of the current date.
-/// @param {Color} $date-current-hover-border-color [null] - The :hover border color of the current date.
-/// @param {Color} $date-current-focus-border-color [null] - The :focus border color of the current date.
-/// @param {Color} $date-selected-current-border-color [null] - The border color of the selected current date.
-/// @param {Color} $date-selected-current-hover-border-color [null] - The :hover border color of the selected current date.
-/// @param {Color} $date-selected-current-focus-border-color [null] - The :focus border color of the selected current date.
-///
-/// @param {Color} $date-range-border-color [null] - The border color of range selection.
-/// @param {Color} $date-range-preview-border-color [null] - The border color of the range selection in preview state(visible before selecting the end of the range).
-/// @param {Color} $date-disabled-foreground [color: ('gray', 500, .5)] - The foreground color of disabled dates.
-/// @param {Color} $date-disabled-range-foreground [color: ('gray', 500)] - The foreground color of disabled dates.
-/// @param {Number} $size [null] - The size of the days, months, and years views.
-/// @param {List} $border-radius [null] - The border radius used for the calendar.
-/// @param {List} $date-border-radius [null] - The border radius used for the date.
-/// @param {List} $date-range-border-radius [null] - The border radius used for the date range selection.
-/// @param {List} $date-current-border-radius [null] - The border radius used for the current date .
-/// @param {List} $date-special-border-radius [null] - The border radius used for the special date.
-/// @param {List} $ym-border-radius [null] - The border radius used for the month/year.
-///
-/// @param {Color} $actions-divider-color [null] - The border color used for the date-picker actions divider.
-///
-/// @requires $light-material-schema
-///
-/// @example scss Change the header and content background colors
-///   $my-calendar-theme: calendar-theme(
-///     $header-background: purple,
-///     $content-background: black
-///   );
-///   // Pass the theme to the css-vars() mixin
-///   @include css-vars($my-calendar-theme);
-@function calendar-theme(
-    $schema: $light-material-schema,
-
-    $content-background: null,
-    $content-foreground: null,
-    $border-color: null,
-
-    $header-background: null,
-    $header-foreground: null,
-
-    $picker-foreground: null,
-    $picker-background: null,
-    $picker-hover-foreground: null,
-    $picker-focus-foreground: null,
-
-    $weekday-color: null,
-    $weekend-color: null,
-    $inactive-color: null,
-
-    $week-number-foreground: null,
-    $week-number-background: null,
-
-    $ym-selected-current-hover-foreground: null,
-    $ym-selected-current-hover-background: null,
-
-    $navigation-color: null,
-    $navigation-hover-color: null,
-    $navigation-focus-color: null,
-
-    $ym-hover-foreground: null,
-    $ym-hover-background: null,
-
-    $ym-current-foreground: null,
-    $ym-current-background: null,
-    $ym-current-hover-foreground: null,
-    $ym-current-hover-background: null,
-
-    $ym-selected-current-foreground: null,
-    $ym-selected-current-background: null,
-
-    $ym-selected-foreground: null,
-    $ym-selected-background: null,
-    $ym-selected-hover-foreground: null,
-    $ym-selected-hover-background: null,
-
-    $ym-current-outline-color: null,
-    $ym-current-outline-hover-color: null,
-    $ym-current-outline-focus-color: null,
-
-    $ym-selected-outline-color: null,
-    $ym-selected-hover-outline-color: null,
-    $ym-selected-focus-outline-color: null,
-
-    $ym-selected-current-outline-color: null,
-    $ym-selected-current-outline-hover-color: null,
-    $ym-selected-current-outline-focus-color: null,
-
-    $date-hover-background: null,
-    $date-focus-background: null,
-    $date-hover-foreground: null,
-    $date-focus-foreground: null,
-
-    $date-border-color: null,
-    $date-hover-border-color: null,
-    $date-focus-border-color: null,
-
-    $date-selected-foreground: null,
-    $date-selected-background: null,
-    $date-selected-hover-background: null,
-    $date-selected-focus-background: null,
-    $date-selected-hover-foreground: null,
-    $date-selected-focus-foreground: null,
-
-    $date-selected-range-foreground: null,
-    $date-selected-range-background: null,
-    $date-selected-range-hover-foreground: null,
-    $date-selected-range-hover-background: null,
-    $date-selected-range-focus-foreground: null,
-    $date-selected-range-focus-background: null,
-
-    $date-selected-current-foreground: null,
-    $date-selected-current-background: null,
-    $date-selected-current-hover-foreground: null,
-    $date-selected-current-hover-background: null,
-    $date-selected-current-focus-foreground: null,
-    $date-selected-current-focus-background: null,
-
-    $date-selected-current-range-foreground: null,
-    $date-selected-current-range-background: null,
-    $date-selected-current-range-hover-foreground: null,
-    $date-selected-current-range-hover-background: null,
-    $date-selected-current-range-focus-foreground: null,
-    $date-selected-current-range-focus-background: null,
-
-    $date-selected-border-color: null,
-    $date-selected-hover-border-color: null,
-    $date-selected-focus-border-color: null,
-
-    $date-current-border-color: null,
-    $date-current-hover-border-color: null,
-    $date-current-focus-border-color: null,
-
-    $date-selected-current-border-color: null,
-    $date-selected-current-hover-border-color: null,
-    $date-selected-current-focus-border-color: null,
-
-    $date-selected-special-border-color: null,
-    $date-selected-special-hover-border-color: null,
-    $date-selected-special-focus-border-color: null,
-
-    $date-current-foreground: null,
-    $date-current-background: null,
-    $date-current-hover-foreground: null,
-    $date-current-focus-foreground: null,
-    $date-current-hover-background: null,
-    $date-current-focus-background: null,
-
-    $date-special-background: null,
-    $date-special-foreground: null,
-    $date-special-hover-background: null,
-    $date-special-hover-foreground: null,
-    $date-special-focus-background: null,
-    $date-special-focus-foreground: null,
-    $date-special-border-color: null,
-    $date-special-hover-border-color: null,
-    $date-special-range-background: null,
-    $date-special-range-hover-background: null,
-    $date-special-range-focus-background: null,
-    $date-special-range-foreground: null,
-    $date-special-range-border-color: null,
-    $date-disabled-foreground: null,
-    $date-disabled-range-foreground: null,
-
-    $date-range-border-color: null,
-    $date-range-preview-border-color: null,
-
-    $border-radius: null,
-    $date-border-radius: null,
-    $week-number-border-radius: null,
-    $date-range-border-radius: null,
-    $date-current-border-radius: null,
-    $date-special-border-radius: null,
-    $ym-border-radius: null,
-
-    $actions-divider-color: null,
-
-    $size: null,
-    $inner-size: null,
-) {
-    $name: 'igx-calendar';
-    $selector: 'igx-calendar, .igx-days-view--standalone, .igx-calendar-view--standalone, .igx-date-picker, .igx-month-picker';
-    $calendar-schema: ();
-
-    @if map.has-key($schema, 'calendar') {
-        $calendar-schema: map.get($schema, 'calendar');
-    } @else {
-        $calendar-schema: $schema;
-    }
-
-    $theme: digest-schema($calendar-schema);
-    $variant: map.get($schema, '_meta', 'theme');
-
-    @if not($date-range-border-radius) and $date-border-radius {
-        $date-range-border-radius: $date-border-radius;
-    }
-
-    @if not($date-border-radius) and $date-range-border-radius {
-        $date-border-radius: $date-range-border-radius;
-    }
-
-    @if not($date-current-border-radius) and $date-border-radius {
-        $date-current-border-radius: $date-border-radius;
-    }
-
-    @if not($date-special-border-radius) and $date-border-radius {
-        $date-special-border-radius: $date-border-radius;
-    }
-
-    //base start
-    @if not($header-foreground) and $header-background {
-        $header-foreground: adaptive-contrast(var(--header-background));
-    }
-
-    @if not($content-foreground) and $content-background {
-        $content-foreground: adaptive-contrast(var(--content-background));
-    }
-
-    @if not($weekend-color) and $content-foreground {
-        $weekend-color: var(--content-foreground);
-    }
-
-    @if not($inactive-color) and $content-background {
-        $inactive-color: hsla(from adaptive-contrast(var(--content-background)) h s l / .5);
-    }
-
-    @if not($weekday-color) and $inactive-color {
-        $weekday-color: var(--inactive-color);
-    }
-
-    @if not($week-number-background) and $content-background {
-        $week-number-background: hsla(from var(--content-background) h s calc(l * 0.8));
-    }
-
-    @if not($week-number-foreground) and $week-number-background {
-        $week-number-foreground: hsla(from adaptive-contrast(var(--week-number-background)) h s l / 0.5);
-    }
-    //base end
-
-    //picker start
-    @if $variant == 'bootstrap' {
-        @if not($picker-background) and $header-background {
-            $picker-background: var(--header-background);
-        }
-
-        @if not($picker-hover-foreground) and $picker-background {
-            $picker-hover-foreground: hsla(from adaptive-contrast(var(--picker-background)) h s l / 0.8);
-        }
-
-        @if not($weekday-color) and $header-background {
-            $weekday-color: hsla(from adaptive-contrast(var(--header-background)) h s l / 0.8);
-        }
-    } @else {
-        @if not($picker-background) and $content-background {
-            $picker-background: var(--content-background);
-        }
-
-        @if not($picker-hover-foreground) and $header-background {
-            $picker-hover-foreground: var(--header-background);
-        }
-    }
-
-    @if not($picker-foreground) and $picker-background {
-        $picker-foreground: adaptive-contrast(var(--picker-background));
-    }
-
-    @if not($picker-focus-foreground) and $picker-hover-foreground {
-        $picker-focus-foreground: var(--picker-hover-foreground);
-    }
-
-    @if not($navigation-color) and $picker-background {
-        $navigation-color: adaptive-contrast(var(--picker-background));
-    }
-
-    @if not($navigation-hover-color) and $picker-hover-foreground {
-        $navigation-hover-color: var(--picker-hover-foreground);
-    }
-
-    @if not($navigation-focus-color) and $navigation-hover-color {
-        $navigation-focus-color: var(--navigation-hover-color);
-    }
-    //picker end
-
-    //date start
-    @if not($date-hover-background) and $content-background {
-        $date-hover-background: hsl(from var(--content-background) h s calc(l * 0.9));
-    }
-
-    @if not($date-hover-foreground) and $date-hover-background {
-        $date-hover-foreground: adaptive-contrast(var(--date-hover-background));
-    }
-
-    @if not($date-focus-background) and $date-hover-background {
-        $date-focus-background: var(--date-hover-background)
-    }
-
-    @if not($date-focus-foreground) and $date-hover-foreground {
-        $date-focus-foreground: var(--date-hover-foreground);
-    }
-
-    @if not($ym-hover-background) and $date-hover-background {
-        $ym-hover-background: var(--date-hover-background);
-    }
-
-    @if not($ym-hover-foreground) and $ym-hover-background {
-        $ym-hover-foreground: adaptive-contrast(var(--ym-hover-background));
-    }
-    //date end
-
-    //date current start
-    @if $variant == 'indigo' {
-        @if not($date-current-background) and $header-background {
-            $date-current-background: hsla(from var(--header-background) h s l / 0.4);
-        }
-
-        @if not($date-current-border-color) and $date-current-background {
-            $date-current-border-color: hsla(from var(--date-current-background) h s l / 0.6);
-        }
-
-        @if not($date-current-hover-background) and $date-current-background {
-            $date-current-hover-background: hsl(from var(--date-current-background) h s calc(l * 0.9));
-        }
-
-        @if not($date-current-hover-border-color) and $date-current-border-color {
-            $date-current-hover-border-color: hsl(from var(--date-current-border-color) h s calc(l * 0.9));
-        }
-
-        @if not($date-current-focus-background) and $date-current-hover-background {
-            $date-current-focus-background: var(--date-current-hover-background);
-        }
-
-        @if not($date-current-focus-border-color) and $date-current-hover-border-color {
-            $date-current-focus-border-color: var(--date-current-hover-border-color);
-        }
-
-        @if not($date-current-foreground) and $date-current-background {
-            $date-current-foreground: adaptive-contrast(var(--date-current-background));
-        }
-
-        @if not($date-current-foreground) and $content-foreground {
-            $date-current-foreground: var(--content-foreground);
-        }
-
-        @if not($date-current-hover-foreground) and $date-current-foreground {
-            $date-current-hover-foreground: var(--date-current-foreground);
-        }
-
-        @if not($date-current-focus-foreground) and $date-current-foreground {
-            $date-current-focus-foreground: var(--date-current-foreground);
-        }
-    }
-
-    @if $variant == 'fluent' {
-        @if not($date-current-background) and $header-background {
-            $date-current-background: var(--header-background);
-        }
-    }
-
-    @if $variant == 'material' or $variant == 'bootstrap' {
-        @if not($date-current-background) and $content-background {
-            $date-current-background: var(--content-background);
-        }
-    }
-
-    @if $variant != 'indigo' {
-        @if not($date-current-foreground) and $date-current-background {
-            $date-current-foreground: adaptive-contrast(var(--date-current-background));
-        }
-
-        @if not($date-current-hover-background) and $date-hover-background {
-            $date-current-hover-background: var(--date-hover-background);
-        }
-
-        @if not($date-current-focus-background) and $date-focus-background {
-            $date-current-focus-background: var(--date-focus-background);
-        }
-
-        @if $variant == 'fluent' {
-            @if not($date-current-hover-foreground) and $date-current-background {
-                $date-current-hover-foreground: adaptive-contrast(var(--date-current-background));
-            }
-
-            @if not($date-current-focus-foreground) and $date-current-background {
-                $date-current-focus-foreground: adaptive-contrast(var(--date-current-background));
-            }
-        }
-
-        @if not($date-current-hover-foreground) and $date-current-hover-background {
-            $date-current-hover-foreground: adaptive-contrast(var(--date-current-hover-background));
-        }
-
-        @if not($date-current-focus-foreground) and $date-current-hover-background {
-            $date-current-focus-foreground: adaptive-contrast(var(--date-current-hover-background));
-        }
-    }
-
-    @if $variant == 'material' or $variant == 'bootstrap' {
-        @if not($date-current-border-color) and $date-current-foreground {
-            $date-current-border-color: var(--date-current-foreground);
-        }
-
-        @if not($date-current-hover-border-color) and $date-current-hover-foreground {
-            $date-current-hover-border-color: var(--date-current-hover-foreground);
-        }
-
-        @if not($date-current-focus-border-color) and $date-current-focus-foreground {
-            $date-current-focus-border-color: var(--date-current-focus-foreground);
-        }
-    }
-    //date current end
-
-    //date selected start
-
-    @if $variant == 'fluent' {
-        @if not($date-selected-background) and $date-hover-background {
-            $date-selected-background: var(--date-hover-background);
-        }
-    } @else {
-        @if not($date-selected-background) and $header-background {
-            $date-selected-background: var(--header-background);
-        }
-    }
-
-    @if not($date-selected-current-background) and $date-selected-background {
-        $date-selected-current-background: var(--date-selected-background);
-    }
-
-    @if not($date-selected-hover-background) and $date-selected-background {
-        $date-selected-hover-background: hsl(from var(--date-selected-background) h s calc(l * 0.9));
-    }
-
-    @if not($date-selected-current-hover-background) and $date-selected-hover-background {
-        $date-selected-current-hover-background: var(--date-selected-hover-background);
-    }
-
-    @if not($date-selected-focus-background) and $date-selected-hover-background {
-        $date-selected-focus-background: var(--date-selected-hover-background);
-    }
-
-    @if not($date-selected-current-focus-background) and $date-selected-focus-background {
-        $date-selected-current-focus-background: var(--date-selected-focus-background);
-    }
-
-    @if not($date-selected-foreground) and $date-selected-background {
-        $date-selected-foreground: adaptive-contrast(var(--date-selected-background));
-    }
-
-    @if not($date-selected-hover-foreground) and $date-selected-background {
-        $date-selected-hover-foreground: adaptive-contrast(var(--date-selected-background));
-    }
-
-    @if not($date-selected-focus-foreground) and $date-selected-background {
-        $date-selected-focus-foreground: adaptive-contrast(var(--date-selected-background));
-    }
-
-    @if $variant == 'indigo' {
-        @if not($date-selected-current-border-color) and $date-selected-current-background {
-            $date-selected-current-border-color: hsl(from var(--date-selected-current-background) h calc(s * 0.9) calc(l * 1.5));
-        }
-    } @else {
-        @if not($date-selected-current-border-color) and $content-foreground {
-            $date-selected-current-border-color: var(--content-foreground);
-        }
-    }
-
-    @if not($date-selected-current-hover-background) and $date-selected-hover-background {
-        $date-selected-current-hover-background: var(--date-selected-hover-background);
-    }
-
-    @if not($date-selected-current-hover-border-color) and $date-selected-current-border-color {
-        $date-selected-current-hover-border-color: var(--date-selected-current-border-color);
-    }
-
-    @if $variant == 'fluent' {
-        @if not($date-selected-current-foreground) and $date-current-background {
-            $date-selected-current-foreground: adaptive-contrast(var(--date-current-background));
-        }
-
-        @if not($date-selected-current-hover-foreground) and $date-current-background {
-            $date-selected-current-hover-foreground: adaptive-contrast(var(--date-current-background));
-        }
-
-        @if not($date-selected-current-focus-foreground) and $date-current-background {
-            $date-selected-current-focus-foreground: adaptive-contrast(var(--date-current-background));
-        }
-    } @else {
-        @if not($date-selected-current-foreground) and $date-selected-background {
-            $date-selected-current-foreground: adaptive-contrast(var(--date-selected-background));
-        }
-
-        @if not($date-selected-current-hover-foreground) and $date-selected-background {
-            $date-selected-current-hover-foreground: adaptive-contrast(var(--date-selected-background));
-        }
-
-        @if not($date-selected-current-focus-foreground) and $date-selected-current-focus-background {
-            $date-selected-current-focus-foreground: adaptive-contrast(var(--date-selected-current-focus-background));
-        }
-    }
-
-    @if not($date-selected-current-focus-border-color) and $date-selected-current-hover-border-color {
-        $date-selected-current-focus-border-color: var(--date-selected-current-hover-border-color);
-    }
-    //date selected end
-
-    //date special start
-    @if $variant == 'fluent' or $variant == 'bootstrap' {
-        @if not($date-special-foreground) and $content-foreground {
-            $date-special-foreground: var(--content-foreground);
-        }
-
-        @if not($date-special-border-color) and $header-background {
-            $date-special-border-color: var(--header-background);
-        }
-
-        @if not($date-special-hover-border-color) and $date-special-border-color {
-            $date-special-hover-border-color: var(--date-special-border-color);
-        }
-
-        @if not($date-special-focus-foreground) and $date-special-foreground {
-            $date-special-focus-foreground: var(--date-special-foreground);
-        }
-    } @else {
-        @if not($date-special-foreground) and $header-background {
-            $date-special-foreground: var(--header-background);
-        }
-
-        @if not($date-special-border-color) and $date-special-foreground {
-            $date-special-border-color: var(--date-special-foreground);
-        }
-
-        @if not($date-special-hover-foreground) and $date-special-foreground {
-            $date-special-hover-foreground: hsl(from var(--date-special-foreground) h s calc(l * 0.8));
-        }
-
-        @if not($date-special-hover-border-color) and $date-special-hover-foreground {
-            $date-special-hover-border-color: var(--date-special-hover-foreground);
-        }
-
-        @if not($date-special-focus-foreground) and $date-special-hover-border-color {
-            $date-special-focus-foreground: var(--date-special-hover-border-color);
-        }
-    }
-
-    @if not($date-special-hover-foreground) and $date-special-foreground {
-        $date-special-hover-foreground: hsl(from var(--date-special-foreground) h s calc(l * 0.8));
-    }
-
-    @if not($date-special-hover-background) and $date-hover-background {
-        $date-special-hover-background: var(--date-hover-background);
-    }
-
-    @if not($date-special-focus-background) and $date-focus-background {
-        $date-special-focus-background: var(--date-focus-background);
-    }
-
-    @if not($date-special-range-focus-background) and $date-special-focus-background {
-        $date-special-range-focus-background: var(--date-special-focus-background);
-    }
-
-    @if $variant != 'fluent' {
-        @if not($date-selected-special-border-color) and $date-selected-foreground {
-            $date-selected-special-border-color: var(--date-selected-foreground);
-        }
-
-        @if not($date-selected-special-hover-border-color) and $date-selected-hover-foreground {
-            $date-selected-special-hover-border-color: var(--date-selected-hover-foreground);
-        }
-
-        @if not($date-selected-special-focus-border-color) and $date-selected-focus-foreground {
-            $date-selected-special-focus-border-color: var(--date-selected-focus-foreground);
-        }
-    } @else {
-        @if not($date-selected-special-border-color) and $date-special-border-color {
-            $date-selected-special-border-color: var(--date-special-border-color);
-        }
-
-        @if not($date-selected-special-hover-border-color) and $date-selected-special-border-color {
-            $date-selected-special-hover-border-color: var(--date-selected-special-border-color);
-        }
-
-        @if not($date-selected-special-focus-border-color) and $date-selected-special-border-color {
-            $date-selected-special-focus-border-color: var(--date-selected-special-border-color);
-        }
-    }
-    //date special end
-
-    //calendar views start
-    @if $variant != 'fluent' {
-        @if not($ym-selected-background) and $header-background {
-            $ym-selected-background: var(--header-background);
-        }
-
-        @if not($ym-selected-hover-background) and $ym-selected-background {
-            $ym-selected-hover-background: hsl(from var(--ym-selected-background) h s calc(l * 0.9));
-        }
-
-        @if not($ym-current-background) and $date-current-background {
-            $ym-current-background: var(--date-current-background);
-        }
-
-        @if not($ym-current-hover-background) and $date-current-hover-background {
-            $ym-current-hover-background: var(--date-current-hover-background);
-        }
-
-        @if not($ym-current-outline-color) and $date-current-border-color {
-            $ym-current-outline-color: var(--date-current-border-color);
-        }
-
-        @if not($ym-current-outline-hover-color) and $ym-current-outline-color {
-            $ym-current-outline-hover-color: var(--ym-current-outline-color);
-        }
-
-        @if not($ym-current-outline-focus-color) and $ym-current-outline-hover-color {
-            $ym-current-outline-focus-color: var(--ym-current-outline-hover-color);
-        }
-
-        @if not($ym-selected-current-outline-color) and $ym-current-outline-color {
-            $ym-selected-current-outline-color: var(--ym-current-outline-color);
-        }
-
-        @if not($ym-selected-current-outline-hover-color) and $ym-current-outline-hover-color {
-            $ym-selected-current-outline-hover-color: var(--ym-current-outline-hover-color);
-        }
-
-        @if not($ym-selected-current-outline-focus-color) and $ym-current-outline-focus-color {
-            $ym-selected-current-outline-focus-color: var(--ym-current-outline-focus-color);
-        }
-    } @else {
-        @if not($ym-selected-background) and $header-background {
-            $ym-selected-background: hsla(from var(--header-background) h s l / 0.3);
-        }
-
-        @if not($ym-current-background) and $date-selected-background {
-            $ym-current-background: var(--date-selected-background);
-        }
-
-        @if not($ym-current-hover-background) and $ym-current-background {
-            $ym-current-hover-background: hsl(from var(--ym-current-background) h s calc(l * 0.9));
-        }
-
-        @if not($ym-selected-hover-background) and $ym-selected-background {
-            $ym-selected-hover-background: hsla(from var(--ym-selected-background) h s calc(l * 0.9) / 0.5);
-        }
-
-        @if not($ym-selected-current-outline-color) and $ym-selected-current-foreground {
-            $ym-selected-current-outline-color: var(--ym-selected-current-foreground);
-        }
-
-        @if not($ym-selected-foreground) and $content-foreground {
-            $ym-selected-foreground: var(--content-foreground);
-        }
-
-        @if not($ym-selected-hover-foreground) and $ym-selected-foreground {
-            $ym-selected-hover-foreground: var(--content-foreground);
-        }
-    }
-
-    @if not($ym-selected-current-background) and $ym-selected-background {
-        $ym-selected-current-background: var(--ym-selected-background);
-    }
-
-    @if not($ym-selected-current-hover-background) and $ym-selected-hover-background {
-        $ym-selected-current-hover-background: var(--ym-selected-hover-background);
-    }
-
-    @if not($ym-current-foreground) and $ym-current-background {
-        $ym-current-foreground: adaptive-contrast(var(--ym-current-background));
-    }
-
-    @if not($ym-current-hover-foreground) and $ym-current-hover-background {
-        $ym-current-hover-foreground: adaptive-contrast(var(--ym-current-hover-background));
-    }
-
-    @if not($ym-selected-current-foreground) and $ym-selected-current-background {
-        $ym-selected-current-foreground: adaptive-contrast(var(--ym-selected-current-background));
-    }
-
-    @if not($ym-selected-current-hover-foreground) and $ym-selected-current-hover-background {
-        $ym-selected-current-hover-foreground: adaptive-contrast(var(--ym-selected-current-hover-background));
-    }
-    //calendar views end
-
-    //date range start
-    @if not($date-selected-range-foreground) and $content-foreground {
-        $date-selected-range-foreground: var(--content-foreground);
-    }
-
-    @if $variant == 'fluent' {
-        @if not($date-selected-range-background) and $date-selected-background {
-            $date-selected-range-background: var(--date-selected-background);
-        }
-
-        @if not($date-selected-current-range-background) and $date-selected-range-background {
-            $date-selected-current-range-background: var(--date-selected-range-background);
-        }
-
-        @if not($date-selected-range-hover-background) and $date-selected-hover-background {
-            $date-selected-range-hover-background: var(--date-selected-hover-background);
-        }
-
-        @if not($date-selected-range-focus-background) and $date-selected-hover-background {
-            $date-selected-range-focus-background: var(--date-selected-hover-background);
-        }
-
-        @if not($date-selected-current-range-hover-foreground) and $date-current-background {
-            $date-selected-current-range-hover-foreground: adaptive-contrast(var(--date-current-background));
-        }
-
-        @if not($date-selected-current-range-focus-background) and $date-current-background {
-            $date-selected-current-range-focus-background: adaptive-contrast(var(--date-current-background));
-        }
-    } @else {
-        @if not($date-selected-range-background) and $date-selected-background {
-            $date-selected-range-background: hsla(from var(--date-selected-background) h s l / 0.24);
-        }
-
-         @if not($date-range-preview-border-color) and $date-selected-background {
-            $date-range-preview-border-color: var(--date-selected-background);
-        }
-
-        @if not($date-selected-current-range-hover-foreground) and $date-selected-current-range-hover-background {
-            $date-selected-current-range-hover-foreground: adaptive-contrast(var(--date-selected-current-range-hover-background));
-        }
-
-        @if not($date-selected-current-range-hover-foreground) and $content-foreground {
-            $date-selected-current-range-hover-foreground: var(--content-foreground);
-        }
-
-        @if not($date-selected-current-range-focus-background) and $date-selected-current-range-hover-background {
-            $date-selected-current-range-focus-background: var(--date-selected-current-range-hover-background);
-        }
-    }
-
-    @if not($date-selected-range-hover-background) and $date-hover-background {
-        $date-selected-range-hover-background: var(--date-hover-background);
-    }
-
-    @if not($date-selected-range-focus-background) and $date-selected-range-hover-background {
-        $date-selected-range-focus-background: var(--date-selected-range-hover-background);
-    }
-
-    @if not($date-selected-range-hover-foreground) and $date-selected-range-hover-background {
-        $date-selected-range-hover-foreground: adaptive-contrast(hsla(from var(--date-selected-range-hover-background) h s l / 1));
-    }
-
-    @if not($date-selected-range-focus-foreground) and $date-selected-range-focus-background {
-        $date-selected-range-focus-foreground: adaptive-contrast(hsla(from var(--date-selected-range-focus-background) h s l / 1));
-    }
-
-    @if $variant == 'indigo' {
-        @if not($date-selected-current-range-background) and $date-selected-background {
-            $date-selected-current-range-background: hsla(from var(--date-selected-background) h s calc(l * 0.9) / 0.12);
-        }
-
-        @if not($date-selected-current-range-hover-background) and $date-selected-background {
-            $date-selected-current-range-hover-background: hsla(from var(--date-selected-background) h s calc(l * 0.9) / 0.24);
-        }
-
-        @if not($date-selected-current-range-foreground) and $date-current-background {
-            $date-selected-current-range-foreground: adaptive-contrast(var(--date-current-background));
-        }
-    } @else {
-        @if not($date-selected-current-range-foreground) and $date-current-background {
-            $date-selected-current-range-foreground: adaptive-contrast(var(--date-current-background));
-        }
-
-        @if not($date-selected-current-range-foreground) and $content-foreground {
-            $date-selected-current-range-foreground: var(--content-foreground);
-        }
-    }
-
-    @if not($date-special-range-foreground) and $date-special-foreground {
-        $date-special-range-foreground: hsl(from var(--date-special-foreground) h s calc(l * 0.8));
-    }
-
-    @if not($date-special-range-border-color) and $date-special-range-foreground {
-        $date-special-range-border-color: var(--date-special-range-foreground);
-    }
-
-    @if not($date-special-range-hover-background) and $date-selected-range-hover-background {
-        $date-special-range-hover-background: var(--date-selected-range-hover-background);
-    }
-    //date range end
-
-    @if not($date-disabled-foreground) and $content-background {
-        $date-disabled-foreground: hsla(from adaptive-contrast(var(--content-background)) h s l / .3);
-    }
-
-    @if not($date-disabled-range-foreground) and $date-selected-range-background {
-        $date-disabled-range-foreground: hsla(from adaptive-contrast(var(--content-background)) h s l / .3);
-    }
-
-    @return extend($theme, (
-        name: $name,
-        selector: $selector,
-
-        content-background: $content-background,
-        content-foreground: $content-foreground,
-        border-color: $border-color,
-
-        header-background: $header-background,
-        header-foreground: $header-foreground,
-
-        picker-foreground: $picker-foreground,
-        picker-background: $picker-background,
-        picker-hover-foreground: $picker-hover-foreground,
-        picker-focus-foreground: $picker-focus-foreground,
-
-        navigation-color: $navigation-color,
-        navigation-hover-color: $navigation-hover-color,
-        navigation-focus-color: $navigation-focus-color,
-
-        ym-hover-foreground: $ym-hover-foreground,
-        ym-hover-background: $ym-hover-background,
-
-        ym-current-background: $ym-current-background,
-        ym-current-foreground: $ym-current-foreground,
-        ym-current-hover-foreground: $ym-current-hover-foreground,
-        ym-current-hover-background: $ym-current-hover-background,
-
-        ym-selected-foreground: $ym-selected-foreground,
-        ym-selected-background: $ym-selected-background,
-        ym-selected-hover-foreground: $ym-selected-hover-foreground,
-        ym-selected-hover-background: $ym-selected-hover-background,
-
-        ym-selected-current-foreground: $ym-selected-current-foreground,
-        ym-selected-current-background: $ym-selected-current-background,
-        ym-selected-current-hover-foreground: $ym-selected-current-hover-foreground,
-        ym-selected-current-hover-background: $ym-selected-current-hover-background,
-
-        ym-current-outline-color: $ym-current-outline-color,
-        ym-current-outline-hover-color: $ym-current-outline-hover-color,
-        ym-current-outline-focus-color: $ym-current-outline-focus-color,
-
-        ym-selected-outline-color: $ym-selected-outline-color,
-        ym-selected-hover-outline-color: $ym-selected-hover-outline-color,
-        ym-selected-focus-outline-color: $ym-selected-focus-outline-color,
-
-        ym-selected-current-outline-color: $ym-selected-current-outline-color,
-        ym-selected-current-outline-hover-color: $ym-selected-current-outline-hover-color,
-        ym-selected-current-outline-focus-color: $ym-selected-current-outline-focus-color,
-
-        date-hover-background: $date-hover-background,
-        date-focus-background: $date-focus-background,
-        date-hover-foreground: $date-hover-foreground,
-        date-focus-foreground: $date-focus-foreground,
-
-        date-selected-background: $date-selected-background,
-        date-selected-foreground: $date-selected-foreground,
-        date-selected-hover-background: $date-selected-hover-background,
-        date-selected-focus-background: $date-selected-focus-background,
-        date-selected-hover-foreground: $date-selected-hover-foreground,
-        date-selected-focus-foreground: $date-selected-focus-foreground,
-
-        date-selected-range-foreground: $date-selected-range-foreground,
-        date-selected-range-background: $date-selected-range-background,
-        date-selected-range-hover-foreground: $date-selected-range-hover-foreground,
-        date-selected-range-hover-background: $date-selected-range-hover-background,
-        date-selected-range-focus-foreground: $date-selected-range-focus-foreground,
-        date-selected-range-focus-background: $date-selected-range-focus-background,
-
-        date-selected-current-range-foreground: $date-selected-current-range-foreground,
-        date-selected-current-range-background: $date-selected-current-range-background,
-        date-selected-current-range-hover-foreground: $date-selected-current-range-hover-foreground,
-        date-selected-current-range-hover-background: $date-selected-current-range-hover-background,
-        date-selected-current-range-focus-foreground: $date-selected-current-range-focus-foreground,
-        date-selected-current-range-focus-background: $date-selected-current-range-focus-background,
-
-        date-current-background: $date-current-background,
-        date-current-foreground: $date-current-foreground,
-        date-current-hover-background: $date-current-hover-background,
-        date-current-focus-background: $date-current-focus-background,
-        date-current-hover-foreground: $date-current-hover-foreground,
-        date-current-focus-foreground: $date-current-focus-foreground,
-
-        date-selected-current-background: $date-selected-current-background,
-        date-selected-current-hover-background: $date-selected-current-hover-background,
-        date-selected-current-focus-background: $date-selected-current-focus-background,
-        date-selected-current-foreground: $date-selected-current-foreground,
-        date-selected-current-hover-foreground: $date-selected-current-hover-foreground,
-        date-selected-current-focus-foreground: $date-selected-current-focus-foreground,
-
-        date-selected-special-border-color: $date-selected-special-border-color,
-        date-selected-special-hover-border-color: $date-selected-special-hover-border-color,
-        date-selected-special-focus-border-color: $date-selected-special-focus-border-color,
-
-        date-special-foreground: $date-special-foreground,
-        date-special-background: $date-special-background,
-        date-special-hover-foreground: $date-special-hover-foreground,
-        date-special-hover-background: $date-special-hover-background,
-        date-special-focus-foreground: $date-special-focus-foreground,
-        date-special-focus-background: $date-special-focus-background,
-        date-special-border-color: $date-special-border-color,
-        date-special-hover-border-color: $date-special-hover-border-color,
-        date-special-range-foreground: $date-special-range-foreground,
-        date-special-range-background: $date-special-range-background,
-        date-special-range-hover-background: $date-special-range-hover-background,
-        date-special-range-focus-background: $date-special-range-focus-background,
-        date-special-range-border-color: $date-special-range-border-color,
-
-        week-number-foreground: $week-number-foreground,
-        week-number-background: $week-number-background,
-
-        weekend-color: $weekend-color,
-        inactive-color: $inactive-color,
-        weekday-color: $weekday-color,
-
-        border-radius: $border-radius,
-        date-border-radius: $date-border-radius,
-        date-range-border-radius: $date-range-border-radius,
-        date-current-border-radius: $date-current-border-radius,
-        date-special-border-radius: $date-special-border-radius,
-        ym-border-radius: $ym-border-radius,
-        week-number-border-radius: $week-number-border-radius,
-        date-border-color: $date-border-color,
-        date-hover-border-color: $date-hover-border-color,
-        date-focus-border-color: $date-focus-border-color,
-        date-selected-border-color: $date-selected-border-color,
-        date-selected-hover-border-color: $date-selected-hover-border-color,
-        date-selected-focus-border-color: $date-selected-focus-border-color,
-        date-current-border-color: $date-current-border-color,
-        date-current-hover-border-color: $date-current-hover-border-color,
-        date-current-focus-border-color: $date-current-focus-border-color,
-        date-selected-current-border-color: $date-selected-current-border-color,
-        date-selected-current-hover-border-color: $date-selected-current-hover-border-color,
-        date-selected-current-focus-border-color: $date-selected-current-focus-border-color,
-        date-range-preview-border-color: $date-range-preview-border-color,
-        date-range-border-color: $date-range-border-color,
-        date-disabled-foreground: $date-disabled-foreground,
-        date-disabled-range-foreground: $date-disabled-range-foreground,
-        actions-divider-color: $actions-divider-color,
-        size: $size,
-        inner-size: $inner-size,
-    ));
-}
 
 /// @deprecated Use the `css-vars` mixin instead.
 /// @see {mixin} css-vars