@import "../assets/bootstrap5/functions";

$prefix: bs- !default;
$enable-shadows: true !default;
$enable-validation-icons: false !default;

$font-path-body: "../../fonts" !default;

// Font
$font-size-base: 1rem !default;
$font-size-lg: $font-size-base * 1.125 !default;

$font-family-base: "Gilroy" !default;
$font-family-code: "Gilroy" !default;

// Colors
$foundation: #1f1f4f !default;
$tangerine: #ff6a1a !default;
$lavender: #9747fc !default;
$electric: #02f !default;
$sunglow: #fbcd18 !default;
$green: #09cc8b !default;
$red: #e4263e !default;
$gray: #8a8f98 !default;

$white: #fff !default;
$gray-25: tint-color($gray, 95%) !default;
$gray-50: tint-color($gray, 90%) !default;
$gray-100: tint-color($gray, 80%) !default;
$gray-200: tint-color($gray, 60%) !default;
$gray-300: tint-color($gray, 40%) !default;
$gray-400: tint-color($gray, 20%) !default;
$gray-500: $gray !default;
$gray-600: shade-color($gray, 20%) !default;
$gray-700: shade-color($gray, 40%) !default;
$gray-800: shade-color($gray, 60%) !default;
$gray-900: shade-color($gray, 80%) !default;
$black: #000 !default;

$grays: (
  "25": $gray-25,
  "50": $gray-50,
  "100": $gray-100,
  "200": $gray-200,
  "300": $gray-300,
  "400": $gray-400,
  "500": $gray-500,
  "600": $gray-600,
  "700": $gray-700,
  "800": $gray-800,
  "900": $gray-900,
) !default;

$colors: (
  "foundation": $foundation,
  "tangerine": $tangerine,
  "sunglow": $sunglow,
  "green": $green,
  "electric": $electric,
  "red": $red,
  "gray": $gray-600,
) !default;

// Color variants
$foundation-25: tint-color($foundation, 95%) !default;
$foundation-50: tint-color($foundation, 90%) !default;
$foundation-100: tint-color($foundation, 80%) !default;
$foundation-200: tint-color($foundation, 60%) !default;
$foundation-300: tint-color($foundation, 40%) !default;
$foundation-400: tint-color($foundation, 20%) !default;
$foundation-450: tint-color($foundation, 10%) !default;
$foundation-500: $foundation !default;
$foundation-600: shade-color($foundation, 20%) !default;
$foundation-700: shade-color($foundation, 40%) !default;
$foundation-800: shade-color($foundation, 60%) !default;
$foundation-900: shade-color($foundation, 80%) !default;

$tangerine-25: tint-color($tangerine, 95%) !default;
$tangerine-50: tint-color($tangerine, 90%) !default;
$tangerine-100: tint-color($tangerine, 80%) !default;
$tangerine-200: tint-color($tangerine, 60%) !default;
$tangerine-300: tint-color($tangerine, 40%) !default;
$tangerine-400: tint-color($tangerine, 20%) !default;
$tangerine-450: tint-color($tangerine, 10%) !default;
$tangerine-500: $tangerine !default;
$tangerine-600: shade-color($tangerine, 20%) !default;
$tangerine-700: shade-color($tangerine, 40%) !default;
$tangerine-800: shade-color($tangerine, 60%) !default;
$tangerine-900: shade-color($tangerine, 80%) !default;

$lavender-25: tint-color($lavender, 95%) !default;
$lavender-50: tint-color($lavender, 90%) !default;
$lavender-100: tint-color($lavender, 80%) !default;
$lavender-200: tint-color($lavender, 60%) !default;
$lavender-300: tint-color($lavender, 40%) !default;
$lavender-400: tint-color($lavender, 20%) !default;
$lavender-450: tint-color($lavender, 10%) !default;
$lavender-500: $lavender !default;
$lavender-600: shade-color($lavender, 20%) !default;
$lavender-700: shade-color($lavender, 40%) !default;
$lavender-800: shade-color($lavender, 60%) !default;
$lavender-900: shade-color($lavender, 80%) !default;

$sunglow-25: tint-color($sunglow, 95%) !default;
$sunglow-50: tint-color($sunglow, 90%) !default;
$sunglow-100: tint-color($sunglow, 80%) !default;
$sunglow-200: tint-color($sunglow, 60%) !default;
$sunglow-300: tint-color($sunglow, 40%) !default;
$sunglow-400: tint-color($sunglow, 20%) !default;
$sunglow-450: tint-color($sunglow, 10%) !default;
$sunglow-500: $sunglow !default;
$sunglow-600: shade-color($sunglow, 20%) !default;
$sunglow-700: shade-color($sunglow, 40%) !default;
$sunglow-800: shade-color($sunglow, 60%) !default;
$sunglow-900: shade-color($sunglow, 80%) !default;

