/*
 * NWMT — minimal Forgejo theme
 * Brand palette: #ececec (light), #151515 (dark), #35B1FF (accent)
 * Designed to feel restrained, monochromatic, with one accent.
 */

:root {
  /* ---- Brand accent ===== #2AADFF ===== */
  --color-primary: #2AADFF;
  --color-primary-light-1: #54bdff;
  --color-primary-light-2: #7dcdff;
  --color-primary-light-3: #a6ddff;
  --color-primary-light-4: #d0eeff;
  --color-primary-light-5: #f3faff;
  --color-primary-light-6: #f9fdff;
  --color-primary-light-7: #ffffff;
  --color-primary-dark-1: #1a9fee;
  --color-primary-dark-2: #0d8cd6;
  --color-primary-dark-3: #0577b8;
  --color-primary-dark-4: #026299;
  --color-primary-dark-5: #014d7a;
  --color-primary-dark-6: #01385b;
  --color-primary-dark-7: #00233c;

  /* ---- Neutral ===== #151515 → #ececec ===== */
  --color-secondary: #5a5a5a;
  --color-secondary-light-1: #6e6e6e;
  --color-secondary-light-2: #828282;
  --color-secondary-light-3: #969696;
  --color-secondary-light-4: #aaaaaa;
  --color-secondary-light-5: #bdbdbd;
  --color-secondary-light-6: #d1d1d1;
  --color-secondary-light-7: #e5e5e5;
  --color-secondary-dark-1: #4a4a4a;
  --color-secondary-dark-2: #3a3a3a;
  --color-secondary-dark-3: #2a2a2a;
  --color-secondary-dark-4: #2a2a2a;
  --color-secondary-dark-5: #1f1f1f;
  --color-secondary-dark-6: #181818;
  --color-secondary-dark-7: #151515;

  /* ---- Page ===== brand blacks ===== */
  --color-body: #151515;
  --color-text: #ececec;
  --color-text-light: #d0d0d0;
  --color-text-dark: #ffffff;
  --color-text-secondary: #9a9a9a;
  --color-text-weakt-link: #35B1FF;

  /* ---- Surfaces ===== shade tiers, no borders ===== */
  /* body #151515 → box-body #1a1a1a → box-header #1d1d1d → highlight #242424 */
  --color-box-header: #1d1d1d;
  --color-box-body: #1a1a1a;
  --color-box-body-secondary: #181818;
  --color-box-body-highlight: #242424;
  --color-box-bg: #1a1a1a;
  --color-box-title: #ececec;

  /* ---- Navigation ===== monochrome ===== */
  --color-nav: #181818;
  --color-nav-text: #ececec;
  --color-nav-hover: #202020;
  --color-nav-active: #1d1d1d;
  --color-nav-border: #1a1a1a;

  /* ---- Links ===== accent reserved for action only ===== */
  --color-link: #35B1FF;
  --color-link-hover: #5cc1ff;
  --color-link-active: #1a9fee;

  /* ---- Borders ===== effectively invisible ===== */
  /* Kept as variables so anything that still draws a border uses a
     tone that's invisible against the surface it sits on. */
  --color-border: #1a1a1a;
  --color-border-light: #181818;
  --color-border-dark: #1a1a1a;
  --color-line: #1a1a1a;

  /* ---- Inputs ===== flat, single shade ===== */
  --color-input-text: #ececec;
  --color-input-background: #1d1d1d;
  --color-input-background-disabled: #181818;
  --color-input-border: #1d1d1d;
  --color-input-border-hover: #35B1FF;
  --color-input-focus: #35B1FF;

  /* ---- Misc ===== */
  --color-light: #ececec;
  --color-light-misc: #1a1a1a;
  --color-light-border: #1a1a1a;
  --color-hover: #202020;
  --color-mark: #35B1FF;
  --color-code: #ececec;
  --color-code-bg: #151515;
  --color-code-inline-bg: #1f1f1f;
  --color-caret: #35B1FF;

  /* ---- Buttons ===== */
  --color-button: #1d1d1d;
  --color-button-text: #ececec;
  --color-button-hover: #242424;
  --color-button-border: #1d1d1d;
  --color-button-primary: #35B1FF;
  --color-button-primary-text: #ececec;
  --color-button-primary-hover: #5cc1ff;

  /* ---- Semantic ===== */
  --color-red: #e64444;
  --color-orange: #e08821;
  --color-yellow: #d4ac22;
  --color-green: #3fcb6e;
  --color-gold: #cc9333;
  --color-grey: #828282;
  --color-white: #ececec;
  --color-black: #151515;

  /* ---- Diff ===== */
  --color-diff-added: #143424;
  --color-diff-added-bg: #1a3a26;
  --color-diff-added-border: #2a5a3c;
  --color-diff-removed: #3a1414;
  --color-diff-removed-bg: #421919;
  --color-diff-removed-border: #5a2a2a;
  --color-diff-changed: #2a2a05;
  --color-diff-changed-bg: #2f2f08;
  --color-diff-changed-border: #4a4a0a;
  --color-diff-renamed: #14324a;
  --color-diff-renamed-bg: #163848;
  --color-diff-renamed-border: #1a4a5a;
}

/* ============================================================
   Minimal look — soften vendor chrome, kill decoration
   ============================================================ */

/* Tighter rounding — but only on elements that have a visible border.
   Wildcard `*` forces rounding on inline elements (links inside spans,
   icons inside buttons) which can blow up the clickable box. */
