/*
 * Excalibur's Sheath
 * Base Styles
 *
 * Global ANSI color palette, resets,
 * and fundamental element behavior.
 */

:root {
  /* Classic ANSI 16-color palette */
  --ansi-black:          #000000;
  --ansi-red:            #aa0000;
  --ansi-green:          #00aa00;
  --ansi-yellow:         #aa5500;
  --ansi-blue:           #0000aa;
  --ansi-magenta:        #aa00aa;
  --ansi-cyan:           #00aaaa;
  --ansi-white:          #aaaaaa;

  --ansi-bright-black:   #555555;
  --ansi-bright-red:     #ff5555;
  --ansi-bright-green:   #55ff55;
  --ansi-bright-yellow:  #ffff55;
  --ansi-bright-blue:    #5555ff;
  --ansi-bright-magenta: #ff55ff;
  --ansi-bright-cyan:    #55ffff;
  --ansi-bright-white:   #ffffff;

  /* Site palette */
  --color-background: var(--ansi-black);

  /* Normal ANSI green for long-form text */
  --color-text: var(--ansi-green);

  /* Document structure */
  --color-heading: var(--ansi-bright-yellow);

  /* Interactive elements */
  --color-link: var(--ansi-bright-cyan);
  --color-link-hover: var(--ansi-bright-white);

  /* Navigation/location */
  --color-breadcrumb: var(--ansi-bright-red);

  /* Secondary content */
  --color-muted: var(--ansi-white);
  --color-border: var(--ansi-bright-black);

  color-scheme: dark;
}

/* Box sizing */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Document */
html {
  min-height: 100%;
  background-color: var(--color-background);
}

body {
  min-height: 100%;
  margin: 0;

  background-color: var(--color-background);
  color: var(--color-text);
}

/* Media */
img,
svg,
video {
  max-width: 100%;
  height: auto;
}

/* Links */
a {
  color: var(--color-link);
  text-decoration: none;
}

a:visited {
  color: var(--color-link);
}

a:hover,
a:focus {
  color: var(--color-link-hover);
  text-decoration: none;
}

/* Horizontal rules */
hr {
  height: 0;
  margin: 1.5rem 0;

  border: 0;
  border-top: 1px dashed var(--color-border);
}

/* Tables */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* Forms */
button,
input,
select,
textarea {
  color: inherit;
  font: inherit;
}

/* Selection */
::selection {
  background-color: var(--ansi-bright-green);
  color: var(--ansi-black);
}