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

:root {
  --steel-900: #191b1d;
  --steel-850: #1c1e20;
  --steel-800: #232628;
  --steel-750: #292c2e;
  --steel-700: #303436;
  --steel-650: #383d3f;
  --steel-600: #444a4c;
  --steel-550: #59615f;
  --steel-500: #727b77;
  --steel-450: #777777;
  --steel-400: #898989;
  --steel-350: #999999;
  --steel-300: #aaaaaa;
  --steel-250: #b6b6b6;
  --steel-200: #c2c2c2;
  --steel-150: #d1d1d1;
  --steel-100: #dedede;
  --color-primary: #afc9bc;
  --color-primary-contrast: #101616;
  --color-primary-dark-1: #bfd5c9;
  --color-primary-dark-2: #cbded3;
  --color-primary-dark-3: #d4e4da;
  --color-primary-dark-4: #dceae1;
  --color-primary-dark-5: #e5efe8;
  --color-primary-dark-6: #edf4ef;
  --color-primary-dark-7: #f3f7f4;
  --color-primary-light-1: #9bb9a9;
  --color-primary-light-2: #89a895;
  --color-primary-light-3: #577866;
  --color-primary-light-4: #496354;
  --color-primary-light-5: #3d5347;
  --color-primary-light-6: #32453b;
  --color-primary-light-7: #293a31;
  --color-primary-alpha-10: #afc9bc19;
  --color-primary-alpha-20: #afc9bc33;
  --color-primary-alpha-30: #afc9bc4b;
  --color-primary-alpha-40: #afc9bc66;
  --color-primary-alpha-50: #afc9bc80;
  --color-primary-alpha-60: #afc9bc99;
  --color-primary-alpha-70: #afc9bcb3;
  --color-primary-alpha-80: #afc9bccc;
  --color-primary-alpha-90: #afc9bce1;
  --color-primary-hover: #cbded3;
  --color-primary-active: #9bb9a9;
  --color-text: #dfdfd8;
  --color-text-dark: #f0eee7;
  --color-text-light: #cccec6;
  --color-text-light-1: #bfc4bb;
  --color-text-light-2: #b0b8ae;
  --color-text-light-3: #a5aea3;
  --color-input-background: #1d2022;
  --color-input-border: #7b847c;
  --color-input-border-hover: #afc9bc;
  --color-button: #444b47;
  --color-nav-bg: #191b1d;
  --color-nav-hover-bg: #353b37;
  --color-console-bg: #1c1f21;
  --color-console-border: #59615f;
  --color-console-menu-bg: #303436;
  --color-console-active-bg: #444b47;
  --color-console-fg-subtle: #b0b8ae;
  --color-code-bg: #202325;
  --color-body: #232628;
  --color-box-body: #292c2e;
  --color-box-header: #303436;
  --color-secondary: #515a55;
  --color-secondary-light-1: #414846;
  --color-secondary-light-2: #383d3f;
  --color-secondary-light-3: #303436;
  --color-secondary-light-4: #292c2e;
  --font-main: Arial, Helvetica, sans-serif;
  --color-expand-button: #444b47;
  --color-selection-bg: #afc9bc;
  --color-selection-fg: #101616;
  --border-radius: 2px;
  --border-radius-medium: 2px;
  --border-radius-large: 2px;
  --font-monospace: "DejaVu Sans Mono", "Liberation Mono", monospace;
  color-scheme: dark;
}

