/*
 * Tiberius theme for Forgejo ("aerospace-light").
 *
 * Light theme matching the tiberius.com marketing identity: near-black
 * navy navbar (#0c111d, also makes the white wordmark logo visible),
 * the site's blue as primary, cool-gray surfaces, GitHub's font stacks.
 *
 * Shipped via the forgejo-theme ConfigMap, mounted at
 * /data/gitea/public/assets/css/theme-tiberius.css and registered through
 * [ui].THEMES / DEFAULT_THEME in the HelmRelease values. CSS changes need
 * a pod restart (subPath ConfigMap mounts don't hot-reload).
 *
 * Builds on the stock light theme via @import: anything not overridden
 * here keeps its upstream value, which keeps this file small and
 * upgrade-safe. Selectors were verified against the deployed instance's
 * index.css — prefer overriding CSS variables over deep selectors.
 *
 * Local iteration: scripts/forgejo-theme-preview.sh copies a DevTools
 * console snippet of this file to the clipboard.
 */
@import url("theme-forgejo-light.css");

:root {
  /* ── Primary: marketing-site blue (#0082f3 family, darkened for
        contrast on white) with generated shade/alpha ramp ──────────── */
  --color-primary: #0a6fd6;
  --color-primary-contrast: #ffffff;
  --color-primary-light-1: #2680db;
  --color-primary-light-2: #4290df;
  --color-primary-light-3: #5fa1e4;
  --color-primary-light-4: #7bb1e9;
  --color-primary-light-5: #97c2ee;
  --color-primary-light-6: #b3d2f2;
  --color-primary-light-7: #cfe3f7;
  --color-primary-dark-1: #0964c1;
  --color-primary-dark-2: #0859ab;
  --color-primary-dark-3: #074e96;
  --color-primary-dark-4: #064380;
  --color-primary-dark-5: #05386b;
  --color-primary-dark-6: #042c56;
  --color-primary-dark-7: #032140;
  --color-primary-alpha-10: #0a6fd619;
  --color-primary-alpha-20: #0a6fd633;
  --color-primary-alpha-30: #0a6fd64b;
  --color-primary-alpha-40: #0a6fd666;
  --color-primary-alpha-50: #0a6fd680;
  --color-primary-alpha-60: #0a6fd699;
  --color-primary-alpha-70: #0a6fd6b3;
  --color-primary-alpha-80: #0a6fd6cc;
  --color-primary-alpha-90: #0a6fd6e1;

  /* ── GitHub's font stacks: native UI font + native monospace ─────── */
  --fonts-proportional: -apple-system, BlinkMacSystemFont, "Segoe UI",
    "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji";
  --fonts-monospace: ui-monospace, SFMono-Regular, "SF Mono", Menlo,
    Consolas, "Liberation Mono", monospace;

  /* ── Surfaces: white page like GitHub; boxes separate via their
        borders + muted headers rather than a tinted canvas. ──────────── */
  --color-body: #ffffff;
  --color-box-body: #ffffff;
  --color-box-header: #f8fafc;
  --color-card: #ffffff;
  --color-menu: #ffffff;
  --color-secondary: #dde3ec;
  --color-secondary-bg: #eef2f6;
  --color-timeline: #dde3ec;

  /* ── Dark navbar (marketing-site near-black) ─────────────────────── */
  --color-nav-bg: #0c111d;
  --color-nav-hover-bg: rgba(8, 196, 246, 0.12);

  /* ── Slightly larger rounding than stock (4px) ───────────────────── */
  --border-radius: 6px;
  --border-radius-medium: 8px;
  --border-radius-large: 12px;
}

/* ── Top navigation: light text on the near-black bar ─────────────── */
#navbar {
  background: #0c111d;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* Top-level items only — dropdown popups keep their light styling.
   (This Forgejo build has no --color-nav-text variable.) */
#navbar .navbar-left > .item,
#navbar .navbar-right > .item,
#navbar details.dropdown > summary {
  color: #98a2b3;
}

