@use 'sass:string';
@forward '../../../../src/framework/theme/styles/theming';
@use '../../../../src/framework/theme/styles/theming' as *;
@use '../../../../src/framework/theme/styles/themes/default';
@use '../../../../src/framework/theme/styles/global/breakpoints' as *;

$nb-enable-css-custom-properties: false;

/*
We have to overwrite breakpoints because we need to add *macpro* breakpoint.
But if we add it using *map-merge* function we'll get the warning and *media-breakpoint-down* will stop working.
*/
$grid-breakpoints: (
  xs: 0,
  is: 400px,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  macpro: 1280px,
  xxl: 1400px,
  xxxl: 1600px,
);

$nb-enabled-themes: (docs-home, docs-page);

$nb-themes: nb-register-theme(
  (
    font-family-primary:
      string.unquote(
        '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"'
      ),
    font-family-secondary: font-family-primary,
    // custom
    content-width: 1140px,
    settings-col-width: 0,
    settings-col-margin: 0,
    color-fg-heading-light: #ffffff,
    header-menu-fg-active: color-fg,
    footer-menu-fg: color-fg-text,
    code-block-bg: linear-gradient(225deg, #333c66 0%, #1d2447 100%),
    color-gray-light: #ced5dd,
    radius: 0.375rem,
    color-fg-highlight: #40dc7e,
    select-min-width: 5rem,
    color-fg: white,
    color-fg-heading: #0d1c2e,
    color-fg-text: #919fb1,
    shadow: none,
    layout-background-color: transparent,
    layout-padding: 0,
    layout-medium-padding: 0,
    layout-small-padding: 0,
    footer-text-color: color-fg-text,
    footer-icon-color: #cdd6e3,
    footer-background-color: transparent,
    footer-divider-width: 0,
    header-padding: 0 0,
    header-height: 4.25rem,
    header-fg: color-fg-heading-light,
    menu-item-padding: 0.675rem 1rem,
    menu-fg: color-fg-heading-light,
    menu-active-fg: menu-fg,
    footer-height: 18.75rem,
    footer-padding: 1.25rem 0,
    menu-font-size: 0.95rem,
    menu-font-weight: font-weight-normal,
    link-text-decoration: none,
  ),
  docs-home,
  default
);

$nb-themes: nb-register-theme(
  (
    // custom
    content-width: 1440px,
    settings-col-width: 19rem,
    settings-col-margin: 0.375rem,
    color-gray-light: #ced5dd,
    color-fg-heading-light: #8994a3,
    code-block-bg: linear-gradient(225deg, #333c66 0%, #1d2447 100%),
    color-info: #5699f0,
    color-warning: #f09301,
    header-menu-fg-active: color-fg-highlight,
    radius: 0.25rem,
    separator: transparent,
    color-bg: transparent,
    color-fg: #494949,
    color-fg-text: #494949,
    color-fg-heading: rgba(0, 0, 0, 0.88),
    shadow: 0 8px 20px 0 rgba(218, 224, 235, 0.6),
    layout-background-color: #fafafa,
    layout-padding: 3.25rem 1.25rem 3.25rem 1rem,
    header-bg: white,
    sidebar-padding: 2rem,
    sidebar-shadow: none,
    color-fg-highlight: color-primary-default,
    link-color: color-fg-highlight,
    link-color-hover: color-fg-highlight,
    link-color-visited: color-fg-highlight,
    header-padding: 0,
    header-fg: black,
    menu-fg: black,
    menu-submenu-fg: color-fg-heading-light,
    menu-active-fg: menu-fg,
    menu-submenu-item-container-padding: 0 1rem,
    menu-submenu-active-border-color: transparent,
    menu-submenu-active-fg: color-fg-highlight,
    menu-active-font-weight: bold,
    card-bg: white,
    card-header-font-size: 2rem,
    card-header-font-weight: bold,
    card-header-fg-heading: black,
    card-margin: 2.5rem,
    footer-shadow: none,
    footer-text-color: color-fg-heading-light
  ),
  docs-page,
  docs-home
);
