// Color system

$white: #fff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #dee2e6 !default;
$gray-400: #ced4da !default;
$gray-500: #adb5bd !default;
$gray-600: #6c757d !default;
$gray-700: #495057 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black: #000 !default;

$grays: (
  "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;

$blue: #066fd1 !default;
$azure: #4299e1 !default;
$indigo: #4263eb !default;
$purple: #ae3ec9 !default;
$pink: #ff0055 !default;
$red: #d63939 !default;
$orange: #f76707 !default;
$yellow: #f59f00 !default;
$lime: #74b816 !default;
$green: #2fb344 !default;
$teal: #0ca678 !default;
$cyan: #17a2b8 !default;

$colors: (
  "blue": $blue,
  "azure": $azure,
  "indigo": $indigo,
  "purple": $purple,
  "pink": $pink,
  "red": $red,
  "orange": $orange,
  "yellow": $yellow,
  "lime": $lime,
  "green": $green,
  "teal": $teal,
  "cyan": $cyan,
  "black": $black,
  "white": $white,
  "gray": $gray-600,
  "gray-dark": $gray-800,
) !default;

// Definición de variables de colores base
$facebook: #1877f2 !default;
$twitter: #1da1f2 !default;
$x-twitter: #000 !default;
$google: #4285f4 !default;
$youtube: #ff0000 !default;
$linkedin: #0a66c2 !default;
$instagram: #e1306c !default;
$pinterest: #e60023 !default;
$snapchat: #fffc00 !default;
$tiktok: #010101 !default;
$whatsapp: #25d366 !default;
$amazon: #ff9900 !default;
$microsoft: #737373 !default;
$apple: #a2aaad !default;
$samsung: #1428a0 !default;
$tesla: #e31937 !default;
$spotify: #1db954 !default;
$netflix: #e50914 !default;
$adobe: #ff0000 !default;
$nvidia: #76b900 !default;
$paypal: #003087 !default;
$github: #181717 !default;
$dribbble: #ea4c89 !default;
$vimeo: #1ab7ea !default;
$flickr: #0063dc !default;
$bitbucket: #2684ff !default;

// Mapa de colores unificado
$social-colors: (
  "facebook": $facebook,
  "twitter": $twitter,
  "x-twitter": $x-twitter,
  "google": $google,
  "youtube": $youtube,
  "linkedin": $linkedin,
  "instagram": $instagram,
  "pinterest": $pinterest,
  "snapchat": $snapchat,
  "tiktok": $tiktok,
  "whatsapp": $whatsapp,
  "amazon": $amazon,
  "microsoft": $microsoft,
  "apple": $apple,
  "samsung": $samsung,
  "tesla": $tesla,
  "spotify": $spotify,
  "netflix": $netflix,
  "adobe": $adobe,
  "nvidia": $nvidia,
  "paypal": $paypal,
  "github": $github,
  "dribbble": $dribbble,
  "vimeo": $vimeo,
  "flickr": $flickr,
  "bitbucket": $bitbucket,
) !default;

// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.
// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
$min-contrast-ratio: 4.5 !default;

// Customize the light and dark text colors for use in our color contrast function.
$color-contrast-dark: $black !default;
$color-contrast-light: $white !default;

// fusv-disable
$blue-100: tint-color($blue, 80%) !default;
$blue-200: tint-color($blue, 60%) !default;
$blue-300: tint-color($blue, 40%) !default;
$blue-400: tint-color($blue, 20%) !default;
$blue-500: $blue !default;
$blue-600: shade-color($blue, 20%) !default;
$blue-700: shade-color($blue, 40%) !default;
$blue-800: shade-color($blue, 60%) !default;
$blue-900: shade-color($blue, 80%) !default;

$indigo-100: tint-color($indigo, 80%) !default;
$indigo-200: tint-color($indigo, 60%) !default;
$indigo-300: tint-color($indigo, 40%) !default;
$indigo-400: tint-color($indigo, 20%) !default;
$indigo-500: $indigo !default;
$indigo-600: shade-color($indigo, 20%) !default;
$indigo-700: shade-color($indigo, 40%) !default;
$indigo-800: shade-color($indigo, 60%) !default;
$indigo-900: shade-color($indigo, 80%) !default;

$purple-100: tint-color($purple, 80%) !default;
$purple-200: tint-color($purple, 60%) !default;
$purple-300: tint-color($purple, 40%) !default;
$purple-400: tint-color($purple, 20%) !default;
$purple-500: $purple !default;
$purple-600: shade-color($purple, 20%) !default;
$purple-700: shade-color($purple, 40%) !default;
$purple-800: shade-color($purple, 60%) !default;
$purple-900: shade-color($purple, 80%) !default;

$pink-100: tint-color($pink, 80%) !default;
$pink-200: tint-color($pink, 60%) !default;
$pink-300: tint-color($pink, 40%) !default;
$pink-400: tint-color($pink, 20%) !default;
$pink-500: $pink !default;
$pink-600: shade-color($pink, 20%) !default;
$pink-700: shade-color($pink, 40%) !default;
$pink-800: shade-color($pink, 60%) !default;
$pink-900: shade-color($pink, 80%) !default;

$red-100: tint-color($red, 80%) !default;
$red-200: tint-color($red, 60%) !default;
$red-300: tint-color($red, 40%) !default;
$red-400: tint-color($red, 20%) !default;
$red-500: $red !default;
$red-600: shade-color($red, 20%) !default;
$red-700: shade-color($red, 40%) !default;
$red-800: shade-color($red, 60%) !default;
$red-900: shade-color($red, 80%) !default;

$orange-100: tint-color($orange, 80%) !default;
$orange-200: tint-color($orange, 60%) !default;
$orange-300: tint-color($orange, 40%) !default;
$orange-400: tint-color($orange, 20%) !default;
$orange-500: $orange !default;
$orange-600: shade-color($orange, 20%) !default;
$orange-700: shade-color($orange, 40%) !default;
$orange-800: shade-color($orange, 60%) !default;
$orange-900: shade-color($orange, 80%) !default;

$yellow-100: tint-color($yellow, 80%) !default;
$yellow-200: tint-color($yellow, 60%) !default;
$yellow-300: tint-color($yellow, 40%) !default;
$yellow-400: tint-color($yellow, 20%) !default;
$yellow-500: $yellow !default;
$yellow-600: shade-color($yellow, 20%) !default;
$yellow-700: shade-color($yellow, 40%) !default;
$yellow-800: shade-color($yellow, 60%) !default;
$yellow-900: shade-color($yellow, 80%) !default;

$green-100: tint-color($green, 80%) !default;
$green-200: tint-color($green, 60%) !default;
$green-300: tint-color($green, 40%) !default;
$green-400: tint-color($green, 20%) !default;
$green-500: $green !default;
$green-600: shade-color($green, 20%) !default;
$green-700: shade-color($green, 40%) !default;
$green-800: shade-color($green, 60%) !default;
$green-900: shade-color($green, 80%) !default;

$teal-100: tint-color($teal, 80%) !default;
$teal-200: tint-color($teal, 60%) !default;
$teal-300: tint-color($teal, 40%) !default;
$teal-400: tint-color($teal, 20%) !default;
$teal-500: $teal !default;
$teal-600: shade-color($teal, 20%) !default;
$teal-700: shade-color($teal, 40%) !default;
$teal-800: shade-color($teal, 60%) !default;
$teal-900: shade-color($teal, 80%) !default;

$cyan-100: tint-color($cyan, 80%) !default;
$cyan-200: tint-color($cyan, 60%) !default;
$cyan-300: tint-color($cyan, 40%) !default;
$cyan-400: tint-color($cyan, 20%) !default;
$cyan-500: $cyan !default;
$cyan-600: shade-color($cyan, 20%) !default;
$cyan-700: shade-color($cyan, 40%) !default;
$cyan-800: shade-color($cyan, 60%) !default;
$cyan-900: shade-color($cyan, 80%) !default;

$blues: (
  "blue-100": $blue-100,
  "blue-200": $blue-200,
  "blue-300": $blue-300,
  "blue-400": $blue-400,
  "blue-500": $blue-500,
  "blue-600": $blue-600,
  "blue-700": $blue-700,
  "blue-800": $blue-800,
  "blue-900": $blue-900,
) !default;

$indigos: (
  "indigo-100": $indigo-100,
  "indigo-200": $indigo-200,
  "indigo-300": $indigo-300,
  "indigo-400": $indigo-400,
  "indigo-500": $indigo-500,
  "indigo-600": $indigo-600,
  "indigo-700": $indigo-700,
  "indigo-800": $indigo-800,
  "indigo-900": $indigo-900,
) !default;

$purples: (
  "purple-100": $purple-100,
  "purple-200": $purple-200,
  "purple-300": $purple-300,
  "purple-400": $purple-400,
  "purple-500": $purple-500,
  "purple-600": $purple-600,
  "purple-700": $purple-700,
  "purple-800": $purple-800,
  "purple-900": $purple-900,
) !default;

$pinks: (
  "pink-100": $pink-100,
  "pink-200": $pink-200,
  "pink-300": $pink-300,
  "pink-400": $pink-400,
  "pink-500": $pink-500,
  "pink-600": $pink-600,
  "pink-700": $pink-700,
  "pink-800": $pink-800,
  "pink-900": $pink-900,
) !default;

$reds: (
  "red-100": $red-100,
  "red-200": $red-200,
  "red-300": $red-300,
  "red-400": $red-400,
  "red-500": $red-500,
  "red-600": $red-600,
  "red-700": $red-700,
  "red-800": $red-800,
  "red-900": $red-900,
) !default;

$oranges: (
  "orange-100": $orange-100,
  "orange-200": $orange-200,
  "orange-300": $orange-300,
  "orange-400": $orange-400,
  "orange-500": $orange-500,
  "orange-600": $orange-600,
  "orange-700": $orange-700,
  "orange-800": $orange-800,
  "orange-900": $orange-900,
) !default;

$yellows: (
  "yellow-100": $yellow-100,
  "yellow-200": $yellow-200,
  "yellow-300": $yellow-300,
  "yellow-400": $yellow-400,
  "yellow-500": $yellow-500,
  "yellow-600": $yellow-600,
  "yellow-700": $yellow-700,
  "yellow-800": $yellow-800,
  "yellow-900": $yellow-900,
) !default;

$greens: (
  "green-100": $green-100,
  "green-200": $green-200,
  "green-300": $green-300,
  "green-400": $green-400,
  "green-500": $green-500,
  "green-600": $green-600,
  "green-700": $green-700,
  "green-800": $green-800,
  "green-900": $green-900,
) !default;

$teals: (
  "teal-100": $teal-100,
  "teal-200": $teal-200,
  "teal-300": $teal-300,
  "teal-400": $teal-400,
  "teal-500": $teal-500,
  "teal-600": $teal-600,
  "teal-700": $teal-700,
  "teal-800": $teal-800,
  "teal-900": $teal-900,
) !default;

$cyans: (
  "cyan-100": $cyan-100,
  "cyan-200": $cyan-200,
  "cyan-300": $cyan-300,
  "cyan-400": $cyan-400,
  "cyan-500": $cyan-500,
  "cyan-600": $cyan-600,
  "cyan-700": $cyan-700,
  "cyan-800": $cyan-800,
  "cyan-900": $cyan-900,
) !default;
// fusv-enable

$primary: $pink !default;
$secondary: $gray-700 !default;
$success: $green !default;
$info: $cyan !default;
$warning: $yellow !default;
$danger: $red !default;
$light: $gray-100 !default;
$dark: #1a1a1a !default;

// scss-docs-start theme-colors-map
$theme-colors: (
  "primary": $primary,
  "secondary": $secondary,
  "success": $success,
  "info": $info,
  "warning": $warning,
  "danger": $danger,
  "light": $light,
  "dark": $dark,
) !default;
// scss-docs-end theme-colors-map

$primary-100: tint-color($primary, 80%) !default;
$primary-200: tint-color($primary, 60%) !default;
$primary-300: tint-color($primary, 40%) !default;
$primary-400: tint-color($primary, 20%) !default;
$primary-500: $primary !default;
$primary-600: shade-color($primary, 20%) !default;
$primary-700: shade-color($primary, 40%) !default;
$primary-800: shade-color($primary, 60%) !default;
$primary-900: shade-color($primary, 80%) !default;

$primarys: (
  "primary-100": $primary-100,
  "primary-200": $primary-200,
  "primary-300": $primary-300,
  "primary-400": $primary-400,
  "primary-500": $primary-500,
  "primary-600": $primary-600,
  "primary-700": $primary-700,
  "primary-800": $primary-800,
  "primary-900": $primary-900,
) !default;

$primary-text: $primary-600 !default;
$secondary-text: $gray-600 !default;
$success-text: $green-600 !default;
$info-text: $cyan-700 !default;
$warning-text: $yellow-700 !default;
$danger-text: $red-600 !default;
$light-text: $gray-600 !default;
$dark-text: $gray-700 !default;

$primary-bg-subtle: $primary-100 !default;
$secondary-bg-subtle: $gray-100 !default;
$success-bg-subtle: $green-100 !default;
$info-bg-subtle: $cyan-100 !default;
$warning-bg-subtle: $yellow-100 !default;
$danger-bg-subtle: $red-100 !default;
$light-bg-subtle: mix($gray-100, $white) !default;
$dark-bg-subtle: $gray-400 !default;

$primary-border-subtle: $primary-200 !default;
$secondary-border-subtle: $gray-200 !default;
$success-border-subtle: $green-200 !default;
$info-border-subtle: $cyan-200 !default;
$warning-border-subtle: $yellow-200 !default;
$danger-border-subtle: $red-200 !default;
$light-border-subtle: $gray-200 !default;
$dark-border-subtle: $gray-500 !default;

// Characters which are escaped by the escape-svg function
$escaped-characters: (
  ("<", "%3c"),
  (">", "%3e"),
  ("#", "%23"),
  ("(", "%28"),
  (")", "%29")
) !default;

// Options
//
// Quickly modify global styling by enabling or disabling optional features.

$enable-caret: true !default;
$enable-rounded: true !default;
$enable-shadows: false !default;
$enable-gradients: false !default;
$enable-transitions: true !default;
$enable-reduced-motion: true !default;
$enable-smooth-scroll: true !default;
$enable-grid-classes: true !default;
$enable-container-classes: true !default;
$enable-cssgrid: false !default;
$enable-button-pointers: true !default;
$enable-rfs: true !default;
$enable-validation-icons: true !default;
$enable-negative-margins: false !default;
$enable-deprecation-messages: true !default;
$enable-important-utilities: true !default;

$enable-dark-mode: true !default;
$color-mode-type: data !default; // `data` or `media-query`

// Prefix for :root CSS variables

$variable-prefix: pr- !default; // Deprecated in v5.2.0 for the shorter `$prefix`
$prefix: $variable-prefix !default;

// Gradient
//
// The gradient which is added to components if `$enable-gradients` is `true`
// This gradient is also added to elements with `.bg-gradient`
// scss-docs-start variable-gradient
$gradient: linear-gradient(
  180deg,
  rgba($white, 0.15),
  rgba($white, 0)
) !default;
// scss-docs-end variable-gradient

// Spacing
//
// Control the default styling of most Bootstrap elements by modifying these
// variables. Mostly focused on spacing.
// You can add more entries to the $spacers map, should you need more variation.

// scss-docs-start spacer-variables-maps
$spacer: 1rem !default;
$spacers: (
  0: 0,
  1: $spacer * 0.25,
  2: $spacer * 0.5,
  3: $spacer,
  4: $spacer * 1.5,
  5: $spacer * 3,
) !default;
// scss-docs-end spacer-variables-maps

// Position
//
// Define the edge positioning anchors of the position utilities.

// scss-docs-start position-map
$position-values: (
  0: 0,
  50: 50%,
  100: 100%,
) !default;
// scss-docs-end position-map

// Body
//

$body-text-align: null !default;

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

$body-bg: $white !default;
$body-bg-alt: shade-color($body-bg, 3%) !default;

$body-emphasis-color: $black !default;

$body-secondary-color: rgba($body-color, 0.75) !default;
$body-secondary-bg: $gray-200 !default;

$body-tertiary-color: rgba($body-color, 0.5) !default;
$body-tertiary-bg: $gray-100 !default;

$emphasis-color: $black !default;

// Links
//
// Style anchor elements.

$link-decoration: none !default;
$link-hover-decoration: underline !default;

// Paragraphs

// Grid breakpoints

// Grid containers

// Grid columns

// Components
//
// Define common padding and border radius sizes and more.

// scss-docs-start border-variables
$border-width: 1px !default;
$border-widths: (
  1: 1px,
  2: 2px,
  3: 3px,
  4: 4px,
  5: 5px,
) !default;
$border-style: solid !default;
$border-color: $gray-300 !default;
$border-color-translucent: rgba($black, 0.175) !default;
// scss-docs-end border-variables

// scss-docs-start border-radius-variables
$border-radius: 0.375rem !default;
$border-radius-sm: 0.25rem !default;
$border-radius-lg: 0.5rem !default;
$border-radius-xl: 1rem !default;
$border-radius-2xl: 2rem !default;
$border-radius-pill: 50rem !default;
// scss-docs-end border-radius-variables

// scss-docs-start box-shadow-variables
$box-shadow: 0 0.5rem 1rem rgba(var(--#{$prefix}body-color-rgb), 0.15) !default;
$box-shadow-sm: 0 0.125rem 0.25rem rgba(var(--#{$prefix}body-color-rgb), 0.075) !default;
$box-shadow-lg: 0 1rem 3rem rgba(var(--#{$prefix}body-color-rgb), 0.175) !default;
$box-shadow-inset: inset 0 1px 2px rgba(var(--#{$prefix}body-color-rgb), 0.075) !default;
// scss-docs-end box-shadow-variables

$component-active-color: $white !default;
$component-active-bg: $primary !default;

// scss-docs-start caret-variables
$caret-width: 0.3em !default;
$caret-vertical-align: $caret-width * 0.85 !default;
$caret-spacing: $caret-width * 0.85 !default;
// scss-docs-end caret-variables

$transition-base: all 0.2s ease-in-out !default;
$transition-fade: opacity 0.15s linear !default;
// scss-docs-start collapse-transition
$transition-collapse: height 0.35s ease !default;
$transition-collapse-width: width 0.35s ease !default;
// scss-docs-end collapse-transition

// stylelint-disable function-disallowed-list
// scss-docs-start aspect-ratios
$aspect-ratios: (
  "1x1": 100%,
  "4x3": calc(3 / 4 * 100%),
  "16x9": calc(9 / 16 * 100%),
  "21x9": calc(9 / 21 * 100%),
) !default;
// scss-docs-end aspect-ratios
// stylelint-enable function-disallowed-list

//Icons
$icon-stroke-width: 1.5 !default;
$icon-size: 1.25rem !default;

// Typography
//
// Font, line-height, and color for body text, headings, and more.

// scss-docs-start font-variables
// stylelint-disable value-keyword-case
$font-family-sans-serif: "Nunito", sans-serif !default;
$font-family-monospace: "Fira Code", monospace !default;
// stylelint-enable value-keyword-case
$font-family-base: var(--#{$prefix}font-sans-serif) !default;
$font-family-code: var(--#{$prefix}font-monospace) !default;

// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins
// $font-size-base affects the font size of the body text
$font-size-root: null !default;
$font-size-base: 0.875rem !default; // Assumes the browser default, typically `16px`
$font-size-sm: $font-size-base * 0.875 !default;
$font-size-lg: $font-size-base * 1.25 !default;

$font-weight-lighter: lighter !default;
$font-weight-light: 300 !default;
$font-weight-normal: 400 !default;
$font-weight-medium: 500 !default;
$font-weight-semibold: 600 !default;
$font-weight-bold: 700 !default;
$font-weight-bolder: bolder !default;

$font-weight-base: $font-weight-normal !default;

$line-height-base: 1.5 !default;
$line-height-sm: 1.25 !default;
$line-height-lg: 2 !default;

$h1-font-size: $font-size-base * 2.5 !default;
$h2-font-size: $font-size-base * 2 !default;
$h3-font-size: $font-size-base * 1.75 !default;
$h4-font-size: $font-size-base * 1.5 !default;
$h5-font-size: $font-size-base * 1.25 !default;
$h6-font-size: $font-size-base !default;
// scss-docs-end font-variables

// scss-docs-start font-sizes
$font-sizes: (
  1: $h1-font-size,
  2: $h2-font-size,
  3: $h3-font-size,
  4: $h4-font-size,
  5: $h5-font-size,
  6: $h6-font-size,
) !default;
// scss-docs-end font-sizes

// scss-docs-start headings-variables
$headings-margin-bottom: $spacer * 0.5 !default;
$headings-font-family: null !default;
$headings-font-style: null !default;
$headings-font-weight: 500 !default;
$headings-line-height: 1.2 !default;
$headings-color: null !default;
// scss-docs-end headings-variables

// scss-docs-start display-headings
$display-font-sizes: (
  1: 5rem,
  2: 4.5rem,
  3: 4rem,
  4: 3.5rem,
  5: 3rem,
  6: 2.5rem,
) !default;

$display-font-family: null !default;
$display-font-style: null !default;
$display-font-weight: 300 !default;
$display-line-height: $headings-line-height !default;
// scss-docs-end display-headings

// scss-docs-start type-variables
$lead-font-size: $font-size-base * 1.25 !default;
$lead-font-weight: 300 !default;

$small-font-size: 0.875em !default;

$sub-sup-font-size: 0.75em !default;

$text-muted: var(--#{$prefix}secondary-color) !default;

$initialism-font-size: $small-font-size !default;

$blockquote-margin-y: $spacer !default;
$blockquote-font-size: $font-size-base * 1.25 !default;
$blockquote-footer-color: $gray-600 !default;
$blockquote-footer-font-size: $small-font-size !default;

$hr-margin-y: $spacer !default;
$hr-color: inherit !default;

$hr-border-color: null !default; // Allows for inherited colors
$hr-border-width: var(--#{$prefix}border-width) !default;
$hr-opacity: 0.25 !default;

$legend-margin-bottom: 0.5rem !default;
$legend-font-size: 1.5rem !default;
$legend-font-weight: null !default;

$dt-font-weight: $font-weight-bold !default;

$list-inline-padding: 0.5rem !default;

$mark-padding: 0.1875em !default;
$mark-bg: $yellow-100 !default;
// scss-docs-end type-variables

// Tables

// Buttons + Forms

// Buttons

// Forms

// Form validation

// Z-index master list

// Navs

// Navbar

// Dropdowns

// Pagination

// Placeholders

// scss-docs-start placeholders
$placeholder-opacity-max: 0.5 !default;
$placeholder-opacity-min: 0.2 !default;
// scss-docs-end placeholders

// Cards
$card-border-color: var(--#{$prefix}body-color-rgb) !default;
$card-cap-bg: var(--#{$prefix}body-color-rgb) !default;

// Accordion

// Tooltips

// Popovers

// Toasts

// Badges
$badge-font-size: 0.8em;
$badge-font-weight: $font-weight-semibold;
$badge-color: $white;
$badge-padding-y: 0.35em;
$badge-padding-x: 0.65em;
$badge-border-radius: var(--#{$prefix}border-radius);

// Modals

// Alerts

// Progress bars

// Image thumbnails

// Figures

// Breadcrumbs

// Carousel

// Spinners

// Close

// Offcanvas

// Code

$code-font-size: $small-font-size !default;
$code-color: $cyan !default;

$kbd-padding-y: 0.1875rem !default;
$kbd-padding-x: 0.375rem !default;
$kbd-font-size: $code-font-size !default;
$kbd-color: var(--#{$prefix}body-bg) !default;
$kbd-bg: var(--#{$prefix}body-color) !default;
$nested-kbd-font-weight: null !default; // Deprecated in v5.2.0, removing in v6

$pre-color: null !default;

// =======================
// Styles components
// =======================

// Tab
$tab-bg: var(--#{$prefix}body-bg) !default;
$tab-color: null !default;

$tab-active-bg: var(--#{$prefix}body-bg) !default;
$tab-active-color: null !default;

$tab-hover-bg: null !default;
$tab-hover-color: $primary !default;

// =======================
// Styles layout
// =======================

// Sidebar general
$sidebar-width: 260px !default;
$sidebar-transition:
  margin-left 0.35s ease-in-out,
  left 0.35s ease-in-out,
  margin-right 0.35s ease-in-out,
  right 0.35s ease-in-out !default;
$sidebar-bg: $body-bg !default;

// Sidebar brand
$sidebar-brand-padding-y: 1.15rem !default;
$sidebar-brand-padding-x: 1.5rem !default;
$sidebar-brand-font-weight: $font-weight-bold !default;
$sidebar-brand-font-size: 1.5rem !default;
$sidebar-brand-color: $body-color !default;

// Sidebar header
$sidebar-header-padding: 0.5rem 1.5rem 0.375rem !default;
$sidebar-header-font-size: $font-size-sm !default;
$sidebar-header-color: $gray-600 !default;

// Sidebar link
$sidebar-link-padding: 0.625rem 1.625rem !default;
$sidebar-link-font-weight: 400 !default;
$sidebar-link-bg: $sidebar-bg !default;
$sidebar-link-color: $body-color !default;
$sidebar-link-border-left-color: transparent !default;

$sidebar-link-hover-font-weight: $font-weight-normal !default;
$sidebar-link-hover-bg: rgba($primary, 0.1) !default;
$sidebar-link-hover-color: $primary !default;
$sidebar-link-hover-border-left-color: transparent !default;

$sidebar-link-active-font-weight: $font-weight-normal !default;
$sidebar-link-active-bg: rgba($primary, 0.1) !default;
$sidebar-link-active-color: $primary !default;
$sidebar-link-active-border-left-color: $primary !default;

// Sidebar child link
$sidebar-link-child-padding: 0.625rem 1.5rem 0.625rem 3.25rem !default;
$sidebar-link-child-font-size: 90% !default;
$sidebar-link-child-font-weight: 400 !default;

$sidebar-link-child-color: $body-color !default;
$sidebar-link-child-bg: transparent !default;
$sidebar-link-child-hover-color: $primary !default;
$sidebar-link-child-hover-bg: transparent !default;
$sidebar-link-child-active-color: $primary !default;
$sidebar-link-child-active-bg: transparent !default;

// Sidebar link icon
$sidebar-link-icon-color: $body-color !default;
$sidebar-link-icon-hover-color: $primary !default;
$sidebar-link-icon-active-color: $primary !default;

// Transitions
$transition-appearance:
  background 0.4s ease-in-out,
  color 0.4s ease-in-out !default;
$transition-appearance-slow:
  background 0.6s ease-in-out,
  color 0.6s ease-in-out !default;
$transition-appearance-fast:
  background 0.1s ease-in-out,
  color 0.1s ease-in-out !default;

// Main
$main-box-shadow: inset 0.75rem 0px 1.5rem 0px rgba($black, 0.075);

// Content
$content-padding-desktop: 2rem 2rem 2rem 2rem !default;
$content-padding-mobile: 0.75rem 0.75rem 0.75rem 0.75rem !default;

// NavTop
$navtop-padding-y: $spacer * 0.875 !default;
$navtop-padding-x: $spacer * 1.375 !default;
$navtop-nav-link-padding-x: 0.5rem !default;
$navtop-border-bottom: 0 !default;
$navtop-box-shadow: 0 0 2rem 0 rgba($dark, 0.1) !default;
$navtop-bg: $white !default;

// Simplebar
$simplebar-scrollbar-bg: #fff !default;

// Hamburger
$hamburger-width-top: 24px !default;
$hamburger-width-middle: 24px !default;
$hamburger-width-bottom: 16px !default;

// Footer
$footer-bg: $white !default;
