/* =====================================================
   Constants
   ===================================================== */

/* Banner */
$banner-height--small: map(sizes, large);
$banner-height--large: map(sizes, xlarge);

/* Navigation */
$navigation-width--large: map(sizes, xlarge);
$navigation-duration: 0.4s;
$navigation-color: white;
$navigation-color--offset: map(colors, neutral, lightest);
$navigation-color--text: map(colors, neutral, dark);
$navigation-color--shadow: color(map(colors, neutral, darker) a(25%));

/* Backdrop */
$backdrop-color: color(map(colors, neutral, darkest) a(33%));

/* Author images */
$author-duration: 0.5s;

/* Text */
$color-text: map(colors, neutral, darker);

/* Prose */
$prose-color--background: color(map(colors, neutral, base) a(15%));
$prose-color--rule: color(map(colors, neutral, base) a(25%));
$prose-color--shadow: color(map(colors, neutral, base) a(25%));

/* Links */
$color-link: map(colors, secondary, base);
$color-link--hover: map(colors, secondary, dark);
$color-link--active: map(colors, secondary, light);
$color-ui-link: map(colors, primary, base);
$color-ui-link--hover: map(colors, primary, light);
$color-ui-link--active: map(colors, primary, dark);

/* Focus */
$color-focus: map(colors, secondary, light);

/* Themes */
$color-year: hsl(348, 100%, 16%);
$color-year--dark: hsl(348, 100%, 8%);
$color-year--dark-alpha: hsla(348, 100%, 8%, 0.8);
$color-day: hsl(360, 80%, 60%);
$color-day--light: hsl(360, 60%, 98%);
$color-day--dark: hsl(360, 100%, 24%);
$color-day--dark-alpha: hsl(360, 100%, 24%, 0.33);
