/*
 * SamNet brand for SamNet Workflows (Frappe v16), loaded on the desk, the
 * login page and every web form (hooks.py: app_include_css, web_include_css).
 *
 * Same tokens as My SamNet (src/client/styles.css) and the Authentik accent
 * (deploy/authentik/samnet-brand.css): sage #667452, darker #536043 on hover,
 * pale #eef2e9, ink #293127, Instrument Sans and Instrument Serif. Frappe's
 * layout is left alone; only colour, type and marks change.
 */

@font-face {
	font-family: "Instrument Sans";
	src: url("/assets/samnet_workflows/fonts/InstrumentSans-Variable.woff2") format("woff2");
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
}

@font-face {
	font-family: "Instrument Sans";
	src: url("/assets/samnet_workflows/fonts/InstrumentSans-VariableItalic.woff2") format("woff2");
	font-style: italic;
	font-weight: 100 900;
	font-display: swap;
}

@font-face {
	font-family: "Instrument Serif";
	src: url("/assets/samnet_workflows/fonts/InstrumentSerif-Regular.woff2") format("woff2");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

:root,
[data-theme="light"] {
	--samnet-sage: #667452;
	--samnet-sage-dark: #536043;
	--samnet-sage-pale: #eef2e9;
	--samnet-ink: #293127;
	--samnet-line: #dfe4da;

	--font-stack: "Instrument Sans", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--primary: var(--samnet-sage);
	--primary-color: var(--samnet-sage);
	--brand-color: var(--samnet-sage);
	--btn-primary: var(--samnet-sage);
	--border-primary: var(--samnet-sage);
	--text-on-light-blue: var(--samnet-sage-dark);
	--highlight-shadow: 1px 1px 10px var(--samnet-sage-pale), 0px 0px 4px var(--samnet-sage);
	--sidebar-select-color: var(--samnet-sage-pale);
	--checkbox-gradient: linear-gradient(180deg, var(--samnet-sage) -124.51%, var(--samnet-sage) 100%);
	--progress-bar-bg: var(--samnet-sage);
}

[data-theme="dark"] {
	--samnet-sage: #8a9a72;
	--samnet-sage-dark: #a3b28b;
	--font-stack: "Instrument Sans", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--primary: var(--samnet-sage);
	--primary-color: var(--samnet-sage);
	--brand-color: var(--samnet-sage);
	--btn-primary: var(--samnet-sage);
	--border-primary: var(--samnet-sage);
	--checkbox-gradient: linear-gradient(180deg, var(--samnet-sage) -124.51%, var(--samnet-sage) 100%);
}

/* Frappe's login and web-form bundles load after this file and redefine
   --font-stack on :root, so the doubled :root outranks them and body names
   the fonts outright. */
:root:root,
:root:root[data-theme] {
	--font-stack: "Instrument Sans", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html body {
	font-family: "Instrument Sans", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Primary actions: sage with white text, darker on hover, like Authentik. */
.btn-primary,
.btn.btn-primary,
.web-form .btn-primary,
.page-card .btn-primary {
	background-color: var(--samnet-sage) !important;
	border-color: var(--samnet-sage) !important;
	color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus-visible,
.btn-primary:active {
	background-color: var(--samnet-sage-dark) !important;
	border-color: var(--samnet-sage-dark) !important;
	color: #fff !important;
}

a,
.btn-link {
	color: var(--samnet-sage-dark);
}

input[type="checkbox"]:checked {
	background-color: var(--samnet-sage);
	border-color: var(--samnet-sage);
}

.form-control:focus,
.awesomplete input:focus {
	box-shadow: 0 0 0 2px var(--samnet-sage-pale), 0 0 0 3px var(--samnet-sage);
}

/* Headings in the SamNet serif, as on the public site. */
html body .web-form-head h1,
html body .web-form-title,
html body .page-card-head h4,
html body .success-page .success-title {
	font-family: "Instrument Serif", Georgia, "Times New Roman", serif;
	font-weight: 400;
	letter-spacing: 0;
	color: var(--samnet-ink);
}

html body .web-form-head h1,
html body .web-form-title {
	font-size: 2.25rem;
}

html body .page-card-head h4 {
	font-size: 1.75rem;
}

/* Public pages (login, web forms) sit on SamNet's pale sage. */
body[data-path="login"],
body[data-path="apply"],
body[data-path^="apply/"] {
	background: #f6f7f3;
}

/* Login card: the full SamNet logo (Website Settings → App Logo). */
html body .page-card-head img.app-logo {
	width: auto !important;
	max-width: 240px !important;
	height: 64px !important;
	max-height: none !important;
	object-fit: contain;
	margin-bottom: 4px;
}

/* "Login with SamNet" is the only way in, so it is the primary action. */
html body .btn-login-option.btn-samnet {
	background-color: var(--samnet-sage) !important;
	border-color: var(--samnet-sage) !important;
	color: #fff !important;
	font-weight: 600;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
}

html body .btn-login-option.btn-samnet:hover,
html body .btn-login-option.btn-samnet:focus-visible {
	background-color: var(--samnet-sage-dark) !important;
	border-color: var(--samnet-sage-dark) !important;
}

html body .page-card {
	border: 1px solid var(--samnet-line);
	box-shadow: 0 10px 30px rgba(41, 49, 39, 0.08);
}

/* Workflow state indicators follow the SamNet palette. */
.indicator-pill.blue,
.indicator.blue {
	--indicator-dot-color: var(--samnet-sage);
}
