/* Stack Elevate brand theme
   Colors:
   - Red:   #EB2229
   - Blue:  #0B0D2A
   - White: #FFFFFF
*/

/* ---------- Brand tokens ---------- */
:root {
	--se-red: #EB2229;
	--se-blue: #0B0D2A;
	--se-white: #FFFFFF;

	--se-link: var(--se-red);
	--se-text: var(--se-blue);
	--se-bg: var(--se-white);

	--se-red-hover: #c61c22;
	/* slightly darker hover */

	--bs-navbar-brand-padding-y: 0;
}

/* ---------- Base ---------- */
html,
body {
	height: 100%;
}

body {
	background: var(--se-bg);
	color: var(--se-text);
}

/* Links */
a {
	color: var(--se-link);
	text-decoration: none;
}

a:hover,
a:focus {
	color: var(--se-red-hover);
	text-decoration: underline;
}

/* ---------- Bootstrap overrides ---------- */

/* Primary button becomes brand red */
.btn-primary {
	--bs-btn-color: var(--se-white);
	--bs-btn-bg: var(--se-red);
	--bs-btn-border-color: var(--se-red);
	--bs-btn-hover-color: var(--se-white);
	--bs-btn-hover-bg: var(--se-red-hover);
	--bs-btn-hover-border-color: var(--se-red-hover);
	--bs-btn-active-color: var(--se-white);
	--bs-btn-active-bg: var(--se-red-hover);
	--bs-btn-active-border-color: var(--se-red-hover);
	--bs-btn-disabled-color: var(--se-white);
	--bs-btn-disabled-bg: var(--se-red);
	--bs-btn-disabled-border-color: var(--se-red);
}

/* Outline primary uses brand red */
.btn-outline-primary {
	--bs-btn-color: var(--se-red);
	--bs-btn-border-color: var(--se-red);
	--bs-btn-hover-color: var(--se-white);
	--bs-btn-hover-bg: var(--se-red);
	--bs-btn-hover-border-color: var(--se-red);
	--bs-btn-active-color: var(--se-white);
	--bs-btn-active-bg: var(--se-red-hover);
	--bs-btn-active-border-color: var(--se-red-hover);
}

/* Navbar: if you use navbar-dark + bg-dark, map bg-dark to brand blue */
.bg-dark {
	background-color: var(--se-blue) !important;
}

/* If you use text-primary, make it brand red */
.text-primary {
	color: var(--se-red) !important;
}

/* Optional: make .border-bottom / .border-top slightly subtle on dark backgrounds */
.navbar.bg-dark {
	border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.navbar-brand {
	--bs-navbar-brand-padding-y: 0;
	padding-top: var(--bs-navbar-brand-padding-y);
	padding-bottom: var(--bs-navbar-brand-padding-y);
}

/* Headings: keep default but ensure strong contrast */
h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--se-text);
}

/* ---------- Small utility helpers (optional) ---------- */
/* Use these if you ever want explicit brand classes without inline styles. */
.bg-se-blue {
	background-color: var(--se-blue) !important;
}

.bg-se-red {
	background-color: var(--se-red) !important;
}

.text-se-red {
	color: var(--se-red) !important;
}

.text-se-blue {
	color: var(--se-blue) !important;
}

.text-se-white {
	color: var(--se-white) !important;
}
