/* crenshawdev, a Forgejo theme matching jcrenshaw.dev.
   Deep Slate surfaces + Arch blue accent, IBM Plex self-hosted.
   Derived from the built-in dark theme so upstream keeps owning everything
   this file does not explicitly claim. */

@import url("./theme-forgejo-dark.css");

/* Fonts, served from this instance. No Google Fonts request, ever. */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/ibm-plex-sans-latin.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/ibm-plex-mono-400-latin.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/ibm-plex-mono-500-latin.woff2") format("woff2");
}

:root {
  /* Deep Slate ramp. The 900/850/800/750 anchors are the site's own
     --bg-deep / --bg / --surface-2 / --surface, and 250/150/100 are its ink
     ramp, so the forge and the site read as one surface. */
  --steel-900: #0b0e13;
  --steel-850: #0e1218;
  --steel-800: #11151c;
  --steel-750: #161b23;
  --steel-700: #1a212c;
  --steel-650: #202834;
  --steel-600: #29323f;
  --steel-550: #333e4d;
  --steel-500: #3f4c5d;
  --steel-450: #4d5b6e;
  --steel-400: #5c6b7f;
  --steel-350: #6d7c90;
  --steel-300: #828fa1;
  --steel-250: #9aa2af;
  --steel-200: #b3bac5;
  --steel-150: #c6ccd6;
  --steel-100: #e8ecf2;

  /* Arch blue. Dark theme convention, dark-N goes lighter, light-N darker. */
  --color-primary: #1793d1;
  --color-primary-contrast: #04121b;
  --color-primary-dark-1: #3aabe4;
  --color-primary-dark-2: #52b5e7;
  --color-primary-dark-3: #6cc0ea;
  --color-primary-dark-4: #86cbec;
  --color-primary-dark-5: #9fd5ef;
  --color-primary-dark-6: #b8e0f1;
  --color-primary-dark-7: #d1eaf4;
  --color-primary-light-1: #1584bc;
  --color-primary-light-2: #1276a8;
  --color-primary-light-3: #106793;
  --color-primary-light-4: #0e597e;
  --color-primary-light-5: #0c4a6a;
  --color-primary-light-6: #093c55;
  --color-primary-light-7: #072d40;
  --color-primary-alpha-10: #1793d119;
  --color-primary-alpha-20: #1793d133;
  --color-primary-alpha-30: #1793d14b;
  --color-primary-alpha-40: #1793d166;
  --color-primary-alpha-50: #1793d180;
  --color-primary-alpha-60: #1793d199;
  --color-primary-alpha-70: #1793d1b3;
  --color-primary-alpha-80: #1793d1cc;
  --color-primary-alpha-90: #1793d1e1;
  --color-primary-hover: var(--color-primary-dark-1);
  --color-primary-active: var(--color-primary-dark-2);

  /* Accent text sits one step lighter than the fill so link-sized text clears
     WCAG AA on the body surface, the same reason the site keeps an accent-2. */
  --color-accent: var(--color-primary-dark-1);
  --color-small-accent: var(--color-primary-light-3);
  --color-highlight-fg: var(--color-primary-dark-1);
  --color-highlight-bg: var(--color-primary-alpha-20);

  /* Lines, matching the site's --line / --line-soft rather than dark's #ffffff28 */
  --color-light-border: rgba(255, 255, 255, 0.08);
  --color-secondary: #29323f;

  --color-console-bg: var(--steel-900);
  --color-console-fg: var(--steel-150);
  --color-console-border: rgba(255, 255, 255, 0.08);

  --fonts-proportional: "IBM Plex Sans", -apple-system, "Segoe UI", system-ui, Roboto, sans-serif;
  --fonts-monospace: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace,
    var(--fonts-emoji);
}

/* Links carry the lighter tint. Upstream points them at --color-primary,
   which is a 4:1 fill color, fine for buttons and thin for body text. */
a,
.link,
.ui.breadcrumb a,
.repo-title a {
  color: var(--color-primary-dark-1);
}
a:hover,
.link:hover {
  color: var(--color-primary-dark-3);
}

/* An accent hairline under the top bar, the same seam the site's panel has. */
#navbar,
.ui.top.secondary.menu {
  border-bottom: 1px solid rgba(23, 147, 209, 0.42);
  box-shadow: 0 1px 0 rgba(23, 147, 209, 0.12), 0 8px 24px rgba(0, 0, 0, 0.35);
}

::selection {
  background: var(--color-primary);
  color: #0b0e13;
}

:focus-visible {
  outline: 2px solid var(--color-primary-dark-1);
  outline-offset: 2px;
}

/* Repo and org headings in Plex with the site's tighter tracking. */
.repository .header-wrapper .repo-title .name,
#user-profile-avatar-name,
.ui.header {
  letter-spacing: -0.01em;
}

/* Code and diffs sit on the deepest surface so the gutter reads as chrome. */
.file-view.code-view,
.diff-file-box .file-body {
  font-family: var(--fonts-monospace);
  font-feature-settings: "liga" 0, "calt" 0;
}