$action-25: tint-color($electric, 95%) !default;
$action-50: tint-color($electric, 90%) !default;
$action-100: tint-color($electric, 80%) !default;
$action-200: tint-color($electric, 60%) !default;
$action-300: tint-color($electric, 40%) !default;
$action-400: tint-color($electric, 20%) !default;
$action-450: tint-color($electric, 10%) !default;
$action-500: $electric !default;
$action-600: shade-color($electric, 20%) !default;
$action-700: shade-color($electric, 40%) !default;
$action-800: shade-color($electric, 60%) !default;
$action-900: shade-color($electric, 80%) !default;

$success-25: tint-color($green, 95%) !default;
$success-50: tint-color($green, 90%) !default;
$success-100: tint-color($green, 80%) !default;
$success-200: tint-color($green, 60%) !default;
$success-300: tint-color($green, 40%) !default;
$success-400: tint-color($green, 20%) !default;
$success-450: tint-color($green, 10%) !default;
$success-500: $green !default;
$success-600: shade-color($green, 20%) !default;
$success-700: shade-color($green, 40%) !default;
$success-800: shade-color($green, 60%) !default;
$success-900: shade-color($green, 80%) !default;

$danger-25: tint-color($red, 95%) !default;
$danger-50: tint-color($red, 90%) !default;
$danger-100: tint-color($red, 80%) !default;
$danger-200: tint-color($red, 60%) !default;
$danger-300: tint-color($red, 40%) !default;
$danger-400: tint-color($red, 20%) !default;
$danger-450: tint-color($red, 10%) !default;
$danger-500: $red !default;
$danger-600: shade-color($red, 20%) !default;
$danger-700: shade-color($red, 40%) !default;
$danger-800: shade-color($red, 60%) !default;
$danger-900: shade-color($red, 80%) !default;

$foundations: (
  "foundation-25": $foundation-25,
  "foundation-50": $foundation-50,
  "foundation-100": $foundation-100,
  "foundation-200": $foundation-200,
  "foundation-300": $foundation-300,
  "foundation-400": $foundation-400,
  "foundation-450": $foundation-450,
  "foundation-500": $foundation-500,
  "foundation-600": $foundation-600,
  "foundation-700": $foundation-700,
  "foundation-800": $foundation-800,
  "foundation-900": $foundation-900
) !default;

$tangerines: (
  "tangerine-25": $tangerine-25,
  "tangerine-50": $tangerine-50,
  "tangerine-100": $tangerine-100,
  "tangerine-200": $tangerine-200,
  "tangerine-300": $tangerine-300,
  "tangerine-400": $tangerine-400,
  "tangerine-450": $tangerine-450,
  "tangerine-500": $tangerine-500,
  "tangerine-600": $tangerine-600,
  "tangerine-700": $tangerine-700,
  "tangerine-800": $tangerine-800,
  "tangerine-900": $tangerine-900
) !default;

$lavenders: (
  "lavender-25": $lavender-25,
  "lavender-50": $lavender-50,
  "lavender-100": $lavender-100,
  "lavender-200": $lavender-200,
  "lavender-300": $lavender-300,
  "lavender-400": $lavender-400,
  "lavender-450": $lavender-450,
  "lavender-500": $lavender-500,
  "lavender-600": $lavender-600,
  "lavender-700": $lavender-700,
  "lavender-800": $lavender-800,
  "lavender-900": $lavender-900
) !default;

$sunglows: (
  "sunglow-25": $sunglow-25,
  "sunglow-50": $sunglow-50,
  "sunglow-100": $sunglow-100,
  "sunglow-200": $sunglow-200,
  "sunglow-300": $sunglow-300,
  "sunglow-400": $sunglow-400,
  "sunglow-450": $sunglow-450,
  "sunglow-500": $sunglow-500,
  "sunglow-600": $sunglow-600,
  "sunglow-700": $sunglow-700,
  "sunglow-800": $sunglow-800,
  "sunglow-900": $sunglow-900
) !default;

$warnings: (
  "warning-25": $tangerine-25,
  "warning-50": $tangerine-50,
  "warning-100": $tangerine-100,
  "warning-200": $tangerine-200,
  "warning-300": $tangerine-300,
  "warning-400": $tangerine-400,
  "warning-450": $tangerine-450,
  "warning-500": $tangerine-500,
  "warning-600": $tangerine-600,
  "warning-700": $tangerine-700,
  "warning-800": $tangerine-800,
  "warning-900": $tangerine-900
) !default;