#navbar .navbar-left > a.item:hover,
#navbar .navbar-left > a.item:focus,
#navbar .navbar-right > a.item:hover,
#navbar .navbar-right > a.item:focus,
#navbar details.dropdown > summary:is(:hover, :focus) {
  color: #ffffff;
}

/* Active nav item: fomantic's --color-active is a light gray that washes
   out on the dark navbar, so give it a translucent white instead. */
#navbar .navbar-left > .active.item,
#navbar .navbar-right > .active.item {
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
}

/* ── Depth: subtle layered shadows on cards and boxes ─────────────── */
.ui.segment,
.ui.segments,
.ui.attached.segment,
.ui.card {
  box-shadow:
    0 1px 2px rgba(12, 17, 29, 0.05),
    0 2px 8px rgba(12, 17, 29, 0.04);
}

/* ── Motion: gentle transitions on interactive elements ───────────── */
a,
.ui.button,
.ui.menu .item {
  transition:
    color 0.12s ease,
    background-color 0.12s ease,
    border-color 0.12s ease,
    box-shadow 0.12s ease;
}

.ui.primary.button:not(.disabled):hover {
  box-shadow: 0 2px 10px var(--color-primary-alpha-40);
}

/* ── Button geometry: GitHub Primer medium (32px tall, 6px radius) ─── */
/* Stock .ui.button is padding:.785em 1.5em (11px/21px at the 14px root) +
   1px border + border-box → ~38px tall and wide. GitHub's medium button is
   32px tall with tighter side padding. 8px top/bottom gives 14+8+8+2 = 32px;
   16px sides sits just inside Primer's 12px without feeling cramped. Equal
   specificity (0,2,0) but loaded after index.css, so it wins. Compact, icon,
   and labeled buttons keep their own higher-specificity padding.

   Semantic UI also hardcodes border-radius:.28571429rem (4px) and ignores
   --border-radius; GitHub uses 6px. Pin standalone buttons here, and the
   outer corners of split/grouped buttons below (their :first/:last-child
   rules carry 4px at (0,3,0), so they need a matching-specificity override). */
.ui.button {
  padding: 8px 16px;
  border-radius: var(--border-radius);
}

.ui.buttons .button:first-child {
  border-top-left-radius: var(--border-radius);
  border-bottom-left-radius: var(--border-radius);
}

.ui.buttons .button:last-child {
  border-top-right-radius: var(--border-radius);
  border-bottom-right-radius: var(--border-radius);
}

/* ── Pill-shaped counters and labels (GitHub-style) ───────────────── */
.ui.label:not(.attached) {
  border-radius: var(--border-radius-full);
}

/* Markdown task-list checkboxes are 14px and inherit the global radius,
   which turns them into circles — pin them to a GitHub-like 3px. */
.markup input[type="checkbox"] {
  border-radius: 3px;
}

/* ── Issue/PR list: GitHub-like 12px meta line ────────────────────── */
/* The secondary line under each list title ("#42 opened … by …", branch
   pills, file counts) is .flex-item-body, which sets no font-size and so
   inherits the 14px base. GitHub renders it at 12px. Match the full class
   chain (0,2,0) the bundle uses — the theme loads after index.css, so an
   equal-specificity rule wins. */
.flex-item .flex-item-body {
  font-size: 12px;
}

/* ── Issue/PR sidebar: GitHub-like compact typography ─────────────── */
/* Shrink the whole sidebar to 12px; GitHub's sidebar body and labels are
   both 12px. Must match the full class chain (.issue-content-right is also
   .ui.segment, which sets font-size:1rem at higher specificity than a
   single class — otherwise the segment rule wins and stays 14px). */
.issue-content-right.ui.segment {
  font-size: 12px;
}

/* Every sidebar section header is a .text element with a direct-child
   <strong> (Reviewers, Assignees, Labels, …). Stock renders them in full
   bold; GitHub uses a semibold, muted label. */
