/* Digit UI tokens.
   Source: ERPNext System 2026 (6) / 06-Product-Blueprint.
   Keep this file framework-safe: variables, fonts, and generic foundations only. */

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("/assets/digit/fonts/digit/Archivo-Regular.ttf") format("truetype");
}

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("/assets/digit/fonts/digit/Archivo-Medium.ttf") format("truetype");
}

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("/assets/digit/fonts/digit/Archivo-SemiBold.ttf") format("truetype");
}

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("/assets/digit/fonts/digit/Archivo-Bold.ttf") format("truetype");
}

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("/assets/digit/fonts/digit/Archivo-Bold.ttf") format("truetype");
}

@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("/assets/digit/fonts/digit/IBMPlexSansArabic-Regular.ttf") format("truetype");
}

@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("/assets/digit/fonts/digit/IBMPlexSansArabic-Medium.ttf") format("truetype");
}

@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("/assets/digit/fonts/digit/IBMPlexSansArabic-SemiBold.ttf") format("truetype");
}

@font-face {
	font-family: "IBM Plex Sans Arabic";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("/assets/digit/fonts/digit/IBMPlexSansArabic-Bold.ttf") format("truetype");
}

:root {
	--digit-brand: #0A8754;
	--digit-brand-deep: #064E3B;
	--digit-brand-soft: #E6F3EC;
	--digit-mint: #34D399;
	--digit-ink: #0B1F17;
	--digit-body: #33433B;
	--digit-muted: #71807A;
	--digit-paper: #F4F3EE;
	--digit-card: #FFFFFF;
	--digit-border: rgba(6, 78, 59, 0.14);
	--digit-border-soft: rgba(6, 78, 59, 0.08);
	--digit-success: #067647;
	--digit-success-bg: #ECFDF3;
	--digit-warning: #B54708;
	--digit-warning-bg: #FFFAEB;
	--digit-error: #B42318;
	--digit-error-bg: #FEF3F2;
	--digit-info: #175CD3;
	--digit-info-bg: #EFF8FF;
	--digit-radius-xs: 4px;
	--digit-radius-sm: 6px;
	--digit-radius-md: 8px;
	--digit-radius-lg: 10px;
	--digit-shadow-flat: 0 1px 0 rgba(6, 78, 59, 0.05), 0 1px 2px rgba(6, 78, 59, 0.06);
	--digit-shadow-hover: 0 4px 14px rgba(6, 78, 59, 0.12);
	--digit-focus: 0 0 0 3px rgba(52, 211, 153, 0.24);
	--digit-font-arabic: "IBM Plex Sans Arabic", Tahoma, Arial, sans-serif;
	--digit-font-latin: "Archivo", Arial, sans-serif;
	/* TODO: add local Space Mono files if strict blueprint parity is required. */
	--digit-font-mono: "Courier New", Consolas, monospace;
	--digit-topbar-height: 55px;
	--digit-sidebar-width: 248px;
	--digit-content-pad-x: 24px;
	--digit-content-pad-y: 20px;
	--digit-control-height: 34px;
	--digit-button-height: 33px;
	--digit-base-font-size: 13px;
	/* Dark identity chrome — navbar + sidebar share one deep-green frame
	   (DIGIT_PRODUCT_IDENTITY_REFERENCE nav rules + strong brand presence). */
	--digit-chrome-bg: #06402F;
	--digit-chrome-bg-2: #064E3B;
	--digit-chrome-grad: linear-gradient(180deg, #064E3B 0%, #06402F 100%);
	--digit-sidebar-bg: #064E3B;
	--digit-sidebar-fg: rgba(244, 243, 238, 0.78);
	--digit-sidebar-fg-strong: #FFFFFF;
	--digit-sidebar-hover-bg: rgba(52, 211, 153, 0.12);
	--digit-sidebar-active-bg: rgba(52, 211, 153, 0.18);
	--digit-sidebar-active-bar: var(--digit-mint);
	--digit-sidebar-label: rgba(52, 211, 153, 0.75);
	--digit-sidebar-accent: var(--digit-mint);
	/* Brand gradients / accents */
	--digit-brand-grad: linear-gradient(135deg, #064E3B 0%, #0A8754 100%);
	--digit-icon-grad: linear-gradient(135deg, #0A8754 0%, #34D399 100%);
	--digit-mint-soft: rgba(52, 211, 153, 0.14);
	--digit-emerald-soft: rgba(10, 135, 84, 0.08);
	/* Secondary surface (subtle zebra / column-header fill) — mirrors SPA --d-surface-2. */
	--digit-surface-2: #F1F5F2;
	/* NEUTRAL table tokens (embed_v27) — calm grey table chrome, NO green cast.
	   Used for datatable/list/grid header fill + row hover so structural table
	   surfaces read neutral while brand stays for genuine accents (links, pills). */
	--digit-table-header: #f3f4f6;
	--digit-table-hover: rgba(15, 23, 42, 0.035);
	--digit-shadow-brand: 0 10px 28px rgba(6, 78, 59, 0.16);
}

/* Frappe variable bridge: map ERPNext's own theme variables to Digit tokens.
   This themes Desk by overriding source variables rather than fighting every
   selector with !important. Loads first, so all later Digit files inherit it. */
:root {
	--bg-color: var(--digit-paper);
	/* Frappe semantics: --fg-color is the elevated SURFACE color (cards,
	   sections, modals), not text. Must stay light or surfaces go dark. */
	--fg-color: var(--digit-card);
	--card-bg: var(--digit-card);
	--text-color: var(--digit-ink);
	--heading-color: var(--digit-ink);
	--text-muted: var(--digit-muted);
	--subtle-fg: var(--digit-muted);
	--muted-text-color: var(--digit-muted);
	--control-bg: var(--digit-card);
	--control-bg-on-gray: var(--digit-card);
	--border-color: var(--digit-border);
	--dark-border-color: var(--digit-border);
	--primary: var(--digit-brand);
	--primary-color: var(--digit-brand);
	--btn-primary: var(--digit-brand);
	--btn-default-bg: var(--digit-card);
	--btn-default-hover-bg: var(--digit-brand-soft);
	--sidebar-select-color: var(--digit-sidebar-active-bg);
	--text-on-primary: #FFFFFF;
}

html,
body {
	letter-spacing: 0 !important;
}

body {
	background: var(--digit-paper) !important;
	color: var(--digit-body) !important;
	font-family: var(--digit-font-arabic) !important;
	font-size: var(--digit-base-font-size);
	line-height: 1.6;
}

/* ----------------------------------------------------------------------------
   DARK MODE (embedded desk only). The Digit shell mirrors its light/dark theme
   into the iframe by stamping html[data-theme="dark"] (digit_desk.js). Frappe's
   own [data-theme="dark"] block already darkens its CSS vars, but the light
   bridge above (mapped on :root) and the body { ...!important } rule would
   otherwise force the surface back to light. Re-map the bridge to a Digit dark
   palette here — reusing frontend/src/index.css dark tokens (paper #0c100e,
   surface #161b18, ink #eef3f1) — so surfaces, text and borders are dark,
   legible and visually consistent with the shell. Scoped to embed + dark, so
   standalone desk and light mode are untouched.
   ---------------------------------------------------------------------------- */
html.digit-embedded[data-theme="dark"] {
	--digit-paper: #0c100e;
	--digit-card: #161b18;
	--digit-ink: #eef3f1;
	--digit-body: #c0cbc4;
	--digit-muted: #869389;
	--digit-border: rgba(255, 255, 255, 0.12);
	--digit-border-soft: rgba(255, 255, 255, 0.07);
	--digit-brand: #0A8754;
	--digit-brand-soft: rgba(10, 135, 84, 0.22);
	--digit-mint: #34d399;
	--digit-shadow-flat: 0 1px 0 rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.4);
	--digit-shadow-hover: 0 12px 32px -16px rgba(0, 0, 0, 0.65);
	--digit-surface-2: rgba(255, 255, 255, 0.04);
	/* NEUTRAL table tokens (embed_v27) — dark variants. */
	--digit-table-header: rgba(255, 255, 255, 0.04);
	--digit-table-hover: rgba(255, 255, 255, 0.05);

	/* Re-point the Frappe variable bridge at the dark surfaces. */
	--bg-color: var(--digit-paper);
	--fg-color: var(--digit-card);
	--card-bg: var(--digit-card);
	--text-color: var(--digit-ink);
	--heading-color: var(--digit-ink);
	--text-muted: var(--digit-muted);
	--subtle-fg: var(--digit-muted);
	--muted-text-color: var(--digit-muted);
	--control-bg: #1d2421;
	--control-bg-on-gray: #1d2421;
	--border-color: var(--digit-border);
	--dark-border-color: var(--digit-border);
	--btn-default-bg: #1d2421;
	--btn-default-hover-bg: var(--digit-brand-soft);
	color-scheme: dark;
}

html.digit-embedded[data-theme="dark"] body {
	background: var(--digit-paper) !important;
	color: var(--digit-body) !important;
}

.en,
.sub-en,
.kbd,
kbd,
.num,
.currency,
[data-fieldtype="Currency"] .control-value,
[data-fieldtype="Float"] .control-value,
[data-fieldtype="Int"] .control-value {
	font-family: var(--digit-font-latin) !important;
	letter-spacing: 0 !important;
}

code,
pre,
.monospace,
.command-key,
.awesomplete .text-muted {
	font-family: var(--digit-font-mono) !important;
}