/*
 * MDS ERP identity on the ERPNext / HRMS desk: MDS tokens mapped onto Frappe's Espresso variables,
 * so every screen follows them, in light and dark, LTR and RTL.
 *
 * BRAND COLOURS (temporary until the final MDS palette): change only the --mds-* values below.
 *   primary  #1B2541  MDS navy (from the logo)
 *   accent   #17A398  MDS teal (from the logo: active item, focus)
 */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap");

:root {
	--mds-brand-50: 238 241 247;
	--mds-brand-100: 214 220 234;
	--mds-brand-500: 44 62 108;
	--mds-brand-600: 27 37 65;
	--mds-brand-700: 18 26 48;
	--mds-brand-900: 12 17 32;
	--mds-accent: 23 163 152;
	--mds-canvas: 244 246 250;
	--mds-surface: 255 255 255;
	--mds-sunken: 238 241 246;
	--mds-line: 223 228 238;
	--mds-ink: 20 28 46;
	--mds-ink-soft: 74 84 108;
	--mds-ink-faint: 110 120 144;
	--mds-sidebar: 27 37 65;
	--mds-sidebar-ink: 196 210 236;

	--font-stack: "IBM Plex Sans", "IBM Plex Sans Arabic", system-ui, -apple-system, "Segoe UI", sans-serif;

	/* Frappe's blues become MDS blue: links, focus, selection, primary buttons. */
	--blue-50: rgb(var(--mds-brand-50));
	--blue-100: rgb(var(--mds-brand-100));
	--blue-200: rgb(var(--mds-brand-100));
	--blue-400: rgb(var(--mds-brand-500));
	--blue-500: rgb(var(--mds-brand-500));
	--blue-600: rgb(var(--mds-brand-600));
	--blue-700: rgb(var(--mds-brand-700));
	--primary: rgb(var(--mds-brand-600));
	--primary-color: rgb(var(--mds-brand-600));
	--btn-primary: rgb(var(--mds-brand-600));
	--surface-gray-10: rgb(var(--mds-brand-600));

	/* Canvas, cards, lines and text. */
	--surface-base: rgb(var(--mds-surface));
	--surface-gray-1: rgb(var(--mds-canvas));
	--surface-gray-2: rgb(var(--mds-sunken));
	--bg-color: rgb(var(--mds-canvas));
	--fg-color: rgb(var(--mds-surface));
	--card-bg: rgb(var(--mds-surface));
	--outline-gray-1: rgb(var(--mds-line));
	--border-color: rgb(var(--mds-line));
	--ink-gray-8: rgb(var(--mds-ink));
	--ink-gray-9: rgb(var(--mds-ink));
	--ink-gray-6: rgb(var(--mds-ink-soft));
	--ink-gray-5: rgb(var(--mds-ink-faint));
	--text-color: rgb(var(--mds-ink));
	--text-muted: rgb(var(--mds-ink-soft));
	--text-light: rgb(var(--mds-ink-faint));

	--desk-sidebar-bg: rgb(var(--mds-sidebar));
}

[data-theme="dark"] {
	--mds-brand-500: 140 180 240;
	--mds-brand-600: 52 110 196;
	--mds-brand-700: 80 134 214;
	--mds-canvas: 11 17 29;
	--mds-surface: 18 26 43;
	--mds-sunken: 25 34 54;
	--mds-line: 38 50 74;
	--mds-ink: 230 235 245;
	--mds-ink-soft: 168 180 202;
	--mds-ink-faint: 128 140 165;
	--mds-sidebar: 12 19 34;
	--mds-sidebar-ink: 170 184 214;
	--desk-sidebar-bg: rgb(var(--mds-sidebar));
}

body, input, textarea, select, button {
	font-family: var(--font-stack);
}

/* Sidebar: light text on deep blue; the active row marked in the accent. */
.body-sidebar, .body-sidebar-container {
	--ink-gray-8: rgb(var(--mds-sidebar-ink));
	--ink-gray-9: #fff;
	--ink-gray-6: rgb(var(--mds-sidebar-ink) / 0.75);
	--ink-gray-5: rgb(var(--mds-sidebar-ink) / 0.6);
	--surface-gray-2: rgb(255 255 255 / 0.08);
	--surface-gray-3: rgb(255 255 255 / 0.12);
	color: rgb(var(--mds-sidebar-ink));
}
.body-sidebar .standard-sidebar-item.selected,
.body-sidebar .sidebar-item-container.selected > .standard-sidebar-item,
.body-sidebar a.selected {
	background: rgb(255 255 255 / 0.1);
	box-shadow: inset 3px 0 0 rgb(var(--mds-accent));
	color: #fff;
}
[dir="rtl"] .body-sidebar .standard-sidebar-item.selected,
[dir="rtl"] .body-sidebar .sidebar-item-container.selected > .standard-sidebar-item,
[dir="rtl"] .body-sidebar a.selected {
	box-shadow: inset -3px 0 0 rgb(var(--mds-accent));
}

/* Primary actions and focus in the brand colours. */
.btn-primary, .btn.btn-primary {
	background-color: rgb(var(--mds-brand-600));
	border-color: rgb(var(--mds-brand-600));
	color: #fff;
}
.btn-primary:hover, .btn.btn-primary:hover {
	background-color: rgb(var(--mds-brand-700));
	border-color: rgb(var(--mds-brand-700));
}
a, .text-primary { color: rgb(var(--mds-brand-500)); }
:focus-visible { outline: 2px solid rgb(var(--mds-accent)); outline-offset: 1px; }

.indicator-pill.blue, .indicator.blue::before { --indicator-color: rgb(var(--mds-brand-500)); }

/* Login page: the MDS card on the canvas. */
.page-card, .for-login .page-card {
	border-radius: 10px;
	border: 1px solid rgb(var(--mds-line));
	box-shadow: none;
}
.for-login .page-card-head img, .page-card-head .app-logo { max-height: 56px; }

/* White-label: no app switcher, apps screen or upstream help entries. */
.app-switcher-dropdown, .apps-switcher, [data-label="Apps"], .dropdown-item[href="/apps"], a[href="/apps"] { display: none !important; }
