/* ══════════════════════════════════════════════════════════════════════════════
   Gitea — jakobhusu terminal theme
   Deploy: rename to theme-jakobhusu.css, place in
           ~/gitea/gitea/gitea/public/assets/css/
   ══════════════════════════════════════════════════════════════════════════════

   JetBrains Mono: blocked by Gitea's CSP unless self-hosted.
   Self-host: copy .woff2 files to ~/gitea/gitea/gitea/public/assets/fonts/
   and uncomment the @font-face blocks below.

@font-face {
  font-family: 'JetBrains Mono';
  src: url('/assets/fonts/JetBrainsMono-Regular.woff2') format('woff2');
  font-weight: 400; font-style: normal;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/assets/fonts/JetBrainsMono-Bold.woff2') format('woff2');
  font-weight: 700; font-style: normal;
}
*/

/* ── Palette & depth tokens ────────────────────────────────────────────────── */
:root {
  --color-primary:           #00ff9f;
  --color-primary-dark-1:    #00cc80;
  --color-primary-dark-2:    #009960;
  --color-primary-dark-3:    #006640;
  --color-primary-light-1:   #33ffb3;
  --color-primary-light-2:   #66ffc6;
  --color-primary-light-3:   #99ffd9;

  --color-body:              #000000;
  --color-box-header:        #000d00;
  --color-card:              #010c01;

  --color-text:              #00e090;
  --color-text-dark:         #00ff9f;
  --color-text-light-1:      rgba(0,255,159,0.75);
  --color-text-light-2:      rgba(0,255,159,0.55);
  --color-text-light-3:      rgba(0,255,159,0.35);

  --color-secondary:         #001800;
  --color-secondary-dark-1:  #001000;
  --color-secondary-light-1: #002000;

  --color-border:            rgba(0,255,159,0.22);
  --color-border-dark:       rgba(0,255,159,0.45);

  --color-input-background:  #000d00;
  --color-placeholder:       rgba(0,255,159,0.3);
  --color-nav-bg:            #000d00;

  --color-diff-added-row:    rgba(0,255,80,0.08);
  --color-diff-removed-row:  rgba(255,34,68,0.08);
  --color-diff-added-word:   rgba(0,255,80,0.28);
  --color-diff-removed-word: rgba(255,34,68,0.28);

  /* Depth tokens */
  --glow-xs:   0 0 8px  rgba(0,255,159,0.20);
  --glow-sm:   0 0 16px rgba(0,255,159,0.25);
  --glow-md:   0 0 30px rgba(0,255,159,0.20);
  --glow-lg:   0 0 50px rgba(0,255,159,0.18);
  --depth:     0 4px 24px rgba(0,0,0,0.85);
  --card-bg:   linear-gradient(160deg, #010f01 0%, #000900 60%, #010c01 100%);
  --menu-bg:   #000d00;
}

/* ── Global ────────────────────────────────────────────────────────────────── */
*, *::before, *::after {
  font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', Consolas, monospace !important;
}

body {
  background: #000 !important;
  color: #00e090 !important;
  /* Subtle green bloom at top */
  background-image: radial-gradient(ellipse 80% 30% at 50% 0%,
    rgba(0,40,10,0.35) 0%, transparent 100%) !important;
}

/* CRT vignette */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: radial-gradient(ellipse at center,
    transparent 55%, rgba(0,0,0,0.65) 100%);
  pointer-events: none;
  z-index: 99998;
}

/* CRT scanlines */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0,0,0,0.07) 2px,
    rgba(0,0,0,0.07) 4px
  );
  pointer-events: none;
  z-index: 99999;
}

/* ── Links ─────────────────────────────────────────────────────────────────── */
a { color: #00ff9f !important; }
a:hover {
  color: #ffff00 !important;
  text-shadow: 0 0 10px rgba(255,255,0,0.6);
}

/* ── Navbar ────────────────────────────────────────────────────────────────── */
.navbar, #navbar, nav.navbar, #navbar.navbar {
  background: #000d00 !important;
  border-bottom: 1px solid rgba(0,255,159,0.45) !important;
  box-shadow: 0 0 40px rgba(0,255,159,0.18), var(--depth) !important;
}
.navbar .item, #navbar .item,
.navbar .dropdown > .text, #navbar .dropdown > .text {
  color: #00ff9f !important;
}
.navbar .item:hover, #navbar .item:hover {
  background: rgba(0,255,159,0.1) !important;
  color: #ffff00 !important;
}
.navbar .active.item, #navbar .active.item {
  background: rgba(0,255,159,0.12) !important;
  color: #00ff9f !important;
  border-bottom: 2px solid #00ff9f !important;
}

