/*
 * AEU SelfGit — brand override for Gitea 1.27 (loaded via custom/templates/custom/header.tmpl)
 * Palette taken 1:1 from the AEU design-system:
 *   /home/alieu/web/alickaj.eu/public_html/aeu-assets/showcase.css  ("Sunset Industrial" block)
 *     --accent:#ff8300  --accent-dark:#cc6700  --accent-glow:#ff830044
 *     --bg:#2f3a3f  --bg-secondary:#39464c  --text-secondary:#ffc300
 * Only CSS custom properties + a few brand-chrome rules are overridden; no layout hacks,
 * upgrade-safe. Ramp direction differs per theme (see Gitea theme-gitea-dark/light).
 */

/* ---------- Accent, theme-independent ---------- */
:root {
	--color-primary: #ff8300;
	--color-primary-contrast: #ffffff;
	--color-primary-alpha-10: #ff830019;
	--color-primary-alpha-20: #ff830033;
	--color-primary-alpha-30: #ff83004b;
	--color-primary-alpha-40: #ff830066;
	--color-primary-alpha-50: #ff830080;
	--color-primary-alpha-60: #ff830099;
	--color-primary-alpha-70: #ff8300b3;
	--color-primary-alpha-80: #ff8300cc;
	--color-primary-alpha-90: #ff8300e1;
}

/* ---------- DARK themes: dark-N lighten toward white, light-N darken toward black ---------- */
html[data-theme^="gitea-dark"],
html[data-theme^="gitea-auto"] {
	--color-primary-dark-1: #ff921f;
	--color-primary-dark-2: #ffa13d;
	--color-primary-dark-3: #ffb05c;
	--color-primary-dark-4: #ffbf7a;
	--color-primary-dark-5: #ffd4a6;
	--color-primary-dark-6: #ffe9d1;
	--color-primary-dark-7: #fffaf5;
	--color-primary-light-1: #e67600;
	--color-primary-light-2: #cc6900;
	--color-primary-light-3: #b35c00;
	--color-primary-light-4: #994f00;
	--color-primary-light-5: #663400;
	--color-primary-light-6: #331a00;
	--color-primary-light-7: #0d0700;
	/* AEU slate header (nav-text is already light in dark themes) */
	--color-nav-bg: #2f3a3f;
	--color-nav-hover-bg: #39464c;
}

/* ---------- LIGHT themes: dark-N darken, light-N lighten ---------- */
html[data-theme^="gitea-light"] {
	--color-primary-dark-1: #e67600;
	--color-primary-dark-2: #cc6900;
	--color-primary-dark-3: #b35c00;
	--color-primary-dark-4: #994f00;
	--color-primary-dark-5: #663400;
	--color-primary-dark-6: #331a00;
	--color-primary-dark-7: #0d0700;
	--color-primary-light-1: #ff921f;
	--color-primary-light-2: #ffa13d;
	--color-primary-light-3: #ffb05c;
	--color-primary-light-4: #ffbf7a;
	--color-primary-light-5: #ffd4a6;
	--color-primary-light-6: #ffe9d1;
	--color-primary-light-7: #fffaf5;
}

/* gitea-auto under a light OS preference must use the light ramp + light header */
@media (prefers-color-scheme: light) {
	html[data-theme^="gitea-auto"] {
		--color-primary-dark-1: #e67600;
		--color-primary-dark-2: #cc6900;
		--color-primary-dark-3: #b35c00;
		--color-primary-dark-4: #994f00;
		--color-primary-dark-5: #663400;
		--color-primary-dark-6: #331a00;
		--color-primary-dark-7: #0d0700;
		--color-primary-light-1: #ff921f;
		--color-primary-light-2: #ffa13d;
		--color-primary-light-3: #ffb05c;
		--color-primary-light-4: #ffbf7a;
		--color-primary-light-5: #ffd4a6;
		--color-primary-light-6: #ffe9d1;
		--color-primary-light-7: #fffaf5;
		--color-nav-bg: #f6f7fa;
		--color-nav-hover-bg: var(--color-secondary);
	}
}

/* ===================== AEU landing page (home.tmpl) ===================== */
.aeu-landing {
	max-width: 1080px;
	margin: 0 auto;
	padding: 1.5rem 1.25rem 3rem;
}
.aeu-hero {
	text-align: center;
	padding: 3.5rem 1rem 2.25rem;
}
.aeu-hero-logo {
	width: min(360px, 74vw);
	height: auto;
	filter: drop-shadow(0 8px 26px #ff830033);
}
.aeu-hero-title {
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 800;
	letter-spacing: .4px;
	margin: 1rem 0 .35rem;
	color: var(--color-text-dark);
}
.aeu-hero-tagline {
	font-size: clamp(1rem, 2.4vw, 1.2rem);
	color: var(--color-text-light-1);
	margin: 0 auto 1.75rem;
	max-width: 40rem;
}
.aeu-hero-actions {
	display: flex;
	gap: .75rem;
	justify-content: center;
	flex-wrap: wrap;
}
.aeu-hero-actions .button {
	font-weight: 600;
}
.aeu-ghost.button {
	background: transparent;
	border: 1px solid var(--color-primary);
	color: var(--color-primary);
}
.aeu-ghost.button:hover {
	background: var(--color-primary-alpha-10);
	color: var(--color-primary);
}
.aeu-features {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.25rem;
	margin-top: 2.75rem;
}
.aeu-feature {
	background: var(--color-box-body);
	border: 1px solid var(--color-secondary);
	border-radius: 14px;
	padding: 1.6rem 1.4rem;
	text-align: center;
}
.aeu-feature-ico {
	color: var(--color-primary);
	margin-bottom: .6rem;
	line-height: 1;
}
.aeu-feature-ico .svg {
	width: 2rem;
	height: 2rem;
}
.aeu-feature h3 {
	margin: .2rem 0 .5rem;
	font-weight: 700;
	color: var(--color-text-dark);
}
.aeu-feature p {
	color: var(--color-text-light-1);
	margin: 0;
	line-height: 1.5;
}

/* ─── MyAEU external-login button (AEU brand) ──────────────────────────────
   Gitea renders the OAuth sign-in as a full-width `ui button
   external-login-link` (a big bar). AEU brand: keep the MyAEU shield logo as
   the focus and make it a compact, centered pill — NOT a big full-width
   button. Colours from design-system tokens (r.10b). */
.external-login-link.ui.button {
	display: flex !important;
	width: fit-content !important;
	min-width: 0 !important;
	margin: .5rem auto !important;
	padding: .55em 1.1em !important;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	font-weight: 600;
	border-radius: 999px;
	border: 1px solid var(--color-secondary);
}
.external-login-link.ui.button img {
	width: 22px !important;
	height: 22px !important;
}
