:root{
	--color-main: #00a85a;
	--color-dark: #00643b;
	--color-accent: #28aa1e;
	--text-color: #222222;
	--muted: #6c757d;
	--bg: #ffffff;
	--max-content-width: 60vw;
}

/* Base layout */
body { padding-bottom: 40px; color: var(--text-color); background: var(--bg); font-family: 'Manrope', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; }
#calendar { max-width: 900px; margin: 0 auto }

/* Headings use display font */
h1,h2,h3,h4,h5,h6 { font-family: 'Bebas Neue', 'Helvetica Neue', Arial, sans-serif; letter-spacing: 0.03em; color: var(--color-dark); }

/* Primary brand styling */
.navbar { background-color: var(--color-main) !important; }
.navbar { padding-top: .5rem; padding-bottom: .5rem; }
.navbar-brand { color: #ffffff !important; font-family: 'Bebas Neue', sans-serif; }
.nav-link { color: #ffffff !important; }
.nav-link:hover, .nav-link:focus { color: #e9f7ee !important; }

/* Ensure navbar links have sufficient contrast and focus outlines for accessibility */
.navbar .nav-link:focus, .navbar .nav-link:hover { outline: none; }
.navbar .nav-link { padding-left: .5rem; padding-right: .5rem; }

/* Buttons */
.btn-primary { background: var(--color-dark); border-color: rgba(0,0,0,0.12); color: #ffffff; }
.btn-primary:hover, .btn-primary:focus { background: #00502f; color: #fff; }
.btn:focus { outline: 3px solid rgba(40,170,30,0.18); outline-offset: 2px; }

/* Links: use dark main for good contrast and underline for clarity */
a { color: var(--color-dark); text-decoration: underline; }
a:hover, a:focus { color: var(--color-main); text-decoration: underline; }

/* Scale post cover images to roughly 60% of viewport width and left-align */
.post-cover {
	max-width: var(--max-content-width);
	width: 60%;
	height: auto;
	display: block;
	margin-left: 0;
	margin-right: auto;
}

.lead { max-width: var(--max-content-width); margin-left: 0; margin-right: auto; }

/* Ensure images embedded inside markdown content scale like cover images */
.post-content img {
	display: block;
	margin-left: 0;
	margin-right: auto;
	max-width: var(--max-content-width) !important;
	width: 60% !important;
	height: auto !important;
}

/* Make tables and other block content in posts constrained to readable width */
.post-content table, .post-content pre, .post-content blockquote {
	max-width: var(--max-content-width);
	margin-left: 0;
	margin-right: auto;
}

/* Event detail styling */
.event-datetime {
	background: #f8f9fa;
	padding: 12px 16px;
	border-left: 4px solid #0d6efd;
	border-radius: 4px;
	max-width: 60vw;
	margin-left: 0;
	margin-right: auto;
}
.event-datetime .event-date { font-size: 1.05rem; color: #0b5ed7; }
.event-datetime .event-times { font-size: 0.98rem; color: #333; }

.cover-image-picker {
	display: flex;
	align-items: center;
	gap: 32px;
}
.cover-image-select {
	max-width: 420px;
	width: 420px;
	flex: 0 0 420px;
}
.cover-image-preview {
	width: auto !important;
	height: auto !important;
	max-width: none !important;
	max-height: 64px !important;
	border: 1px solid #d6d6d6;
	border-radius: 4px;
	flex: 0 0 auto;
}
.cover-image-help {
	margin-top: .5rem;
	margin-bottom: 0;
	color: var(--text-color);
}
.markdown-toolbar {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: .5rem;
}
.markdown-toolbar .form-label {
	margin-right: 8px;
}
.markdown-image-select {
	max-width: 420px;
	width: 420px;
	flex: 0 0 420px;
}
.markdown-image-picker {
	display: flex;
	align-items: center;
	gap: 32px;
}

/* News list: text on the left, image on the right, separators between items */
.news-item {
	display: flex;
	align-items: flex-start;
	gap: 20px;
	padding: 18px 0;
	border-bottom: 1px solid #e6e6e6;
}
.news-item:last-child { border-bottom: none; }
.news-item .news-text { flex: 1; }
.news-item .news-image { flex: 0 0 220px; }
.news-item .news-image .post-cover { width: 220px; max-width: 220px; }

@media (max-width: 768px) {
	.news-item { flex-direction: column; }
	.news-item .news-image { flex: none; }
	.news-item .news-image .post-cover { width: 60%; max-width: 60vw; margin-left: 0; }
	.post-content img, .post-cover { width: 60%; max-width: 60vw; }
}

@media (prefers-color-scheme: dark) {
	:root {
		--text-color: #f1f5f3;
		--muted: #b8c2bd;
		--bg: #1f1f1f;
	}

	body {
		background: #1f1f1f;
		color: var(--text-color);
	}

	.navbar {
		background-color: var(--color-dark) !important;
	}

	.navbar-brand, .nav-link {
		color: #ffffff !important;
	}

	h1,h2,h3,h4,h5,h6 {
		color: #79e2ad;
	}

	a {
		color: #5ee0a0;
	}

	a:hover, a:focus {
		color: #8af0bc;
	}

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

	.event-datetime {
		background: #2b2b2b;
		border-left-color: var(--color-dark);
	}

	.event-datetime .event-date {
		color: #79e2ad;
	}

	.event-datetime .event-times {
		color: var(--muted);
	}

	.card, .list-group-item, .modal-content {
		background: #2b2b2b;
		color: var(--text-color);
		border-color: #3a3a3a;
	}

	.form-control, .form-select {
		background: #2b2b2b;
		color: var(--text-color);
		border-color: #4a4a4a;
	}

	.form-control:focus, .form-select:focus {
		background: #303030;
		color: var(--text-color);
		border-color: var(--color-main);
		box-shadow: 0 0 0 .25rem rgba(0, 168, 90, .25);
	}

	.table {
		--bs-table-color: var(--text-color);
		--bs-table-bg: #2b2b2b;
		--bs-table-border-color: #3a3a3a;
		--bs-table-striped-bg: #303030;
		--bs-table-striped-color: var(--text-color);
	}

	.news-item {
		border-bottom-color: #3a3a3a;
	}
}
