@import url('https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900');

/* Custom variables */
:root {
    color-scheme: only light;
    --font-primary: 'Poppins', sans-serif;
    --font-secondary: 'Poppins', sans-serif;
    --dark-modifier: 0.8;
    --light-modifier: 1.2;
    --very-light-modifier: 1.6;
    --bg-lightness: 90%;
    --border-radius: .375rem;
    --theme-white-hex: #ffffff;
    --theme-black-hex: #000000;
    --theme-primary-hex: #d8d8d4;
    --theme-secondary-hex: #231d22;
    --theme-success-hex: #00b85f;
    --theme-info-hex: #fc0392;
    --theme-warning-hex: #edce00;
    --theme-danger-hex: #fe001b;
    --theme-light-hex: #d7d7d5;
    --theme-dark-hex: #000000;
    --theme-primary-rgb: 102, 7, 8;
    --theme-secondary-rgb: 177, 167, 166;
    --theme-success-rgb: 229, 56, 59;
    --theme-info-rgb: 22, 26, 29;
    --theme-warning-rgb: 164, 22, 26;
    --theme-danger-rgb: 186, 24, 27;
    --theme-light-rgb: 245, 243, 244;
    --theme-dark-rgb: 11, 9, 10;
    --theme-primary-very-light: hsl(359, 90%, calc(22% * var(--very-light-modifier)));
    --theme-primary-light: hsl(359, 90%, calc(22% * var(--light-modifier)));
    --theme-primary-dark: hsl(359, 90%, calc(22% * var(--dark-modifier)));
    --theme-primary-bg: hsl(359, 90%, var(--bg-lightness));
    --theme-secondary-very-light: hsl(4, 10%, calc(66% * var(--very-light-modifier)));
    --theme-secondary-light: hsl(4, 10%, calc(66% * var(--light-modifier)));
    --theme-secondary-dark: hsl(4, 10%, calc(66% * var(--dark-modifier)));
    --theme-secondary-bg: hsl(4, 10%, var(--bg-lightness));
    --theme-success-very-light: hsl(359, 76%, calc(56% * var(--very-light-modifier)));
    --theme-success-light: hsl(359, 76%, calc(56% * var(--light-modifier)));
    --theme-success-dark: hsl(359, 76%, calc(56% * var(--dark-modifier)));
    --theme-success-bg: hsl(359, 76%, var(--bg-lightness));
    --theme-info-very-light: hsl(210, 20%, calc(10% * var(--very-light-modifier)));
    --theme-info-light: hsl(210, 20%, calc(10% * var(--light-modifier)));
    --theme-info-dark: hsl(210, 20%, calc(10% * var(--dark-modifier)));
    --theme-info-bg: hsl(210, 20%, var(--bg-lightness));
    --theme-warning-very-light: hsl(358, 74%, calc(36% * var(--very-light-modifier)));
    --theme-warning-light: hsl(358, 74%, calc(36% * var(--light-modifier)));
    --theme-warning-dark: hsl(358, 74%, calc(36% * var(--dark-modifier)));
    --theme-warning-bg: hsl(358, 74%, var(--bg-lightness));
    --theme-danger-very-light: hsl(358, 75%, calc(41% * var(--very-light-modifier)));
    --theme-danger-light: hsl(358, 75%, calc(41% * var(--light-modifier)));
    --theme-danger-dark: hsl(358, 75%, calc(41% * var(--dark-modifier)));
    --theme-danger-bg: hsl(358, 75%, var(--bg-lightness));
    --theme-light-very-light: hsl(348, 10%, calc(95% * var(--very-light-modifier)));
    --theme-light-light: hsl(348, 10%, calc(95% * var(--light-modifier)));
    --theme-light-dark: hsl(348, 10%, calc(95% * var(--dark-modifier)));
    --theme-light-bg: hsl(348, 10%, var(--bg-lightness));
    --theme-dark-very-light: hsl(0, 17%, calc(4% * var(--very-light-modifier)));
    --theme-dark-light: hsl(0, 17%, calc(4% * var(--light-modifier)));
    --theme-dark-dark: hsl(0, 17%, calc(4% * var(--dark-modifier)));
    --theme-dark-bg: hsl(0, 17%, var(--bg-lightness));
    --bs-border-radius: var(--border-radius);
    --bs-border-radius-sm: var(--border-radius);
    --bs-border-radius-lg: var(--border-radius);
    --bs-border-radius-xl: var(--border-radius);
    --bs-border-radius-2xl: var(--border-radius);
    --bs-border-radius-pill: var(--border-radius);
    --bs-primary: var(--theme-primary-hex);
    --bs-primary-rgb: var(--theme-primary-rgb);
    --bs-secondary: var(--theme-secondary-hex);
    --bs-secondary-rgb: var(--theme-secondary-rgb);
    --bs-success: var(--theme-success-hex);
    --bs-success-rgb: var(--theme-success-rgb);
    --bs-info: var(--theme-info-hex);
    --bs-info-rgb: var(--theme-info-rgb);
    --bs-warning: var(--theme-warning-hex);
    --bs-warning-rgb: var(--theme-warning-rgb);
    --bs-danger: var(--theme-danger-hex);
    --bs-danger-rgb: var(--theme-danger-rgb);
    --bs-light: var(--theme-light-hex);
    --bs-light-rgb: var(--theme-light-rgb);
    --bs-dark: var(--theme-dark-hex);
    --bs-dark-rgb: var(--theme-dark-rgb);
    --bs-link-color: var(--theme-primary-hex);
    --bs-link-hover-color: var(--theme-primary-dark);
    --bs-body-color: var(--theme-primary-hex);
    --bs-gray-100: #d3d3d3;
    --bs-gray-200: #b1a7a6;
    --bs-gray-300: #d3d3d3;
    --bs-gray-400: #b1a7a6;
    --bs-gray-500: #161a1d;
}