/* Aurora: a slightly warm near-black, one violet accent, Inter, and quieter,
   flatter surfaces than Forgejo's own, on GitHub's dark theme
   (theme-github-dark.css) for the status colours, diffs and syntax.

   Every corner is Forgejo's own: nothing here sets a radius except through
   --border-radius, which is left as Forgejo has it. Nothing moves either. */
@import "./theme-github-dark.css";

@font-face { font-family: "Inter"; src: url("../fonts/inter.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/jetbrains-mono.woff2") format("woff2"); font-weight: 100 800; font-display: swap; }

:root {
  --fonts-proportional: "Inter", -apple-system, "Segoe UI", system-ui, sans-serif;
  --fonts-monospace: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --aurora-pop: 0 1px 0 #ffffff0f inset, 0 16px 40px #000000a6, 0 0 0 1px #2a2c33;
  --aurora-line: #ffffff0f;
  --aurora-raised: #121315;
  color-scheme: dark;
  accent-color: var(--color-primary);
  scrollbar-color: #3a3d45 transparent;

  --color-primary: #8b8cff;
  --color-primary-contrast: #ffffff;
  --color-primary-dark-1: #a3a4ff;
  --color-primary-dark-2: #b8b9ff;
  --color-primary-light-1: #7170ff;
  --color-primary-light-2: #5e6ad2;
  --color-primary-alpha-10: #7170ff1a;
  --color-primary-alpha-20: #7170ff33;
  --color-primary-alpha-30: #7170ff4d;
  --color-primary-alpha-40: #7170ff66;
  --color-accent: #7170ff;
  --color-primary-hover: #7c7dff;
  --color-primary-active: #5e6ad2;

  --color-body: #08090a;
  --color-box-body: #0f1011;
  --color-box-header: #141517;
  --color-box-body-highlight: #16171a;
  --color-secondary-bg: #141517;
  --color-menu: #141517;
  --color-card: #0f1011;
  --fancy-card-bg: #0f1011;
  --fancy-card-border: #23252a;
  --color-nav-bg: #08090a;
  --color-nav-hover-bg: #1c1d21;
  --color-secondary-nav-bg: #08090a;
  --color-header-wrapper: #08090a;
  --color-footer: #08090a;
  --color-hover: #16171a;
  --color-active: #1c1d21;
  --color-button: #16171a;
  --color-expand-button: #1c1d21;
  --color-project-board-bg: #08090a;

  --color-secondary: #23252a;
  --color-secondary-dark-1: #2a2c33;
  --color-secondary-dark-2: #3a3d45;
  --color-secondary-light-1: #1c1d21;
  --color-secondary-light-2: #16171a;
  --color-secondary-light-3: #0f1011;
  --color-secondary-light-4: #08090a;
  --color-light-border: #ffffff0f;
  --color-timeline: #23252a;

  --color-text-dark: #ffffff;
  --color-text: #f7f8f8;
  --color-text-light: #d0d6e0;
  --color-text-light-1: #d0d6e0;
  --color-text-light-2: #8a8f98;
  --color-text-light-3: #6c717a;

  --color-input-background: #0f1011;
  --color-input-border: #2a2c33;
  --color-input-border-hover: #3a3d45;
  --color-input-toggle-background: #1c1d21;
  --color-code-bg: #0f1011;
  --color-markup-code-block: #141517;
  --color-markup-code-inline: #ffffff12;
  --color-markup-table-row: #141517;
  --color-editor-line-highlight: #16171a;
  --color-label-bg: #1c1d21;
  --color-label-hover-bg: #23252a;
  --color-label-active-bg: #2a2c33;
  --color-label-bg-alt: #23252a;
  --color-diff-inactive: #0f1011;
}

/* ---- Everywhere ---------------------------------------------------------- */

/* Nothing fades, slides or eases; only the loading spinners still turn. */
*, *::before, *::after { transition: none !important; }
.pulse, .ui.modal, .ui.dimmer.transition, .markup .code-copy,
.markup .code-block:hover .code-copy, .markup .mermaid-block:hover .code-copy { animation: none !important; }
dialog::backdrop { animation: none !important; opacity: 1 !important; }

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "cv11", "ss01", "calt";
}
h1, h2, h3, h4, .ui.header { text-wrap: balance; letter-spacing: -0.015em; }
p, .markup li { text-wrap: pretty; }
.ui.label, .ui.table, relative-time, .repository-summary, .commit-list, .notification_count { font-variant-numeric: tabular-nums; }
::selection { background: var(--color-primary-alpha-40); }