/* ── ALL menus / dropdowns / popups ────────────────────────────────────────── */
/* Catch every Gitea popup surface: Fomantic UI, Tippy.js, generic */
.ui.dropdown .menu,
.ui.dropdown .menu .menu,
.ui.popup,
.ui.pointing.menu,
.ui.secondary.pointing.menu,
.tippy-box,
.tippy-content,
[data-tippy-root] .tippy-box,
.dropdown-menu,
.popup-menu,
.context-menu,
[role="menu"],
[role="listbox"],
.ui.floating.dropdown .menu,
.ui.upward.dropdown .menu {
  background: #000d00 !important;
  border: 1px solid rgba(0,255,159,0.45) !important;
  box-shadow: var(--glow-sm), var(--depth) !important;
  backdrop-filter: none !important;
}

.ui.dropdown .menu .item,
.dropdown-menu .item,
[role="menu"] [role="menuitem"],
[role="option"],
.tippy-box .item {
  background: transparent !important;
  color: #00e090 !important;
}
.ui.dropdown .menu .item:hover,
.dropdown-menu .item:hover,
[role="menu"] [role="menuitem"]:hover,
[role="option"]:hover {
  background: rgba(0,255,159,0.1) !important;
  color: #ffff00 !important;
}
.ui.dropdown .menu .active.item,
.ui.dropdown .menu .selected.item {
  background: rgba(0,255,159,0.12) !important;
  color: #00ff9f !important;
  font-weight: 700 !important;
}
/* Tippy arrow */
.tippy-box[data-placement^="bottom"] .tippy-arrow::before { border-bottom-color: rgba(0,255,159,0.45) !important; }
.tippy-box[data-placement^="top"]    .tippy-arrow::before { border-top-color:    rgba(0,255,159,0.45) !important; }
.tippy-box[data-placement^="left"]   .tippy-arrow::before { border-left-color:   rgba(0,255,159,0.45) !important; }
.tippy-box[data-placement^="right"]  .tippy-arrow::before { border-right-color:  rgba(0,255,159,0.45) !important; }

/* ── Panels / cards / segments ─────────────────────────────────────────────── */
.ui.segment,
.ui.card,
.ui.card > .content,
.flex-list .flex-item,
.repository,
.repository .ui.attached,
.issue-list .item,
.milestone-list .item,
.project-board .board,
.comment-list .comment {
  background: var(--card-bg) !important;
  border: 1px solid rgba(0,255,159,0.2) !important;
  box-shadow: var(--glow-xs), var(--depth) !important;
  color: #00e090 !important;
}

.ui.attached.header,
.ui.top.attached,
.box-header,
.card-header,
.header.item,
.panel-heading {
  background: #000d00 !important;
  border-color: rgba(0,255,159,0.3) !important;
  color: #00ff9f !important;
  text-shadow: 0 0 12px rgba(0,255,159,0.4);
  box-shadow: 0 2px 10px rgba(0,0,0,0.6) !important;
}

