/* ============================================================
   theme-softcreator.css
   Drop-in Gitea theme for git.softcreator.com
   Targets Gitea 1.21+ CSS custom-property system.
   Place in: custom/public/assets/css/theme-softcreator.css
   Then in app.ini:
       [ui]
       THEMES = gitea-light,gitea-dark,softcreator
       DEFAULT_THEME = softcreator
   ============================================================ */

/* ----------- Brand palette ----------------------------------- */
:root,
.theme-softcreator {
	/* SoftCreator brand */
	--sc-green:         #6fd42f;
	--sc-green-deep:    #5cb828;
	--sc-green-darker:  #3f8c1c;
	--sc-green-dark: #2e7700;
	--sc-mint:          #bcffb4;
	--sc-mint-soft:     #e1ffdc;
	--sc-mid:           #79c480;
	--sc-ink:           #221f1f;
	--sc-ink-soft:      #3a3636;
	--sc-blue:      #1443ff;
	--sc-dark-blue: #00197d;
	--sc-red-bg:    #ffc3c3;

	/* Gitea primary color overrides (semantic) */
	--color-primary:                   var(--sc-green);
	--color-primary-contrast:          var(--sc-ink);
	--color-primary-dark-1:            var(--sc-green-deep);
	--color-primary-dark-2:            var(--sc-green-darker);
	--color-primary-dark-3:            #2f6a14;
	--color-primary-dark-4:            #234f0e;
	--color-primary-dark-5:            #1a3b0a;
	--color-primary-dark-6:            #0d1d05;
	--color-primary-dark-7:            #060f02;
	--color-primary-light-1:           #82dc4a;
	--color-primary-light-2:           #95e466;
	--color-primary-light-3:           #aaec82;
	--color-primary-light-4:           var(--sc-mint);
	--color-primary-light-5:           #d0f7c8;
	--color-primary-light-6:           var(--sc-mint-soft);
	--color-primary-light-7:           #f1fded;
	--color-primary-alpha-10:          rgba(111,212,47,.10);
	--color-primary-alpha-20:          rgba(111,212,47,.20);
	--color-primary-alpha-30:          rgba(111,212,47,.30);
	--color-primary-alpha-40:          rgba(111,212,47,.40);
	--color-primary-alpha-50:          rgba(111,212,47,.50);
	--color-primary-alpha-60:          rgba(111,212,47,.60);
	--color-primary-alpha-70:          rgba(111,212,47,.70);
	--color-primary-alpha-80:          rgba(111,212,47,.80);
	--color-primary-alpha-90:          rgba(111,212,47,.90);

	/* Surface */
	--color-body:                      #fafdf9;
	--color-box-header:                #f4f8f2;
	--color-box-body:                  #ffffff;
	--color-box-body-highlight:        var(--sc-mint-soft);
	--color-text:                      var(--sc-ink);
	--color-text-light:                #4a4f4b;
	--color-text-light-1:              #5a615c;
	--color-text-light-2:              #6e756f;
	--color-text-light-3:              #898f8a;
	--color-secondary:                 #d8e3da;
	--color-secondary-dark-1:          #c5d2c8;
	--color-secondary-dark-2:          #b2c0b5;
	--color-secondary-light-3:         #e4ece6;
	--color-secondary-light-4:         #eef2ef;
	--color-light:                     rgba(111,212,47,.08);
	--color-light-mimic-enabled:       rgba(111,212,47,.10);
	--color-light-border:              #d8e3da;
	--color-hover:                     rgba(111,212,47,.10);
	--color-active:                    rgba(111,212,47,.18);
	--color-menu:                      #ffffff;
	--color-card:                      #ffffff;
	--color-markup-table-row:          rgba(111,212,47,.05);
	--color-markup-code-block:         var(--sc-mint-soft);
	--color-button:                    #ffffff;
	--color-code-bg:                   var(--sc-mint-soft);
	--color-code-sidebar-bg:           #f4f8f2;
	--color-shadow:                    rgba(34,31,31,.06);
	--color-secondary-bg:              #f4f8f2;
	--color-expand-button:             rgba(111,212,47,.15);
	--color-placeholder-text:          var(--color-text-light-3);
	--color-editor-line-highlight:     var(--color-primary-light-6);
	--color-project-board-bg:          var(--color-secondary-light-4);
	--color-caret:                     var(--color-text);
	--color-reaction-bg:               rgba(111,212,47,.10);
	--color-reaction-active-bg:        rgba(111,212,47,.20);
	--color-tooltip-text:              #ffffff;
	--color-tooltip-bg:                var(--sc-ink);

	/* Navbar */
	--color-nav-bg:                    var(--sc-ink);
	--color-nav-hover-bg:              rgba(111,212,47,.12);
	--color-nav-text:                  #d8e3da;
	--color-header-bar:                var(--sc-ink);
	--color-header-wrapper:            var(--sc-ink);
	--color-header-wrapper-transparent:rgba(34,31,31,.85);
	--color-footer:                    var(--sc-ink);

	/* Diff colors stay readable on green-tinted surface */
	--color-diff-added-row-bg:         #e6ffe0;
	--color-diff-added-word-bg:        #b8ffaa;
	--color-diff-removed-row-bg:       #ffeaea;
	--color-diff-removed-word-bg:      #ffc4c4;
	--color-diff-inactive-row-bg:      #f4f8f2;

	/* Semantic status colors.
	   Gitea consumes these for action run icons (success/failure/pending),
	   issue/PR state badges, signed-commit borders, diff stats, .text.{red|green|yellow|...},
	   .ui.{red|green|...}.label/.button, and runner task statuses.
	   Without explicit values here, var(--color-green) resolves to `initial`
	   and the icons render as default black text. */
	--color-green:                     var(--sc-green-deep);
	--color-green-dark-1:              var(--sc-green-darker);
	--color-green-dark-2:              #2f6a14;
	--color-green-light:               var(--sc-mint);
	--color-green-badge:               var(--sc-green-deep);
	--color-green-badge-bg:            var(--sc-mint-soft);
	--color-green-badge-hover-bg:      #cdf3c0;

	--color-red:                       #d93636;
	--color-red-dark-1:                #b52b2b;
	--color-red-dark-2:                #8e1f1f;
	--color-red-light:                 var(--sc-red-bg);
	--color-red-badge:                 #d93636;
	--color-red-badge-bg:              #ffe5e5;
	--color-red-badge-hover-bg:        #ffd0d0;

	--color-yellow:                    #e8b007;
	--color-yellow-dark-1:             #b88a05;
	--color-yellow-badge:              #e8b007;
	--color-yellow-badge-bg:           #fff7d6;
	--color-yellow-badge-hover-bg:     #ffefb0;

	--color-orange:                    #e8730c;
	--color-orange-dark-1:             #b85a06;
	--color-orange-badge:              #e8730c;
	--color-orange-badge-bg:           #ffe8d2;
	--color-orange-badge-hover-bg:     #ffd9b3;

	--color-blue:                      var(--sc-blue);
	--color-blue-dark-1:               var(--sc-dark-blue);
	--color-purple:                    #8e44ad;
	--color-purple-dark-1:             #6c3483;
	--color-gold:                      #b58105;
	--color-olive:                     #8aae12;
	--color-grey:                      #767a85;
	--color-grey-light:                #c5c8cf;
	--color-white:                     #ffffff;

	/* Design tokens Gitea references throughout the UI.
	   Without these, `border-radius: var(--border-radius)` resolves to 0
	   (square corners on labels/badges), `font-weight: var(--font-weight-semibold)`
	   becomes invalid (falls back to normal), and `.ui.label` loses its pill background. */
	--border-radius:                   4px;
	--border-radius-medium:            6px;
	--border-radius-full:              9999px;

	--font-weight-light:               300;
	--font-weight-normal:              400;
	--font-weight-medium:              500;
	--font-weight-semibold:            600;
	--font-weight-bold:                700;
	--font-size-label:                 12px;
	--line-height-default:             1.4285;

	--gap-inline:                      .25rem;
	--gap-block:                       .5rem;

	--color-label-bg:                  var(--color-secondary);
	--color-label-text:                var(--color-text-light);
	--color-label-hover-bg:            var(--color-secondary-dark-1);
}

