@import '../../../../src/framework/theme/styles/theming';
@import '../../../../src/framework/theme/styles/themes/default';
@import '../../../../src/framework/theme/styles/global/breakpoints';

$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);

/* stylelint-disable max-line-length */
$nb-themes: nb-register-theme((
  font-family-primary: 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,
), docs-home, default);
/* stylelint-enable max-line-length */

$nb-themes: nb-register-theme((
  // custom
  content-width: 1440px,
  settings-col-width: 16rem,
  settings-col-margin: 1.875rem,
  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);