// CSS Variables
// -----------------------------------------------------------------------------
:root {
  --real-height: 100vh;
}

// Random Variables
// -----------------------------------------------------------------------------
$PI: 3.1415926536;

// Color Palettes
// -----------------------------------------------------------------------------
$brand-black: #000;
$brand-white: #fff;

/// @require Kennel - kennel/functions/_color.scss
$brand-palette: (
  'grey': (
    'tone-1': #fdfdfd,
    'tone-2': #8e8484,
  ),
);

// Indexes
// -----------------------------------------------------------------------------
$z-layers: (
  base: 1,
  under-base: -1,
  above-base: 2,
);

// Fonts Variables
// -----------------------------------------------------------------------------
$base-font-size: 16px;
$base-line-height: 2;

$fallback-font-serif: 'Times New Roman', 'Georgia', serif;
$fallback-font-sans-serif: 'Helvetica', 'Arial', sans-serif;

/// @require Kennel - kennel/functions/_font.scss
$brand-fonts: (
  'serif': (
    en: (
      $fallback-font-serif,
    ),
    ar: (
      $fallback-font-serif,
    ),
  ),
  'sans-serif': (
    en: (
      $fallback-font-sans-serif,
    ),
    ar: (
      $fallback-font-sans-serif,
    ),
  ),
);

// Grid System Settings
// -----------------------------------------------------------------------------
$config: (
  xxxs: (
    grid-size: calc(100vw - 40px),
    grid-edge: 20px,
    grid-gutter: 20px,
    grid-columns: 4,
  ),
  l: (
    grid-size: calc(100vw - 100px),
    grid-edge: 50px,
    grid-gutter: 20px,
    grid-columns: 12,
  ),
  xl: (
    grid-size: calc(100vw - 100px),
    grid-edge: 50px,
    grid-gutter: 20px,
    grid-columns: 16,
  ),
);