/* ----------- Text selection ---------------------------------- */
/* Gitea default selection uses --color-primary-light-1 (#82dc4a in SC)
   with white text — too saturated and low-contrast. Soft mint + dark ink
   reads cleanly and stays on-brand. */
::selection {
	background: var(--sc-mint) !important;
	color: var(--sc-ink) !important;
}
::-moz-selection {
	background: var(--sc-mint) !important;
	color: var(--sc-ink) !important;
}

/* ----------- Actions run list -------------------------------- */
/* Manrope renders visually heavier than the system font Gitea ships with,
   so semibold (600) at 16px reads as aggressive in the run list.
   Drop to medium / 14px to match the original Gitea proportions. */
.run-list .flex-item-title,
.run-list .flex-item-title a {
	font-weight: var(--font-weight-medium) !important;
	font-size: 14px;
}

/* ----------- Top navigation bar ------------------------------ */
.full.height > .ui.menu.navbar,
#navbar {
	background: var(--sc-ink) !important;
	border-bottom: 3px solid var(--sc-green);
}
#navbar .item,
.ui.menu.navbar .item {
	color: #d8e3da !important;
}
#navbar .item:hover,
.ui.menu.navbar .item:hover {
	background: rgba(111,212,47,.12) !important;
	color: var(--sc-green) !important;
}
#navbar .item.active,
.ui.menu.navbar .item.active {
	color: var(--sc-green) !important;
	background: rgba(111,212,47,.08) !important;
}

