/* Pyrito theme for Forgejo 15 (git.pyrito.com). Built on Forgejo's own dark theme; only overrides.
   Source: platform/forgejo/custom/public/assets/css/theme-pyrito.css, synced by platform/forgejo/apply-theme.sh.
   Tokens follow pyrito/brand tokens.css (.pyrito-dark): pure neutral greys, amber #F0B55A is the only warm colour. */
@import url("./theme-forgejo-dark.css");

@font-face { font-family: "Manrope"; src: url("../fonts/manrope-latin-wght-normal.woff2") format("woff2-variations"), url("../fonts/manrope-latin-wght-normal.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  /* Brand tokens */
  --pyrito-amber: #F0B55A;
  --pyrito-amber-hover: #F5C478;
  --pyrito-amber-deep: #D9952B;
  --pyrito-on-amber: #141414;
  --pyrito-bg: #0A0A0A;
  --pyrito-surface: #141414;
  --pyrito-raised: #1E1E1E;
  --pyrito-line: #2B2B2B;
  --pyrito-muted: #A3A3A3;
  --pyrito-fg: #F4F4F4;

  /* Fonts and corners */
  --fonts-proportional: "Manrope", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --fonts-monospace: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace, var(--fonts-emoji);
  --border-radius: 0;
  --border-radius-medium: 0;

  /* Forgejo-dark's blue "steel" scale, replaced with hue-free greys (anything not overridden below stays neutral) */
  --steel-900: #050505;
  --steel-850: #0A0A0A;
  --steel-800: #0F0F0F;
  --steel-750: #141414;
  --steel-700: #1E1E1E;
  --steel-650: #2B2B2B;
  --steel-600: #333333;
  --steel-550: #3D3D3D;
  --steel-500: #4A4A4A;
  --steel-450: #5C5C5C;
  --steel-400: #6E6E6E;
  --steel-350: #808080;
  --steel-300: #8F8F8F;
  --steel-250: #A3A3A3;
  --steel-200: #BDBDBD;
  --steel-150: #D4D4D4;
  --steel-100: #F4F4F4;

  /* Amber as the primary colour. In a dark theme "dark-N" are lighter, "light-N" deeper. */
  --color-primary: #F0B55A;
  --color-primary-contrast: #141414;
  --color-primary-dark-1: #F5C478;
  --color-primary-dark-2: #F7CF8F;
  --color-primary-dark-3: #F9DAA6;
  --color-primary-dark-4: #FAE3BC;
  --color-primary-dark-5: #FCEDD3;
  --color-primary-dark-6: #FDF4E5;
  --color-primary-dark-7: #FEFAF2;
  --color-primary-light-1: #E8A64A;
  --color-primary-light-2: #D9952B;
  --color-primary-light-3: #B87A1F;
  --color-primary-light-4: #F5C478;
  --color-primary-light-5: #D9952B;
  --color-primary-light-6: #704A12;
  --color-primary-light-7: #4D330C;
  --color-primary-alpha-10: #F0B55A19;
  --color-primary-alpha-20: #F0B55A33;
  --color-primary-alpha-30: #F0B55A4B;
  --color-primary-alpha-40: #F0B55A66;
  --color-primary-alpha-50: #F0B55A80;
  --color-primary-alpha-60: #F0B55A99;
  --color-primary-alpha-70: #F0B55AB3;
  --color-primary-alpha-80: #F0B55ACC;
  --color-primary-alpha-90: #F0B55AE1;
  --color-primary-hover: #F5C478;
  --color-primary-active: #D9952B;
  --color-accent: #F0B55A;
  --color-small-accent: #D9952B;
  --color-highlight-fg: #F5C478;
  --color-highlight-bg: #F0B55A26;
  --color-caret: #F0B55A;

  /* Lines (Forgejo draws most borders with --color-secondary) */
  --color-secondary: #2B2B2B;
  --color-secondary-light-1: #252525;
  --color-secondary-light-2: #1E1E1E;
  --color-secondary-light-3: #141414;
  --color-secondary-light-4: #0F0F0F;
  --color-secondary-alpha-10: #2B2B2B19;
  --color-secondary-alpha-20: #2B2B2B33;
  --color-secondary-alpha-30: #2B2B2B4B;
  --color-secondary-alpha-40: #2B2B2B66;
  --color-secondary-alpha-50: #2B2B2B80;
  --color-secondary-alpha-60: #2B2B2B99;
  --color-secondary-alpha-70: #2B2B2BB3;
  --color-secondary-alpha-80: #2B2B2BCC;
  --color-secondary-alpha-90: #2B2B2BE1;
  --color-light-border: #FFFFFF1A;

  /* Surfaces */
  --color-body: #0A0A0A;
  --color-footer: #0A0A0A;
  --color-nav-bg: #0A0A0A;
  --color-nav-hover-bg: #1E1E1E;
  --color-secondary-nav-bg: #0A0A0A;
  --color-header-wrapper: #0A0A0A;
  --color-header-wrapper-transparent: #0A0A0A00;
  --color-box-header: #1E1E1E;
  --color-box-body: #141414;
  --color-box-body-highlight: #1E1E1E;
  --color-card: #141414;
  --fancy-card-bg: #141414;
  --color-menu: #141414;
  --color-hover: #1E1E1E;
  --color-active: #2B2B2B;
  --color-button: #1E1E1E;
  --color-secondary-bg: #1E1E1E;
  --color-timeline: #2B2B2B;
  --color-diff-inactive: #1E1E1E;
  --color-project-board-bg: #141414;
  --color-editor-line-highlight: #1E1E1E;
  --color-expand-button: #2B2B2B;
  --color-code-bg: #0F0F0F;
  --color-markup-code-block: #0F0F0F;
  --color-markup-code-inline: #1E1E1E;
  --color-markup-table-row: #FFFFFF06;
  --color-label-bg: #2B2B2B;
  --color-label-hover-bg: #333333;
  --color-label-active-bg: #3D3D3D;
  --color-label-bg-alt: #3D3D3D;
  --color-reaction-bg: #FFFFFF0D;
  --color-overlay-backdrop: #050505C8;
  --color-tooltip-bg: #1E1E1EF5;
  --color-tooltip-text: #F4F4F4;
  --color-shadow: #00000080;
  --color-black: #0A0A0A;
  --color-black-light: #1E1E1E;
  --color-black-dark-1: #050505;
  --color-black-dark-2: #0A0A0A;
  --color-grey: #4A4A4A;
  --color-grey-light: #8F8F8F;
  --checkerboard-color-1: #2B2B2B;
  --checkerboard-color-2: #1E1E1E;

  /* Text */
  --color-text-dark: #FFFFFF;
  --color-text: #F4F4F4;
  --color-text-light: #D4D4D4;
  --color-text-light-1: #BDBDBD;
  --color-text-light-2: #A3A3A3;
  --color-text-light-3: #A3A3A3;
  --color-text-focus: #FFFFFF;
  --color-placeholder-text: #808080;
  --color-selection-bg: #F0B55A;
  --color-selection-fg: #141414;
  --color-label-text: #F4F4F4;
  --color-project-board-dark-label: #A3A3A3;

  /* Inputs: page-black field, 1px line, amber on focus */
  --color-input-text: #F4F4F4;
  --color-input-background: #0A0A0A;
  --color-input-toggle-background: #2B2B2B;
  --color-input-border: #2B2B2B;
  --color-input-border-hover: #5C5C5C;

  /* Console / Actions logs */
  --color-console-fg: #F4F4F4;
  --color-console-fg-subtle: #A3A3A3;
  --color-console-bg: #0F0F0F;
  --color-console-border: #2B2B2B;
  --color-console-hover-bg: #FFFFFF10;
  --color-console-active-bg: #2B2B2B;
  --color-console-menu-bg: #1E1E1E;
  --color-console-menu-border: #3D3D3D;
  --color-ansi-black: #1E1E1E;
  --color-ansi-bright-black: #4A4A4A;

  /* Info message was navy; keep it a cool status colour but drop the steel tint from its text */
  --color-info-text: #DCE6FB;

  accent-color: #F0B55A;
}

/* Type */
body, .ui.header, h1, h2, h3, h4, h5, h6 { font-feature-settings: normal; }
.ui.header, h1, h2, h3, h4, h5, h6, .repo-header .repo-title, .page-content .ui.top.attached.header { font-weight: 600; letter-spacing: -0.01em; }

/* Square corners (Fomantic hard-codes .28571429rem on most components) */
.ui.button, .ui.buttons .button, .ui.buttons, .ui.basic.buttons, .ui.segment, .ui.segments, .ui.attached.segment,
.ui.top.attached.header, .ui.attached.header, .ui.bottom.attached.segment, .ui.form input:not([type="checkbox"]):not([type="radio"]),
.ui.form textarea, .ui.form select, .ui.input > input, .ui.action.input > .button, .ui.dropdown, .ui.selection.dropdown,
.ui.dropdown .menu, .ui.menu, .ui.vertical.menu, .ui.secondary.vertical.menu, .ui.label, .ui.labels .label, .ui.card, .ui.cards > .card,
.ui.modal, .ui.modal > :first-child:not(.icon):not(.dimmer), .ui.modal > :last-child, .ui.message, .ui.table, .ui.form .field .dropdown,
.tippy-box, .menu-list, .flash-message, .repository .ui.tabs.container, .project-column, .issue-card, .ui.attached.table, textarea, select,
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="url"], input[type="number"] {
  border-radius: 0 !important;
}