/* The footer says nothing about the software; the language menu stays. */
.page-footer { background: transparent; border-top: 1px solid var(--aurora-line); font-size: 12px; color: var(--color-text-light-3); }
.page-footer .left-links { visibility: hidden; }

/* ---- Top bar ------------------------------------------------------------- */

#navbar {
  position: sticky; top: 0; z-index: 100;
  min-height: 52px; padding: 0 16px;
  background: #08090acc;
  border-bottom: 1px solid var(--aurora-line);
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
}
#navbar-logo img { width: 24px; height: 24px; }
#navbar .navbar-left > a.item:not(#navbar-logo) { font-size: 13.5px; font-weight: 500; color: var(--color-text-light-2); }
#navbar .navbar-left > a.item:not(#navbar-logo):hover,
#navbar .navbar-left > a.item.active { color: var(--color-text); background: #ffffff0a; }
#navbar a.item:hover, #navbar details.dropdown > summary:hover { background: #ffffff0a; }

/* ---- Repository header --------------------------------------------------- */

.secondary-nav { background: transparent !important; }
.repo-header { padding-top: 6px; }
.repo-header .flex-item-leading > .svg { display: none; }
.repo-header .flex-item-title { font-size: 20px; font-weight: 400; letter-spacing: -0.02em; color: var(--color-text-light-2); }
.repo-header .flex-item-title a { color: var(--color-text-light-2); }
.repo-header .flex-item-title a:last-of-type { color: var(--color-text); font-weight: 650; }
/* The feed link is one more button nobody presses. */
.repo-header a[href$=".rss"] { display: none !important; }
.repo-header .ui.labeled.button > .button, .repo-header .ui.labeled.button > .label,
.repo-header .ui.compact.button { font-size: 12.5px; }