/* Brand mark color in dark nav */
#navbar .logo,
.ui.menu.navbar .logo {
	filter: none;
}

/* ----------- Buttons ----------------------------------------- */
.ui.primary.button,
.ui.primary.buttons .button {
	background: var(--sc-green);
	color: var(--sc-ink);
	font-weight: 600;
	border: 1px solid var(--sc-green-deep);
}
.ui.primary.button:hover,
.ui.primary.buttons .button:hover {
	background: var(--sc-green-deep);
	color: var(--sc-ink);
}
.ui.basic.primary.button {
	color: var(--sc-green-darker) !important;
	box-shadow: 0 0 0 1px var(--sc-green) inset !important;
}
.ui.basic.primary.button:hover {
	background: var(--sc-mint-soft) !important;
	color: var(--sc-green-darker) !important;
}

/* Danger / destructive buttons (merge commit, close PR, delete, etc.).
   Must read as a clear "red" signal — not pastel. The .ui.primary.button.red
   combo on the merge confirmation step also needs to win over the green
   primary rule above, so we set bg/border/color with !important. */
.ui.merge-button.red,
.ui.button.red,
.ui.red.button,
.ui.red.buttons .button,
.ui.primary.button.red,
.ui.primary.buttons.red .button {
    background: var(--color-red) !important;
    color: var(--color-white) !important;
    border: 1px solid var(--color-red-dark-1) !important;
}
.ui.merge-button.red:hover,
.ui.button.red:hover,
.ui.red.button:hover,
.ui.red.buttons .button:hover,
.ui.primary.button.red:hover,
.ui.primary.buttons.red .button:hover {
    background: var(--color-red-dark-1) !important;
    color: var(--color-white) !important;
}

/* ----------- Links ------------------------------------------- */
a, .ui.menu .item > a {
	color: var(--sc-green-darker);
	font-weight: 500;
}
a:hover {
	color: var(--sc-ink);
	text-decoration: underline;
}
/* Links inside the dark navbar must stay light */
#navbar a,
.ui.menu.navbar a {
	font-weight: inherit;
}

/* ----------- Primary-coloured text on white surfaces --------- */
/* Gitea applies `.text.primary` / `.muted-links` / `.flex-item-title a`
   to repository and organization name links. These inherit
   --color-primary (#6fd42f) which is bright enough for backgrounds
   and badges but reads as pale lime when used as foreground text on
   a white surface (~3:1 contrast). Override with a darker, more
   saturated green (~7:1 contrast). */
.text.primary,
a.text.primary,
a.primary:not(.button),
a.muted-links,
.muted-links a,
.flex-item-title a,
.flex-item-title strong,
.repos-list .repo-list-link a,
.repository-owner > a,
.admin-setting-content a {
	color: var(--sc-dark-blue) !important;
	font-weight: 500 !important;
}
.text.primary:hover,
a.text.primary:hover,
a.primary:not(.button):hover,
a.muted-links:hover,
.muted-links a:hover,
.flex-item-title a:hover,
.repos-list .repo-list-link a:hover,
.repository-owner > a:hover,
.admin-setting-content a:hover {
	color: var(--sc-blue) !important;
	text-decoration: underline;
}

/* ----------- Dropdown menus inside dark navbar --------------- */
/* The top-level navbar items are light grey on dark ink.
   Dropdown panels, however, render on a white background,
   so their items need dark text — otherwise they inherit
   #d8e3da and become unreadable. */