/* ── Buttons ───────────────────────────────────────────────────────────────── */
.ui.button,
.ui.basic.button,
button.button {
  background: rgba(0,20,0,0.8) !important;
  border: 1px solid rgba(0,255,159,0.4) !important;
  color: #00ff9f !important;
  box-shadow: var(--glow-xs) !important;
  transition: box-shadow 0.15s, color 0.15s, border-color 0.15s, background 0.15s !important;
}
.ui.button:hover,
.ui.basic.button:hover {
  background: rgba(0,40,10,0.9) !important;
  box-shadow: var(--glow-sm) !important;
  color: #ffff00 !important;
  border-color: #ffff00 !important;
}
.ui.primary.button, .ui.green.button.primary {
  background: rgba(0,60,20,0.8) !important;
  border-color: #00ff9f !important;
  box-shadow: var(--glow-sm) !important;
  color: #00ff9f !important;
}
.ui.primary.button:hover {
  box-shadow: var(--glow-md) !important;
  color: #ffff00 !important;
  border-color: #ffff00 !important;
}
.ui.red.button, .ui.negative.button {
  background: rgba(50,0,10,0.8) !important;
  border-color: #ff2244 !important;
  box-shadow: 0 0 12px rgba(255,34,68,0.2) !important;
  color: #ff2244 !important;
}
.ui.green.button:not(.primary), .ui.positive.button {
  background: rgba(0,40,10,0.8) !important;
  border-color: #28c840 !important;
  box-shadow: 0 0 12px rgba(40,200,64,0.2) !important;
  color: #28c840 !important;
}

