@font-face {
  font-family: "Special Elite";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("/assets/fonts/SpecialElite.woff2") format("woff2");
}

/* courier-prime-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Courier Prime';
  font-style: normal;
  font-weight: 400;
  src: url('/assets/fonts/courier-prime-v11-latin/courier-prime-v11-latin-regular.woff2') format('woff2');
}

/* courier-prime-italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Courier Prime';
  font-style: italic;
  font-weight: 400;
  src: url('/assets/fonts/courier-prime-v11-latin/courier-prime-v11-latin-italic.woff2') format('woff2');
}

/* courier-prime-700 - latin */
@font-face {
  font-display: swap;
  font-family: 'Courier Prime';
  font-style: normal;
  font-weight: 700;
  src: url('/assets/fonts/courier-prime-v11-latin/courier-prime-v11-latin-700.woff2') format('woff2');
}

/* courier-prime-700italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Courier Prime';
  font-style: italic;
  font-weight: 700;
  src: url('/assets/fonts/courier-prime-v11-latin/courier-prime-v11-latin-700italic.woff2') format('woff2');
}


:root {
  /* Set sans-serif & mono fonts */
  --sans-font: "Courier Prime", Courier, monospace;
  --serif-font: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --mono-font: Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
  --standard-border-radius: 0px;
  --border-width: 2px;

  /* Default (light) theme */
  --bg: #fff;
  --accent-bg: #f0f0f0;
  --text: #212121;
  --text-light: #585858;
  --border: #212121;
  --accent: #0d47a1;
  --accent-hover: #1266e2;
  --accent-text: var(--bg);
  --red: #af2e1b;

  /* Status & notice colours */
  --color-warning-bg:   #fff3cd;
  --color-warning-text: #664d03;
  --color-success-bg:   #d1e7dd;
  --color-success-text: #0a3622;
  --color-info-bg:      #cfe2ff;
  --color-info-text:    #084298;
  --color-danger-bg:    #f8d7da;
  --color-danger-text:  #842029;
}

/* Dark theme */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg: #212121;
    --accent-bg: #1a1a1a;
    --text: #dcdcdc;
    --text-light: #ababab;
    --border: #dcdcdc;
    --accent: #ffb300;
    --accent-hover: #ffe099;
    --accent-text: var(--bg);
    --preformatted: #ccc;
    --disabled: #111;
    --red: #e05a45;

    /* Status & notice colours */
    --color-warning-bg:   #3d2e00;
    --color-warning-text: #ffc107;
    --color-success-bg:   #0d2b1d;
    --color-success-text: #75c896;
    --color-info-bg:      #0d1f4a;
    --color-info-text:    #90b8ff;
    --color-danger-bg:    #3d0a0d;
    --color-danger-text:  #f1a0a8;
  }
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Special Elite", serif;
}

img.logo {
    max-width: 125px;
    height: auto;
    margin-top: 1.5rem;
}

header nav a {
    text-transform: uppercase;
    font-weight: bold;
}

header nav a:hover, header nav a.current {
    background-color: var(--text);
    color: var(--bg);
    border-color: var(--text);
}

@media only screen and (max-width: 720px) {
    header nav a,
    header nav a:visited {
    margin: 0 0.5rem 1rem 0.5rem;
    border: var(--border-width) solid var(--border);
    display: inline-block;
    padding: 0.1rem 1rem;
    text-decoration: none;
    line-height: inherit;
    }
}

.status-pending {
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.85em;
}

.status-fulfilled {
    background: var(--color-success-bg);
    color: var(--color-success-text);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.85em;
}

.status-paid {
    background: var(--color-info-bg);
    color: var(--color-info-text);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.85em;
}

.status-declined {
    background: var(--color-danger-bg);
    color: var(--color-danger-text);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.85em;
}

button, a.button {
    background: var(--bg);
    color: var(--accent);
    text-transform: uppercase;
    font-weight: bold;
}

button:enabled:hover, .button:not([aria-disabled=true]):hover, a.button:hover, input[type=submit]:enabled:hover, input[type=reset]:enabled:hover, input[type=button]:enabled:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--bg);
}

.btn-danger, header nav a.btn-danger {
    background: var(--bg);
    border-color: var(--red);
    color: var(--red);
}

.btn-danger:hover, header nav a.btn-danger:hover {
    background: var(--red) !important;
    border-color: var(--red) !important;
    color: var(--bg) !important;
}

.notice {
    padding: 0.75rem 1rem;
    border-radius: 4px;
    margin-bottom: 1rem;
}

.notice-error {
    background: var(--color-danger-bg);
    color: var(--color-danger-text);
}

.notice-success {
    background: var(--color-success-bg);
    color: var(--color-success-text);
}

table {
    width: 100%;
}

.table-wrap {
    overflow-x: auto;
}