body { background: var(--color-body); }
.vm-register .vm-register-art { border: 0; box-shadow: 0 14px 36px -10px #0009, 0 3px 10px #0003; }
#navbar { border-bottom: 1px solid #515a55; min-height: 62px; }
#navbar-logo img { width: 132px; height: auto; max-height: 44px; object-fit: contain; }
#navbar-logo { padding-block: 0; }
#navbar-expand-toggle::after { content: "Menu"; margin-left: .4rem; }
.ui.form .button, .ui.form input:not([type="checkbox"]):not([type="radio"]) { min-height: 44px; }
.ui.button, .ui.input > input, .ui.form input, .ui.segment, .ui.menu, .ui.label { border-radius: 2px; }
.ui.secondary.vertical.menu { border-radius: 2px !important; }
.ui.primary.button, .ui.primary.buttons .button { color: #101616; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid #cbded3;
  outline-offset: 3px;
}
.page-footer { border-top: 1px solid #515a55; }
.chroma :is(.c, .c1, .ch, .cm, .cs, .go),
.CodeMirror.cm-s-default .cm-comment, .CodeMirror.cm-s-paper .cm-comment { color: #999e98; }
.chroma :is(.k, .kd, .kn, .kr, .kt, .o, .ow) { color: #b2c8c2; }
.chroma :is(.s, .s1, .s2, .sb, .sd, .sh) { color: #c5c5a9; }
.chroma :is(.nf, .na, .nb, .nc, .nt) { color: #d8d8d1; }
.chroma :is(.m, .mb, .mf, .mh, .mi, .mo, .kc) { color: #afaec3; }

.vm-home { padding: 0 1.25rem 4rem; }
.vm-shell { max-width: 1120px; margin-inline: auto; }
.vm-intro { display: grid; gap: 2rem; padding-block: 2rem 2.5rem; }
.vm-intro-copy { align-self: center; }
.vm-intro-copy > .vm-description, .vm-intro-copy > .vm-browse { width: min(100%, 420px); max-width: 420px; text-align: center; }
.vm-intro-copy > .vm-browse { justify-content: center; }
.vm-mark { display: block; width: min(100%, 420px); height: auto; margin: 0 0 2rem; }
.vm-byline { font-size: .95rem; margin: 0 0 .75rem; color: var(--color-text-light-2); }
.vm-byline a { color: var(--color-primary); }
.vm-intro h1 { margin: 0 0 1.5rem; line-height: 1; }
.vm-intro h1 .vm-mark { margin: 0; }
.vm-description { max-width: 26rem; font-size: 1.1rem; line-height: 1.75; color: var(--color-text-light-1); margin: 0; }
.vm-browse { display: inline-flex; align-items: center; min-height: 44px; margin-top: 1.5rem; color: var(--color-primary); text-decoration: underline; text-underline-offset: 5px; }
.vm-art { margin: 0; min-width: 0; width: min(100%, 380px); justify-self: center; padding-right: 10px; }
.vm-art img { display: block; width: 100%; height: auto; border: 0; border-radius: 50% 50% 0 0 / 30% 30% 0 0; box-shadow: 0 18px 22px -20px #0006; }
.vm-art figcaption { text-align: right; font-size: .75rem; padding-top: 18px; color: #a5aea3; }
.vm-art figcaption a { color: var(--color-text-light-3); text-decoration: underline; text-underline-offset: 3px; }
.vm-repositories { scroll-margin-top: 1rem; }
.vm-section-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 1rem; padding-bottom: .75rem; border-bottom: 1px solid #7b847c; }
.vm-section-heading h2 { font: 400 1.75rem/1.3 Georgia, "Times New Roman", serif; margin: 0; }
.vm-section-heading > a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-primary); }
.vm-repo { display: grid; gap: .5rem; padding: 1.35rem 0; border-bottom: 1px solid #454e48; }
.vm-repo h3 { font-family: var(--font-monospace); font-size: 1rem; font-weight: 400; margin: 0; overflow-wrap: anywhere; }
.vm-repo h3 a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-text); }
.vm-repo h3 a:hover { color: var(--color-primary); text-decoration: underline; text-underline-offset: 4px; }
.vm-repo p { margin: 0; font-size: .95rem; line-height: 1.65; color: var(--color-text-light-1); overflow-wrap: anywhere; }
.vm-repo-details { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; font-size: .83rem; color: var(--color-text-light-3); }
#vm-repo-status { padding-block: 1.5rem; }
.no-js #vm-repo-status { display: none; }

@media (min-width: 760px) {
  .vm-home { padding-inline: 2.5rem; }
  .vm-intro { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 5rem; padding-block: 3.5rem 3.5rem; }
  .vm-art img { height: auto; }
  .vm-repo { grid-template-columns: minmax(150px, .85fr) minmax(0, 1.7fr) minmax(140px, .65fr); align-items: baseline; gap: 1.5rem; padding-block: 1.05rem; }
  .vm-repo-details { flex-direction: column; gap: .3rem; align-items: flex-end; text-align: right; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}