{"version":3,"sources":["../../scss/demo.scss","demo.css","../../scss/_variables.scss","../../scss/demo/_highlight.scss","../../scss/mixins/_mixins.scss","../../scss/demo/_examples.scss"],"names":[],"mappings":"AAAA;;;;;ECKE;ACsGF;;EDnGE;AEAF;;EAEE,iBAAiB;EACjB,gBAAgB;EAChB,cAAc;EACd,sBDoIwB;ECnIxB,mBDGY;ECFZ,kBDsHiB;ECrHjB,cAAc,EAAA;ECJd;;IACE,UAAU;IACV,WAAW;IACX,kCAA0B;IAA1B,0BAA0B,EAAA;EAG5B;;IACE,kBAAkB;IAGhB,uBAAuB,EAAA;EAM3B;;IACE,uBAAuB,EAAA;EAGzB;;IACE,mBFF8B;IEK5B,mBAAiC,EAAA;;ADhBvC;EACY,cAfO,EAAA;;AAcnB;EAE6D,cArBxC,EAAA;;AAmBrB;EAG2B,cAvBP,EAAA;;AAoBpB;EAIyC,cApBtB,EAAA;;AAgBnB;EAK4B,cAtBV,EAAA;;AAiBlB;EAMqB,cAxBA,EAAA;;AEFrB;EACE,aAAa;EACb,cAAc;EACd,2CHqDgE;EGpDhE,0BAA0B;EAC1B,kBAAkB;EAElB,iBAAiB;EACjB,aAAa;EACb,mBAAmB;EACnB,gBAAgB,EAAA;;AAGlB;EACE,uBAAuB,EAAA;EADzB;IAII,YAAY,EAAA;;AAIhB;EACE,oBHqGuB;EGpGvB,OAAO;EACP,eAAe,EAAA;;AAGjB;EACE,mBHZa,EAAA;;AGef;EACE,cAAc;EACd,gBAAgB,EAAA;EAFlB;IAKI,SAAS;IACT,0BAA0B,EAAA;EAG5B;IACE,iBAAiB,EAAA;;AAIrB;EACE,cAAc,EAAA;EADhB;IAII,gBAAgB,EAAA;;AAIpB;EACE,gBAAgB,EAAA;;AAGlB;EACE,gBAAgB,EAAA;;AAGlB;EACE,mBH7CY;EG8CZ,aHkR0B;EGjR1B,kBAAkB;EAClB,WAAW;EACX,OAAO;EACP,MAAM;EACN,YAAY;EACZ,0BAA0B,EAAA;;ADnBxB;EACE;ICuBF,2CHlB8D;IGmB9D,gBAAgB,EAAA,EACjB;;ADpBC;EACE;ICiBF,2CHlB8D;IGmB9D,gBAAgB,EAAA,EACjB;;ALhEH;EACE,8CAA8C;EAC9C,qBAAqB;EACrB,iBAAiB,EAAA;;AAGnB;EACE,2BAA2B,EAAA;;AAG7B;EAEI,aACF,EAAA;;AAHF;EAMI,gBAAgB;EAChB,kBAAkB,EAAA;;AAPtB;EAWI,cEuB8D,EAAA","file":"demo.css","sourcesContent":["/*!\n * Tabler (v1.0.0-alpha.4)\n * Copyright 2018-2020 The Tabler Authors\n * Copyright 2018-2020 codecalm\n * Licensed under MIT (https://github.com/tabler/tabler/blob/master/LICENSE)\n */\n\n@import \"config\";\n@import \"demo/highlight\";\n@import \"demo/examples\";\n\n\n.card-sponsor {\n  background: #dbe7f6 no-repeat center/100% 100%;\n  border-color: #548ed2;\n  min-height: 316px;\n}\n\nbody.no-transitions * {\n  transition: none !important;\n}\n\n.toc-entry {\n  &:before {\n    content: '- '\n  }\n\n  ul {\n    list-style: none;\n    padding-left: 1rem;\n  }\n\n  a {\n    color: $text-muted;\n  }\n}","/*!\n * Tabler (v1.0.0-alpha.4)\n * Copyright 2018-2020 The Tabler Authors\n * Copyright 2018-2020 codecalm\n * Licensed under MIT (https://github.com/tabler/tabler/blob/master/LICENSE)\n */\n/**\nDark mode\n */\npre.highlight,\n.highlight pre {\n  max-height: 30rem;\n  margin: 1.5rem 0;\n  overflow: auto;\n  font-size: 0.7333333em;\n  background: #354052;\n  border-radius: 3px;\n  color: #ffffff; }\n  pre.highlight::-webkit-scrollbar,\n  .highlight pre::-webkit-scrollbar {\n    width: 6px;\n    height: 6px;\n    transition: .3s background; }\n  pre.highlight::-webkit-scrollbar-thumb,\n  .highlight pre::-webkit-scrollbar-thumb {\n    border-radius: 5px;\n    background: transparent; }\n  pre.highlight::-webkit-scrollbar-corner,\n  .highlight pre::-webkit-scrollbar-corner {\n    background: transparent; }\n  pre.highlight:hover::-webkit-scrollbar-thumb,\n  .highlight pre:hover::-webkit-scrollbar-thumb {\n    background: #cbcfd6;\n    background: #5d6675; }\n\n.highlight .c, .highlight .c1 {\n  color: #a0aec0; }\n\n.highlight .na, .highlight .nx, .highlight .nl, .language-css .highlight .na, .language-scss .highlight .na {\n  color: #ffe484; }\n\n.highlight .s, .highlight .dl, .highlight .s1, .highlight .s2, .highlight .mh {\n  color: #b5f4a5; }\n\n.highlight .mi, .highlight .language-js .nb, .highlight .nc, .highlight .nd, .highlight .nt {\n  color: #93ddfd; }\n\n.highlight .language-html .nt, .highlight .nb {\n  color: #ff8383; }\n\n.highlight .k, .highlight .kd, .highlight .nv, .highlight .n {\n  color: #d9a9ff; }\n\n.example {\n  padding: 2rem;\n  margin: 2rem 0;\n  border: 1px solid rgba(134, 140, 151, 0.24);\n  border-radius: 3px 3px 0 0;\n  position: relative;\n  min-height: 12rem;\n  display: flex;\n  align-items: center;\n  overflow-x: auto; }\n\n.example-centered {\n  justify-content: center; }\n  .example-centered .example-content {\n    flex: 0 auto; }\n\n.example-content {\n  font-size: 0.9375rem;\n  flex: 1;\n  max-width: 100%; }\n\n.example-bg {\n  background: #f5f7fb; }\n\n.example-code {\n  margin: 2rem 0;\n  border-top: none; }\n  .example-code pre {\n    margin: 0;\n    border-radius: 0 0 3px 3px; }\n  .example + .example-code {\n    margin-top: -2rem; }\n\n.example-column {\n  margin: 0 auto; }\n  .example-column > .card:last-of-type {\n    margin-bottom: 0; }\n\n.example-column-1 {\n  max-width: 20rem; }\n\n.example-column-2 {\n  max-width: 40rem; }\n\n.example-modal-backdrop {\n  background: #354052;\n  opacity: 0.24;\n  position: absolute;\n  width: 100%;\n  left: 0;\n  top: 0;\n  height: 100%;\n  border-radius: 2px 2px 0 0; }\n\n@media not print {\n  .theme-dark .example-code {\n    border: 1px solid rgba(134, 140, 151, 0.24);\n    border-top: none; } }\n\n@media not print and (prefers-color-scheme: dark) {\n  .theme-dark-auto .example-code {\n    border: 1px solid rgba(134, 140, 151, 0.24);\n    border-top: none; } }\n\n.card-sponsor {\n  background: #dbe7f6 no-repeat center/100% 100%;\n  border-color: #548ed2;\n  min-height: 316px; }\n\nbody.no-transitions * {\n  transition: none !important; }\n\n.toc-entry:before {\n  content: '- '; }\n\n.toc-entry ul {\n  list-style: none;\n  padding-left: 1rem; }\n\n.toc-entry a {\n  color: #868c97; }\n\n/*# sourceMappingURL=demo.css.map */","//ASSETS BASE\n$assets-base: \"..\" !default;\n\n// FONTS\n$google-font: \"Source Sans Pro\" !default;\n\n$font-family-sans-serif: $google-font, -apple-system, blinkmacsystemfont, segoe ui, helvetica, arial, sans-serif, apple color emoji, segoe ui emoji, segoe ui symbol !default;\n$font-family-monospace: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;\n$font-family-serif: \"Georgia\", \"Times New Roman\", times, serif !default;\n\n// EXTERNAL FONTS\n$icon-fonts: () !default;\n\n// COLORS\n$theme-color-interval: 10% !default;\n\n$light: #f5f7fb !default;\n$dark: #354052 !default;\n\n$light-black: rgba($dark, .24) !default;\n$light-mix: rgba(mix($light, $dark, 64%), .24) !default;\n$light-white: rgba($light, .24) !default;\n\n$min-black: rgba($dark, .024) !default;\n$min-white: rgba(mix($light, $dark, 48%), .1) !default;\n\n$gray-50: #fbfbfb !default;\n$gray-100: $light !default;\n$gray-200: mix($light, $dark, 98%) !default;\n$gray-300: mix($light, $dark, 94%) !default;\n$gray-400: mix($light, $dark, 88%) !default;\n$gray-500: mix($light, $dark, 78%) !default;\n$gray-600: mix($light, $dark, 60%) !default;\n$gray-700: mix($light, $dark, 36%) !default;\n$gray-800: mix($light, $dark, 16%) !default;\n$gray-900: $dark !default;\n\n$blue: #206bc4 !default;\n$azure: #45aaf2 !default;\n$indigo: #6574cd !default;\n$purple: #a55eea !default;\n$pink: #f66d9b !default;\n$red: #fa4654 !default;\n$orange: #ff922b !default;\n$yellow: #fab005 !default;\n$lime: #94d82d !default;\n$green: #5eba00 !default;\n$teal: #2bcbba !default;\n$cyan: #17a2b8 !default;\n$black: #000000 !default;\n$white: #ffffff !default;\n\n$body-bg: $light !default;\n$body-color: $dark !default;\n\n$text-muted-opacity: .60 !default;\n$text-muted: mix($body-color, #ffffff, $text-muted-opacity * 100%) !default;\n$border-color: rgba($text-muted, .24) !default;\n$border-color-light: rgba($text-muted, .12) !default;\n\n$hover-bg: $light !default;\n$active-bg: rgba($blue, .06) !default;\n\n$primary: $blue !default;\n$secondary: $text-muted !default;\n$success: $green !default;\n$info: $azure !default;\n$warning: $yellow !default;\n$danger: $red !default;\n\n$social-colors: (\n  \"facebook\": #3b5998,\n  \"twitter\": #1da1f2,\n  \"google\": #dc4e41,\n  \"youtube\": #ff0000,\n  \"vimeo\": #1ab7ea,\n  \"dribbble\": #ea4c89,\n  \"github\": #181717,\n  \"instagram\": #e4405f,\n  \"pinterest\": #bd081c,\n  \"vk\": #6383a8,\n  \"rss\": #ffa500,\n  \"flickr\": #0063dc,\n  \"bitbucket\": #0052cc,\n  \"tabler\": #206bc4\n) !default;\n\n$colors: (\n  \"blue\": $blue,\n  \"azure\": $azure,\n  \"indigo\": $indigo,\n  \"purple\": $purple,\n  \"pink\": $pink,\n  \"red\": $red,\n  \"orange\": $orange,\n  \"yellow\": $yellow,\n  \"lime\": $lime,\n  \"green\": $green,\n  \"teal\": $teal,\n  \"cyan\": $cyan,\n  \"white\": $white,\n  \"gray\": $gray-600,\n  \"gray-dark\": $gray-800,\n  \"dark\": $dark\n) !default;\n\n\n/**\nDark mode\n */\n\n$dark-mode-darken: darken($dark, 3%) !default;\n$dark-mode-lighten: lighten($dark, 3%) !default;\n$dark-mode-text: $light;\n\n$avatar-sizes: (\n  \"sm\": 1.5rem,\n  \"md\": 3rem,\n  \"lg\": 4.5rem,\n  \"xl\": 6rem\n) !default;\n\n//Fonts\n$font-size-base: .9375rem !default;\n$font-weight-bold: 600 !default;\n$body-letter-spacing: null !default;\n\n$line-height-base: 1.6 !default;\n$line-height-sm: 1.3333334 !default;\n$line-height-lg: 2 !default;\n\n$border-width: 1px !default;\n$border-width-wide: 2px !default;\n$border-radius: 3px !default;\n\n//Typography\n$headings-font-weight: $font-weight-bold !default;\n\n$small-font-size: 87.5% !default;\n\n$h1-font-size: (26em / 15) !default;\n$h2-font-size: (22em / 15) !default;\n$h3-font-size: (18em / 15) !default;\n$h4-font-size: (15em / 15) !default;\n$h5-font-size: (13em / 15) !default;\n$h6-font-size: (11em / 15) !default;\n\n$blockquote-font-size: $h4-font-size !default;\n\n$code-font-size: $h6-font-size !default;\n$code-color: $primary !default;\n\n$lead-font-size: $h4-font-size !default;\n$lead-font-weight: 400 !default;\n\n$hr-opacity: .1 !default;\n$hr-margin-y: 2rem !default;\n\n$caret-spacing: .4em !default;\n\n//Sizing\n$spacer: 1rem !default;\n$spacers: (\n  0: 0,\n  1: $spacer * .25,\n  2: $spacer * .5,\n  3: $spacer,\n  4: $spacer * 1.25,\n  5: $spacer * 1.5,\n  6: $spacer * 3,\n  7: $spacer * 6,\n  8: $spacer * 9,\n) !default;\n\n$size-spacers: (\n  auto: auto,\n  px: 1px,\n  full: 100%\n) !default;\n\n\n$size-values: (\n  1: 1%,\n  25: 25%,\n  50: 50%,\n  75: 75%,\n  100: 100%,\n  auto: auto\n) !default;\n\n$grid-breakpoints: (\n  xs: 0,\n  sm: 33rem,\n  md: 48rem,\n  lg: 64rem,\n  xl: 75.25rem\n) !default;\n\n$container-max-widths: (\n  sm: 32.5rem,\n  md: 47.5rem,\n  lg: 64rem,\n  xl: 75.25rem\n) !default;\n\n$container-variations: (\n  tight: 30rem,\n  narrow: 45rem,\n) !default;\n\n$embed-responsive-aspect-ratios: (\n  \"21by9\": (\n    x: 21,\n    y: 9\n  ),\n  \"16by9\": (\n    x: 16,\n    y: 9\n  ),\n  \"4by3\": (\n    x: 4,\n    y: 3\n  ),\n  \"1by1\": (\n    x: 1,\n    y: 1\n  ),\n  '2by1': (\n    x: 2,\n    y: 1\n  )\n) !default;\n\n$content-padding-y: 1.25rem !default;\n\n\n\n//alerts\n$alert-link-font-weight: $font-weight-bold !default;\n$alert-bg-level: -8 !default;\n$alert-border-level: -6 !default;\n$alert-color-level: 8 !default;\n\n//breadcrumb\n$breadcrumb-variants: (\n  dots: \"·\",\n  arrows: \"›\",\n  bullets: \"\\02022\",\n) !default;\n\n//badges\n$badge-font-weight: $font-weight-bold !default;\n$badge-empty-size: .5rem !default;\n\n//buttons\n$input-color: $body-color !default;\n$input-btn-line-height: (22/15) !default;\n$input-btn-font-size: $font-size-base !default;\n\n$input-btn-font-size-sm: $h5-font-size !default;\n$input-btn-padding-x-sm: .5rem !default;\n$input-btn-padding-y-sm: .125rem !default;\n\n$input-btn-font-size-lg: $h2-font-size !default;\n$input-btn-padding-x-lg: 1.5rem !default;\n$input-btn-padding-y-lg: .5rem !default;\n\n$input-height: null !default;\n$input-height-sm: null !default;\n$input-height-lg: null !default;\n$input-color: inherit !default;\n$input-focus-color: inherit !default;\n\n//buttons\n$btn-padding-x: 1rem !default;\n$btn-font-weight: 500 !default;\n$btn-border-radius: 3px !default;\n\n//cards\n$card-border-color: $border-color !default;\n$card-border-radius: $border-radius !default;\n$card-cap-bg: $min-black !default;\n\n$card-cap-padding-x: 1.25rem !default;\n$card-cap-padding-y: .75rem !default;\n\n$card-active-border-color: $primary !default;\n$card-status-size: $border-width-wide !default;\n$card-group-margin: 1.5rem !default;\n$card-group-margin-sm: .75rem !default;\n\n$card-shadow: rgba($dark, .04) 0 2px 4px 0 !default;\n$card-shadow-hover: rgba($dark, .16) 0 2px 16px 0 !default;\n\n$cards-grid-gap: 1.25rem !default;\n$cards-grid-gap-sm: .75rem !default;\n$cards-grid-breakpoint: lg !default;\n\n//carousel\n$carousel-control-color: $white !default;\n$carousel-control-icon-width: 1.5rem !default;\n$carousel-control-prev-icon-bg: url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{$carousel-control-color}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='15 18 9 12 15 6'></polyline></svg>\") !default;\n$carousel-control-next-icon-bg: url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{$carousel-control-color}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='9 18 15 12 9 6'></polyline></svg>\") !default;\n\n\n\n//close\n$close-font-weight: 400 !default;\n$close-font-size: 1.5rem !default;\n\n//dropdown\n$dropdown-item-padding-x: 1rem !default;\n$dropdown-font-size: $h4-font-size !default;\n$dropdown-divider-bg: $border-color !default;\n$dropdown-padding-y: .5rem !default;\n$dropdown-link-hover-bg: $hover-bg !default;\n$dropdown-link-hover-color: inherit !default;\n$dropdown-spacer: 1px !default;\n$dropdown-min-width: 12rem !default;\n\n$dropdown-link-active-color: $primary !default;\n$dropdown-link-active-bg: $active-bg !default;\n\n$dropdown-border-color: $border-color !default;\n$dropdown-menu-max-width: 25rem !default;\n\n//grid\n$grid-gutter-width: 1.5rem !default;\n\n//loader\n$loader-size: 2.5rem !default;\n\n//lists\n$list-group-item-padding-y: .5rem !default;\n$list-group-item-padding-x: .75rem !default;\n\n//modals\n$modal-backdrop-opacity: .24 !default;\n$modal-backdrop-bg: $dark !default;\n$modal-backdrop-blur: 2px !default;\n\n$modal-fade-transform: translate(0, -1rem) !default;\n\n$modal-content-border-color: $border-color-light !default;\n$modal-content-bg: $gray-50 !default;\n$modal-content-border-radius: $border-radius !default;\n\n$modal-header-padding: 1.5rem !default;\n$modal-header-height: 3.5rem !default;\n$modal-header-border-width: 1px !default;\n$modal-header-border-color: $border-color-light !default;\n$modal-header-bg: $white !default;\n$modal-inner-padding: 1.5rem !default;\n$modal-footer-border-width: 0 !default;\n$modal-footer-margin-between: .75rem !default;\n\n$modal-xl: 1140px !default;\n$modal-lg: 720px !default;\n$modal-md: 540px !default;\n$modal-sm: 380px !default;\n\n//navbar\n$navbar-padding-y: .5rem !default;\n$navbar-height: 3.5rem !default;\n$navbar-border-color: $border-color !default;\n\n$navbar-toggler-padding-y: .75rem !default;\n$navbar-toggler-padding-x: .75rem !default;\n$navbar-toggler-margin: -.75rem !default;\n$navbar-toggler-font-size: 1rem !default;\n$navbar-toggler-size: 1.5rem !default;\n$navbar-toggler-item-height: 2px !default;\n$navbar-toggler-item-spacing: 7px !default;\n$navbar-toggler-transform-time: .2s !default;\n\n//sidenav\n$navbar-vertical-width: 15.625rem !default;\n$navbar-vertical-narrow-width: 4rem !default;\n$navbar-vertical-dark-bg: $dark !default;\n$navbar-vertical-dark-color: $white !default;\n$navbar-vertical-padding: 1rem !default;\n$navbar-vertical-active-accent-color: $primary !default;\n\n$navbar-nav-link-padding-x: .75rem !default;\n\n//$navbar-light-color: rgba($body-color, .64) !default;\n//$navbar-light-active-color: $primary !default;\n//$navbar-light-hover-color: $body-color !default;\n\n//$navbar-dark-color: rgba($white, .64) !default;\n//$navbar-dark-active-color: $white !default;\n//$navbar-dark-hover-color: $white !default;\n\n//popover\n$popover-border-color: $border-color !default;\n\n//footer\n$footer-bg: $white !default;\n$footer-border-color: $border-color !default;\n$footer-border-color: $border-color !default;\n\n\n//pagination\n$pagination-border-width: 0 !default;\n$pagination-padding-y: .25rem !default;\n$pagination-padding-x: .25rem !default;\n$pagination-color: $text-muted !default;\n$pagination-bg: transparent !default;\n$pagination-disabled-bg: transparent !default;\n$pagination-disabled-color: rgba($text-muted, .5) !default;\n\n\n//steps\n$steps-border-width: 2px !default;\n$steps-color-inactive: #f3f5f5 !default;\n\n//spinner\n$spinner-width: 1.5rem !default;\n$spinner-height: 1.5rem !default;\n$spinner-width-sm: 1rem !default;\n$spinner-height-sm: 1rem !default;\n$spinner-border-width: 2px !default;\n$spinner-border-width-sm: 1px !default;\n\n//tables\n$table-head-border-color: $border-color !default;\n\n//toasts\n$toast-border-color: $border-color !default;\n$toast-header-color: $text-muted !default;\n\n//other\n$yiq-contrasted-threshold: 200 !default;\n\n//progress\n$progress-bg: $light-mix !default;\n$progress-height: .5rem !default;\n\n//ribbons\n$ribbon-margin: .25rem !default;\n\n\n$list-group-border-color: $border-color !default;\n$list-group-action-color: inherit !default;\n\n$input-disabled-bg: $gray-100 !default;\n$input-border-color: $border-color !default;\n$input-placeholder-color: $text-muted !default;\n\n$input-group-addon-bg: $min-black !default;\n$input-group-addon-color: $text-muted !default;\n\n$input-border-radius: $border-radius !default;\n\n\n//Forms\n$form-check-input-width: 1rem !default;\n$form-check-padding-left: $form-check-input-width + .5rem !default;\n$form-check-input-bg: $white !default;\n$form-check-input-border: 1px solid $border-color !default;\n$form-check-input-border-radius: $border-radius !default;\n$form-check-input-checked-bg-size: 1rem !default;\n\n$form-check-input-checked-color: $white !default;\n$form-check-input-checked-bg-repeat: repeat !default;\n$form-check-input-checked-bg-image: url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='#{$form-check-input-checked-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M4 8.5L6.5 11l6-6' transform='scale(.8)' transform-origin='50% 50%'/></svg>\") !default;\n$form-check-input-checked-bg-image-dark: url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='#{$dark}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M4 8.5L6.5 11l6-6' transform='scale(.8)' transform-origin='50% 50%'/></svg>\") !default;\n$form-check-radio-checked-bg-image: url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><circle r='3' fill='#{$form-check-input-checked-color}' cx='8' cy='8' /></svg>\") !default;\n\n$form-check-input-checked-border-color: $border-color !default;\n\n$form-select-indicator-color: opacify($border-color, .24) !default;\n\n$form-switch-width: 1.75rem !default;\n$form-switch-padding-left: $form-switch-width + .5rem !default;\n$form-switch-bg-image: url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$border-color}'/></svg>\") !default;\n\n\n$form-range-track-height: .25rem !default;\n$form-range-track-bg: $light-mix !default;\n$form-range-thumb-border: 2px solid $white !default;\n$form-range-thumb-height: 1rem !default;\n$form-range-thumb-focus-box-shadow-width: .125rem !default;\n\n$form-feedback-icon-valid: str-replace(url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='\" + $green + \"' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'></polyline></svg>\"), \"#\", \"%23\") !default;\n$form-feedback-icon-invalid: str-replace(url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='\" + $red + \"' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><line x1='18' y1='6' x2='6' y2='18'></line><line x1='6' y1='6' x2='18' y2='18'></line></svg>\"), \"#\", \"%23\") !default;\n\n$caret-width: .32em !default;\n\n//Flags\n$generate-flags: true !default;\n$flag-sizes: (\n  \"md\": 2rem,\n  \"lg\": 3rem,\n  \"xl\": 4rem\n) !default;\n\n//Payments\n$payment-sizes: (\n  \"sm\": 1.5rem,\n  \"lg\": 3rem,\n  \"xl\": 4rem\n) !default;\n\n$enable-social-colors: true !default;\n$enable-ghost-buttons: true !default;\n$enable-extra-colors: true !default;\n$enable-gradients: false !default;\n$enable-navbar-vertical: true !default;\n$enable-dark-mode: true !default;\n","$code-green: #b5f4a5;\n$code-yellow: #ffe484;\n$code-purple: #d9a9ff;\n$code-red: #ff8383;\n$code-blue: #93ddfd;\n$code-white: #ffffff;\n$code-gray: #a0aec0;\n\npre.highlight,\n.highlight pre {\n  max-height: 30rem;\n  margin: 1.5rem 0;\n  overflow: auto;\n  font-size: $code-font-size;\n  background: $dark;\n  border-radius: $border-radius;\n  color: #ffffff;\n  @include scrollbar(true);\n}\n\n.highlight {\n  .c, .c1 { color: $code-gray; }\n  .na, .nx, .nl, .language-css & .na, .language-scss & .na { color: $code-yellow; }\n  .s, .dl, .s1, .s2, .mh { color: $code-green; }\n  .mi, .language-js .nb, .nc, .nd, .nt { color: $code-blue; }\n  .language-html .nt, .nb { color: $code-red; }\n  .k, .kd, .nv, .n { color: $code-purple; }\n}\n","@mixin subheader($include-color: true) {\n  font-size: $h6-font-size;\n  font-weight: $font-weight-bold;\n  text-transform: uppercase;\n  letter-spacing: .04em;\n\n  @if ($include-color) {\n    color: $text-muted;\n  }\n}\n\n@mixin scrollbar($is-dark: false) {\n  &::-webkit-scrollbar {\n    width: 6px;\n    height: 6px;\n    transition: .3s background;\n  }\n\n  &::-webkit-scrollbar-thumb {\n    border-radius: 5px;\n\n    @if ($is-dark) {\n      background: transparent;\n    } @else {\n      background: $gray-400;\n    }\n  }\n\n  &::-webkit-scrollbar-corner {\n    background: transparent;\n  }\n\n  &:hover::-webkit-scrollbar-thumb {\n    background: $gray-500;\n\n    @if ($is-dark) {\n      background: mix(#fff, $dark, 20%);\n    } @else {\n      background: $gray-500;\n    }\n  }\n}\n\n\n@mixin autodark-image {\n  filter: brightness(0) invert(1);\n}\n\n@mixin dark-mode {\n  @if $enable-dark-mode {\n    @media not print {\n      .theme-dark {\n        @content\n      }\n    }\n\n    @media not print and (prefers-color-scheme: dark) {\n      .theme-dark-auto {\n        @content\n      }\n    }\n  }\n}",".example {\n  padding: 2rem;\n  margin: 2rem 0;\n  border: 1px solid $border-color;\n  border-radius: 3px 3px 0 0;\n  position: relative;\n\n  min-height: 12rem;\n  display: flex;\n  align-items: center;\n  overflow-x: auto;\n}\n\n.example-centered {\n  justify-content: center;\n\n  .example-content {\n    flex: 0 auto;\n  }\n}\n\n.example-content {\n  font-size: $font-size-base;\n  flex: 1;\n  max-width: 100%;\n}\n\n.example-bg {\n  background: $body-bg;\n}\n\n.example-code {\n  margin: 2rem 0;\n  border-top: none;\n\n  pre {\n    margin: 0;\n    border-radius: 0 0 3px 3px;\n  }\n\n  .example + & {\n    margin-top: -2rem;\n  }\n}\n\n.example-column {\n  margin: 0 auto;\n\n  > .card:last-of-type {\n    margin-bottom: 0;\n  }\n}\n\n.example-column-1 {\n  max-width: 20rem;\n}\n\n.example-column-2 {\n  max-width: 40rem;\n}\n\n.example-modal-backdrop {\n  background: $modal-backdrop-bg;\n  opacity: $modal-backdrop-opacity;\n  position: absolute;\n  width: 100%;\n  left: 0;\n  top: 0;\n  height: 100%;\n  border-radius: 2px 2px 0 0;\n}\n\n@include dark-mode {\n  .example-code {\n    border: 1px solid $border-color;\n    border-top: none;\n  }\n}"]}