/* Tabs as one segmented control. */
overflow-menu { border-bottom: 1px solid var(--aurora-line) !important; padding: 0 0 10px; }
.overflow-menu-items { gap: 2px; }
.overflow-menu-items .item {
  border: 0 !important; border-radius: var(--border-radius) !important; padding: 6px 12px !important; margin: 0 !important;
  font-size: 13.5px; color: var(--color-text-light-2) !important; font-weight: 500;
}
.overflow-menu-items .item:hover { background: #ffffff0a; color: var(--color-text) !important; }
.overflow-menu-items .item.active { background: #1c1d21 !important; color: #fff !important; box-shadow: 0 1px 0 #ffffff0f inset, 0 0 0 1px #2a2c33; }
.overflow-menu-items .item .ui.label { background: #ffffff12; color: var(--color-text-light); border: 0; }

/* ---- Repository home ----------------------------------------------------- */

#repo-desc .description, .repo-description { font-size: 15px; color: var(--color-text-light); }
.repo-topic.ui.label {
  background: var(--color-primary-alpha-10); color: var(--color-primary-dark-1);
  border: 0; font-size: 12px; font-weight: 500;
}
.repo-topic.ui.label:hover { background: var(--color-primary-alpha-20); }

/* The counts are a line of text, not a box; the languages a thin bar under it. */
.repository-summary, .repository-summary .segment { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.repository .repository-summary .repository-menu { display: flex !important; flex-wrap: wrap; justify-content: flex-start; gap: 4px 20px; padding: 0 !important; }
.repository-summary .repository-menu .item { flex: none !important; width: auto !important; padding: 4px 0 !important; color: var(--color-text-light-2) !important; font-size: 13px; }
.repository-summary .repository-menu .item b { color: var(--color-text); font-weight: 600; }
.repository-summary .repository-menu .item:hover { color: var(--color-text) !important; background: transparent !important; }
#language-stats stats-bar, .repository-summary stats-bar { height: 4px !important; overflow: hidden; margin: 4px 0 6px; }

/* The file list: hairlines, the latest commit as a header row. */
#repo-files-table { background: transparent; border-color: #23252a !important; }
#repo-files-table thead th { background: var(--aurora-raised) !important; font-weight: 400; }
#repo-files-table td { border-top-color: var(--aurora-line) !important; }
#repo-files-table tbody tr:hover > td { background: #ffffff05; }
#repo-files-table td.name a { color: var(--color-text); }
#repo-files-table td.message, #repo-files-table td.message a, #repo-files-table td.age { color: var(--color-text-light-3) !important; }
#repo-files-table td.message a:hover { color: var(--color-text-light) !important; }

/* ---- Boxes --------------------------------------------------------------- */

.ui.segment, .ui.segments, .ui.table, .ui.attached.segment, .ui.attached.header, .ui.menu:not(.secondary) { border-color: #23252a !important; }
.ui.attached.header, .ui.attached.header:not(.ui.message) { background: var(--aurora-raised) !important; font-size: 13.5px; font-weight: 600; }
.ui.segment, .ui.attached.segment { background: #0c0d0e; }
.ui.divider:not(.vertical):not(.horizontal) { border-top-color: var(--aurora-line) !important; }

/* ---- Controls ------------------------------------------------------------ */

.ui.button { font-weight: 500; font-size: 13px; }
.ui.button:not(.primary):not(.red):not(.green):not(.basic):not(.link) { background-color: #16171a; border-color: #2a2c33; }
.ui.button:not(.primary):not(.red):not(.green):not(.basic):not(.link):hover { background-color: #1e1f23; border-color: #34363d; }
.ui.labeled.button > .label { background: #101113 !important; border-color: #2a2c33 !important; color: var(--color-text-light); }

/* The main action: violet, with a little light on its top edge. */
.ui.primary.button, .primary.button, .ui.primary.buttons .button {
  background: linear-gradient(#7c7dff, #5e6ad2); color: #fff; border-color: transparent;
  box-shadow: 0 1px 0 #ffffff33 inset;
}
.ui.primary.button:hover, .primary.button:hover, .ui.primary.buttons .button:hover { background: linear-gradient(#8b8cff, #6b74e0); color: #fff; }

input, textarea, .ui.selection.dropdown { background-color: #0b0c0d; }
.ui.input input:focus, .ui.form input:focus, .ui.form textarea:focus, textarea:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 3px var(--color-primary-alpha-30) !important;
}

/* Things that float lift off the page. */
.tippy-box, .ui.dropdown:not(.selection) > .menu, details.dropdown > .content { box-shadow: var(--aurora-pop) !important; }

/* Labels: their colours are their own. */
.labels-list .ui.label, .issue-content-right .labels-list .ui.label { font-weight: 550; border: 0; }

/* ---- Lists of issues and pull requests ----------------------------------- */

#issue-list { border: 1px solid #23252a; border-radius: var(--border-radius); background: #0c0d0e; overflow: hidden; margin-top: 12px; }
#issue-list > .flex-item { padding: 12px 16px; }
#issue-list > .flex-item + .flex-item { border-top-color: var(--aurora-line); }
#issue-list > .flex-item:hover { background: #ffffff05; }
#issue-list .flex-item-title a { font-size: 14px; font-weight: 550; color: var(--color-text); }
#issue-list .flex-item-body, #issue-list .flex-item-body a { font-size: 12.5px; color: var(--color-text-light-3); }
#issue-list .flex-item-icon .svg.octicon-issue-opened, #issue-list .flex-item-icon .svg.octicon-git-pull-request { color: var(--color-primary) !important; }
.flex-item-title { letter-spacing: -0.005em; }

/* The activity feed: the event's icon is a hint, not a headline. */
#activity-feed > .flex-item { padding: 12px 4px; border-top-color: var(--aurora-line) !important; font-size: 13.5px; }
#activity-feed .flex-item-trailing .svg { width: 18px; height: 18px; color: var(--color-text-light-3) !important; opacity: .7; }

/* ---- An issue or pull request -------------------------------------------- */

.repository.view.issue .issue-title-header .issue-title h1 { font-size: 26px; font-weight: 650; letter-spacing: -0.025em; }
.repository.view.issue .issue-title-header .issue-title .index { color: var(--color-text-light-3); font-weight: 400; }
.issue-state-label, .issue-title-meta .ui.label { font-weight: 550; }

.timeline::before { background: var(--aurora-line) !important; }
.timeline-item.event, .timeline-item.event a:not(.label-list a) { color: var(--color-text-light-3); font-size: 13px; }
.timeline-item.event .badge { background: #0f1011; border-color: #23252a; }
.comment .comment-container { border-color: #23252a !important; background: #0c0d0e; }
.comment .comment-header { background: transparent !important; border-bottom-color: var(--aurora-line) !important; }
.comment .comment-header .text, .comment .comment-header .text a.muted { color: var(--color-text-light-3); }
.comment .comment-header .author { color: var(--color-text) !important; font-weight: 600; }
.comment .comment-header .ui.label { background: transparent; border: 1px solid #2a2c33; color: var(--color-text-light-2); }

/* The sidebar: small quiet headings, hairlines between. */
.issue-content-right.ui.segment { font-size: 13px; background: transparent; border-color: transparent !important; box-shadow: none; }
.issue-content-right > .divider, .issue-content-right .ui.divider { border-top-color: var(--aurora-line) !important; }
.issue-content-right .text > strong {
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--color-text-light-3);
}

/* Pull request tabs: text with a violet underline, not boxes. */
.ui.pull.tabular.menu { border-bottom: 1px solid var(--aurora-line) !important; gap: 20px; }
.ui.pull.tabular.menu .item {
  border: 0 !important; background: transparent !important; margin: 0 0 -1px !important; padding: 10px 2px !important;
  color: var(--color-text-light-2) !important; font-weight: 500; font-size: 13.5px;
}
.ui.pull.tabular.menu .item:hover { color: var(--color-text) !important; }
.ui.pull.tabular.menu .active.item { color: var(--color-text) !important; box-shadow: inset 0 -2px 0 var(--color-primary); }
.ui.pull.tabular.menu .item .ui.label { background: #ffffff12; color: var(--color-text-light); border: 0; }

/* ---- Settings and other side menus --------------------------------------- */

.ui.vertical.menu:not(.dropdown) { background: transparent; border: 0 !important; box-shadow: none; }
.ui.vertical.menu:not(.dropdown) > .header.item { background: transparent; font-size: 11.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--color-text-light-3); padding-left: 10px; }
.ui.vertical.menu:not(.dropdown) .item { border-radius: var(--border-radius) !important; color: var(--color-text-light-2); padding: 8px 10px !important; }
.ui.vertical.menu:not(.dropdown) .item::before { display: none; }
.ui.vertical.menu:not(.dropdown) .item:hover { background: #ffffff0a; color: var(--color-text); }
.ui.vertical.menu:not(.dropdown) .item.active { background: #1c1d21 !important; color: #fff; }
.ui.vertical.menu:not(.dropdown) details.item { padding: 0 !important; background: transparent !important; }
.ui.vertical.menu:not(.dropdown) details.item > summary { padding: 8px 10px; border-radius: var(--border-radius); color: var(--color-text-light-2); }
.ui.vertical.menu:not(.dropdown) details.item > summary:hover { background: #ffffff0a; color: var(--color-text); }
.ui.vertical.menu:not(.dropdown) details.item > .menu { margin: 2px 0 4px 12px !important; padding-left: 6px; border-left: 1px solid var(--aurora-line); }
.ui.vertical.menu:not(.dropdown) details.item > .menu > .item { font-size: 13px !important; margin: 0 !important; padding: 6px 10px !important; }

/* ---- Code ---------------------------------------------------------------- */

.markup pre, .markup .highlight pre { background: #0c0d0e !important; border: 1px solid #23252a; }
.markup code { background: #ffffff10; }
/* Forgejo backs rendered images with --color-box-body, lighter than Aurora's segments: a transparent logo showed a box. */
.markup.file-view img, .markup.file-view video { background: transparent; }
.diff-file-box { border-color: #23252a !important; }
.diff-file-header { background: var(--aurora-raised) !important; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #3a3d45; border-radius: 99px; border: 3px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-track { background: transparent; }