$actions: (
  "action-25": $action-25,
  "action-50": $action-50,
  "action-100": $action-100,
  "action-200": $action-200,
  "action-300": $action-300,
  "action-400": $action-400,
  "action-450": $action-450,
  "action-500": $action-500,
  "action-600": $action-600,
  "action-700": $action-700,
  "action-800": $action-800,
  "action-900": $action-900
) !default;

$dangers: (
  "danger-25": $danger-25,
  "danger-50": $danger-50,
  "danger-100": $danger-100,
  "danger-200": $danger-200,
  "danger-300": $danger-300,
  "danger-400": $danger-400,
  "danger-450": $danger-450,
  "danger-500": $danger-500,
  "danger-600": $danger-600,
  "danger-700": $danger-700,
  "danger-800": $danger-800,
  "danger-900": $danger-900
) !default;

$successs: (
  "success-25": $success-25,
  "success-50": $success-50,
  "success-100": $success-100,
  "success-200": $success-200,
  "success-300": $success-300,
  "success-400": $success-400,
  "success-450": $success-450,
  "success-500": $success-500,
  "success-600": $success-600,
  "success-700": $success-700,
  "success-800": $success-800,
  "success-900": $success-900
) !default;

$primary: $foundation !default;
$secondary: $sunglow !default;
$success: $green !default;
$action: $electric !default;
$warning: $tangerine !default;
$danger: $red !default;
$light: $white !default;
$dark: $gray-900 !default;

$theme-colors: (
  "primary": $primary,
  "secondary": $secondary,
  "success": $success,
  "action": $action,
  "warning": $warning,
  "danger": $danger,
  "light": $light,
  "dark": $dark,
) !default;

// scss-docs-start theme-text-variables
$action-text-emphasis: shade-color($action, 60%) !default;
// scss-docs-end theme-text-variables

// scss-docs-start theme-bg-subtle-variables
$action-bg-subtle: tint-color($action, 80%) !default;
// scss-docs-end theme-bg-subtle-variables

// scss-docs-start theme-border-subtle-variables
$action-border-subtle: tint-color($action, 60%) !default;
// scss-docs-end theme-border-subtle-variables


// Body
$body-color: $gray-900 !default;

// Grid breakpoints
$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1400px,
  xxxl: 1600px
) !default;

// Grid containers
$container-max-widths: (
  xs: 100%,
  sm: 540px,
  md: 720px,
  lg: 960px,
  xl: 1140px,
  xxl: 1320px,
  xxxl: 1510px
) !default;

$headings-color: $gray-800 !default;
$headings-font-weight: 700 !default;

$display-font-weight: 700 !default;
$display-line-height: 1.1 !default;

$font-sizes: (
  1: $font-size-base * 1.25,
  2: $font-size-base * 1.125,
  3: $font-size-base,
  4: $font-size-base * .875,
  5: $font-size-base * .75,
  6: $font-size-base * .625,
) !default;

// Tables
$table-bg-scale: -80% !default;

$table-variants: (
  "primary": shift-color($primary, $table-bg-scale),
  "secondary": shift-color($secondary, $table-bg-scale),
  "action": shift-color($action, $table-bg-scale),
  "success": shift-color($success, $table-bg-scale),
  "warning": shift-color($warning, $table-bg-scale),
  "danger": shift-color($danger, $table-bg-scale),
  "light": $light,
  "dark": $dark,
) !default;

// Borders
$border-width: 2px !default;
$border-color: $gray-400 !default;

$component-active-bg: $action !default;
$focus-ring-opacity: .25 !default;
$focus-ring-color: rgba($action, $focus-ring-opacity) !default;

// Buttons + Forms
$input-btn-border-width: .125rem !default;
$input-focus-border-color: $component-active-bg !default;

// Buttons
$btn-font-weight: 500 !default;
$btn-hover-bg-shade-amount: 20% !default;
$btn-hover-bg-tint-amount: 10% !default;
$btn-hover-border-shade-amount: 20% !default;
$btn-hover-border-tint-amount: 10% !default;
$btn-active-bg-shade-amount: 40% !default;
$btn-active-bg-tint-amount: 20% !default;
$btn-active-border-shade-amount: 40% !default;
$btn-active-border-tint-amount: 10% !default;
$btn-disabled-opacity: 1 !default;

// Border Radius
$border-radius: .5rem !default;
$border-radius-sm: .375rem !default;
$border-radius-lg: .625rem !default;
$border-radius-xl: 1rem !default;
$border-radius-xxl: 1.5rem !default;

$blockquote-font-size: $font-size-base * 3.5 !default;

