{"version":3,"sourceRoot":"","sources":["../../src/css/palettes/high-contrast.scss"],"names":[],"mappings":"AA4FE,2BACE,gCACA,0CACA,0BACA,8BACA,+BAIA,iCACA,kCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCACA,mCAGE,6BACA,oCACA,mCACA,gDACA,mCACA,kCALA,+BACA,sCACA,qCACA,kDACA,qCACA,oCALA,8BACA,qCACA,oCACA,iDACA,oCACA,mCALA,6BACA,mCACA,mCACA,gDACA,mCACA,kCALA,6BACA,mCACA,mCACA,gDACA,mCACA,kCALA,4BACA,mCACA,kCACA,+CACA,kCACA,iCALA,2BACA,qCACA,iCACA,wCACA,iCACA,gCALA,4BACA,mCACA,kCACA,+CACA,kCACA,iCALA,0BACA,iCACA,gCACA,6CACA,gCACA,+BASJ,wCACE,qCAGF,sDAEE,mBAIF,gDACE,sDACE,iEAIJ,6DACE","file":"high-contrast.class.css","sourcesContent":["@use \"sass:map\";\n@import \"../../themes/ionic.functions.color\";\n\n$primary:         #003fae;\n$secondary:       #01487b;\n$tertiary:        #3400e6;\n$success:         #004314;\n$warning:         #5f4100;\n$danger:          #9c000c;\n$light:           #f4f5f8;\n$medium:          #444446;\n$dark:            #222428;\n\n$colors:  (\n  primary: (\n    base:             $primary,\n    contrast:         #fff,\n    shade:            get-color-shade($primary),\n    tint:             get-color-tint($primary)\n  ),\n  secondary: (\n    base:             $secondary,\n    contrast:         #fff,\n    shade:            get-color-shade($secondary),\n    tint:             get-color-tint($secondary)\n  ),\n  tertiary: (\n    base:             $tertiary,\n    contrast:         #fff,\n    shade:            get-color-shade($tertiary),\n    tint:             get-color-tint($tertiary)\n  ),\n  success: (\n    base:             $success,\n    contrast:         #fff,\n    shade:            get-color-shade($success),\n    tint:             get-color-tint($success)\n  ),\n  warning: (\n    base:             $warning,\n    contrast:         #fff,\n    shade:            get-color-shade($warning),\n    tint:             get-color-tint($warning)\n  ),\n  danger: (\n    base:             $danger,\n    contrast:         #fff,\n    shade:            get-color-shade($danger),\n    tint:             get-color-tint($danger)\n  ),\n  light: (\n    base:             $light,\n    contrast:         #000,\n    shade:            get-color-shade($light),\n    tint:             get-color-tint($light)\n  ),\n  medium: (\n    base:             $medium,\n    contrast:         #fff,\n    shade:            get-color-shade($medium),\n    tint:             get-color-tint($medium)\n  ),\n  dark: (\n    base:             $dark,\n    contrast:         #fff,\n    shade:            get-color-shade($dark),\n    tint:             get-color-tint($dark)\n  )\n);\n\n/// Text step colors are generated based on\n/// how dark or light text can be. The darkest\n/// text color is usually the default text color (white or black).\n/// The darker the $lightest-text-color is, the darker each\n/// stepped color is. If you want to increase text contrast,\n/// make $lightest-text-color darker.\n$background-color: #ffffff;\n$text-color: #000000;\n\n$darkest-text-color: $text-color;\n$lightest-text-color: #888888;\n\n/// Loop through each color object above\n/// and generate CSS Variables for each\n/// color. Do not use the ion-color function\n/// here because that will set the variable\n/// to evaluate to itself with a fallback.\n/// For example:\n/// --ion-color-primary: #{ion-color(primary, base)};\n/// Maps to:\n/// --ion-color-primary: var(--ion-color-primary, #...);\n@mixin high-contrast-light-base-palette() {\n  & {\n    --ion-background-color: #{$background-color};\n    --ion-background-color-rgb: #{color-to-rgb-list($background-color)};\n    --ion-text-color: #{$text-color};\n    --ion-text-color-rgb: #{color-to-rgb-list($text-color)};\n    --ion-placeholder-opacity: 0.8;\n\n    /// Only the item borders should increase in contrast\n    /// Borders for elements like toolbars should remain the same\n    --ion-item-border-color: #7a7a7a;\n    --ion-text-color-step-50: #{mix($lightest-text-color, $darkest-text-color, 5%)};\n    --ion-text-color-step-100: #{mix($lightest-text-color, $darkest-text-color, 10%)};\n    --ion-text-color-step-150: #{mix($lightest-text-color, $darkest-text-color, 15%)};\n    --ion-text-color-step-200: #{mix($lightest-text-color, $darkest-text-color, 20%)};\n    --ion-text-color-step-250: #{mix($lightest-text-color, $darkest-text-color, 25%)};\n    --ion-text-color-step-300: #{mix($lightest-text-color, $darkest-text-color, 30%)};\n    --ion-text-color-step-350: #{mix($lightest-text-color, $darkest-text-color, 35%)};\n    --ion-text-color-step-400: #{mix($lightest-text-color, $darkest-text-color, 40%)};\n    --ion-text-color-step-450: #{mix($lightest-text-color, $darkest-text-color, 45%)};\n    --ion-text-color-step-500: #{mix($lightest-text-color, $darkest-text-color, 50%)};\n    --ion-text-color-step-550: #{mix($lightest-text-color, $darkest-text-color, 55%)};\n    --ion-text-color-step-600: #{mix($lightest-text-color, $darkest-text-color, 60%)};\n    --ion-text-color-step-650: #{mix($lightest-text-color, $darkest-text-color, 65%)};\n    --ion-text-color-step-700: #{mix($lightest-text-color, $darkest-text-color, 70%)};\n    --ion-text-color-step-750: #{mix($lightest-text-color, $darkest-text-color, 75%)};\n    --ion-text-color-step-800: #{mix($lightest-text-color, $darkest-text-color, 80%)};\n    --ion-text-color-step-850: #{mix($lightest-text-color, $darkest-text-color, 85%)};\n    --ion-text-color-step-900: #{mix($lightest-text-color, $darkest-text-color, 90%)};\n    --ion-text-color-step-950: #{mix($lightest-text-color, $darkest-text-color, 95%)};\n\n    @each $color-name, $value in $colors {\n      --ion-color-#{$color-name}: #{map.get($value, base)};\n      --ion-color-#{$color-name}-rgb: #{color-to-rgb-list(map.get($value, base))};\n      --ion-color-#{$color-name}-contrast: #{map.get($value, contrast)};\n      --ion-color-#{$color-name}-contrast-rgb: #{color-to-rgb-list(map.get($value, contrast))};\n      --ion-color-#{$color-name}-shade: #{map.get($value, shade)};\n      --ion-color-#{$color-name}-tint: #{map.get($value, tint)};\n    }\n  }\n}\n\n@mixin high-contrast-light-md-palette() {\n  // Toast\n  // --------------------------------------------------\n\n  & ion-toast {\n    --color: var(--ion-background-color);\n  }\n\n  & ion-toast::part(button) {\n    // Fallback for browsers that don't support color-mix\n    color: var(--color);\n  }\n\n  /* stylelint-disable-next-line order/order */\n  @supports (color: color-mix(in lch, plum, pink)) {\n    & ion-toast::part(button) {\n      color: color-mix(in srgb, var(--color) 70%, var(--button-color));\n    }\n  }\n\n  & ion-toast::part(button cancel) {\n    color: var(--color);\n  }\n}\n"]}