/*
 * Thain Family Forest — Django admin theme
 * Black & white base with forest green accents (matches public site palette).
 */

html[data-theme="light"],
:root {
	--tff-green: #0c5446;
	--tff-green-hover: #094539;
	--tff-green-muted: #1e6b5c;
	--tff-green-tint: #e8f2ef;
	--tff-black: #0a0a0a;
	--tff-gray-900: #1a1a1a;
	--tff-gray-700: #444444;
	--tff-gray-500: #666666;
	--tff-gray-200: #e5e5e5;
	--tff-gray-100: #f5f5f5;
	--tff-white: #ffffff;

	--primary: var(--tff-green);
	--secondary: var(--tff-black);
	--accent: #c8b500;
	--primary-fg: var(--tff-white);

	--body-fg: var(--tff-gray-900);
	--body-bg: var(--tff-white);
	--body-quiet-color: var(--tff-gray-500);
	--body-medium-color: var(--tff-gray-700);
	--body-loud-color: var(--tff-black);

	--header-color: var(--tff-white);
	--header-branding-color: var(--tff-white);
	--header-bg: var(--tff-black);
	--header-link-color: var(--tff-white);

	--breadcrumbs-fg: #cccccc;
	--breadcrumbs-link-fg: var(--tff-white);
	--breadcrumbs-bg: var(--tff-gray-900);

	--link-fg: var(--tff-green);
	--link-hover-color: var(--tff-green-hover);
	--link-selected-fg: var(--tff-green-muted);

	--hairline-color: var(--tff-gray-200);
	--border-color: #cccccc;

	--darkened-bg: var(--tff-gray-100);
	--selected-bg: var(--tff-green-tint);
	--selected-row: #dceee9;

	--button-fg: var(--tff-white);
	--button-bg: var(--tff-green);
	--button-hover-bg: var(--tff-green-hover);
	--default-button-bg: var(--tff-green);
	--default-button-hover-bg: var(--tff-green-hover);
	--close-button-bg: var(--tff-gray-700);
	--close-button-hover-bg: var(--tff-black);

	--object-tools-fg: var(--tff-white);
	--object-tools-bg: var(--tff-gray-900);
	--object-tools-hover-bg: var(--tff-black);

	--message-success-bg: var(--tff-green-tint);
	--message-warning-bg: #fff8e1;
	--message-error-bg: #ffefef;
}

/* Keep admin readable if OS prefers dark mode */
html[data-theme="dark"] {
	--primary: #3d9b88;
	--secondary: #0a0a0a;
	--accent: #c8b500;
	--primary-fg: #ffffff;

	--body-fg: #f0f0f0;
	--body-bg: #121212;
	--body-quiet-color: #aaaaaa;
	--body-medium-color: #cccccc;
	--body-loud-color: #ffffff;

	--header-color: #ffffff;
	--header-branding-color: #ffffff;
	--header-bg: #000000;
	--header-link-color: #ffffff;

	--breadcrumbs-fg: #bbbbbb;
	--breadcrumbs-link-fg: #ffffff;
	--breadcrumbs-bg: #1a1a1a;

	--link-fg: #5cb8a4;
	--link-hover-color: #7dcec0;
	--link-selected-fg: #3d9b88;

	--hairline-color: #333333;
	--border-color: #444444;

	--darkened-bg: #1a1a1a;
	--selected-bg: #1e3330;
	--selected-row: #1e3330;

	--button-bg: #0c5446;
	--button-hover-bg: #3d9b88;
	--default-button-bg: #0c5446;
	--default-button-hover-bg: #3d9b88;
}

#site-name a {
	font-weight: 600;
	letter-spacing: 0.02em;
}

#site-name a:hover {
	color: var(--accent);
}

.module h2,
.inline-group h2 {
	background: var(--tff-black);
	color: var(--tff-white);
}

.button,
input[type="submit"].default,
.submit-row input.default {
	font-weight: 600;
}

a.button:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
	outline-color: var(--tff-green);
}

#changelist-filter h2 {
	background: var(--tff-gray-900);
	color: var(--tff-white);
}

#changelist-filter li.selected a {
	color: var(--tff-green);
	font-weight: 600;
}

div.breadcrumbs a:focus,
div.breadcrumbs a:hover {
	color: var(--accent);
}

/*
 * Keep every admin section within its header width.
 * Long tabular rows, file widgets, and readonly values wrap instead of
 * stretching the page (same idea as stacked dataset-file inlines).
 */
