/**
 * KSA Theme — static structural polish (no user colors).
 * Colors and tokens come from generated preset CSS (theme_active.css).
 */

/* Self-hosted Cairo (variable) — must live here: app/web hooks load ksa_base.css + theme_active.css
   only; ksa_desk.css / ksa_website.css are not included, so @font-face was never applied on Desk. */
@font-face {
	font-family: "Cairo";
	font-style: normal;
	font-display: swap;
	font-weight: 200 1000;
	src: url("/assets/ksa_theme/fonts/cairo/cairo-arabic-wght-normal.woff2") format("woff2-variations");
	unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}

@font-face {
	font-family: "Cairo";
	font-style: normal;
	font-display: swap;
	font-weight: 200 1000;
	src: url("/assets/ksa_theme/fonts/cairo/cairo-latin-wght-normal.woff2") format("woff2-variations");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
		U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Cairo only when KSA theme is enabled (Enable Theme = on) */
body.ksa-theme-enabled.ksa-font-cairo {
	font-family: Cairo, system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif;
}

body.ksa-theme-enabled .page-title,
body.ksa-theme-enabled h1,
body.ksa-theme-enabled h2,
body.ksa-theme-enabled h3,
body.ksa-theme-enabled h4 {
	font-family: inherit;
}

/* Focus visibility without fighting Frappe defaults */
body.ksa-theme-enabled :focus-visible {
	outline: 2px solid var(--primary, #006c35);
	outline-offset: 2px;
}

/* Compact mode only with KSA theme on */
body.ksa-theme-enabled.ksa-compact-mode .layout-main .form-section,
body.ksa-theme-enabled.ksa-compact-mode .dialog-body .form-section {
	margin-bottom: 0.75rem;
}

body.ksa-theme-enabled.ksa-compact-mode .page-head {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

/* Respect reduced motion + admin “animations off” */
@media (prefers-reduced-motion: reduce) {
	body.ksa-theme-enabled * {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

body.ksa-theme-enabled.ksa-animations-disabled .indicator,
body.ksa-theme-enabled.ksa-animations-disabled .progress,
body.ksa-theme-enabled.ksa-animations-disabled [class*="fade"] {
	animation: none !important;
	transition: none !important;
}

/* Brand title next to the app logo (Frappe desk navbar.html); not gated on Enable Theme.
   Scope to navbar so form `.container` rows are not affected. */
header.navbar .container,
header.navbar .container-fluid {
	flex-wrap: wrap;
	row-gap: 0.15rem;
}
/* Same as Help / .nav-link: use --navbar-fg (set with desk nav in presets), not body --text-color. */
header.navbar .ksa-desk-brand-text {
	display: inline-flex;
	align-items: center;
	font-weight: 600;
	margin-inline: 0.5rem;
	flex: 0 0 auto;
	max-width: min(50vw, 28rem);
	white-space: normal;
	line-height: 1.2;
	color: var(--navbar-fg, inherit) !important;
	position: relative;
	z-index: 1;
}