/* ============================================================================
   gitbuild.dev — Neo-Brutalist theme for Forgejo (tested on Forgejo 16)
   Matches the gitbuild.dev design system:
     ink #0A0A0A · paper #FFFFFF · paper-dim #F5F5F0 · accent #FFD60A
     Space Grotesk / JetBrains Mono · 0 radius · 2px borders · hard shadows

   Install on the Forgejo server:
     1. Copy theme-gitbuild.css  →  $FORGEJO_CUSTOM/public/assets/css/
     2. Copy fonts/*.woff2       →  $FORGEJO_CUSTOM/public/assets/fonts/
     3. In app.ini:
          [ui]
          THEMES = forgejo-auto,forgejo-auto-dark,forgejo-light,forgejo-dark,gitbuild
          DEFAULT_THEME = gitbuild
     4. Restart Forgejo.
   ============================================================================ */

/* -------- Self-hosted subsetted variable fonts (same files as the site) --- */
@font-face {
    font-family: 'Space Grotesk';
    font-style: normal;
    font-display: swap;
    font-weight: 300 700;
    src: url('../fonts/space-grotesk-latin.woff2') format('woff2-variations');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Space Grotesk';
    font-style: normal;
    font-display: swap;
    font-weight: 300 700;
    src: url('../fonts/space-grotesk-latin-ext.woff2') format('woff2-variations');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'JetBrains Mono';
    font-style: normal;
    font-display: swap;
    font-weight: 100 800;
    src: url('../fonts/jetbrains-mono-latin.woff2') format('woff2-variations');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'JetBrains Mono';
    font-style: normal;
    font-display: swap;
    font-weight: 100 800;
    src: url('../fonts/jetbrains-mono-latin-ext.woff2') format('woff2-variations');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* -------- Syntax highlighting (chroma light palette, from forgejo-light) -- */
.chroma .bp{color:#999}.chroma .c,.chroma .c1,.chroma .ch{color:#6a737d}.chroma .cm{color:#998}.chroma .cp{color:#109295}.chroma .cpf{color:#4c4dbc}.chroma .cs{color:#999}.chroma .dl{color:#106303}.chroma .gd{color:#000;background-color:#fdd}.chroma .ge{color:#000}.chroma .gh{color:#999}.chroma .gi{color:#000;background-color:#dfd}.chroma .go{color:#888}.chroma .gp{color:#555}.chroma .gr,.chroma .gt{color:#a00}.chroma .gu{color:#aaa}.chroma .il{color:#099}.chroma .k,.chroma .kc,.chroma .kd,.chroma .kn,.chroma .kp,.chroma .kr{color:#d73a49}.chroma .kt{color:#458}.chroma .m,.chroma .mb,.chroma .mf,.chroma .mh,.chroma .mi,.chroma .mo{color:#099}.chroma .na{color:#d73a49}.chroma .nb{color:#005cc5}.chroma .nc{color:#458}.chroma .nd{color:#3c5d5d}.chroma .ne{color:#900}.chroma .nf{color:#005cc5}.chroma .ni{color:#6f42c1}.chroma .nl{color:#900}.chroma .nn{color:#555}.chroma .no{color:teal}.chroma .nt{color:#22863a}.chroma .nv{color:teal}.chroma .nx{color:#24292e}.chroma .o,.chroma .ow{color:#d73a49}.chroma .s,.chroma .s1,.chroma .s2{color:#106303}.chroma .sa{color:#cc7a00}.chroma .sb{color:#106303}.chroma .sc{color:#cc7a00}.chroma .sd{color:#106303}.chroma .se{color:#940}.chroma .sh{color:#106303}.chroma .si{color:#cc7a00}.chroma .sr{color:#4c4dbc}.chroma .ss{color:#940}.chroma .sx{color:#106303}.chroma .vc,.chroma .vg,.chroma .vi{color:teal}.chroma .w{color:#bbb}
.markup [src$="#gh-dark-mode-only"],.markup [src$="#dark-mode-only"],.markup [href$="#gh-dark-mode-only"],.markup [href$="#dark-mode-only"]{display:none}

/* -------- Design tokens ---------------------------------------------------- */
:root {
    --steel-900: #10161d;--steel-850: #131a21;--steel-800: #171e26;--steel-750: #1d262f;--steel-700: #242d38;--steel-650: #2b3642;--steel-600: #374351;--steel-550: #445161;--steel-500: #515f70;--steel-450: #5f6e80;--steel-400: #6d7d8f;--steel-350: #7c8c9f;--steel-300: #8c9caf;--steel-250: #9dadc0;--steel-200: #aebed0;--steel-150: #c0cfe0;--steel-100: #d2e0f0;
    --zinc-50: #fafafa;--zinc-100: #f4f4f5;--zinc-150: #ececee;--zinc-200: #e4e4e7;--zinc-250: #dcdce0;--zinc-300: #d4d4d8;--zinc-350: #babac1;--zinc-400: #a1a1aa;--zinc-450: #898992;--zinc-500: #71717a;--zinc-550: #61616a;--zinc-600: #52525b;--zinc-650: #484850;--zinc-700: #3f3f46;--zinc-750: #333338;--zinc-800: #27272a;--zinc-850: #1f1f23;--zinc-900: #18181b;

    /* gitbuild.dev palette */
    --gb-ink: #0A0A0A;
    --gb-paper: #FFFFFF;
    --gb-paper-dim: #F5F5F0;
    --gb-accent: #FFD60A;
    --gb-accent-dark: #E6C100;

    /* Primary = accent yellow, text on primary = ink */
    --color-primary: #ffd60a;
    --color-primary-contrast: #0a0a0a;
    --color-primary-dark-1: #ffd60a;
    --color-primary-dark-2: #e6c100;
    --color-primary-dark-3: #d4b300;
    --color-primary-dark-4: #bfa400;
    --color-primary-dark-5: #ad9600;
    --color-primary-dark-6: #9a8600;
    --color-primary-dark-7: #877600;
    --color-primary-light-1: #ffdc2b;
    --color-primary-light-2: #ffe24d;
    --color-primary-light-3: #ffe870;
    --color-primary-light-4: #ffee94;
    --color-primary-light-5: #fff4b8;
    --color-primary-light-6: #fff9db;
    --color-primary-light-7: #fffdeb;
    --color-primary-alpha-10: #ffd60a19;
    --color-primary-alpha-20: #ffd60a33;
    --color-primary-alpha-30: #ffd60a4b;
    --color-primary-alpha-40: #ffd60a66;
    --color-primary-alpha-50: #ffd60a80;
    --color-primary-alpha-60: #ffd60a99;
    --color-primary-alpha-70: #ffd60ab3;
    --color-primary-alpha-80: #ffd60acc;
    --color-primary-alpha-90: #ffd60ae1;
    --color-primary-hover: var(--color-primary-dark-2);
    --color-primary-active: var(--color-primary-dark-4);

    --color-secondary: var(--zinc-200);
    --color-secondary-dark-1: var(--zinc-200);--color-secondary-dark-2: var(--zinc-300);--color-secondary-dark-3: var(--zinc-300);--color-secondary-dark-4: var(--zinc-400);--color-secondary-dark-5: var(--zinc-400);--color-secondary-dark-6: var(--zinc-500);--color-secondary-dark-7: var(--zinc-500);--color-secondary-dark-8: var(--zinc-600);--color-secondary-dark-9: var(--zinc-600);--color-secondary-dark-10: var(--zinc-700);--color-secondary-dark-11: var(--zinc-700);--color-secondary-dark-12: var(--zinc-800);--color-secondary-dark-13: var(--zinc-800);
    --color-secondary-light-1: var(--zinc-200);--color-secondary-light-2: var(--zinc-100);--color-secondary-light-3: var(--zinc-100);--color-secondary-light-4: var(--zinc-50);
    --color-secondary-alpha-10: #d4d4d819;--color-secondary-alpha-20: #d4d4d833;--color-secondary-alpha-30: #d4d4d84b;--color-secondary-alpha-40: #d4d4d866;--color-secondary-alpha-50: #d4d4d880;--color-secondary-alpha-60: #d4d4d899;--color-secondary-alpha-70: #d4d4d8b3;--color-secondary-alpha-80: #d4d4d8cc;--color-secondary-alpha-90: #d4d4d8e1;
    --color-secondary-hover: var(--color-secondary-dark-2);
    --color-secondary-active: var(--color-secondary-dark-4);

    /* Console stays dark — echoes the site's ink terminal card */
    --color-console-fg: #eeeff2;--color-console-fg-subtle: #959cab;--color-console-bg: #1f212b;--color-console-border: #383c47;--color-console-hover-bg: #ffffff16;--color-console-active-bg: #454a57;--color-console-menu-bg: #383c47;--color-console-menu-border: #5c6374;

    /* Semantic label colors (unchanged from forgejo-light) */
    --color-red: #dc2626;--color-orange: #ea580c;--color-yellow: #ca8a04;--color-olive: #91a313;--color-green: #15803d;--color-teal: #0d9488;--color-blue: #2563eb;--color-violet: #7c3aed;--color-purple: #9333ea;--color-pink: #db2777;--color-brown: #a47252;--color-grey: #4b5563;--color-black: #000000;
    --color-red-light: #ef4444;--color-orange-light: #f97316;--color-yellow-light: #eab308;--color-olive-light: #839311;--color-green-light: #16a34a;--color-teal-light: #14b8a6;--color-blue-light: #3b82f6;--color-violet-light: #8b5cf6;--color-purple-light: #a855f7;--color-pink-light: #ec4899;--color-brown-light: #94674a;--color-grey-light: #6b7280;--color-black-light: #181818;
    --color-red-dark-1: #c82020;--color-orange-dark-1: #d34f0b;--color-yellow-dark-1: #b67c04;--color-olive-dark-1: #839311;--color-green-dark-1: #137337;--color-teal-dark-1: #0c857a;--color-blue-dark-1: #1554e0;--color-violet-dark-1: #6a1feb;--color-purple-dark-1: #8519e7;--color-pink-dark-1: #c7216b;--color-brown-dark-1: #94674a;--color-black-dark-1: #000000;
    --color-red-dark-2: #b21d1d;--color-orange-dark-2: #bb460a;--color-yellow-dark-2: #a26e03;--color-olive-dark-2: #74820f;--color-green-dark-2: #116631;--color-teal-dark-2: #0a766d;--color-blue-dark-2: #124bc7;--color-violet-dark-2: #5c14d8;--color-purple-dark-2: #7715cf;--color-pink-dark-2: #b11d5f;--color-brown-dark-2: #835b42;--color-black-dark-2: #000000;
    --color-ansi-black: #1f2326;--color-ansi-red: #cc4848;--color-ansi-green: #87ab63;--color-ansi-yellow: #cc9903;--color-ansi-blue: #3a8ac6;--color-ansi-magenta: #d22e8b;--color-ansi-cyan: #00918a;--color-ansi-white: var(--color-console-fg-subtle);--color-ansi-bright-black: #46494d;--color-ansi-bright-red: #d15a5a;--color-ansi-bright-green: #93b373;--color-ansi-bright-yellow: #eaaf03;--color-ansi-bright-blue: #4e96cc;--color-ansi-bright-magenta: #d74397;--color-ansi-bright-cyan: #00b6ad;--color-ansi-bright-white: var(--color-console-fg);
    --color-gold: #b1983b;
    --color-white: #ffffff;

    /* Diffs and alert boxes keep their semantic colors */
    --color-diff-removed-word-bg: #fca5a5;--color-diff-added-word-bg: #86efac;--color-diff-removed-row-bg: #fee2e2;--color-diff-moved-row-bg: #fef9c3;--color-diff-added-row-bg: #dcfce7;--color-diff-removed-row-border: #fca5a5;--color-diff-moved-row-border: #fde047;--color-diff-added-row-border: #86efac;--color-diff-inactive: var(--zinc-100);
    --color-error-border: #fecaca;--color-error-bg: #fee2e2;--color-error-bg-active: #fca5a5;--color-error-bg-hover: #fecaca;--color-error-text: #7f1d1d;
    --color-success-border: #bbf7d0;--color-success-bg: #dcfce7;--color-success-text: #14532d;
    --color-warning-border: #fde047;--color-warning-bg: #fef3c7;--color-warning-text: #78350f;
    --color-info-border: #bae6fd;--color-info-bg: #e0f2fe;--color-info-text: #0c4a6e;
    --color-red-badge: #b91c1c;--color-red-badge-bg: #b91c1c22;--color-red-badge-hover-bg: #b91c1c44;
    --color-green-badge: #16a34a;--color-green-badge-bg: #16a34a22;--color-green-badge-hover-bg: #16a34a44;
    --color-yellow-badge: #ca8a04;--color-yellow-badge-bg: #ca8a0422;--color-yellow-badge-hover-bg: #ca8a0444;
    --color-orange-badge: #ea580c;--color-orange-badge-bg: #ea580c22;--color-orange-badge-hover-bg: #ea580c44;

    /* Surfaces: paper-dim body, paper boxes, ink text */
    --color-body: var(--gb-paper-dim);
    --color-box-header: var(--gb-paper-dim);
    --color-box-body: var(--gb-paper);
    --color-box-body-highlight: #f0f0e8;
    --color-text-dark: var(--gb-ink);
    --color-text: var(--gb-ink);
    --color-text-light: #262626;
    --color-text-light-1: #404040;
    --color-text-light-2: #525252;
    --color-text-light-3: #6b6b6b;
    --color-footer: var(--gb-paper);
    --color-timeline: #0a0a0a33;
    --color-input-text: var(--gb-ink);
    --color-input-background: var(--gb-paper);
    --color-input-toggle-background: var(--gb-paper);
    --color-input-border: var(--gb-ink);
    --color-input-border-hover: var(--gb-ink);
    --color-header-wrapper: var(--gb-paper);
    --color-header-wrapper-transparent: #d2e0f000;
    --color-light: #ffffffcc;
    --color-light-mimic-enabled: rgba(0, 0, 0, calc(6 / 255 * 222 / 255 / var(--opacity-disabled)));
    --color-light-border: #0000001d;
    --color-hover: var(--color-primary-alpha-40);
    --color-active: var(--color-primary-alpha-60);
    --color-menu: var(--gb-paper-dim);
    --color-card: var(--gb-paper);
    --fancy-card-bg: var(--gb-paper);
    --fancy-card-border: var(--gb-ink);
    --color-markup-table-row: #ffffff06;
    --color-markup-code-block: var(--gb-paper-dim);
    --color-markup-code-inline: #edede4;
    --color-button: var(--gb-paper);
    --color-code-bg: var(--gb-paper);
    --color-shadow: #0a0a0a60;
    --color-secondary-bg: var(--gb-paper-dim);
    --color-text-focus: var(--gb-paper);
    --color-expand-button: var(--color-primary-light-5);
    --color-placeholder-text: var(--color-text-light-3);
    --color-editor-line-highlight: var(--color-primary-light-6);
    --color-project-board-bg: var(--color-secondary-light-2);
    --color-project-board-dark-label: var(--color-text-light-3);
    --color-caret: var(--color-text);
    --color-reaction-bg: #0000000a;
    --color-reaction-active-bg: var(--color-primary-alpha-20);
    --color-reaction-hover-bg: var(--color-primary-alpha-30);
    --color-tooltip-text: var(--gb-accent);
    --color-tooltip-bg: #0a0a0af0;
    --color-nav-bg: var(--gb-paper);
    --color-nav-hover-bg: var(--gb-accent);
    --color-secondary-nav-bg: var(--color-body);
    --color-label-text: var(--color-text);
    --color-label-bg: #cacaca7b;
    --color-label-hover-bg: #cacacaa0;
    --color-label-active-bg: #cacacaff;
    --color-label-bg-alt: #cacacaff;
    --color-accent: var(--gb-accent-dark);
    --color-small-accent: var(--color-primary-light-5);
    --color-highlight-fg: var(--color-primary-light-4);
    --color-highlight-bg: var(--color-primary-light-6);
    --color-overlay-backdrop: #080808c0;
    --color-selection-bg: var(--gb-accent);
    --color-selection-fg: var(--gb-ink);
    --checkerboard-color-1: #ffffff;
    --checkerboard-color-2: #e5e5e5;
    --color-indicator-offline: #52525b;--color-indicator-offline-20: #52525b33;
    --color-indicator-idle: #16a34a;--color-indicator-idle-20: #16a34a33;
    --color-indicator-active: #2185d0;--color-indicator-active-20: #2185d033;

    /* Typography: same fonts as the website */
    --fonts-regular: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', 'Twemoji Mozilla';
    --fonts-monospace: 'JetBrains Mono', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace, 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji';

    /* Neo-brutalism: no rounded corners (keep --border-radius-full for spinners/avatars) */
    --border-radius: 0;
    --border-radius-medium: 0;
    --border-radius-large: 0;

    accent-color: var(--color-accent);
    color-scheme: light;
}

/* -------- Neo-brutalist structure ----------------------------------------- */

/* Faint grid-paper background, like the site's hero */
body {
    background-image:
        linear-gradient(to right, rgba(10, 10, 10, 0.06) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(10, 10, 10, 0.06) 1px, transparent 1px);
    background-size: 32px 32px;
}

/* Square everything */
.ui.button, .ui.basic.button, .ui.buttons,
.ui.segment, .ui.segments,
.ui.card, .ui.cards > .card,
.ui.message, .ui.label,
.ui.dropdown, .ui.dropdown .menu,
.ui.modal, .ui.popup,
.ui.form input, .ui.form textarea, .ui.form select,
.ui.input > input, .ui.selection.dropdown,
.ui.menu, .ui.tabular.menu .active.item,
.ui.progress, .ui.items > .item > .image > img {
    border-radius: 0 !important;
}
.ui.secondary.vertical.menu {
    border-radius: 0 !important;
    overflow: hidden;
}

/* Buttons: 2px ink border + hard offset shadow + pressed state (nb-btn) */
.ui.button,
.ui.basic.button {
    border: 2px solid var(--gb-ink);
    box-shadow: 3px 3px 0 0 var(--gb-ink);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    transition: transform 75ms ease, box-shadow 75ms ease, background-color 150ms ease;
}
.ui.button:active,
.ui.basic.button:active {
    transform: translate(2px, 2px);
    box-shadow: 1px 1px 0 0 var(--gb-ink);
}

/* Cards & segments: paper box with hard ink shadow (nb-card) */
.ui.segment {
    border: 2px solid var(--gb-ink);
    box-shadow: 4px 4px 0 0 var(--gb-ink);
}
.ui.segments {
    border: 2px solid var(--gb-ink);
    box-shadow: 4px 4px 0 0 var(--gb-ink);
}
.ui.segments > .segment {
    border: 0;
    border-top: 2px solid var(--gb-ink);
    box-shadow: none;
}
.ui.segments > .segment:first-child {
    border-top: 0;
}
.ui.card, .ui.cards > .card {
    border: 2px solid var(--gb-ink);
    box-shadow: 4px 4px 0 0 var(--gb-ink);
}

/* Inputs: 2px ink border, shadow on focus (nb-input) */
.ui.form input:not([type="checkbox"]):not([type="radio"]),
.ui.form textarea,
.ui.form select,
.ui.input > input,
.ui.selection.dropdown {
    border-width: 2px;
    border-color: var(--gb-ink);
}
.ui.form input:not([type="checkbox"]):not([type="radio"]):focus,
.ui.form textarea:focus,
.ui.form select:focus,
.ui.input > input:focus,
.ui.selection.dropdown:focus {
    border-color: var(--gb-ink);
    box-shadow: 3px 3px 0 0 var(--gb-ink);
}

/* Messages, dropdown menus, modals */
.ui.message {
    border: 2px solid var(--gb-ink);
    box-shadow: 3px 3px 0 0 var(--gb-ink);
}
.ui.dropdown .menu {
    border: 2px solid var(--gb-ink);
    box-shadow: 4px 4px 0 0 var(--gb-ink);
}
.ui.modal {
    border: 2px solid var(--gb-ink);
    box-shadow: 6px 6px 0 0 var(--gb-ink);
}

/* Top navigation: paper bar with thick ink underline, yellow hover */
#navbar {
    border-bottom: 3px solid var(--gb-ink);
}
#navbar .item {
    font-weight: 700;
}
#navbar .item:hover {
    background: var(--gb-accent);
    color: var(--gb-ink);
}