#content,
#content-main,
.colM,
.colMS,
form,
.aligned,
.module,
.inline-group,
fieldset.module {
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.module,
.inline-group {
	overflow-x: auto;
}

.aligned .flex-container,
.form-row .flex-container {
	flex-wrap: wrap;
	min-width: 0;
	max-width: 100%;
}

.aligned .form-row > div,
.aligned .flex-container > div {
	min-width: 0;
	max-width: 100%;
}

.aligned label + div.readonly,
.aligned .readonly,
.form-row p,
.form-row .help {
	overflow-wrap: anywhere;
	word-break: break-word;
	max-width: 100%;
}

.aligned input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.aligned select,
.aligned textarea,
.form-row input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.form-row select,
.form-row textarea {
	max-width: 100%;
	box-sizing: border-box;
}

.aligned .file-upload,
.form-row .file-upload {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem 0.75rem;
	max-width: 100%;
}

.selector {
	flex-wrap: wrap;
	max-width: 100%;
	min-width: 0;
}

.selector-available,
.selector-chosen {
	min-width: 0;
	flex: 1 1 220px;
}

.inline-related.tabular fieldset.module {
	overflow-x: auto;
	max-width: 100%;
}

.inline-related.tabular fieldset.module table {
	width: 100%;
	max-width: 100%;
	table-layout: fixed;
	overflow-x: visible;
}

.inline-group .tabular th,
.inline-group .tabular td {
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: break-word;
	vertical-align: top;
}

.inline-group .tabular input,
.inline-group .tabular select,
.inline-group .tabular textarea {
	max-width: 100%;
	box-sizing: border-box;
}

#changelist .results,
#changelist-form .results {
	overflow-x: auto;
	max-width: 100%;
}

#changelist table {
	table-layout: auto;
	width: max-content;
	min-width: 100%;
	max-width: none;
	border-collapse: collapse;
}

#changelist table thead th,
#changelist table tbody td,
#changelist table tbody th {
	white-space: nowrap;
	overflow-wrap: normal;
	word-break: normal;
	padding: 8px 12px;
}

#changelist table thead th.column-short_title,
#changelist table tbody th.field-short_title,
#changelist table tbody td.field-short_title {
	min-width: 18rem;
	max-width: 28rem;
	white-space: normal;
	overflow-wrap: break-word;
	word-break: break-word;
}

#changelist table thead th.column-slug,
#changelist table tbody td.field-slug {
	min-width: 12rem;
}

#changelist table thead th.column-organization,
#changelist table tbody td.field-organization,
#changelist table thead th.column-lead_name,
#changelist table tbody td.field-lead_name,
#changelist table thead th.column-lead_email,
#changelist table tbody td.field-lead_email,
#changelist table thead th.column-owner,
#changelist table tbody td.field-owner {
	min-width: 10rem;
}

/* Admin home: welcome panel above a compact recent-actions drawer */
.tff-dashboard #content-main {
	max-width: 100%;
}

.tff-welcome {
	margin-bottom: 1.25rem;
}

.tff-welcome-message {
	font-size: 0.95rem;
	line-height: 1.45;
	max-width: 52rem;
}

.tff-welcome-columns {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
	gap: 1.25rem 2rem;
	margin-top: 0.75rem;
}

.tff-welcome h3 {
	margin: 0 0 0.4rem;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.tff-link-list,
.tff-shortcut-list {
	margin: 0;
	padding-left: 1.1rem;
}

.tff-link-list li,
.tff-shortcut-list li {
	margin: 0.25rem 0;
}

.tff-shortcut-list {
	list-style: none;
	padding-left: 0;
}

.tff-shortcut-list a {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.45rem 0.55rem;
	border: 1px solid var(--hairline-color);
	background: var(--body-bg);
	text-decoration: none;
}

.tff-shortcut-list a:hover,
.tff-shortcut-list a:focus-visible {
	background: var(--selected-bg);
}

.tff-hotkey {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.4rem;
	height: 1.4rem;
	padding: 0 0.25rem;
	border: 1px solid var(--border-color);
	border-radius: 3px;
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--body-medium-color);
	background: var(--darkened-bg);
}

.tff-hotkey-hint {
	color: var(--body-quiet-color);
	font-size: 0.75rem;
	margin: 0 0 0.5rem;
}

.tff-hotkey-hint kbd {
	border: 1px solid var(--border-color);
	border-radius: 3px;
	padding: 0 0.3rem;
	font-size: 0.72rem;
	background: var(--darkened-bg);
}

.tff-add-project {
	display: inline-block;
	margin-top: 0.5rem;
}

.tff-recent-actions {
	margin-bottom: 1.5rem;
	color: var(--body-quiet-color);
}

.tff-recent-actions summary {
	cursor: pointer;
	font-weight: 600;
	color: var(--body-medium-color);
	padding: 8px;
}

.tff-recent-actions .actionlist {
	padding: 0 10px 10px;
}

.tff-guide-body {
	max-width: 48rem;
	line-height: 1.5;
}

.tff-guide-body pre {
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}

.tff-related-panel {
	margin: 1.25rem 0 1.75rem;
	padding: 12px 14px 16px;
}

.tff-related-panel h2 {
	margin-top: 0;
}

.tff-related-panel h3 {
	margin: 1.1rem 0 0.4rem;
	font-size: 0.95rem;
}

.tff-related-help,
.tff-related-empty {
	color: var(--body-medium-color);
	max-width: 52rem;
}

.tff-related-table {
	width: 100%;
	border-collapse: collapse;
}

.tff-related-table th,
.tff-related-table td {
	text-align: left;
	padding: 0.4rem 0.6rem;
	border-bottom: 1px solid var(--hairline-color);
	vertical-align: top;
}

@media (max-width: 768px) {
	.tff-welcome-columns {
		grid-template-columns: 1fr;
	}
}