/* Digit Home visual match.
   Scoped to /app/digit-home only through body.digit-home-active.
   Reference: 06-Product-Blueprint/01-system-home.html */

body.digit-home-active {
	background: var(--digit-paper, #F4F3EE) !important;
	color: var(--digit-body, #33433B) !important;
	font-family: var(--digit-font-arabic, "IBM Plex Sans Arabic", Tahoma, Arial, sans-serif) !important;
}

body.digit-home-active .navbar {
	min-height: 55px !important;
	background: #fff !important;
	border-bottom: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14)) !important;
	box-shadow: none !important;
}

body.digit-home-active .navbar .search-bar,
body.digit-home-active .navbar .awesomplete > input {
	height: 34px !important;
	max-width: 480px !important;
	border-radius: 8px !important;
	background: var(--digit-paper, #F4F3EE) !important;
	border: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14)) !important;
	color: var(--digit-muted, #71807A) !important;
}

body.digit-home-active .page-container,
body.digit-home-active .page-content,
body.digit-home-active .page-body {
	max-width: none !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	background: var(--digit-paper, #F4F3EE) !important;
}

body.digit-home-active:not(.digit-home-official) .page-head,
body.digit-home-active:not(.digit-home-official) .layout-main,
body.digit-home-active:not(.digit-home-official) .layout-side-section,
body.digit-home-active:not(.digit-home-official) .layout-main-section-wrapper,
body.digit-home-active:not(.digit-home-official) .layout-main-section {
	display: none !important;
}

body.digit-home-active .digit-home-main > .sticky-top {
	display: none !important;
}

body.digit-home-active.digit-home-official .page-head {
	display: none !important;
}

body.digit-home-active.digit-home-official .layout-main-section-wrapper,
body.digit-home-active.digit-home-official .layout-main-section,
body.digit-home-active.digit-home-official .page-content {
	margin: 0 !important;
	padding: 0 !important;
	max-width: none !important;
	width: 100% !important;
	background: var(--digit-paper, #F4F3EE) !important;
}

.digit-home-page,
.digit-home-page * {
	box-sizing: border-box;
	letter-spacing: 0 !important;
}

.digit-home-page {
	direction: rtl;
	min-height: calc(100vh - 55px);
	background: var(--digit-paper, #F4F3EE);
	color: var(--digit-body, #33433B);
	font: 400 13px/1.6 var(--digit-font-arabic, "IBM Plex Sans Arabic", Tahoma, Arial, sans-serif);
}

.digit-home-shell {
	display: grid;
	grid-template-columns: 248px minmax(0, 1fr);
	min-height: calc(100vh - 55px);
}

.digit-home-sidebar {
	position: sticky;
	top: 55px;
	height: calc(100vh - 55px);
	overflow-y: auto;
	background: #fff;
	border-inline-start: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14));
	padding: 14px 10px;
}

.digit-home-brand {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 9px;
	direction: ltr;
	padding: 4px 10px 14px;
	color: var(--digit-ink, #0B1F17);
}

.digit-home-brand img {
	width: 26px;
	height: 26px;
	object-fit: contain;
}

.digit-home-brand strong {
	font: 800 15px/1 var(--digit-font-latin, Archivo, Arial, sans-serif);
	color: var(--digit-ink, #0B1F17);
}

.digit-home-side-section {
	padding: 14px 10px 4px;
	color: var(--digit-muted, #71807A);
	font: 700 10px/1.2 var(--digit-font-mono, Consolas, monospace);
	text-transform: uppercase;
}

.digit-home-side-item {
	display: grid;
	grid-template-columns: 18px minmax(0, 1fr);
	align-items: center;
	gap: 10px;
	min-height: 36px;
	padding: 8px 10px;
	margin-bottom: 1px;
	border-radius: 8px;
	color: var(--digit-body, #33433B);
	text-decoration: none;
	font-weight: 600;
}

.digit-home-side-item:hover,
.digit-home-side-item.is-active {
	background: var(--digit-brand-soft, #E6F3EC);
	color: var(--digit-brand-deep, #064E3B);
}

.digit-home-side-item img {
	width: 18px;
	height: 18px;
	object-fit: contain;
}

.digit-home-side-item small {
	display: block;
	color: var(--digit-muted, #71807A);
	font: 600 10px/1.2 var(--digit-font-latin, Archivo, Arial, sans-serif);
}

.digit-home-main {
	min-width: 0;
	padding: 18px 24px 60px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.digit-home-topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	min-height: 52px;
	background: #fff;
	border: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14));
	border-radius: 12px;
	padding: 8px 12px;
	box-shadow: 0 1px 2px rgba(6, 78, 59, 0.04);
}

.digit-home-user,
.digit-home-logo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	color: var(--digit-ink, #0B1F17);
	text-decoration: none;
}

.digit-home-user a {
	color: var(--digit-body, #33433B);
	font-weight: 700;
	text-decoration: none;
}

.digit-home-avatar {
	display: inline-grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 9px;
	background: var(--digit-brand-soft, #E6F3EC);
	color: var(--digit-brand-deep, #064E3B);
	border: 1px solid rgba(10, 135, 84, 0.2);
	font: 800 11px/1 var(--digit-font-latin, Archivo, Arial, sans-serif);
}

.digit-home-icon-btn {
	display: inline-grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 8px;
	border: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14));
	background: #fff;
}

.digit-home-icon-btn img {
	width: 17px;
	height: 17px;
}

.digit-home-search {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: min(460px, 42vw);
	min-height: 36px;
	padding: 0 12px;
	border-radius: 9px;
	border: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14));
	background: var(--digit-paper, #F4F3EE);
	color: var(--digit-muted, #71807A);
	font: 600 12px/1.2 var(--digit-font-latin, Archivo, Arial, sans-serif);
	direction: ltr;
}

.digit-home-search img,
.digit-home-logo img {
	width: 20px;
	height: 20px;
}

.digit-home-logo strong {
	font: 800 14px/1 var(--digit-font-latin, Archivo, Arial, sans-serif);
	color: var(--digit-ink, #0B1F17);
}

.digit-home-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.digit-home-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 33px;
	padding: 7px 14px;
	border: 1px solid transparent;
	border-radius: 8px;
	background: #fff;
	color: var(--digit-body, #33433B);
	font-weight: 700;
	font-size: 12.5px;
	text-decoration: none;
	box-shadow: none;
}

.digit-home-btn:hover {
	background: var(--digit-paper, #F4F3EE);
	border-color: var(--digit-border, rgba(6, 78, 59, 0.14));
	color: var(--digit-brand-deep, #064E3B);
	text-decoration: none;
}

.digit-home-btn.is-primary {
	background: var(--digit-brand, #0A8754);
	border-color: var(--digit-brand, #0A8754);
	color: #fff;
}

.digit-home-btn.is-primary:hover {
	background: var(--digit-brand-deep, #064E3B);
	color: #fff;
}

.digit-home-btn img {
	width: 15px;
	height: 15px;
}

.digit-home-hero {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	padding: 4px 2px 0;
}

.digit-home-title h1 {
	margin: 0;
	color: var(--digit-ink, #0B1F17);
	font: 800 22px/1.35 var(--digit-font-arabic, "IBM Plex Sans Arabic", Tahoma, Arial, sans-serif);
}

.digit-home-title p {
	margin: 2px 0 0;
	color: var(--digit-muted, #71807A);
	font-size: 12.5px;
}

.digit-home-title .sub-en {
	display: inline-block;
	margin-top: 2px;
	color: var(--digit-muted, #71807A);
	font: 700 10.5px/1.3 var(--digit-font-latin, Archivo, Arial, sans-serif);
}

.digit-home-grid {
	display: grid;
	gap: 12px;
}

.digit-home-grid.kpis {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.digit-home-grid.kpis .digit-home-kpi-empty {
	grid-column: 1 / -1;
}

.digit-home-grid.modules {
	grid-template-columns: repeat(8, minmax(0, 1fr));
}

.digit-home-grid.lower {
	grid-template-columns: 1.1fr 1fr 1fr;
	align-items: stretch;
}

.digit-home-card,
.digit-home-module {
	background: #fff;
	border: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14));
	border-radius: 10px;
	box-shadow: var(--digit-shadow-flat, 0 1px 0 rgba(6, 78, 59, 0.05), 0 1px 2px rgba(6, 78, 59, 0.06));
}

.digit-home-card {
	padding: 14px 16px;
	min-width: 0;
}

.digit-home-card h3 {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 10px;
	color: var(--digit-ink, #0B1F17);
	font-size: 13px;
	font-weight: 700;
}

.digit-home-card h3 small {
	color: var(--digit-muted, #71807A);
	font: 700 10px/1.2 var(--digit-font-latin, Archivo, Arial, sans-serif);
}

.digit-home-card h3 a {
	margin-inline-start: auto;
	color: var(--digit-brand, #0A8754);
	font-size: 11.5px;
	text-decoration: none;
}

.digit-home-kpi {
	min-height: 96px;
}

.digit-home-kpi .label {
	color: var(--digit-muted, #71807A);
	font-size: 11.5px;
	font-weight: 500;
}

.digit-home-kpi .value {
	margin: 2px 0;
	color: var(--digit-ink, #0B1F17);
	font: 800 20px/1.3 var(--digit-font-latin, Archivo, Arial, sans-serif);
	direction: ltr;
	text-align: right;
}

.digit-home-kpi .delta {
	color: var(--digit-success, #067647);
	font-size: 11px;
	font-weight: 700;
}

.digit-home-kpi .delta.is-danger {
	color: var(--digit-error, #B42318);
}

.digit-home-section-title {
	display: flex;
	align-items: center;
	gap: 8px;
	justify-content: flex-start;
	color: var(--digit-ink, #0B1F17);
	font-weight: 700;
	font-size: 13px;
}

.digit-home-section-title .sub-en {
	color: var(--digit-muted, #71807A);
	font: 700 10px/1.2 var(--digit-font-latin, Archivo, Arial, sans-serif);
}

.digit-home-module {
	min-height: 104px;
	padding: 14px 8px 12px;
	text-align: center;
	text-decoration: none;
	color: var(--digit-ink, #0B1F17);
	transition: box-shadow 120ms ease, transform 120ms ease, border-color 120ms ease;
}

.digit-home-module:hover {
	box-shadow: var(--digit-shadow-hover, 0 4px 14px rgba(6, 78, 59, 0.12));
	transform: translateY(-1px);
	border-color: rgba(10, 135, 84, 0.28);
	text-decoration: none;
	color: var(--digit-brand-deep, #064E3B);
}

.digit-home-module-icon {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin: 0 auto 8px;
	border-radius: 10px;
	background: var(--digit-brand-soft, #E6F3EC);
}

.digit-home-module-icon img {
	width: 24px;
	height: 24px;
	object-fit: contain;
}

.digit-home-module strong {
	display: block;
	color: inherit;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
}

.digit-home-module span {
	display: block;
	color: var(--digit-muted, #71807A);
	font: 700 10px/1.2 var(--digit-font-latin, Archivo, Arial, sans-serif);
}

.digit-home-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 12px;
}

.digit-home-table td,
.digit-home-table th {
	padding: 8px 10px;
	border-bottom: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14));
	text-align: right;
}

.digit-home-table tr:last-child td {
	border-bottom: 0;
}

.digit-home-table tr:hover td {
	background: var(--digit-paper, #F4F3EE);
}

.digit-home-num {
	font-family: var(--digit-font-latin, Archivo, Arial, sans-serif);
	font-weight: 700;
	color: var(--digit-ink, #0B1F17);
	direction: ltr;
}

.digit-home-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	min-height: 20px;
	padding: 2px 9px;
	border-radius: 999px;
	font-size: 10.5px;
	font-weight: 700;
	white-space: nowrap;
}

.digit-home-badge::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 999px;
	background: currentColor;
}

.digit-home-badge.ok {
	background: var(--digit-success-bg, #ECFDF3);
	color: var(--digit-success, #067647);
}

.digit-home-badge.warn {
	background: var(--digit-warning-bg, #FFFAEB);
	color: var(--digit-warning, #B54708);
}

.digit-home-badge.err {
	background: var(--digit-error-bg, #FEF3F2);
	color: var(--digit-error, #B42318);
}

.digit-home-badge.mut {
	background: var(--digit-paper, #F4F3EE);
	color: var(--digit-muted, #71807A);
	border: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14));
}

.digit-home-chip-row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.digit-home-alert {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 10px;
	align-items: start;
	border-radius: 8px;
	padding: 10px 12px;
	border: 1px solid var(--digit-border, rgba(6, 78, 59, 0.14));
	background: #fff;
}

.digit-home-alert.err {
	background: var(--digit-error-bg, #FEF3F2);
	border-color: #FECDCA;
}

.digit-home-alert.info {
	background: var(--digit-info-bg, #EFF8FF);
	border-color: #B2DDFF;
}

.digit-home-alert img {
	width: 20px;
	height: 20px;
}

.digit-home-alert strong {
	color: var(--digit-ink, #0B1F17);
	font-size: 12.5px;
}

.digit-home-alert p {
	margin: 2px 0 0;
	font-size: 12px;
	color: var(--digit-body, #33433B);
}

.digit-home-empty {
	display: grid;
	align-content: center;
	min-height: 74px;
	padding: 12px;
	border: 1px dashed rgba(6, 78, 59, 0.18);
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.62);
	color: var(--digit-muted, #71807A);
	font-size: 12px;
	line-height: 1.6;
}

.digit-home-empty strong {
	color: var(--digit-ink, #0B1F17);
	font-size: 13px;
}

.digit-home-empty p {
	margin: 2px 0 0;
}

.digit-home-empty.is-compact {
	min-height: 34px;
	padding: 8px 12px;
}

.digit-home-empty-wide {
	grid-column: 1 / -1;
}

.digit-home-side-empty {
	margin: 10px;
	padding: 10px;
	border-radius: 8px;
	background: var(--digit-brand-soft, #E6F3EC);
	color: var(--digit-muted, #71807A);
	font-size: 12px;
	text-align: center;
}

.digit-home-loading {
	display: grid;
	place-items: center;
	align-content: center;
	gap: 8px;
	min-height: calc(100vh - 55px);
	padding: 32px;
	text-align: center;
	color: var(--digit-body, #33433B);
}

.digit-home-loading-mark {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 14px;
	background: var(--digit-brand-soft, #E6F3EC);
}

.digit-home-loading-mark img {
	width: 28px;
	height: 28px;
}

.digit-home-loading strong {
	color: var(--digit-ink, #0B1F17);
	font-size: 16px;
}

.digit-home-loading p {
	max-width: 420px;
	margin: 0;
	color: var(--digit-muted, #71807A);
	font-size: 12.5px;
}

.digit-home-error {
	background: var(--digit-error-bg, #FEF3F2);
}

@media (max-width: 1200px) {
	.digit-home-grid.modules {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.digit-home-grid.lower {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 900px) {
	.digit-home-shell {
		grid-template-columns: 1fr;
	}

	.digit-home-sidebar {
		display: none;
	}

	.digit-home-main {
		padding: 16px;
	}

	.digit-home-topbar,
	.digit-home-hero {
		display: grid;
		grid-template-columns: 1fr;
	}

	.digit-home-search {
		width: 100%;
		order: 3;
	}

	.digit-home-grid.kpis,
	.digit-home-grid.modules,
	.digit-home-grid.lower {
		grid-template-columns: 1fr;
	}
}