.ui.button,
.ui.button:hover,
.ui.button:focus,
.ui.basic.buttons .button,
.ui.basic.button,
.ui.label,
.ui.card,
.ui.segment,
.ui.message,
.ui.input > input,
.ui.form input,
.ui.form textarea,
.ui.form select,
.ui.dropdown,
.ui.selection.dropdown,
.ui.menu,
.ui.menu .item,
.ui.attached.segment,
img.avatar,
.ui.avatar.image {
  border-radius: 4px !important;
}

.ui.button,
.ui.button:hover,
.ui.button:focus,
.ui.basic.buttons .button,
.ui.basic.button {
  box-shadow: none !important;
  text-shadow: none !important;
  /* Keep background-image — Fomantic uses a gradient layer that
     fills the button's hit area. Removing it shrinks the visual
     box relative to the clickable box. */
}

/* Dropdown menu popup — must have an explicit, opaque background.
   Default Fomantic inherits the parent which can be transparent. */
.ui.dropdown .menu,
.ui.upward.dropdown .menu,
.ui.dropdown .menu .item,
.ui.selection.dropdown .menu .item {
  background: var(--color-box-body) !important;
  border: none !important;
  color: var(--color-text) !important;
}

.ui.dropdown .menu .item:hover,
.ui.dropdown .menu .item.selected,
.ui.selection.dropdown .menu .item:hover {
  background: var(--color-hover) !important;
  color: var(--color-text) !important;
}

.ui.dropdown .menu .message {
  color: var(--color-text-secondary) !important;
}

.ui.inverted.menu,
.ui.inverted.segment,
.ui.inverted.header,
.ui.basic.inverted.label,
.ui.basic.inverted.buttons .button {
  background: var(--color-box-body) !important;
  border: none !important;
}

img,
.avatar,
.ui.avatar.image,
.ui.mini.image,
.ui.tiny.image {
  filter: grayscale(0.4);
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI",
               Roboto, Helvetica, Arial, sans-serif;
  letter-spacing: 0.01em;
  font-weight: 400;
}

/* Accent should be a signal, not a constant — use only where it matters */
a,
.ui.link.list .item a,
.ui.breadcrumb a,
.repo-path .section,
.ui.menu .item.active > .label,
.ui.primary.label,
.ui.primary.button,
.ui.primary.buttons .button {
  color: var(--color-link);
}

.ui.primary.button,
.ui.primary.buttons .button {
  background: rgba(42, 173, 255, 0.1) !important;
  color: var(--color-primary) !important;
  border: none !important;
  font-weight: 500;
}

.ui.primary.button:hover,
.ui.primary.button:focus,
.ui.primary.buttons .button:hover,
.ui.primary.buttons .button:focus {
  background: rgba(42, 173, 255, 0.18) !important;
  color: var(--color-primary) !important;
}

/* Inputs: flat, no border. Use shade for separation. */
.ui.input > input,
.ui.form input,
.ui.form textarea,
.ui.form select,
.ui.dropdown,
.ui.selection.dropdown {
  border: none !important;
  background: var(--color-input-background) !important;
  box-shadow: none !important;
}

.ui.input > input:focus,
.ui.form input:focus,
.ui.form textarea:focus,
.ui.form select:focus,
.ui.dropdown:focus,
.ui.selection.dropdown:focus {
  background: var(--color-input-background) !important;
  box-shadow: inset 0 0 0 1px var(--color-primary) !important;
}

/* Headers: scale down weight, lift weight via tracking not decoration */
h1, h2, h3, h4, h5, h6,
.ui.header {
  font-weight: 500;
  letter-spacing: -0.01em;
}

.ui.header .sub.header {
  color: var(--color-text-secondary);
  font-weight: 400;
}

/* Cards, segments, messages: pure shade, no border. */
.ui.card,
.ui.segment,
.ui.basic.segment,
.ui.attached.segment,
.message,
.ui.basic.buttons .button,
.ui.basic.button {
  border: none !important;
  box-shadow: none !important;
  background: var(--color-box-body) !important;
}

/* Tables: shade-only row separation. */
.ui.table {
  background: transparent;
  border: none !important;
}

.ui.table thead th {
  background: var(--color-box-header);
  border: none !important;
  color: var(--color-text-secondary);
  font-weight: 500;
  text-transform: uppercase;
  font-size: 0.78em;
  letter-spacing: 0.06em;
}

.ui.table tbody tr {
  background: transparent;
}

.ui.table tbody tr:nth-child(even) {
  background: var(--color-box-body) !important;
}

.ui.table tbody tr:hover {
  background: var(--color-hover) !important;
}

/* Scrollbars */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: #2a2a2a;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover { background: var(--color-secondary-light-2); }

/* Selection */
::selection {
  background: var(--color-primary);
  color: var(--color-light);
}

/* Code blocks: shade only, no border */
.ui.code,
pre, code, .code-block {
  background: var(--color-code-inline-bg) !important;
  border: none !important;
}

/* Nav: pure shade, no line */
.ui.top.menu,
.ui.fixed.menu,
.ui.attached.menu {
  border: none !important;
  background: var(--color-nav) !important;
}

.ui.menu .item {
  font-weight: 400;
  border: none !important;
}

.ui.menu .item.active,
.ui.menu .item:hover {
  background: var(--color-nav-hover) !important;
  color: var(--color-text) !important;
}

/* Footer: muted */
.ui.footer {
  background: transparent;
  border: none !important;
  color: var(--color-text-secondary);
}