#navbar .ui.dropdown .menu .item,
#navbar .menu .menu .item,
.ui.menu.navbar .ui.dropdown .menu .item {
	color: var(--sc-ink) !important;
	background: transparent !important;
}
#navbar .ui.dropdown .menu .item:hover,
#navbar .menu .menu .item:hover,
.ui.menu.navbar .ui.dropdown .menu .item:hover {
	color: var(--sc-ink) !important;
	background: var(--sc-mint-soft) !important;
}
/* Section headers inside dropdown (e.g. "Signed in as ...") */
#navbar .ui.dropdown .menu .header,
.ui.menu.navbar .ui.dropdown .menu .header {
	color: var(--sc-ink) !important;
}
/* Active / selected entry in dropdown (e.g. Site Administration) */
#navbar .ui.dropdown .menu .item.active,
#navbar .ui.dropdown .menu .item.selected,
.ui.menu.navbar .ui.dropdown .menu .item.active {
	color: var(--sc-green-darker) !important;
	background: var(--sc-mint-soft) !important;
}

/* ----------- Cards / repo list ------------------------------- */
.ui.card,
.ui.cards > .card,
.ui.segment {
	border: 1px solid var(--color-light-border);
	box-shadow: 0 1px 2px rgba(34,31,31,.04);
	border-radius: 8px;
}
.ui.card:hover,
.ui.cards > .card:hover {
	border-color: var(--sc-mid);
	box-shadow: 0 1px 2px rgba(34,31,31,.04), 0 8px 24px -8px rgba(63,140,28,.10);
	transform: translateY(-1px);
	transition: all .15s ease;
}

/* Repo list rows */

.flex-item:hover,
.repo-owner-name-list .item:hover,
.dashboard.feeds .news .meta:hover {
	background: var(--sc-mint-soft) !important;
	color: var(--sc-green-dark) !important;
}

.flex-item a:not(.label,.button):hover {
    color: var(--sc-blue) !important;
}


/* Branch / tag labels */
.ui.basic.label.branch,
.ui.label.branch {
	background: var(--sc-mint-soft);
	color: var(--sc-green-darker);
	border: 1px solid rgba(111,212,47,.3);
	font-family: 'JetBrains Mono','Consolas',monospace;
}

/* ----------- Code blocks ------------------------------------- */
.code-view,
.file-view.markup pre,
.markup pre {
	background: #fbfdfa;
	border: 1px solid var(--color-light-border);
	border-radius: 6px;
}
.markup code, .markup tt {
	background: var(--sc-mint-soft);
	color: var(--sc-green-darker);
	border-radius: 4px;
	padding: 1px 6px;
	font-family: 'JetBrains Mono','Consolas',monospace;
}

/* ----------- Status badges ----------------------------------- */
.ui.green.label,
.ui.green.labels .label {
	background-color: var(--sc-green) !important;
	color: var(--sc-ink) !important;
	border-color: var(--sc-green-deep) !important;
}
.ui.basic.green.label {
	color: var(--sc-green-darker) !important;
	box-shadow: 0 0 0 1px var(--sc-green) inset !important;
}

/* Issue / PR open badge */
.issue-list .status.open,
.pull-list .status.open {
	color: var(--sc-green-darker);
}

/* ----------- Activity feed ----------------------------------- */
.dashboard.feeds .news,
#activity-feed .news {
	border-bottom: 1px solid var(--color-light-border);
}
.dashboard.feeds .news .avatar img {
	border: 2px solid var(--sc-mint);
}

/* ----------- Form controls ----------------------------------- */
.ui.input input,
.ui.form input[type=text],
.ui.form input[type=email],
.ui.form input[type=password],
.ui.form textarea {
	border: 1px solid var(--color-light-border);
	border-radius: 6px;
	transition: border-color .12s, box-shadow .12s;
}
.ui.input input:focus,
.ui.form input:focus,
.ui.form textarea:focus {
	border-color: var(--sc-green) !important;
	box-shadow: 0 0 0 3px rgba(111,212,47,.15) !important;
}

/* ----------- Tabs / segmented controls ----------------------- */
.ui.tabular.menu .active.item,
.ui.tabular.menu .item:hover {
	color: var(--sc-green-darker);
	border-color: var(--sc-green);
}

/* ----------- Footer ------------------------------------------ */
.page-footer,
footer.page-footer {
	background: var(--sc-ink);
	color: #d8e3da;
	border-top: 3px solid var(--sc-green);
}
.page-footer a,
footer.page-footer a {
	color: #d8e3da;
}
.page-footer a:hover,
footer.page-footer a:hover {
	color: var(--sc-green);
}

/* ----------- Typography hint --------------------------------- */
body, .ui {
	font-family: 'Manrope','Tahoma',system-ui,sans-serif;
}
h1,h2,h3,h4,h5,.ui.header {
	font-family: 'Outfit','Tahoma',system-ui,sans-serif;
	letter-spacing: -.3px;
}
code, kbd, pre, .monospace, .ui.code {
	font-family: 'JetBrains Mono','Consolas',monospace;
}