/*
 * Forgejo Midnight Theme
 * Based on forgejo-dark, replacing brownish-grey tones with deep midnight blue.
 *
 * Installation:
 *   1. Copy this file to $GITEA_CUSTOM/public/assets/css/theme-forgejo-midnight.css
 *   2. In app.ini under [ui], add "forgejo-midnight" to THEMES
 *      e.g. THEMES = forgejo-auto,forgejo-light,forgejo-dark,forgejo-midnight
 *   3. Optionally set DEFAULT_THEME = forgejo-midnight
 *   4. Restart Forgejo.
 *   5. Users can select it under Settings → Appearance.
 */

@import "./theme-forgejo-dark.css";

:root {
  /* ── Colour scheme hint ──────────────────────────────────────────────── */
  color-scheme: dark;

  /* ── Core background scale (brownish-grey → midnight blue) ──────────── */
  --color-body:              #202c3e;   /* page background                  */
  --color-box-body:          #283644;   /* card / box interior               */
  --color-box-header:        #2d3c50;   /* card / box header strip           */

  /* Fomantic / Semantic UI surface variables */
  --color-subtle-bg:         #1a2235;   /* subtle backgrounds, sidebars      */
  --color-canvas-default:    #141928;
  --color-canvas-subtle:     #1a2235;
  --color-canvas-inset:      #111624;

  /* ── Navigation / header ────────────────────────────────────────────── */
  --color-nav-bg:            #161d2e;   /* top navigation bar background     */
  --color-secondary-nav-bg:  #1a2235;   /* secondary nav / breadcrumb bar    */

  /* ── Input / form surfaces ──────────────────────────────────────────── */
  --color-input-background:  #182030;
  --color-input-border:      #263852;

  /* ── Borders ────────────────────────────────────────────────────────── */
  --color-border:            #263852;
  --color-border-light:      #202e45;
  --color-secondary-border:  #233148;

  /* ── Menu / dropdown ────────────────────────────────────────────────── */
  --color-menu:              #182030;
  --color-item-hover:        #1e2a42;

  /* ── Text ───────────────────────────────────────────────────────────── */
  --color-text:              #e0e0e0;          /* default body text          */
  --color-text-dark:         #e0e0e0;
  --color-text-light:        #a0aec0;          /* secondary / muted text     */
  --color-text-light-2:      #718096;
  --color-text-dark-2:       #b0bec8;

  /* ── Primary accent (was orange → now a cool blue-indigo) ───────────── */
  --color-primary:           #5aafcb;
  --color-primary-hover:     #5a90dc;
  --color-primary-active:    #3a6fbb;
  --color-primary-light-1:   #3d6db8;
  --color-primary-light-2:   #2f5a9e;
  --color-primary-light-3:   #234a87;
  --color-primary-dark-1:    #5a8fd8;
  --color-primary-dark-2:    #6a9fe8;
  --color-primary-dark-3:    #7aaef8;

  /* ── Accent (orange → yellow-green per spec: #f0f080) ───────────────── */
  --color-accent:            #f0f080;
  --color-accent-hover:      #f5f59a;
  --color-accent-active:     #e8e860;

  /* ── Links ──────────────────────────────────────────────────────────── */
  --color-link:              #6fa8e8;
  --color-link-hover:        #89baf5;

  /* ── Code blocks ────────────────────────────────────────────────────── */
  --color-code-bg:           #111624;
  --color-code-sidebar-bg:   #141928;

  /* ── Diff view ──────────────────────────────────────────────────────── */
  --color-diff-added-row-bg:          #0d2b1a;
  --color-diff-removed-row-bg:        #2b0d14;
  --color-diff-added-word-bg:         #1a5c30;
  --color-diff-removed-word-bg:       #5c1a28;
  --color-diff-added-row-border:      #1a5c30;
  --color-diff-removed-row-border:    #5c1a28;

  /* ── Timeline / activity ────────────────────────────────────────────── */
  --color-timeline-border:   #1e2d4a;

  /* ── Shadow ─────────────────────────────────────────────────────────── */
  --color-shadow:            rgba(0, 0, 0, 0.5);

  /* ── Scrollbar ──────────────────────────────────────────────────────── */
  --color-scrollbar-track:   #182030;
  --color-scrollbar-thumb:   #2a3f60;
  --color-scrollbar-thumb-hover: #3a5080;

  /* ── Labels / badges ────────────────────────────────────────────────── */
  --color-label-bg:          #1e2a42;

  /* ── Rounded corners (global) ───────────────────────────────────────── */
  --border-radius:           10px;
  --border-radius-sm:        10px;
  --border-radius-lg:        10px;
}

/* ── Apply border-radius globally ──────────────────────────────────────── */
/*
 * Forgejo uses a mix of inline px values and component-specific selectors.
 * The variables above cover the Fomantic UI layer; the rules below catch
 * hard-coded rounded shapes elsewhere in the UI.
 */

/* Buttons */
.ui.button,
.ui.buttons .button,
.ui.buttons .or {
  border-radius: 10px !important;
}

/* Input fields */
.ui.input > input,
.ui.form input[type="text"],
.ui.form input[type="password"],
.ui.form input[type="email"],
.ui.form input[type="search"],
.ui.form textarea,
.ui.form select,
.ui.selection.dropdown,
.ui.dropdown,
.CodeMirror,
.editor-wrapper,
textarea {
  border-radius: 10px !important;
}

/* Cards / segments / boxes */
.ui.segment,
.ui.card,
.ui.cards > .card,
.repository.file.content,
.issue-content,
.comment-code-cloud,
.ui.attached.segment,
.ui.top.attached,
.ui.bottom.attached {
  border-radius: 10px !important;
}

/* Labels and tags */
.ui.label,
.ui.labels .label,
.topic,
.tag {
  border-radius: 10px !important;
}

/* Modals */
.ui.modal,
.ui.modal > .header,
.ui.modal > .content,
.ui.modal > .actions {
  border-radius: 10px !important;
}

/* Menus / dropdowns */
.ui.menu,
.ui.dropdown .menu,
.ui.dropdown > .menu {
  border-radius: 10px !important;
}

/* Search bar */
.ui.search > .ui.input > input {
  border-radius: 10px !important;
}

/* Inline code and pre blocks */
pre,
code,
.highlight pre,
.code-view pre {
  border-radius: 10px !important;
}

/* Repo header / activity boxes */
.repository.header,
#repo-desc,
.milestone-list-item,
.issue-item,
.pull-request-item {
  border-radius: 10px !important;
}

/* Avatar images stay circular — intentionally excluded */

/* ── Accent / orange text → #f0f080 ────────────────────────────────────── */
/*
 * Forgejo uses the orange accent for things like "Open" issue badges,
 * active tab underlines, and primary call-to-action text links.
 * The --color-accent variable handles most cases; the rules below
 * catch hard-coded orange values in components.
 */

a.silenced,
.ui.orange.label,
.ui.orange.labels .label {
  background-color: #f0f080 !important;
  color: #1a1a00 !important;
}

/* Navbar active indicator */
.ui.menu .active.item,
.ui.menu .active.item:hover {
  border-color: #f0f080 !important;
}

/* ── Scrollbar styling ──────────────────────────────────────────────────── */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: var(--color-scrollbar-track);
}
::-webkit-scrollbar-thumb {
  background: var(--color-scrollbar-thumb);
  border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-scrollbar-thumb-hover);
}