/* Buttons: amber fill, #141414 text. Secondary buttons are raised greys with a 1px line. */
.ui.primary.button, .ui.primary.buttons .button {
  background: var(--pyrito-amber) !important;
  color: var(--pyrito-on-amber) !important;
  font-weight: 650;
}
.ui.primary.button:hover, .ui.primary.buttons .button:hover, .ui.primary.button:focus {
  background: var(--pyrito-amber-hover) !important;
  color: var(--pyrito-on-amber) !important;
}
.ui.basic.primary.button, .ui.basic.primary.buttons .button {
  background: transparent !important;
  color: var(--pyrito-amber) !important;
  border-color: var(--pyrito-amber) !important;
}
.ui.button:not(.primary):not(.red):not(.green):not(.basic) { border: 1px solid var(--pyrito-line); }

/* Focus rings */
:focus-visible { outline: 2px solid var(--pyrito-amber) !important; outline-offset: 2px; }
.ui.form input:focus, .ui.form textarea:focus, .ui.input > input:focus, .ui.selection.dropdown:focus, .ui.selection.active.dropdown,
input:focus, textarea:focus {
  border-color: var(--pyrito-amber) !important;
  box-shadow: 0 0 0 3px rgba(240, 181, 90, 0.18) !important;
  outline: none !important;
}

