@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');

@font-face {
  font-family: Everett;
  src:
    url('../fonts/TWKEverett-Medium.woff2') format('woff2'),
    url('../fonts/TWKEverett-Medium.woff') format('woff'),
    url('../fonts/TWKEverett-Medium.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/** Custom CSS variables for our own global components */
:root {
  --search-bar-height: 44px;

  /* Border radii - read _ as / (division) */
  --br-1: 0.5rem;
  --br-1_2: calc(var(--br-1) / 2);
  --br-2: calc(var(--br-1) * 2);
  --br-3: calc(var(--br-1) * 3);
  --br-4: calc(var(--br-1) * 4);

  /* Spacing - read _ as / (division)  */
  --s-1: 0.5rem;
  --s-1_4: calc(var(--s-1) / 4);
  --s-1_2: calc(var(--s-1) / 2);
  --s-3_2: calc(var(--s-1) * 1.5);
  --s-2: calc(var(--s-1) * 2);
  --s-3: calc(var(--s-1) * 3);
  --s-4: calc(var(--s-1) * 4);
  --s-6: calc(var(--s-1) * 6);
  --s-8: calc(var(--s-1) * 8);

  /* Rebrand variables */
  --full-top-nav-height: 5rem;
  --nav-pill-height: 3rem;
  --spacer-6xs: 0.5rem;
  --large-border-radius: 5rem;
  --small-border-radius: 2rem;
  --nav-button-padding: 4px 12px;
  --thin-grey-border: 0.0625rem solid var(--ifm-color-gray-200);
}

:root {
  --ifm-color-white: white;
  --ifm-color-black: black;
  --brand-blue-700: #253c99;
  --brand-blue: #3d64ff;

  /** MW SDK primary color scheme */
  --ifm-color-primary-lightest: #e6ddfe; /* map-purple-100*/
  --ifm-color-primary-lighter: #ad8efb;
  --ifm-color-primary-light: #936bf9;
  --ifm-color-primary: #7a48f8;
  --ifm-color-primary-dark: #623ac6;
  --ifm-color-primary-darker: #492b95;
  --ifm-color-primary-darkest: #311d63;

  /** MW SDK secondary color scheme */
  --ifm-color-secondary-lightest: #f7f7f8; /* navy-100 */
  --ifm-color-secondary-lighter: #e4e4e7;
  --ifm-color-secondary-light: #b5b5ba;
  --ifm-color-secondary: #8e8e95;
  --ifm-color-secondary-dark: #797981;
  --ifm-color-secondary-darker: #606067;
  --ifm-color-secondary-darkest: #39393c;

  /** MW SDK neutral grey color scheme */
  --ifm-color-gray-0: var(--ifm-color-white);
  --ifm-color-gray-100: #f7f7f8;
  --ifm-color-gray-200: #e4e4e7;
  --ifm-color-gray-300: #b5b5ba;
  --ifm-color-gray-400: #a3a3a9;
  --ifm-color-gray-500: #8e8e95;
  --ifm-color-gray-600: #797981;
  --ifm-color-gray-700: #606067;
  --ifm-color-gray-800: #4d4d52;
  --ifm-color-gray-900: #39393c;
  --ifm-color-gray-1000: var(--ifm-color-black);

  /** Other infima CSS variable overrides  */
  --ifm-footer-link-hover-color: #0a1639;
  --ifm-link-color: inherit;
  --ifm-link-decoration: none;
  --ifm-link-hover-decoration: none;
  --ifm-footer-link-color: inherit;
  --ifm-navbar-link-hover-color: var(--ifm-navbar-link-color);
  --ifm-background-color: var(--ifm-color-gray-100);
  --ifm-navbar-item-padding-vertical: 0; /* Navbar item padding is set on a per-item basis. Links are padded in custom.css */
  --ifm-navbar-item-padding-horizontal: 0;
  --ifm-font-family-base: 'DM Sans', 'Helvetica Neue', Helvetica, sans-serif;
  --ifm-heading-font-family: 'Everett', 'DM Sans', 'Helvetica Neue', Helvetica, sans-serif;
  --ifm-button-color: var(--ifm-font-color-base);
  --ifm-tabs-color: var(--ifm-font-color-base);
  --ifm-tabs-color-active: var(--ifm-font-color-base);
  --ifm-footer-background-color: var(--ifm-color-gray-200);
  --ifm-footer-padding-vertical: var(--s-2);
  --ifm-footer-padding-vertical: var(--s-3);
  --ifm-global-radius: var(--br-1);
  --ifm-code-background: rgba(241, 238, 243, 1);
  --ifm-code-padding-horizontal: 0.2rem;
  --ifm-font-family-monospace: Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
  --ifm-font-color-base: #02040b;
  --ifm-font-weight-bold: 600;
  --ifm-navbar-height: var(--full-top-nav-height);

  /** Prism syntax highlighting */
  --prism-background-color: var(--ifm-color-primary-lightest);
}
