@use "sass:color";

// Font settings
$lexend-font-path: ".";
$lexend-weights: 500, 600;
$fa-font-path: ".";

$font-family-sans-serif: "Lexend", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
$font-family-serif: Georgia, "DejaVu Serif", "Times New Roman", Times, serif;
$font-family-monospace: "PragmataPro", Monaco, "Ubuntu Mono", Menlo, "DejaVu Sans Mono", monospace;
$font-family-base: $font-family-sans-serif;

$font-size-base: 1rem;
$font-size-large: ceil(($font-size-base * 1.25)); // ~18px
$font-size-small: ceil(($font-size-base * 0.85)); // ~12px

$font-size-h1: floor(($font-size-base * 2.6)); // ~36px
$font-size-h2: floor(($font-size-base * 2.15)); // ~30px
$font-size-h3: ceil(($font-size-base * 1.7)); // ~24px
$font-size-h4: ceil(($font-size-base * 1.25)); // ~18px
$font-size-h5: $font-size-base;
$font-size-h6: ceil(($font-size-base * 0.85)); // ~12px

// Bootstrap CSS variable prefix
$prefix: '';

// Usual navbar height
$navbar-height: 56px;

// Color overrides for Bootstrap
$primary: #5e35b1;

$rs-theme-colors: (
  primary: $primary
);

$theme-colors: map-merge($theme-colors, $rs-theme-colors);

// Container overrides for Bootstrap

$container-max-widths: map-remove($container-max-widths, xxl);

// Cards
$card-border-width: 0;

// List Groups
$list-group-border-width: 0;

// nProgress
$nprogress-color: lighten($primary, 25%);

// Color names for theme generation
$color-names: (
  "primary",
  "danger",
  "warning",
  "info",
  "success",
  "dark",
  "light"
);

// Avatar variables
$avatar-border-radius: 4px;

$avatar-sizes: (
  "xs": 20px,
  "sm": 30px,
  "md": 40px,
  "lg": 80px,
  "xl": 120px,
  "xxl": 160px,
);

$rs-spacers: (
  10: (1rem * 6)
);

$spacers: map-merge($rs-spacers, $spacers);

:root {
  --background: #f0edf4;
  --input-bg: var(--background);
  --raised-bg: #ffffff;
  --raised-accent: #f7f7f7;

  /**
   *-rgb values are some of the background colors
   available as triplets because they are required
   for background opacity styles
   */

  --primary-rgb: #{color.red($primary)}, #{color.green($primary)}, #{color.blue($primary)};
  --raised-bg-rgb: #{color.red(#ffffff)}, #{color.green(#ffffff)}, #{color.blue(#ffffff)};
  --raised-accent-rgb: #{color.red(#f7f7f7)}, #{color.green(#f7f7f7)}, #{color.blue(#f7f7f7)};

  /**
   NOTE for all *-text variables
   ----------------------------------------------
   The text-variables are present as triplets
   because in some places it's required to adjust
   their transparency.

   So, for general usage, use:
   color: RGB(var(--*-text));

   And for transparent usage, use:
   color: rgba(var(--*-text), .7);

   The uppercase RGB is required because internally
   SassC wants more than one argument for rgb(),
   hence writing RGB() bypasses that check, but
   browsers interpret it correctly.
   */

  --primary-text: 255, 255, 255;
  --danger-text: 255, 255, 255;
  --warning-text: 41, 41, 41;
  --info-text: 255, 255, 255;
  --success-text: 255, 255, 255;
  --dark-text: 255, 255, 255;
  --light-text: 0, 0, 0;

  --body-text: 0, 0, 0;
  --muted-text: 108, 117, 125;
  --input-text: 0, 0, 0;
  --input-placeholder: 108, 117, 125;
  --raised-text: 0, 0, 0;
  --raised-accent-text: 0, 0, 0;

  --turbolinks-progress-color: #a58adc; // --primary lightened by 25%
}

$gray: #e2e2e2;