/* Amber labels and counters get dark text */
.ui.primary.label, .ui.primary.labels .label, .ui.red.label.notification_count, .notification_count {
  background-color: var(--pyrito-amber) !important;
  color: var(--pyrito-on-amber) !important;
}

/* Top bar: page black with a 1px line, like the task board */
#navbar { background: var(--pyrito-bg); border-bottom: 1px solid var(--pyrito-line); }
#navbar .item { color: var(--pyrito-muted); }
#navbar .item:hover, #navbar .item.active { color: var(--pyrito-fg); }
#navbar-logo img { width: 26px; height: 28px; }

/* Active tab: amber underline */
.ui.secondary.pointing.menu .active.item, .ui.secondary.pointing.menu .active.item:hover,
.ui.secondary.pointing.menu .dropdown.item.active, .overflow-menu .overflow-menu-items .item.active {
  border-color: var(--pyrito-amber) !important;
  color: var(--pyrito-fg) !important;
}
.ui.tabular.menu .active.item { border-top: 2px solid var(--pyrito-amber) !important; }
.ui.vertical.menu .active.item, .ui.secondary.vertical.menu .active.item { box-shadow: inset 2px 0 0 var(--pyrito-amber); }

/* Footer */
.page-footer { border-top: 1px solid var(--pyrito-line); color: var(--pyrito-muted); }

/* Sign-in, sign-up and other user/auth pages: card on page black with a faint amber glow, as in the brand sample */
.page-content.user.signin, .page-content.user.link-account, .page-content.user.signup, .page-content.user.forgot.password,
.page-content.user.activate, .page-content.user.reset.password {
  background-image: radial-gradient(60% 50% at 80% 0%, rgba(240, 181, 90, 0.10), transparent 70%);
  background-repeat: no-repeat;
}
.page-content.user.signin .ui.attached.header, .page-content.user.signin .ui.top.attached.header {
  background: var(--pyrito-surface);
  font-size: 1.15em;
  letter-spacing: -0.02em;
}
.page-content.user.signin .ui.attached.segment { background: var(--pyrito-surface); }
.page-content.user.signin label { color: var(--pyrito-muted); font-weight: 500; }
.oauth-login-link.ui.button { background: var(--pyrito-raised); border: 1px solid var(--pyrito-line); color: var(--pyrito-fg); font-weight: 600; }
.oauth-login-link.ui.button:hover { border-color: var(--pyrito-muted); background: var(--pyrito-raised); }

/* Landing page */
.page-content.home .hero h1, .page-content.home .hero h2 { letter-spacing: -0.03em; }
.page-content.home .hero svg.logo, .page-content.home .hero img.logo { width: 120px; height: auto; }

/* Labels in mono, as in the brand (IDs, SHAs, small uppercase captions) */
.sha.label, .ui.label.sha, code, kbd, pre, .commit-id { font-family: var(--fonts-monospace); }

/* Custom landing page (custom/templates/home.tmpl) */
.pyrito-home {
  display: grid; place-items: center; min-height: 62vh; padding: 48px 16px;
  background-image: radial-gradient(60% 50% at 80% 0%, rgba(240, 181, 90, 0.10), transparent 70%);
  background-repeat: no-repeat;
}
.pyrito-home-card {
  width: 100%; max-width: 420px; background: var(--pyrito-surface); border: 1px solid var(--pyrito-line);
  padding: 32px; display: grid; gap: 14px; justify-items: start;
}
.pyrito-home-mark { width: 40px; height: 44px; }
.pyrito-home-card h1 { margin: 6px 0 0; font-size: 26px; font-weight: 650; letter-spacing: -0.04em; color: var(--pyrito-fg); }
.pyrito-home-card p { margin: 0; color: var(--pyrito-muted); font-size: 15px; line-height: 1.5; }
.pyrito-home-card .ui.primary.button { margin-top: 6px; padding: 11px 18px; }