// Accordion
$accordion-bg: transparent !default;
$accordion-border-width: .0625rem !default;
$accordion-border-radius: 0 !default;
$accordion-button-bg: transparent !default;
$accordion-button-active-bg: transparent !default;
$accordion-button-active-color: $body-color !default;
$accordion-icon-color: $action !default;
$accordion-icon-active-color: $action !default;
$accordion-button-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='#{$accordion-icon-color}'><path d='M12.6923 1.69231C12.6923 0.75625 11.9361 0 11 0C10.0639 0 9.30769 0.75625 9.30769 1.69231V9.30769H1.69231C0.75625 9.30769 0 10.0639 0 11C0 11.9361 0.75625 12.6923 1.69231 12.6923H9.30769V20.3077C9.30769 21.2438 10.0639 22 11 22C11.9361 22 12.6923 21.2438 12.6923 20.3077V12.6923H20.3077C21.2438 12.6923 22 11.9361 22 11C22 10.0639 21.2438 9.30769 20.3077 9.30769H12.6923V1.69231Z'/></svg>") !default;
$accordion-button-active-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 25' fill='#{$accordion-icon-color}'><path d='M21.2143 12.5C21.2143 13.3643 20.512 14.0625 19.6428 14.0625H2.35713C1.48794 14.0625 0.785706 13.3643 0.785706 12.5C0.785706 11.6357 1.48794 10.9375 2.35713 10.9375H19.6428C20.512 10.9375 21.2143 11.6357 21.2143 12.5Z'/></svg>") !default;
$accordion-icon-width: 1rem !default;
$accordion-button-focus-box-shadow: none !default;

// Badges
$badge-font-size: .9375em !default;
$badge-border-radius: var(--#{$prefix}border-radius-pill) !default;

// Modal
$modal-backdrop-bg: rgba($action-200, .15) !default;
$modal-backdrop-opacity: 1 !default;

// Carousel
$carousel-control-color: $action !default;
$carousel-control-icon-width: .75rem !default;
$carousel-indicator-width: 6px !default;
$carousel-indicator-height: 6px !default;
$carousel-indicator-active-bg: $action !default;
$carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='#{$carousel-control-color}'><path d='M0.251787 5.38204C-0.083034 5.72383 -0.083034 6.27891 0.251787 6.62071L4.5375 10.9957C4.87232 11.3375 5.41607 11.3375 5.75089 10.9957C6.08572 10.6539 6.08572 10.0988 5.75089 9.75704L2.925 6.87501H11.1429C11.617 6.87501 12 6.48399 12 6.00001C12 5.51602 11.617 5.12501 11.1429 5.12501H2.92768L5.74822 2.24297C6.08304 1.90118 6.08304 1.3461 5.74822 1.0043C5.41339 0.662506 4.86964 0.662506 4.53482 1.0043L0.249109 5.3793L0.251787 5.38204Z'/></svg>") !default;
$carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='#{$carousel-control-color}'><path d='M11.7482 5.87002C12.083 5.52822 12.083 4.97314 11.7482 4.63135L7.4625 0.256348C7.12768 -0.0854492 6.58393 -0.0854492 6.24911 0.256348C5.91429 0.598145 5.91429 1.15322 6.24911 1.49502L9.075 4.37705H0.857143C0.383036 4.37705 0 4.76807 0 5.25205C0 5.73604 0.383036 6.12705 0.857143 6.12705H9.07232L6.25179 9.00908C5.91696 9.35088 5.91696 9.90596 6.25179 10.2478C6.58661 10.5896 7.13036 10.5896 7.46518 10.2478L11.7509 5.87275L11.7482 5.87002Z'/></svg>") !default;

// Tooltips
$tooltip-border-radius: var(--#{$prefix}border-radius-xs) !default;
$tooltip-bg: var(--#{$prefix}primary) !default;

// Progress
$progress-border-radius: var(--#{$prefix}border-radius-xs) !default;

// Inputs
$input-border-color: $gray-600 !default;
$input-placeholder-color: $gray-600 !default;
$input-border-radius: var(--#{$prefix}border-radius-xs) !default;
$input-border-radius-sm: var(--#{$prefix}border-radius-xs) !default;
$input-border-radius-lg: var(--#{$prefix}border-radius-sm) !default;

// Pagination
$pagination-padding-y: .75rem !default;
$pagination-padding-x: 1.25rem !default;
$pagination-border-width: 0 !default;
$pagination-color: $body-color !default;
$pagination-bg: $action-25 !default;
$pagination-border-radius: var(--#{$prefix}border-radius-xs) !default;
$pagination-hover-color: $body-color !default;
$pagination-hover-bg: var(--#{$prefix}secondary) !default;
$pagination-active-color: $body-color !default;
$pagination-active-bg: var(--#{$prefix}secondary) !default;

// Form Range
$form-range-thumb-width: 1.25rem !default;
$form-range-thumb-height: 1.25rem !default;

// Card
$card-border-color: transparent !default;
$card-box-shadow: var(--#{$prefix}box-shadow-xl) !default;