.issue-content-right .text > strong {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-light-1);
}

/* The per-section edit gears are always visible and add clutter; dim
   them and bring them up to full strength only on header hover. */
.issue-content-right .text .octicon-gear {
  color: var(--color-text-light-3);
  transition: color 0.12s ease;
}

.issue-content-right .text:hover .octicon-gear {
  color: var(--color-text-light-1);
}

/* Airier section rhythm with a thin separator, closer to GitHub. Stock
   sidebar dividers are bare 10px gaps with no rule. */
.issue-content-right .divider {
  margin: 16px 0;
  border-top: 1px solid var(--color-secondary);
}

/* ── Comment body padding: 16px to match GitHub (stock is 1em/14px) ─ */
/* Must outrank .ui.segment (0,2,0), which sets padding:1em — a bare
   .comment-body (0,1,0) loses and stays 14px. */
.comment-body.ui.segment {
  padding: 16px;
}

/* ── Commit-subject links in the issue/PR timeline ───────────────── */
/* GitHub renders these as muted gray, underlined (Link--secondary). Two
   wrappers carry them: the commit lists use a.default-link.muted, and the
   "referenced from a commit" events use a bare <a> inside .muted-links.
   Both otherwise resolve to primary blue (default-link out-ranks .muted;
   muted-links links go blue on hover). Target commit links by href so
   usernames and other muted links keep their styling, and pin a muted,
   underlined treatment that never turns blue — including on hover. */
.singular-commit a.default-link.muted,
.commit-list a.default-link.muted,
.muted-links a[href*="/commit/"] {
  color: var(--color-text-light);
  text-decoration: underline;
  text-decoration-color: var(--color-text-light-3);
}

.singular-commit a.default-link.muted:hover,
.commit-list a.default-link.muted:hover,
.muted-links a[href*="/commit/"]:hover {
  color: var(--color-text);
  text-decoration-color: var(--color-text-light-1);
}

/* ── Dashboard activity feed: GitHub-like declutter ───────────────── */
/* The home dashboard feed (#activity-feed) piles on three kinds of noise:
   hard full-width rules between every row, oversized 32px trailing git
   icons, and chunky signed-SHA pills with a "no signature" padlock on each
   commit. Calm all three. Scoped to #activity-feed so issue/PR lists, which
   reuse .flex-item, keep their dividers and layout. */

/* Soften the ledger lines between rows (keep separation, drop the weight). */
#activity-feed .flex-item + .flex-item {
  border-top-color: color-mix(in srgb, var(--color-secondary) 55%, transparent);
}

/* Trailing event-type glyph: 32px → GitHub's ~16px, and muted. */
#activity-feed .flex-item-trailing svg {
  width: 16px;
  height: 16px;
  color: var(--color-text-light-3);
}

/* Commit-SHA pills: smaller, and hide the per-row padlock GitHub never
   shows in a feed (only the signed pills carry a .signature segment). */
#activity-feed .sha.label {
  height: 20px;
  font-size: 12px;
}
#activity-feed .sha.label .shortsha {
  padding: 2px 6px;
}
#activity-feed .sha.label .signature {
  display: none;
}

/* Round the contribution-heatmap cells (2px), matching GitHub. The blue
   ramp is applied inline by the JS component, so this only softens corners. */
#user-heatmap .vch__day__square {
  rx: 2px;
  ry: 2px;
}

/* Side repo panel (#dashboard-repo-list) is a Vue island whose row styles
   live in scoped [data-v-*] CSS we can't edit. Soften its per-row dividers
   to match the calmed feed; the #id selector outranks the scoped rule (id
   beats attribute specificity) so we don't need the build hash, and a bare
   border-color override is a no-op if no divider is set. */
#dashboard-repo-list .repo-owner-name-list li {
  border-color: color-mix(in srgb, var(--color-secondary) 55%, transparent);
}

/* ── Brand-colored text selection ─────────────────────────────────── */
::selection {
  background: #b3dcff;
}