/* ── Inputs ────────────────────────────────────────────────────────────────── */
input, textarea, select,
.ui.input input,
.ui.input textarea,
.CodeMirror {
  background: #000d00 !important;
  color: #00ff9f !important;
  border: 1px solid rgba(0,255,159,0.25) !important;
  box-shadow: inset 0 2px 8px rgba(0,0,0,0.6) !important;
}
input:focus, textarea:focus, select:focus,
.ui.input.focus input {
  border-color: #00ff9f !important;
  box-shadow: inset 0 2px 8px rgba(0,0,0,0.6), var(--glow-sm) !important;
  outline: none !important;
}
input::placeholder, textarea::placeholder { color: rgba(0,255,159,0.3) !important; }
.CodeMirror-cursor { border-left-color: #00ff9f !important; }

/* ── Labels / badges / tags ────────────────────────────────────────────────── */
.ui.label {
  background: rgba(0,30,10,0.9) !important;
  border: 1px solid rgba(0,255,159,0.3) !important;
  color: #00ff9f !important;
  box-shadow: var(--glow-xs) !important;
}
.ui.red.label, .label.red       { background: rgba(40,0,10,0.9) !important; border-color: #ff2244 !important; color: #ff2244 !important; }
.ui.green.label, .label.green   { background: rgba(0,30,10,0.9) !important; border-color: #28c840 !important; color: #28c840 !important; }
.ui.yellow.label, .label.yellow { background: rgba(40,30,0,0.9) !important; border-color: #ffbc2e !important; color: #ffbc2e !important; }
.ui.blue.label, .label.blue     { background: rgba(0,20,40,0.9) !important; border-color: #00ccff !important; color: #00ccff !important; }

/* ── Tables ────────────────────────────────────────────────────────────────── */
.ui.table, table {
  background: #010c01 !important;
  color: #00e090 !important;
  border: 1px solid rgba(0,255,159,0.15) !important;
  box-shadow: var(--depth) !important;
}
.ui.table thead th, table thead th {
  background: #000d00 !important;
  color: #00ff9f !important;
  border-bottom: 1px solid rgba(0,255,159,0.35) !important;
  text-shadow: 0 0 10px rgba(0,255,159,0.3);
}
.ui.table tr:hover td, table tbody tr:hover td {
  background: rgba(0,255,159,0.05) !important;
}
.ui.table td, table td { border-color: rgba(0,255,159,0.08) !important; }

/* ── Code & diff ───────────────────────────────────────────────────────────── */
code, pre {
  background: #000a00 !important;
  color: #00ff9f !important;
  border: 1px solid rgba(0,255,159,0.18) !important;
  box-shadow: inset 0 0 20px rgba(0,0,0,0.5) !important;
}
.code-view {
  border: 1px solid rgba(0,255,159,0.18) !important;
  box-shadow: var(--depth) !important;
}
.code-view td.lines-code {
  background: #000 !important;
  color: #00ff9f !important;
}
.code-view td.lines-num {
  background: #000a00 !important;
  color: rgba(0,255,159,0.3) !important;
  border-right: 1px solid rgba(0,255,159,0.15) !important;
}
.code-view tr.active td { background: rgba(0,255,159,0.07) !important; }
.code-view tr:hover td.lines-num { color: rgba(0,255,159,0.6) !important; }

/* ── Menu / tabs ───────────────────────────────────────────────────────────── */
.ui.menu,
.ui.secondary.menu,
.ui.pointing.secondary.menu,
.ui.tabular.menu {
  background: #000a00 !important;
  border: 1px solid rgba(0,255,159,0.2) !important;
  box-shadow: var(--depth) !important;
}
.ui.menu .item { color: #00e090 !important; background: transparent !important; }
.ui.menu .active.item {
  background: rgba(0,255,159,0.12) !important;
  color: #00ff9f !important;
  border-color: rgba(0,255,159,0.5) !important;
  text-shadow: 0 0 10px rgba(0,255,159,0.4);
  box-shadow: none !important;
}
.ui.menu .item:hover {
  background: rgba(0,255,159,0.08) !important;
  color: #ffff00 !important;
}

/* ── Sidebar ───────────────────────────────────────────────────────────────── */
.ui.sidebar,
.repository .sidebar,
#repo-summary,
.side.menu {
  background: linear-gradient(180deg, #010a01 0%, #000800 100%) !important;
  border: 1px solid rgba(0,255,159,0.15) !important;
  box-shadow: var(--glow-xs), var(--depth) !important;
}

/* ── Activity feed / dashboard ─────────────────────────────────────────────── */
.feeds .news .desc,
.activity-feed .event,
.dashboard .feeds > li {
  background: var(--card-bg) !important;
  border: 1px solid rgba(0,255,159,0.15) !important;
  box-shadow: var(--depth) !important;
}
.feeds .news .desc:hover { background: rgba(0,30,10,0.9) !important; }

/* ── Repo file list ────────────────────────────────────────────────────────── */
#repo-files-table {
  box-shadow: var(--depth) !important;
}
#repo-files-table tr:hover td { background: rgba(0,255,159,0.05) !important; }
#repo-files-table .name a { color: #00ff9f !important; }
#repo-files-table .name a:hover { color: #ffff00 !important; }

/* ── Stats / counters ──────────────────────────────────────────────────────── */
.text.green, .positive  { color: #28c840 !important; }
.text.red, .negative    { color: #ff2244 !important; }
.text.yellow            { color: #ffbc2e !important; }
.text.grey, .text.gray,
.ui.grey.text           { color: rgba(0,255,159,0.4) !important; }

/* ── Pagination ────────────────────────────────────────────────────────────── */
.ui.pagination .item {
  background: rgba(0,20,0,0.8) !important;
  color: #00e090 !important;
  border: 1px solid rgba(0,255,159,0.2) !important;
}
.ui.pagination .active.item {
  background: rgba(0,60,20,0.8) !important;
  color: #00ff9f !important;
  box-shadow: var(--glow-xs) !important;
}

/* ── Alerts / flash messages ───────────────────────────────────────────────── */
.ui.positive.message { background: rgba(0,30,10,0.9)  !important; border: 1px solid #28c840 !important; color: #28c840 !important; box-shadow: 0 0 15px rgba(40,200,64,0.15) !important; }
.ui.negative.message { background: rgba(40,0,10,0.9)  !important; border: 1px solid #ff2244 !important; color: #ff2244 !important; box-shadow: 0 0 15px rgba(255,34,68,0.15)  !important; }
.ui.warning.message  { background: rgba(40,30,0,0.9)  !important; border: 1px solid #ffbc2e !important; color: #ffbc2e !important; box-shadow: 0 0 15px rgba(255,188,46,0.15) !important; }
.ui.info.message     { background: rgba(0,20,40,0.9)  !important; border: 1px solid #00ccff !important; color: #00ccff !important; box-shadow: 0 0 15px rgba(0,204,255,0.15)   !important; }

/* ── Footer ────────────────────────────────────────────────────────────────── */
footer, #footer {
  background: #000a00 !important;
  border-top: 1px solid rgba(0,255,159,0.25) !important;
  color: rgba(0,255,159,0.4) !important;
  box-shadow: 0 -10px 30px rgba(0,0,0,0.5) !important;
}
footer a, #footer a { color: rgba(0,255,159,0.6) !important; }

/* ── Explore / home page ───────────────────────────────────────────────────── */
.explore .secondary {
  background: #000 !important;
  border: 1px solid rgba(0,255,159,0.15) !important;
}
.explore h3 a { color: #00ff9f !important; }
.explore h3 a:hover { color: #ffff00 !important; }
.explore .item .desc { color: rgba(0,255,159,0.6) !important; }

/* ── Issue/PR status badges ────────────────────────────────────────────────── */
.issue-state-label.open   { background: rgba(0,60,20,0.9)  !important; border-color: #28c840 !important; color: #28c840 !important; }
.issue-state-label.closed { background: rgba(60,0,10,0.9)  !important; border-color: #ff2244 !important; color: #ff2244 !important; }
.issue-state-label.merged { background: rgba(60,0,80,0.9)  !important; border-color: #cc44ff !important; color: #cc44ff !important; }

/* ── Repo header / owner name ──────────────────────────────────────────────── */
.repository.file.list .breadcrumb,
.repository .header-wrapper {
  text-shadow: 0 0 15px rgba(0,255,159,0.3);
}

/* ── Commit graph & stats ──────────────────────────────────────────────────── */
.commit-graph { filter: hue-rotate(110deg) saturate(1.5) brightness(0.9); }
.language-bar { box-shadow: 0 0 10px rgba(0,0,0,0.5) !important; }

/* ── Home page terminal ────────────────────────────────────────────────────── */
/* Override Gitea's default home page layout */
#j-home.page-content.home {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 60px);
  padding: 2rem;
  background: transparent !important;
}
.j-wrap {
  width: 100%;
  max-width: 680px;
}
.j-term {
  background: #000a00;
  border: 1px solid rgba(0,255,159,0.4);
  border-radius: 6px;
  box-shadow: 0 0 60px rgba(0,255,159,0.15), 0 0 120px rgba(0,255,159,0.05), 0 20px 60px rgba(0,0,0,0.9);
  overflow: hidden;
}

/* Title bar */
.j-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: #000d00;
  border-bottom: 1px solid rgba(0,255,159,0.25);
}
.j-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.j-red { background: #ff5f57; box-shadow: 0 0 6px rgba(255,95,87,0.5); }
.j-yel { background: #febc2e; box-shadow: 0 0 6px rgba(254,188,46,0.5); }
.j-grn { background: #28c840; box-shadow: 0 0 6px rgba(40,200,64,0.5); }
.j-title {
  flex: 1;
  text-align: center;
  font-size: 11px !important;
  color: rgba(0,255,159,0.4) !important;
  letter-spacing: 0.05em;
}

/* Body */
.j-body {
  padding: 1.4rem 1.8rem 1.8rem;
}
.j-line {
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: #00e090 !important;
  margin: 0 !important;
}
.j-dim  { color: rgba(0,255,159,0.4) !important; }
.j-err  { color: #ff4455 !important; }
.j-ps1  { color: #00ff9f !important; font-weight: 700 !important; }
.j-hint {
  font-size: 12px !important;
  color: rgba(255,188,46,0.7) !important;
  letter-spacing: 0.03em;
}

/* Blinking cursor */
.j-caret {
  display: inline-block;
  color: #00ff9f !important;
  animation: j-blink 1s step-end infinite;
}
@keyframes j-blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

/* Authenticate button */
.j-btn {
  display: inline-block;
  margin-top: 0.5rem;
  padding: 8px 20px;
  background: rgba(0,30,10,0.8) !important;
  border: 1px solid rgba(0,255,159,0.5) !important;
  color: #00ff9f !important;
  font-size: 13px !important;
  letter-spacing: 0.08em;
  text-decoration: none !important;
  box-shadow: var(--glow-xs);
  transition: box-shadow 0.15s, color 0.15s, border-color 0.15s;
}
.j-btn:hover {
  color: #ffff00 !important;
  border-color: #ffff00 !important;
  box-shadow: 0 0 20px rgba(255,255,0,0.25) !important;
}

/* ── Scrollbar ─────────────────────────────────────────────────────────────── */
::-webkit-scrollbar       { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #000; }
::-webkit-scrollbar-thumb { background: rgba(0,255,159,0.25); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(0,255,159,0.55); box-shadow: var(--glow-xs); }

/* ── Selection ─────────────────────────────────────────────────────────────── */
::selection { background: rgba(0,255,159,0.2); color: #00ff9f; }
