@eui/styles 23.0.0-alpha.1 → 23.0.0-alpha.2

package/dist/eui-base.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../base/00-reset/index.scss","../base/03-vars/vars.scss","../base/01-base/mixins/_media.mixins.scss","../base/04-elements/index.scss","../base/01-base/mixins/_eui-scrollbars.scss","../base/01-base/mixins/_accessibility.mixins.scss","../base/05-assets/icons/index.scss"],"names":[],"mappings":"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IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;;;ACrGJ;EDHR;IA+GY;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;;;AChHJ;EDHR;IA0HY;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;IAJA;IACA;IACA;IACA;IACA;;;;AEjJZ;EACI;EACA;EACA;EACA;;ACFA;EACI;EACA,QAJsB;EAKtB,OALsB;EAOlB,kBAPoF;;AAe5F;EAEQ,kBAjB2C;EAkB3C,eAlB0I;EAoB1I;EACA;;AAEA;EACI;EACA;EACA;;AASZ;EC2EA;EACA;EACA;;ADvEA;ECqEA;EACA;EACA;;ADhEA;EAEQ,kBAlDoF;EAmDpF;;AAQR;ED3DJ;IC4DQ;IAEA;;;AAMA;EAFJ;IAGQ;;;;AD7DZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AGtBJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAOY;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAdR;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAdR;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAdR;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAdR;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAdR;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAdR;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAdR;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAdR;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAdR;EACI;EACA;;AAGA;EACI;EACA;;AAKJ;EACI;EACA;;;AAapB;AAAA;EAEI;EACA;EACA;;AAGJ;EACI;EACA;;;AAKJ;EACI;;;AAMJ;EACI","file":"eui-base.css","sourcesContent":["/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\n html {\n    line-height: var(--eui-base-line-height); /* 1 */\n    -webkit-text-size-adjust: 100%; /* 2 */\n  }\n\n  /* Sections\n     ========================================================================== */\n\n  /**\n   * Remove the margin in all browsers.\n   */\n\n  body {\n    margin: 0;\n  }\n\n  /**\n   * Render the `main` element consistently in IE.\n   */\n\n  main {\n    display: block;\n  }\n\n  /**\n   * Correct the font size and margin on `h1` elements within `section` and\n   * `article` contexts in Chrome, Firefox, and Safari.\n   */\n\n  h1 {\n    font-size: 2em;\n    margin: 0.67em 0;\n  }\n\n  /* Grouping content\n     ========================================================================== */\n\n  /**\n   * 1. Add the correct box sizing in Firefox.\n   * 2. Show the overflow in Edge and IE.\n   */\n\n  hr {\n    box-sizing: content-box; /* 1 */\n    height: 0; /* 1 */\n    overflow: visible; /* 2 */\n  }\n\n  /**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\n  pre {\n    font-family: monospace, monospace; /* 1 */\n    font-size: 1em; /* 2 */\n  }\n\n  /* Text-level semantics\n     ========================================================================== */\n\n  /**\n   * Remove the gray background on active links in IE 10.\n   */\n\n  a {\n    background-color: transparent;\n  }\n\n  /**\n   * 1. Remove the bottom border in Chrome 57-\n   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n   */\n\n  abbr[title] {\n    border-bottom: none; /* 1 */\n    text-decoration: underline; /* 2 */\n    text-decoration: underline dotted; /* 2 */\n  }\n\n  /**\n   * Add the correct font weight in Chrome, Edge, and Safari.\n   */\n\n  b,\n  strong {\n    font-weight: bolder;\n  }\n\n  /**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\n  code,\n  kbd,\n  samp {\n    font-family: monospace, monospace; /* 1 */\n    font-size: 1em; /* 2 */\n  }\n\n  /**\n   * Add the correct font size in all browsers.\n   */\n\n  small {\n    font-size: 80%;\n  }\n\n  /**\n   * Prevent `sub` and `sup` elements from affecting the line height in\n   * all browsers.\n   */\n\n  sub,\n  sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n\n  sub {\n    bottom: -0.25em;\n  }\n\n  sup {\n    top: -0.5em;\n  }\n\n  /* Embedded content\n     ========================================================================== */\n\n  /**\n   * Remove the border on images inside links in IE 10.\n   */\n\n  img {\n    border-style: none;\n  }\n\n  /* Forms\n     ========================================================================== */\n\n  /**\n   * 1. Change the font styles in all browsers.\n   * 2. Remove the margin in Firefox and Safari.\n   */\n\n  button,\n  input,\n  optgroup,\n  select,\n  textarea {\n    font-family: inherit; /* 1 */\n    font-size: 100%; /* 1 */\n    line-height: 1; /* 1 */   // eUI adapations forced to \"1\"\n    margin: 0; /* 2 */\n  }\n\n  /**\n   * Show the overflow in IE.\n   * 1. Show the overflow in Edge.\n   */\n\n  button,\n  input { /* 1 */\n    overflow: visible;\n  }\n\n  /**\n   * Remove the inheritance of text transform in Edge, Firefox, and IE.\n   * 1. Remove the inheritance of text transform in Firefox.\n   */\n\n  button,\n  select { /* 1 */\n    text-transform: none;\n  }\n\n  /**\n   * Correct the inability to style clickable types in iOS and Safari.\n   */\n\n  button,\n  [type=\"button\"],\n  [type=\"reset\"],\n  [type=\"submit\"] {\n    -webkit-appearance: button;\n  }\n\n  /**\n   * Remove the inner border and padding in Firefox.\n   */\n\n  button::-moz-focus-inner,\n  [type=\"button\"]::-moz-focus-inner,\n  [type=\"reset\"]::-moz-focus-inner,\n  [type=\"submit\"]::-moz-focus-inner {\n    border-style: none;\n    padding: 0;\n  }\n\n  /**\n   * Restore the focus styles unset by the previous rule.\n   */\n\n  button:-moz-focusring,\n  [type=\"button\"]:-moz-focusring,\n  [type=\"reset\"]:-moz-focusring,\n  [type=\"submit\"]:-moz-focusring {\n    outline: 1px dotted ButtonText;\n  }\n\n  /**\n   * Correct the padding in Firefox.\n   */\n\n  fieldset {\n    padding: 0.35em 0.75em 0.625em;\n  }\n\n  /**\n   * 1. Correct the text wrapping in Edge and IE.\n   * 2. Correct the color inheritance from `fieldset` elements in IE.\n   * 3. Remove the padding so developers are not caught out when they zero out\n   *    `fieldset` elements in all browsers.\n   */\n\n  legend {\n    box-sizing: border-box; /* 1 */\n    color: inherit; /* 2 */\n    display: table; /* 1 */\n    max-width: 100%; /* 1 */\n    padding: 0; /* 3 */\n    white-space: normal; /* 1 */\n  }\n\n  /**\n   * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n   */\n\n  progress {\n    vertical-align: baseline;\n  }\n\n  /**\n   * Remove the default vertical scrollbar in IE 10+.\n   */\n\n  textarea {\n    overflow: auto;\n  }\n\n  /**\n   * 1. Add the correct box sizing in IE 10.\n   * 2. Remove the padding in IE 10.\n   */\n\n  [type=\"checkbox\"],\n  [type=\"radio\"] {\n    box-sizing: border-box; /* 1 */\n    padding: 0; /* 2 */\n  }\n\n  /**\n   * Correct the cursor style of increment and decrement buttons in Chrome.\n   */\n\n  [type=\"number\"]::-webkit-inner-spin-button,\n  [type=\"number\"]::-webkit-outer-spin-button {\n    height: auto;\n  }\n\n  /**\n   * 1. Correct the odd appearance in Chrome and Safari.\n   * 2. Correct the outline style in Safari.\n   */\n\n  [type=\"search\"] {\n    -webkit-appearance: textfield; /* 1 */\n    outline-offset: -2px; /* 2 */\n  }\n\n  /**\n   * Remove the inner padding in Chrome and Safari on macOS.\n   */\n\n  [type=\"search\"]::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n\n  /**\n   * 1. Correct the inability to style clickable types in iOS and Safari.\n   * 2. Change font properties to `inherit` in Safari.\n   */\n\n  ::-webkit-file-upload-button {\n    -webkit-appearance: button; /* 1 */\n    font: inherit; /* 2 */\n  }\n\n  /* Interactive\n     ========================================================================== */\n\n  /*\n   * Add the correct display in Edge, IE 10+, and Firefox.\n   */\n\n  details {\n    display: block;\n  }\n\n  /*\n   * Add the correct display in all browsers.\n   */\n\n  summary {\n    display: list-item;\n  }\n\n  /* Misc\n     ========================================================================== */\n\n  /**\n   * Add the correct display in IE 10+.\n   */\n\n  template {\n    display: none;\n  }\n\n  /**\n   * Add the correct display in IE 10.\n   */\n\n  [hidden] {\n    display: none;\n  }\n","@use 'sass:map';\n@use '../01-base' as base;\n@use '../02-tokens/maps' as maps;\n@use '../02-tokens/colors-default' as colors;\n\n@font-face {\n  font-family: 'Inter';\n  src: url('#{base.$eui-assets-base-path}/fonts/inter/InterVariable.woff2') format('woff2');\n  font-weight: 100 900;\n  font-style: normal;\n  font-display: block;\n}\n\n@font-face {\n  font-family: 'Inter';\n  src: url('#{base.$eui-assets-base-path}/fonts/inter//InterVariable-Italic.woff2') format('woff2');\n  font-weight: 100 900;\n  font-display: block;\n  font-style: italic;\n}\n\n:root {\n    // GENERIC CONTEXT COLORS\n    // ----------------------\n    \n    --eui-c-transparent: transparent;\n    --eui-c-white: #fff;\n    --eui-c-black: #000;\n\n    --eui-c-secondary-min: #{map.get(map.get(colors.$color-map, grn), 25)};\n    --eui-c-secondary-max: #{map.get(map.get(colors.$color-map, grn), 950)};\n\n    --eui-c-surface-page: #{map.get(map.get(colors.$color-map, grn), 25)};\n    --eui-c-surface-container: var(--eui-c-white);\n    \n    --eui-c-surface-shell: #{map.get(map.get(colors.$color-map, grn), 50)};\n    --eui-c-surface-container-1: #{map.get(map.get(colors.$color-map, grn), 75)};\n    --eui-c-surface-container-2: #{map.get(map.get(colors.$color-map, grn), 100)};\n    --eui-c-surface-container-3: #{map.get(map.get(colors.$color-map, grn), 200)};\n\n    --eui-c-text: #{map.get(map.get(colors.$color-map, gr), 950)};\n    --eui-c-text-light: #{map.get(map.get(colors.$color-map, gr), 800)};\n    --eui-c-text-lighter: #{map.get(map.get(colors.$color-map, gr), 700)};\n    --eui-c-text-lightest: #{map.get(map.get(colors.$color-map, gr), 600)};\n\n    --eui-c-focus-visible: #{map.get(map.get(colors.$color-map, pr), 600)};\n    --eui-c-focus: #{map.get(map.get(colors.$color-map, pr), 200)};\n    \n    --eui-c-hover: #{map.get(map.get(colors.$color-map, pr), 75)};\n    --eui-c-hover-disabled: #{map.get(map.get(colors.$color-map, gr), 100)};\n\n    --eui-c-active: #{map.get(map.get(colors.$color-map, pr), 600)};\n    --eui-c-active-bg: #{map.get(map.get(colors.$color-map, pr), 200)};\n    --eui-c-active-bg-alt: #{map.get(map.get(colors.$color-map, pr), 300)};\n    --eui-c-active-bg-light: #{map.get(map.get(colors.$color-map, pr), 100)};\n    --eui-c-active-bg-lighter: #{map.get(map.get(colors.$color-map, pr), 75)};\n\n    --eui-c-disabled: #{map.get(map.get(colors.$color-map, gr), 500)};\n    --eui-c-disabled-bg: #{map.get(map.get(colors.$color-map, gr), 50)};\n    --eui-c-readonly: #{map.get(map.get(colors.$color-map, gr), 600)};\n\n    --eui-c-link: #{map.get(map.get(colors.$color-map, pr), 600)};\n\n    --eui-c-divider: #{map.get(map.get(colors.$color-map, gr), 100)};\n    --eui-c-divider-dark: #{map.get(map.get(colors.$color-map, gr), 200)};\n    --eui-c-divider-light: #{map.get(map.get(colors.$color-map, gr), 75)};\n\n    --eui-c-black-alpha-025: rgba(0,0,0, 0.025);\n    --eui-c-black-alpha-10: rgba(0,0,0, 0.1);\n    --eui-c-black-alpha-075: rgba(0,0,0, 0.075);\n\n\n    // CONTEXT COLORS FROM PALETTES\n    // ----------------------------\n\n    @each $color, $shades in colors.$color-state-map {\n        @each $shade, $value in $shades {\n            @if $shade == default {\n                --eui-c-#{$color}: #{$value};\n            } @else {\n                --eui-c-#{$color + '-' + $shade}: #{$value};\n            }\n        }\n    }\n\n\n    // TYPOGRAPHY - eui-f\n    // ------------------\n\n    // TYPOGRAPHY\n    --eui-f-family: 'Inter', arial, sans-serif;\n\n    // font families\n    --eui-f-family-monospace: 'Consolas', 'Liberation Mono', 'Courier New', monospace;\n\n    // font sizes\n    --eui-f-size-base: 16px;\n\n    // base line-height / scale-factor (for compact mode)\n    --eui-base-line-height: 1.5;\n    --eui-base-scale-factor: 1;\n\n    // font aliases\n    --eui-f: var(--eui-f-m);\n    --eui-f-light: var(--eui-f-m-light);\n    --eui-f-medium: var(--eui-f-m-medium);\n    --eui-f-semi-bold: var(--eui-f-m-semi-bold);\n    --eui-f-bold: var(--eui-f-m-bold);\n\n    @each $size, $sizeDef in maps.$font-map {\n        $desktop: map.get($sizeDef, 'desktop');\n        --eui-f-#{$size}-light: normal normal var(--eui-f-w-light) var(--eui-f-s-#{map.get($desktop, 'font-size')})/var(--eui-f-lh-#{map.get($desktop, 'line-height')}) var(--eui-f-family);\n        --eui-f-#{$size}: normal normal var(--eui-f-w-regular) var(--eui-f-s-#{map.get($desktop, 'font-size')})/var(--eui-f-lh-#{map.get($desktop, 'line-height')}) var(--eui-f-family);\n        --eui-f-#{$size}-medium: normal normal var(--eui-f-w-medium) var(--eui-f-s-#{map.get($desktop, 'font-size')})/var(--eui-f-lh-#{map.get($desktop, 'line-height')}) var(--eui-f-family);\n        --eui-f-#{$size}-semi-bold: normal normal var(--eui-f-w-semi-bold) var(--eui-f-s-#{map.get($desktop, 'font-size')})/var(--eui-f-lh-#{map.get($desktop, 'line-height')}) var(--eui-f-family);\n        --eui-f-#{$size}-bold: normal normal var(--eui-f-w-bold) var(--eui-f-s-#{map.get($desktop, 'font-size')})/var(--eui-f-lh-#{map.get($desktop, 'line-height')}) var(--eui-f-family);\n    }\n\n    @include base.media(maps.$eui-bkp-tablet) {\n        @each $size, $sizeDef in maps.$font-map {\n            $tablet: map.get($sizeDef, 'tablet');\n            --eui-f-#{$size}-light: normal normal var(--eui-f-w-light) var(--eui-f-s-#{map.get($tablet, 'font-size')})/var(--eui-f-lh-#{map.get($tablet, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}: normal normal var(--eui-f-w-regular) var(--eui-f-s-#{map.get($tablet, 'font-size')})/var(--eui-f-lh-#{map.get($tablet, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}-medium: normal normal var(--eui-f-w-medium) var(--eui-f-s-#{map.get($tablet, 'font-size')})/var(--eui-f-lh-#{map.get($tablet, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}-semi-bold: normal normal var(--eui-f-w-semi-bold) var(--eui-f-s-#{map.get($tablet, 'font-size')})/var(--eui-f-lh-#{map.get($tablet, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}-bold: normal normal var(--eui-f-w-bold) var(--eui-f-s-#{map.get($tablet, 'font-size')})/var(--eui-f-lh-#{map.get($tablet, 'line-height')}) var(--eui-f-family);\n        }\n    }\n\n    @include base.media(maps.$eui-bkp-mobile-s) {\n        @each $size, $sizeDef in maps.$font-map {        \n            $mobile: map.get($sizeDef, 'mobile');\n            --eui-f-#{$size}-light: normal normal var(--eui-f-w-light) var(--eui-f-s-#{map.get($mobile, 'font-size')})/var(--eui-f-lh-#{map.get($mobile, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}: normal normal var(--eui-f-w-regular) var(--eui-f-s-#{map.get($mobile, 'font-size')})/var(--eui-f-lh-#{map.get($mobile, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}-medium: normal normal var(--eui-f-w-medium) var(--eui-f-s-#{map.get($mobile, 'font-size')})/var(--eui-f-lh-#{map.get($mobile, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}-semi-bold: normal normal var(--eui-f-w-semi-bold) var(--eui-f-s-#{map.get($mobile, 'font-size')})/var(--eui-f-lh-#{map.get($mobile, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}-bold: normal normal var(--eui-f-w-bold) var(--eui-f-s-#{map.get($mobile, 'font-size')})/var(--eui-f-lh-#{map.get($mobile, 'line-height')}) var(--eui-f-family);\n        }\n    }\n\n    @include base.media(maps.$eui-bkp-mobile-xs) {\n        @each $size, $sizeDef in maps.$font-map {        \n            $mobilexs: map.get($sizeDef, 'mobile-xs');\n            --eui-f-#{$size}-light: normal normal var(--eui-f-w-light) var(--eui-f-s-#{map.get($mobilexs, 'font-size')})/var(--eui-f-lh-#{map.get($mobilexs, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}: normal normal var(--eui-f-w-regular) var(--eui-f-s-#{map.get($mobilexs, 'font-size')})/var(--eui-f-lh-#{map.get($mobilexs, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}-medium: normal normal var(--eui-f-w-medium) var(--eui-f-s-#{map.get($mobilexs, 'font-size')})/var(--eui-f-lh-#{map.get($mobilexs, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}-semi-bold: normal normal var(--eui-f-w-semi-bold) var(--eui-f-s-#{map.get($mobilexs, 'font-size')})/var(--eui-f-lh-#{map.get($mobilexs, 'line-height')}) var(--eui-f-family);\n            --eui-f-#{$size}-bold: normal normal var(--eui-f-w-bold) var(--eui-f-s-#{map.get($mobilexs, 'font-size')})/var(--eui-f-lh-#{map.get($mobilexs, 'line-height')}) var(--eui-f-family);\n        }\n    }\n\n    @each $size, $def in maps.$font-size-map {\n        --eui-f-s-#{$size}: #{$def};\n    }\n\n    @each $size, $def in maps.$font-line-height-map {\n        --eui-f-lh-#{$size}: #{$def};\n    }\n\n    @each $size, $def in maps.$font-weight-map {\n        --eui-f-w-#{$size}: #{$def};\n    }\n\n\n    // SPACING - eui-s\n    // ---------------\n\n    @each $spacing, $value in maps.$spacing-map {\n        --eui-s-#{$spacing}: #{$value};\n    }\n\n    \n    // BORDER RADIUS - eui-br\n    // ----------------------\n\n    @each $br, $value in maps.$border-radius-map {\n        --eui-br-#{$br}: #{$value};\n    }\n\n\n    // LAYOUT-BREAKPOINTS - eui-bp\n    // ---------------------------\n\n    @each $bp, $value in maps.$breakpoint-map {\n        --eui-bp-#{$bp}: #{$value};\n    }\n\n\n    // BORDER WIDTH - eui-bw\n    // ---------------------\n\n    @each $br, $value in maps.$border-width-map {\n        --eui-bw-#{$br}: #{$value};\n    }\n\n\n    // BOX-SHADOWS - eui-sh\n    // --------------------\n\n    @each $sh, $value in maps.$box-shadow-map {\n        --eui-sh-#{$sh}: #{$value};\n    }\n\n\n    // ICON-SIZES - eui-is\n    // -------------------\n\n    @each $icon-size, $value in maps.$icon-size-map {\n        --eui-is-#{$icon-size}: #{$value};\n    }\n\n\n    // OPACITY - eui-o\n    // ---------------\n\n    @each $idx, $value in maps.$opacity-map {\n        --eui-o-#{$idx}: #{$value};\n    }\n\n\n    // Z-INDEXES - eui-zi\n    // -------------------\n\n    @each $idx, $value in maps.$z-index-map {\n        --eui-zi-#{$idx}: #{$value};\n    }\n\n\n    // OTHERS \n    // ------\n    --eui-internal-icon-checkmark-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/check.svg');\n    --eui-internal-icon-remove-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/remove.svg');\n    --eui-internal-icon-ellipse-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/ellipse.svg');\n    --eui-internal-icon-external-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/external.svg');\n    --eui-internal-icon-chevron-down-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/chevron-down.svg');    \n\n\n\n    // Animations related\n    --eui-base-animation-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 1);\n    --eui-base-animation-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    --eui-base-animation-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1);\n    --eui-base-animation-ease-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);    // ease\n    --eui-base-animation-ease-in-out-timing-function: ease-in-out;\n\n    --eui-base-animation-duration-fast: 0.25s;\n    --eui-base-animation-duration-medium: 0.5s;\n    --eui-base-animation-duration-slow: 1s;\n    --eui-base-animation-duration-base: 500ms;\n    --eui-base-animation-duration: var(--eui-base-animation-duration-base);\n\n    --eui-base-animation-transition-base: all 0.2s #{var(--eui-base-animation-linear-out-slow-in-timing-function)};\n    --eui-base-animation-transition-ease: all 0.2s #{var(--eui-base-animation-ease-timing-function)};\n    --eui-base-animation-transition-ease-in-out: all 0.2s #{var(--eui-base-animation-ease-in-out-timing-function)};\n    --eui-base-animation-transition-ease-in-out-1s: all 1s #{var(--eui-base-animation-ease-in-out-timing-function)};\n\n    --eui-base-animation-delay: 0s;\n    --eui-base-animation-direction: normal;\n    --eui-base-animation-fill-mode: forwards;    // this prevents the animation from restarting\n    --eui-base-animation-background-color: var(--eui-c-primary-surface-light);\n}","@use 'sass:map';\n@use 'sass:list';\n\n$default-feature: \"min-width\";\n@mixin media($query: $feature $value $columns) {\n    @if list.length($query) == 1 {\n        @media screen and ($default-feature: list.nth($query, 1)) {\n            @content;\n        }\n    }\n    @else {\n        $loop-to: list.length($query);\n        $media-query: \"screen and \";\n        @if is-not(is-even(list.length($query))) {\n            $loop-to: $loop-to - 1;\n        }\n        $i: 1;\n        @while $i <=$loop-to {\n            $media-query: $media-query + \"(\" + list.nth($query, $i) + \": \" + list.nth($query, $i + 1) + \") \";\n            @if ($i + 1) != $loop-to {\n                $media-query: $media-query + \"and \";\n            }\n            $i: $i+2;\n        }\n        @media #{$media-query} {\n            @content;\n        }\n    }\n}\n","@use '../../base' as base;\n\nhtml {\n    display: block;\n    height: 100%;\n    font-size: var(--eui-f-size-base);\n    line-height: var(--eui-base-line-height);\n    @include base.eui-scrollbars();\n}\n\nbody {\n    background-color: var(--eui-c-surface-page);\n    color: var(--eui-c-text);\n    font-family: var(--eui-f-family);\n    font-feature-settings: 'liga';\n    font-size: var(--eui-f-size-base);\n    -moz-font-smoothing: antialiased;\n    -webkit-font-smoothing: antialiased;\n    font-style: normal;\n    font-weight: normal;\n    height: 100%;\n    line-height: var(--eui-base-line-height);\n    margin: 0;\n    text-align: start;\n    text-rendering: optimizeLegibility;\n}\n","@use 'accessibility.mixins' as a11y;\n\n@mixin eui-scrollbars( $size: 10px, $foreground-color: var(--eui-c-divider), $background-color: var(--eui-c-secondary-surface-light), $border-radius: 5rem, $state: active ) {\n    \n    &::-webkit-scrollbar {\n        display: inherit;\n        height: $size;      // horizontal scroll\n        width: $size;       // vertical scroll\n        @if ($state == active) {\n            background-color: $background-color;\n        }\n        @else {\n            background-color: transparent;\n        }\n    }\n\n    // This is the scrolling bar\n    &::-webkit-scrollbar-thumb {\n        @if ($state == active) {\n            background-color: $foreground-color;\n            border-radius: $border-radius;\n            // Uses the border instead of width to make it grow when on hover\n            background-clip: padding-box;   // make the border work\n            border: 2px solid transparent;\n\n            &:hover {\n                background-color: var(--eui-c-secondary-surface);\n                border: 0;\n                cursor: grab;\n            }\n        }\n        @else {\n            background-color: transparent;\n        }\n    }\n\n    // Apply focus and keyboard focus to scrollbar thumb when the scrollable container is focused\n    &:focus::-webkit-scrollbar-thumb {\n        @if ($state == active) {\n            @include a11y.eui-accessible-focus-pseudo;\n        }\n    }\n\n    &:focus-visible::-webkit-scrollbar-thumb {\n        @if ($state == active) {\n            @include a11y.eui-accessible-focus-pseudo;\n        }\n    }\n\n    // This is the scroll container\n    &::-webkit-scrollbar-track {\n        @if ($state == active) {\n            background-color: $background-color;\n            border-radius: 0;\n        }\n        @else {\n            background-color: transparent;\n        }\n    }\n\n    // Firefox only CSS-specific extension - Attention those properties overrides :webkit pseudos!\n    @-moz-document url-prefix() {\n        scrollbar-color: var(--eui-c-secondary-surface) var(--eui-c-secondary-surface-light);\n        // scrollbar-gutter: stable;\n        scrollbar-width: auto;\n    }\n\n    // Firefox focus state for scrollbar\n    &:focus,\n    &:focus-visible {\n        @-moz-document url-prefix() {\n            scrollbar-color: var(--eui-c-focus-visible) var(--eui-c-s-secondary-surface-light);\n        }\n    }\n}\n@mixin eui-scrollbars-inactive($size: 8px) {\n    &::-webkit-scrollbar {\n        background-color: transparent;\n        display: inherit;\n        height: $size;      // horizontal scroll\n        width: $size;       // vertical scroll\n    }\n\n    &::-webkit-scrollbar-thumb {\n        background-color: transparent;\n    }\n\n    &::-webkit-scrollbar-track {\n        background-color: transparent;\n    }\n}\n\n\n// @mixin eui-ng-scrollbar() {\n//     --scrollbar-thickness: 10 !important;\n//     --scrollbar-hover-thickness: var(--scrollbar-thickness) !important;\n//     --scrollbar-border-radius: 5rem !important;\n// }\n","$outline-offset: -2px;\n$outline-size: 2px;\n\n// Call this mixin to enforce the accessibility visuals when on focus/active\n@mixin eui-accessible-focus($offset: $outline-offset, $size: $outline-size) {\n    &:focus:not([readonly]) {\n        outline: $size solid var(--eui-c-focus) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n\n    &:focus-visible:not([readonly]) {\n        outline: $size solid var(--eui-c-focus-visible) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n\n    // Forced focusable element\n    [tabindex=\"0\"] {\n        // &:active:not([readonly]),\n        &:focus:not([readonly]) {\n            outline: $size solid var(--eui-c-focus-visible) !important;\n            outline-offset: $offset !important;\n            transition: none;\n        }\n    }\n}\n\n@mixin eui-accessible-focus-only($offset: $outline-offset, $size: $outline-size) {\n    &:focus:not([readonly]) {\n        outline: $size solid var(--eui-c-focus) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n}\n\n@mixin eui-accessible-focus-visible($offset: $outline-offset, $size: $outline-size) {\n    &:focus-visible:not([readonly]) {\n        outline: $size solid var(--eui-c-focus-visible) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n}\n\n@mixin eui-accessible-focus-rounded($offset: $outline-offset, $size: $outline-size) {\n    &:focus:not([readonly]) {\n        border-radius: var(--eui-br-max);\n        outline: $size solid var(--eui-c-focus) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n\n    &:focus-visible:not([readonly]) {\n        border-radius: var(--eui-br-max);\n        outline: $size solid var(--eui-c-focus-visible) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n}\n\n@mixin eui-accessible-focus-visible-rounded($offset: $outline-offset, $size: $outline-size) {\n    &:focus-visible:not([readonly]) {\n        border-radius: var(--eui-br-max);\n        outline: $size solid var(--eui-c-focus-visible) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n}\n\n@mixin eui-accessible-focus-border() {\n    border-left: var(--eui-s-3xs) solid transparent;\n\n    &:focus:not([readonly]) {\n        border: var(--eui-s-3xs) solid var(--eui-c-focus-visible) !important;\n        transition: none;\n    }\n}\n\n\n\n@mixin eui-accessible-focus-ring($offset: 1px) {\n    &:focus:not([readonly]) {\n        outline: var(--eui-bw-s) solid var(--eui-c-primary-border-light) !important;\n        outline-offset: $offset !important;\n        border-radius: var(--eui-br-xs) !important;\n    }\n}\n@mixin eui-accessible-focus-ring-rounded($offset: 1px) {\n    &:focus:not([readonly]) {\n        outline: var(--eui-bw-s) solid var(--eui-c-primary-border-light) !important;\n        outline-offset: $offset !important;\n        border-radius: var(--eui-br-max) !important;\n    }\n}\n@mixin eui-accessible-focus-visible-ring($offset: 1px) {\n    &:focus-visible:not([readonly]) {\n        outline: var(--eui-bw-s) solid var(--eui-c-primary-border) !important;\n        outline-offset: $offset !important;\n        border-radius: var(--eui-br-xs) !important;\n    }\n}\n@mixin eui-accessible-focus-visible-ring-rounded($offset: 1px) {\n    &:focus-visible:not([readonly]) {\n        outline: var(--eui-bw-s) solid var(--eui-c-primary-border) !important;\n        outline-offset: $offset !important;\n        border-radius: var(--eui-br-max) !important;\n    }\n}\n\n// Mixin for applying focus outline to pseudo-elements (like scrollbar thumbs)\n// This doesn't use :not([readonly]) since pseudo-elements don't support attribute selectors, that's why a new mixin is needed\n@mixin eui-accessible-focus-pseudo($offset: $outline-offset, $size: $outline-size) {\n    background-color: var(--eui-c-primary-surface);\n    outline: $size solid var(--eui-c-focus-visible) !important;\n    outline-offset: $offset !important;\n}\n","@use '../../02-tokens/maps' as tokens;\n\n.eui-icon-svg {\n    fill: currentColor;\n    margin: 0;\n    transform: scaleX(1) scaleY(1) rotateZ(0deg);\n    transition: transform 300ms ease-in-out;\n    display: inline-flex;\n    align-items: center;\n}\n\n@each $icon-size, $value in tokens.$icon-size-map {\n    .eui-icon-svg {\n        &.eui-icon-svg--size {\n            &-#{$icon-size} {\n                svg {\n                    height: var(--eui-is-#{$icon-size});\n                    width: var(--eui-is-#{$icon-size});\n\n                    // Custom icons\n                    > image {\n                        height: var(--eui-is-#{$icon-size});\n                        width: var(--eui-is-#{$icon-size});\n                    }\n                }\n\n                &.eui-icon-svg--stack {\n                    svg {\n                        height: var(--eui-is-#{$icon-size});\n                        width: var(--eui-is-#{$icon-size});\n                    }\n                }\n            }\n        }\n    }\n}\n\n\n\n\n// COMPOSITION: ICON + BADGE\n.eui-icon-svg {\n    .eui-badge,\n    .eui-badge--size-m {\n        position: absolute;\n        left: 40%;\n        top: -40%;\n    }\n\n    .eui-badge--empty {\n        left: 70%;\n        top: -5%\n    }\n}\n\n.eui-icon-svg--size-l {\n    .eui-badge--size-s {\n        left: 70%;\n    }\n}\n\n// COMPOSITION: BUTTON + BADGE\n.eui-button {\n    .eui-badge {\n        height: inherit;\n    }\n}\n"]}
+{"version":3,"sourceRoot":"","sources":["../base/00-reset/index.scss","../base/03-vars/vars.scss","../base/04-elements/index.scss","../base/01-base/mixins/_eui-scrollbars.scss","../base/01-base/mixins/_accessibility.mixins.scss","../base/05-assets/icons/index.scss"],"names":[],"mappings":"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","file":"eui-base.css","sourcesContent":["/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\n html {\n    line-height: var(--eui-base-line-height); /* 1 */\n    -webkit-text-size-adjust: 100%; /* 2 */\n  }\n\n  /* Sections\n     ========================================================================== */\n\n  /**\n   * Remove the margin in all browsers.\n   */\n\n  body {\n    margin: 0;\n  }\n\n  /**\n   * Render the `main` element consistently in IE.\n   */\n\n  main {\n    display: block;\n  }\n\n  /**\n   * Correct the font size and margin on `h1` elements within `section` and\n   * `article` contexts in Chrome, Firefox, and Safari.\n   */\n\n  h1 {\n    font-size: 2em;\n    margin: 0.67em 0;\n  }\n\n  /* Grouping content\n     ========================================================================== */\n\n  /**\n   * 1. Add the correct box sizing in Firefox.\n   * 2. Show the overflow in Edge and IE.\n   */\n\n  hr {\n    box-sizing: content-box; /* 1 */\n    height: 0; /* 1 */\n    overflow: visible; /* 2 */\n  }\n\n  /**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\n  pre {\n    font-family: monospace, monospace; /* 1 */\n    font-size: 1em; /* 2 */\n  }\n\n  /* Text-level semantics\n     ========================================================================== */\n\n  /**\n   * Remove the gray background on active links in IE 10.\n   */\n\n  a {\n    background-color: transparent;\n  }\n\n  /**\n   * 1. Remove the bottom border in Chrome 57-\n   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n   */\n\n  abbr[title] {\n    border-bottom: none; /* 1 */\n    text-decoration: underline; /* 2 */\n    text-decoration: underline dotted; /* 2 */\n  }\n\n  /**\n   * Add the correct font weight in Chrome, Edge, and Safari.\n   */\n\n  b,\n  strong {\n    font-weight: bolder;\n  }\n\n  /**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\n  code,\n  kbd,\n  samp {\n    font-family: monospace, monospace; /* 1 */\n    font-size: 1em; /* 2 */\n  }\n\n  /**\n   * Add the correct font size in all browsers.\n   */\n\n  small {\n    font-size: 80%;\n  }\n\n  /**\n   * Prevent `sub` and `sup` elements from affecting the line height in\n   * all browsers.\n   */\n\n  sub,\n  sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n\n  sub {\n    bottom: -0.25em;\n  }\n\n  sup {\n    top: -0.5em;\n  }\n\n  /* Embedded content\n     ========================================================================== */\n\n  /**\n   * Remove the border on images inside links in IE 10.\n   */\n\n  img {\n    border-style: none;\n  }\n\n  /* Forms\n     ========================================================================== */\n\n  /**\n   * 1. Change the font styles in all browsers.\n   * 2. Remove the margin in Firefox and Safari.\n   */\n\n  button,\n  input,\n  optgroup,\n  select,\n  textarea {\n    font-family: inherit; /* 1 */\n    font-size: 100%; /* 1 */\n    line-height: 1; /* 1 */   // eUI adapations forced to \"1\"\n    margin: 0; /* 2 */\n  }\n\n  /**\n   * Show the overflow in IE.\n   * 1. Show the overflow in Edge.\n   */\n\n  button,\n  input { /* 1 */\n    overflow: visible;\n  }\n\n  /**\n   * Remove the inheritance of text transform in Edge, Firefox, and IE.\n   * 1. Remove the inheritance of text transform in Firefox.\n   */\n\n  button,\n  select { /* 1 */\n    text-transform: none;\n  }\n\n  /**\n   * Correct the inability to style clickable types in iOS and Safari.\n   */\n\n  button,\n  [type=\"button\"],\n  [type=\"reset\"],\n  [type=\"submit\"] {\n    -webkit-appearance: button;\n  }\n\n  /**\n   * Remove the inner border and padding in Firefox.\n   */\n\n  button::-moz-focus-inner,\n  [type=\"button\"]::-moz-focus-inner,\n  [type=\"reset\"]::-moz-focus-inner,\n  [type=\"submit\"]::-moz-focus-inner {\n    border-style: none;\n    padding: 0;\n  }\n\n  /**\n   * Restore the focus styles unset by the previous rule.\n   */\n\n  button:-moz-focusring,\n  [type=\"button\"]:-moz-focusring,\n  [type=\"reset\"]:-moz-focusring,\n  [type=\"submit\"]:-moz-focusring {\n    outline: 1px dotted ButtonText;\n  }\n\n  /**\n   * Correct the padding in Firefox.\n   */\n\n  fieldset {\n    padding: 0.35em 0.75em 0.625em;\n  }\n\n  /**\n   * 1. Correct the text wrapping in Edge and IE.\n   * 2. Correct the color inheritance from `fieldset` elements in IE.\n   * 3. Remove the padding so developers are not caught out when they zero out\n   *    `fieldset` elements in all browsers.\n   */\n\n  legend {\n    box-sizing: border-box; /* 1 */\n    color: inherit; /* 2 */\n    display: table; /* 1 */\n    max-width: 100%; /* 1 */\n    padding: 0; /* 3 */\n    white-space: normal; /* 1 */\n  }\n\n  /**\n   * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n   */\n\n  progress {\n    vertical-align: baseline;\n  }\n\n  /**\n   * Remove the default vertical scrollbar in IE 10+.\n   */\n\n  textarea {\n    overflow: auto;\n  }\n\n  /**\n   * 1. Add the correct box sizing in IE 10.\n   * 2. Remove the padding in IE 10.\n   */\n\n  [type=\"checkbox\"],\n  [type=\"radio\"] {\n    box-sizing: border-box; /* 1 */\n    padding: 0; /* 2 */\n  }\n\n  /**\n   * Correct the cursor style of increment and decrement buttons in Chrome.\n   */\n\n  [type=\"number\"]::-webkit-inner-spin-button,\n  [type=\"number\"]::-webkit-outer-spin-button {\n    height: auto;\n  }\n\n  /**\n   * 1. Correct the odd appearance in Chrome and Safari.\n   * 2. Correct the outline style in Safari.\n   */\n\n  [type=\"search\"] {\n    -webkit-appearance: textfield; /* 1 */\n    outline-offset: -2px; /* 2 */\n  }\n\n  /**\n   * Remove the inner padding in Chrome and Safari on macOS.\n   */\n\n  [type=\"search\"]::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n\n  /**\n   * 1. Correct the inability to style clickable types in iOS and Safari.\n   * 2. Change font properties to `inherit` in Safari.\n   */\n\n  ::-webkit-file-upload-button {\n    -webkit-appearance: button; /* 1 */\n    font: inherit; /* 2 */\n  }\n\n  /* Interactive\n     ========================================================================== */\n\n  /*\n   * Add the correct display in Edge, IE 10+, and Firefox.\n   */\n\n  details {\n    display: block;\n  }\n\n  /*\n   * Add the correct display in all browsers.\n   */\n\n  summary {\n    display: list-item;\n  }\n\n  /* Misc\n     ========================================================================== */\n\n  /**\n   * Add the correct display in IE 10+.\n   */\n\n  template {\n    display: none;\n  }\n\n  /**\n   * Add the correct display in IE 10.\n   */\n\n  [hidden] {\n    display: none;\n  }\n","@use 'sass:map';\n@use '../01-base' as base;\n@use '../02-tokens/maps' as maps;\n@use '../02-tokens/colors-semantic' as semantic;\n@use '../02-tokens/typography-primitive' as typography-primitive;\n@use '../02-tokens/typography-semantic' as typography-semantic;\n@use '../02-tokens/dimensions-semantic' as dimensions-semantic;\n\n@font-face {\n  font-family: 'Inter';\n  src: url('#{base.$eui-assets-base-path}/fonts/inter/InterVariable.woff2') format('woff2');\n  font-weight: 100 900;\n  font-style: normal;\n  font-display: block;\n}\n\n@font-face {\n  font-family: 'Inter';\n  src: url('#{base.$eui-assets-base-path}/fonts/inter//InterVariable-Italic.woff2') format('woff2');\n  font-weight: 100 900;\n  font-display: block;\n  font-style: italic;\n}\n\n:root {\n    // SPACING - eui-s\n    // ---------------\n\n    @each $spacing, $value in dimensions-semantic.$spacing-semantic-map {\n        --eui-s-#{$spacing}: calc( #{var(--eui-s-breakpoint-ratio)} * #{$value} );\n    }\n\n    \n    // BORDER RADIUS - eui-br\n    // ----------------------\n\n    @each $br, $value in maps.$border-radius-map {\n        --eui-br-#{$br}: #{$value};\n    }\n\n\n    // LAYOUT-BREAKPOINTS - eui-bp\n    // ---------------------------\n\n    @each $bp, $value in maps.$breakpoint-map {\n        --eui-bp-#{$bp}: #{$value};\n    }\n\n\n    // BORDER WIDTH - eui-bw\n    // ---------------------\n\n    @each $br, $value in maps.$border-width-map {\n        --eui-bw-#{$br}: #{$value};\n    }\n\n\n    // BOX-SHADOWS - eui-sh\n    // --------------------\n\n    @each $sh, $value in maps.$box-shadow-map {\n        --eui-sh-#{$sh}: #{$value};\n    }\n\n\n    // ICON-SIZES - eui-is\n    // -------------------\n\n    @each $icon-size, $value in dimensions-semantic.$icon-sizing-semantic-map {\n        --eui-is-#{$icon-size}: #{$value};\n    }\n\n\n    // OPACITY - eui-o\n    // ---------------\n\n    @each $idx, $value in maps.$opacity-map {\n        --eui-o-#{$idx}: #{$value};\n    }\n\n\n    // Z-INDEXES - eui-zi\n    // -------------------\n\n    @each $idx, $value in maps.$z-index-map {\n        --eui-zi-#{$idx}: #{$value};\n    }\n\n\n    // OTHERS \n    // ------\n    --eui-internal-icon-checkmark-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/check.svg');\n    --eui-internal-icon-remove-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/remove.svg');\n    --eui-internal-icon-ellipse-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/ellipse.svg');\n    --eui-internal-icon-external-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/external.svg');\n    --eui-internal-icon-chevron-down-path: url('#{base.$eui-assets-base-path}/icons/eui-internals/chevron-down.svg');    \n\n\n\n    // Animations related\n    --eui-base-animation-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 1);\n    --eui-base-animation-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    --eui-base-animation-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1);\n    --eui-base-animation-ease-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);    // ease\n    --eui-base-animation-ease-in-out-timing-function: ease-in-out;\n\n    --eui-base-animation-duration-fast: 0.25s;\n    --eui-base-animation-duration-medium: 0.5s;\n    --eui-base-animation-duration-slow: 1s;\n    --eui-base-animation-duration-base: 500ms;\n    --eui-base-animation-duration: var(--eui-base-animation-duration-base);\n\n    --eui-base-animation-transition-base: all 0.2s #{var(--eui-base-animation-linear-out-slow-in-timing-function)};\n    --eui-base-animation-transition-ease: all 0.2s #{var(--eui-base-animation-ease-timing-function)};\n    --eui-base-animation-transition-ease-in-out: all 0.2s #{var(--eui-base-animation-ease-in-out-timing-function)};\n    --eui-base-animation-transition-ease-in-out-1s: all 1s #{var(--eui-base-animation-ease-in-out-timing-function)};\n\n    --eui-base-animation-delay: 0s;\n    --eui-base-animation-direction: normal;\n    --eui-base-animation-fill-mode: forwards;    // this prevents the animation from restarting\n    --eui-base-animation-background-color: var(--eui-c-primary-surface-light);\n}","@use '../../base' as base;\n\nhtml {\n    display: block;\n    height: 100%;\n    font-size: calc( #{var(--eui-f-breakpoint-ratio)} * #{var(--eui-f-size-base)} );\n    line-height: calc( #{var(--eui-f-breakpoint-ratio)} * #{var(--eui-base-line-height)} );\n    @include base.eui-scrollbars();\n}\n\nbody {\n    background-color: var(--eui-c-surface-page);\n    color: var(--eui-c-text);\n    font-family: var(--eui-f-family);\n    font-feature-settings: 'liga';\n    font-size: calc( #{var(--eui-f-breakpoint-ratio)} * #{var(--eui-f-size-base)} );\n    -moz-font-smoothing: antialiased;\n    -webkit-font-smoothing: antialiased;\n    font-style: normal;\n    font-weight: normal;\n    height: 100%;\n    line-height: calc( #{var(--eui-f-breakpoint-ratio)} * #{var(--eui-base-line-height)} );\n    margin: 0;\n    text-align: start;\n    text-rendering: optimizeLegibility;\n}\n","@use 'accessibility.mixins' as a11y;\n\n@mixin eui-scrollbars( $size: 9px, $foreground-color: var(--eui-c-neutral-dark-surface), $background-color: var(--eui-c-neutral-dark-surface-light), $border-radius: 5rem, $state: active ) {\n    \n    &::-webkit-scrollbar {\n        display: inherit;\n        height: $size;      // horizontal scroll\n        width: $size;       // vertical scroll\n        @if ($state == active) {\n            background-color: $background-color;\n        }\n        @else {\n            background-color: transparent;\n        }\n    }\n\n    // This is the scrolling bar\n    &::-webkit-scrollbar-thumb {\n        @if ($state == active) {\n            background-color: $foreground-color;\n            border-radius: $border-radius;\n            // Uses the border instead of width to make it grow when on hover\n            background-clip: padding-box;   // make the border work\n            border: 1px solid transparent;\n\n            &:hover {\n                background-color: var(--eui-c-secondary-surface-dark);\n                border: 0;\n                cursor: grab;\n            }\n        }\n        @else {\n            background-color: transparent;\n        }\n    }\n\n    // Apply focus and keyboard focus to scrollbar thumb when the scrollable container is focused\n    &:focus::-webkit-scrollbar-thumb {\n        @if ($state == active) {\n            @include a11y.eui-accessible-focus-pseudo;\n        }\n    }\n\n    &:focus-visible::-webkit-scrollbar-thumb {\n        @if ($state == active) {\n            @include a11y.eui-accessible-focus-pseudo;\n        }\n    }\n\n    // This is the scroll container\n    &::-webkit-scrollbar-track {\n        @if ($state == active) {\n            background-color: $background-color;\n            border-radius: 0;\n        }\n        @else {\n            background-color: transparent;\n        }\n    }\n\n    // Firefox only CSS-specific extension - Attention those properties overrides :webkit pseudos!\n    @-moz-document url-prefix() {\n        scrollbar-color: var(--eui-c-secondary-surface) var(--eui-c-secondary-surface-light);\n        // scrollbar-gutter: stable;\n        scrollbar-width: auto;\n    }\n\n    // Firefox focus state for scrollbar\n    &:focus,\n    &:focus-visible {\n        @-moz-document url-prefix() {\n            scrollbar-color: var(--eui-c-focus-visible) var(--eui-c-s-secondary-surface-light);\n        }\n    }\n}\n@mixin eui-scrollbars-inactive($size: 8px) {\n    &::-webkit-scrollbar {\n        background-color: transparent;\n        display: inherit;\n        height: $size;      // horizontal scroll\n        width: $size;       // vertical scroll\n    }\n\n    &::-webkit-scrollbar-thumb {\n        background-color: transparent;\n    }\n\n    &::-webkit-scrollbar-track {\n        background-color: transparent;\n    }\n}\n\n\n// @mixin eui-ng-scrollbar() {\n//     --scrollbar-thickness: 10 !important;\n//     --scrollbar-hover-thickness: var(--scrollbar-thickness) !important;\n//     --scrollbar-border-radius: 5rem !important;\n// }\n","$outline-offset: -2px;\n$outline-size: 2px;\n\n// Call this mixin to enforce the accessibility visuals when on focus/active\n@mixin eui-accessible-focus($offset: $outline-offset, $size: $outline-size) {\n    &:focus:not([readonly]) {\n        outline: $size solid var(--eui-c-focus) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n\n    &:focus-visible:not([readonly]) {\n        outline: $size solid var(--eui-c-focus-visible) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n\n    // Forced focusable element\n    [tabindex=\"0\"] {\n        // &:active:not([readonly]),\n        &:focus:not([readonly]) {\n            outline: $size solid var(--eui-c-focus-visible) !important;\n            outline-offset: $offset !important;\n            transition: none;\n        }\n    }\n}\n\n@mixin eui-accessible-focus-only($offset: $outline-offset, $size: $outline-size) {\n    &:focus:not([readonly]) {\n        outline: $size solid var(--eui-c-focus) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n}\n\n@mixin eui-accessible-focus-visible($offset: $outline-offset, $size: $outline-size) {\n    &:focus-visible:not([readonly]) {\n        outline: $size solid var(--eui-c-focus-visible) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n}\n\n@mixin eui-accessible-focus-rounded($offset: $outline-offset, $size: $outline-size) {\n    &:focus:not([readonly]) {\n        border-radius: var(--eui-br-max);\n        outline: $size solid var(--eui-c-focus) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n\n    &:focus-visible:not([readonly]) {\n        border-radius: var(--eui-br-max);\n        outline: $size solid var(--eui-c-focus-visible) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n}\n\n@mixin eui-accessible-focus-visible-rounded($offset: $outline-offset, $size: $outline-size) {\n    &:focus-visible:not([readonly]) {\n        border-radius: var(--eui-br-max);\n        outline: $size solid var(--eui-c-focus-visible) !important;\n        outline-offset: $offset !important;\n        transition: none;\n    }\n}\n\n@mixin eui-accessible-focus-border() {\n    border-left: var(--eui-s-3xs) solid transparent;\n\n    &:focus:not([readonly]) {\n        border: var(--eui-s-3xs) solid var(--eui-c-focus-visible) !important;\n        transition: none;\n    }\n}\n\n\n\n@mixin eui-accessible-focus-ring($offset: 1px) {\n    &:focus:not([readonly]) {\n        outline: var(--eui-bw-s) solid var(--eui-c-primary-border) !important;\n        outline-offset: $offset !important;\n        border-radius: var(--eui-br-xs) !important;\n    }\n}\n@mixin eui-accessible-focus-ring-rounded($offset: 1px) {\n    &:focus:not([readonly]) {\n        outline: var(--eui-bw-s) solid var(--eui-c-primary-border) !important;\n        outline-offset: $offset !important;\n        border-radius: var(--eui-br-max) !important;\n    }\n}\n@mixin eui-accessible-focus-visible-ring($offset: 1px) {\n    &:focus-visible:not([readonly]) {\n        outline: var(--eui-bw-s) solid var(--eui-c-primary-border) !important;\n        outline-offset: $offset !important;\n        border-radius: var(--eui-br-xs) !important;\n    }\n}\n@mixin eui-accessible-focus-visible-ring-rounded($offset: 1px) {\n    &:focus-visible:not([readonly]) {\n        outline: var(--eui-bw-s) solid var(--eui-c-primary-border) !important;\n        outline-offset: $offset !important;\n        border-radius: var(--eui-br-max) !important;\n    }\n}\n\n// Mixin for applying focus outline to pseudo-elements (like scrollbar thumbs)\n// This doesn't use :not([readonly]) since pseudo-elements don't support attribute selectors, that's why a new mixin is needed\n@mixin eui-accessible-focus-pseudo($offset: $outline-offset, $size: $outline-size) {\n    background-color: var(--eui-c-primary-surface);\n    outline: $size solid var(--eui-c-focus-visible) !important;\n    outline-offset: $offset !important;\n}\n","@use '../../02-tokens/dimensions-semantic' as dimensions-semantic;\n\n.eui-icon-svg {\n    fill: currentColor;\n    margin: 0;\n    transform: scaleX(1) scaleY(1) rotateZ(0deg);\n    transition: transform 300ms ease-in-out;\n    display: inline-flex;\n    align-items: center;\n}\n\n@each $icon-size, $value in dimensions-semantic.$icon-sizing-semantic-map {\n    .eui-icon-svg {\n        &.eui-icon-svg--size {\n            &-#{$icon-size} {\n                svg {\n                    height: var(--eui-is-#{$icon-size});\n                    width: var(--eui-is-#{$icon-size});\n\n                    // Custom icons\n                    > image {\n                        height: var(--eui-is-#{$icon-size});\n                        width: var(--eui-is-#{$icon-size});\n                    }\n                }\n\n                &.eui-icon-svg--stack {\n                    svg {\n                        height: var(--eui-is-#{$icon-size});\n                        width: var(--eui-is-#{$icon-size});\n                    }\n                }\n            }\n        }\n    }\n}\n\n\n// COMPOSITION: ICON + BADGE\n.eui-icon-svg {\n    .eui-badge,\n    .eui-badge--size-m {\n        position: absolute;\n        left: 40%;\n        top: -40%;\n    }\n\n    .eui-badge--empty {\n        left: 70%;\n        top: -5%\n    }\n}\n\n.eui-icon-svg--size-l {\n    .eui-badge--size-s {\n        left: 70%;\n    }\n}\n\n// COMPOSITION: BUTTON + BADGE\n.eui-button {\n    .eui-badge {\n        height: inherit;\n    }\n}\n"]}