/* Footer matches the site's bordered strips */
.page-footer {
    border-top: 3px solid var(--gb-ink);
}

/* Links: ink with yellow highlight on hover (nb-link) */
a {
    color: var(--gb-ink);
}
a:hover {
    color: var(--gb-ink);
    background-color: var(--gb-accent);
}

/* Prose links get the thick yellow underline from the site */
.markup a {
    font-weight: 700;
    text-decoration: underline;
    text-decoration-color: var(--gb-accent);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}
.markup a:hover {
    background-color: var(--gb-accent);
}

/* Keyboard focus: thick yellow ring like the site's focus-visible */
:focus-visible {
    outline: 3px solid var(--gb-accent-dark);
    outline-offset: 2px;
}

/* -------- Ports of forgejo-light fixups, adjusted for ink text ------------ */
.ui.basic.primary.button.item {
    background-color: var(--color-active) !important;
    color: var(--color-text) !important;
    box-shadow: none !important;
}
.ui.red.label.notification_count,
.ui.primary.labels .label {
    background-color: var(--color-primary-dark-1) !important;
    color: var(--gb-ink) !important;
}
.ui.labeled.icon.buttons > .button > .icon,
.ui.labeled.icon.button > .icon {
    background-color: var(--color-shadow) !important;
}
#review-box .review-comments-counter {
    background-color: var(--color-label-bg) !important;
    margin-inline-start: .5em;
}
.ui.basic.labels .primary.label,
.ui.ui.ui.basic.primary.label {
    color: var(--color-text-dark) !important;
}
.ui.yellow.label.pending-label {
    background: var(--color-warning-bg) !important;
    color: var(--color-text-dark) !important;
}