:root {
	--bg: #f4f7fb;
	--panel: #ffffff;
	--surface: #f8fafc;
	--border: #d8e0ea;
	--text: #1f2937;
	--muted: #667085;
	--scrollbar-track: #dfe8f2;
	--scrollbar-thumb: #8da6c0;
	--scrollbar-thumb-hover: #6f8daa;
	--control-bg: #ffffff;
	--checkbox-border: rgba(4, 32, 69, 0.1);
	--switch-track-off: #ffffff;
	--switch-track-border: rgba(4, 32, 69, 0.1);
	--switch-thumb-off: #e5e7eb;
	--hover: #eef6ff;
	--primary: #066fd1;
	--primary-dark: #055fb3;
	--danger: #d63939;
	--success: #2fb344;
	--warning: #f59f00;
	--sidebar-bg: #ffffff;
	--sidebar-active: #eef6ff;
	--shadow: 0 10px 28px rgba(29, 39, 58, 0.08);
	--datasource-card-bg: #ffffff;
	--datasource-card-head-bg: linear-gradient(180deg, #f9fbfd 0%, #f4f7fb 100%);
	--datasource-row-border: #eef2f6;
	--datasource-row-alt: #fcfdff;
	--datasource-badge-bg: #eaf2ff;
	--datasource-badge-text: #2459a6;
	--datasource-premium-bg: #fff1cc;
	--datasource-premium-text: #8a5d00;
	--customer-premium-star: #f59f00;
	--datasource-node-bg: #7aa7e0;
	--datasource-node-child-bg: #9ac46b;
	--datasource-tag-full-bg: #e8f7ec;
	--datasource-tag-full-text: #23793e;
	--datasource-tag-simulated-bg: #fff4dd;
	--datasource-tag-simulated-text: #8a5d00;
	--datasource-tag-unknown-bg: #f2f4f7;
	--datasource-tag-unknown-text: #667085;
	--datasource-tag-active-bg: #e8f7ec;
	--datasource-tag-active-text: #23793e;
	--datasource-tag-inactive-bg: #fdebec;
	--datasource-tag-inactive-text: #b42318;
	--datasource-tag-latest-bg: #e8f0ff;
	--datasource-tag-latest-text: #2459a6;
	--datasource-tag-history-bg: #f4ebff;
	--datasource-tag-history-text: #7a35c2;
	--datasource-empty-text: #98a2b3;
	--login-bg: #e7edf4;
	--login-card-bg: #fdfefe;
	--login-form-bg: #fdfefe;
	--login-card-shadow: 0 16px 38px rgba(29, 39, 58, 0.12);
	--login-title-color: #1f68b5;
	--login-heading-color: #223247;
	--login-label-color: #314155;
	--login-input-bg: #f4f7fa;
	--login-input-border: #c7d1dc;
	--login-input-text: #223247;
	--login-toggle-color: #5d6b7c;
	--login-toggle-hover-bg: #e7eef7;
	--login-link-color: #1f68b5;
	--login-checkbox-bg: #ffffff;
	--login-checkbox-border: #c7d1dc;
	--login-error-bg: #fbecec;
	--login-error-border: #ebbbbb;
	--login-error-text: #a33434;
	--login-hint-warning-bg: #f8f1df;
	--login-hint-warning-border: #d8b55e;
	--login-hint-warning-text: #7c5712;
	--login-hint-danger-bg: #fbecec;
	--login-hint-danger-border: #ebbbbb;
	--login-hint-danger-text: #a33434;
	/* Tabler-compatible font variable */
	--tblr-body-font-family: "Inter Var", Inter, -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}

body[data-theme="dark"] {
	--bg: #0f172a;
	--panel: #182235;
	--surface: #111827;
	--border: #314057;
	--text: #e5edf8;
	--muted: #9aa8bd;
	--scrollbar-track: #162132;
	--scrollbar-thumb: #4a5b73;
	--scrollbar-thumb-hover: #5f738f;
	--control-bg: #111827;
	--checkbox-border: rgba(72, 110, 149, 0.14);
	--switch-track-off: #111827;
	--switch-track-border: rgba(72, 110, 149, 0.14);
	--switch-thumb-off: rgba(255, 255, 255, 0.25);
	--hover: #1d2a3f;
	--primary: #066fd1;
	--primary-dark: #055fb3;
	--sidebar-bg: #111827;
	--sidebar-active: #17365d;
	--shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
	--datasource-card-bg: #121c2d;
	--datasource-card-head-bg: linear-gradient(180deg, #1c2940 0%, #162338 100%);
	--datasource-row-border: #29384d;
	--datasource-row-alt: #152033;
	--datasource-badge-bg: #203456;
	--datasource-badge-text: #bcd7ff;
	--datasource-premium-bg: #4a3513;
	--datasource-premium-text: #ffd37a;
	--customer-premium-star: #ffd37a;
	--datasource-node-bg: #6faef8;
	--datasource-node-child-bg: #93d36d;
	--datasource-tag-full-bg: #173f2a;
	--datasource-tag-full-text: #9fe3ad;
	--datasource-tag-simulated-bg: #4a3513;
	--datasource-tag-simulated-text: #ffd37a;
	--datasource-tag-unknown-bg: #243246;
	--datasource-tag-unknown-text: #c2cedd;
	--datasource-tag-active-bg: #123824;
	--datasource-tag-active-text: #8ee0a4;
	--datasource-tag-inactive-bg: #481d22;
	--datasource-tag-inactive-text: #ffb4b4;
	--datasource-tag-latest-bg: #17375f;
	--datasource-tag-latest-text: #9cc8ff;
	--datasource-tag-history-bg: #35204c;
	--datasource-tag-history-text: #d3b6ff;
	--datasource-empty-text: #9aa8bd;
	--login-bg: #111827;
	--login-card-bg: #182235;
	--login-form-bg: #182235;
	--login-card-shadow: 0 18px 42px rgba(0, 0, 0, 0.34);
	--login-title-color: #9cc8ff;
	--login-heading-color: #e5edf8;
	--login-label-color: #c9d5e6;
	--login-input-bg: #111827;
	--login-input-border: #314057;
	--login-input-text: #e5edf8;
	--login-toggle-color: #9aa8bd;
	--login-toggle-hover-bg: #20304a;
	--login-link-color: #9cc8ff;
	--login-checkbox-bg: #111827;
	--login-checkbox-border: #4a5b73;
	--login-error-bg: #3a1f25;
	--login-error-border: #74414c;
	--login-error-text: #ffb4b4;
	--login-hint-warning-bg: #413114;
	--login-hint-warning-border: #8f6b20;
	--login-hint-warning-text: #ffd37a;
	--login-hint-danger-bg: #3a1f25;
	--login-hint-danger-border: #74414c;
	--login-hint-danger-text: #ffb4b4;
	--cancel-btn-min-width: 74px;
}

* { box-sizing: border-box; }

html, body { min-height: 100%; }

body {
	margin: 0;
	background: var(--bg);
	color: var(--text);
	font: 14px/1.45 var(--tblr-body-font-family);
	padding-bottom: 34px;
}

button, input { font: inherit; }
[hidden] { display: none !important; }

.login-outer {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: var(--login-bg);
}

.login-card {
	display: flex;
	background: var(--login-card-bg);
	box-shadow: var(--login-card-shadow);
	overflow: hidden;
	width: auto;
	min-height: 500px;
	position: relative;
}

.login-outer.is-checking .login-card {
	visibility: hidden;
	pointer-events: none;
}

.login-left,
.login-right {
	display: flex;
	align-items: center;
	justify-content: center;
}

.login-left {
	flex: 1 1 0;
	flex-direction: column;
	padding: 0 32px 2px;
	background: var(--login-form-bg);
	position: relative;
}

.login-top-bar {
	position: absolute;
	top: 14px;
	right: 14px;
	width: auto;
	height: auto;
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 0;
	box-sizing: border-box;
	z-index: 5;
}

.login-right {
	flex: 0 0 288px;
	margin-left: 20px;
	margin-right: 20px;
	background: var(--login-card-bg);
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.login-right img {
	width: 400px;
	max-width: 100%;
	height: auto;
	display: block;
	position: relative;
	z-index: 1;
}

body[data-theme="dark"] .login-right {
	background:
		radial-gradient(circle at 24% 28%, rgba(6, 111, 209, 0.22), transparent 0 24%),
		radial-gradient(circle at 78% 72%, rgba(143, 192, 255, 0.14), transparent 0 18%),
		linear-gradient(180deg, #142033 0%, #0f172a 100%);
}

body[data-theme="dark"] .login-right img {
	content: url("../images/login-dark.png");
	max-width: 82%;
	padding: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	filter: none;
}

body[data-theme="dark"] .login-title img {
	content: url("../images/sarus-small-dark.png");
}

.login-title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-bottom: 18px;
	color: var(--login-title-color);
	font-size: 27px;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.login-title img {
	width: 57px;
	height: 57px;
	object-fit: contain;
}

.login-theme-toggle {
	position: static;
	transform: none;
}

.login-theme-toggle:hover,
.login-theme-toggle:focus,
.login-theme-toggle:active,
.login-theme-toggle:focus-visible {
	background: transparent !important;
	border-color: transparent !important;
	box-shadow: none !important;
	outline: none !important;
	color: var(--muted) !important;
}

.login-theme-toggle .toolbar-icon {
	width: 16px;
	height: 16px;
}

.login-form-title {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 18px;
	color: var(--login-heading-color);
}

.login-form {
	width: 100%;
	max-width: 286px;
}

.login-form label {
	display: block;
	margin-bottom: 6px;
	font-weight: 500;
	color: var(--login-label-color);
}

.login-form input[type="text"],
.login-form input[type="password"] {
	width: 100%;
	border: 1px solid var(--login-input-border);
	border-radius: 6px;
	background: var(--login-input-bg);
	color: var(--login-input-text);
	padding: 10px 12px;
	margin-bottom: 18px;
	outline: none;
}

.password-input-wrap {
	position: relative;
	margin-bottom: 18px;
}

.password-input-wrap input[type="password"],
.password-input-wrap input[type="text"] {
	margin-bottom: 0;
	padding-right: 42px;
}

.password-toggle {
	position: absolute;
	top: 50%;
	right: 6px;
	width: 32px;
	height: 32px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 4px;
	background: transparent;
	color: var(--login-toggle-color);
	cursor: pointer;
	transform: translateY(-50%);
}

.password-toggle:hover {
	background: var(--login-toggle-hover-bg);
	color: var(--login-title-color);
}

.password-toggle:disabled {
	cursor: not-allowed;
	opacity: 0.55;
}

.password-icon {
	position: relative;
	width: 18px;
	height: 18px;
	display: inline-block;
}

.password-icon svg { display: block; width: 18px; height: 18px; }
.password-icon::after { content: none; }

.password-icon.hidden::before {
	content: "";
	position: absolute;
	left: 50%;
	top: -2px;
	width: 2px;
	height: 22px;
	background: currentColor;
	transform: rotate(45deg);
	transform-origin: center;
}

.password-label-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	font-size: 13px;
}

.password-label-row a {
	color: var(--login-link-color);
	text-decoration: none;
	white-space: nowrap;
}

.remember {
	display: flex !important;
	align-items: center;
	gap: 7px;
	font-weight: 400 !important;
	font-size: 13px;
	margin: 0 0 16px !important;
}

.login-outer input[type="checkbox"] {
	width: 16px;
	height: 16px;
	background-color: var(--login-checkbox-bg);
	border: 1px solid var(--login-checkbox-border);
	border-radius: 4px;
	box-shadow: none;
}

.login-outer input[type="checkbox"]:checked {
	background-color: var(--primary);
	border-color: var(--primary);
}

.login-outer input[type="checkbox"]:focus {
	border-color: var(--primary);
	box-shadow: 0 0 0 0.2rem rgba(6, 111, 209, 0.18);
}

.login-form input:disabled {
	cursor: not-allowed;
	opacity: 0.72;
}

.login-error {
	border: 1px solid var(--login-error-border);
	background: var(--login-error-bg);
	color: var(--login-error-text);
	border-radius: 6px;
	padding: 8px 10px;
	margin-bottom: 12px;
	font-size: 13px;
}

.login-form button[type="submit"] {
	width: 100%;
	border: 0;
	border-radius: 4px;
	background: var(--primary);
	color: #fff;
	font-size: 17px;
	font-weight: 600;
	margin-top: 30px;
	padding: 10px 0;
	cursor: pointer;
}

.login-form button:disabled {
	opacity: 1;
	cursor: not-allowed;
	background: #d1d5db !important;
	color: #6b7280 !important;
	border: 1px solid #c5ccd6 !important;
	box-shadow: none;
	filter: none;
}

#loginSubmitBtn:disabled {
	background: #d1d5db !important;
	color: #6b7280 !important;
	border-color: #c5ccd6 !important;
}

.login-auto-breadcrumb {
	position: fixed;
	left: 50%;
	top: 50%;
	z-index: 60;
	min-width: min(360px, calc(100vw - 48px));
	transform: translate(-50%, -50%);
	border: 1px solid rgba(148, 163, 184, 0.38);
	border-radius: 6px;
	background: rgba(17, 24, 39, 0.94);
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28);
	padding: 14px 18px;
	font-size: 15px;
	font-weight: 600;
	color: #e5edf8;
	text-align: center;
	letter-spacing: 0;
}

body[data-theme="light"] .login-auto-breadcrumb {
	background: rgba(255, 255, 255, 0.96);
	color: #223247;
	box-shadow: 0 18px 44px rgba(29, 39, 58, 0.16);
}

/* Inline hint box (below Sign in button, full left-panel width) */
.login-hint-box {
	width: 100%;
	border-radius: 6px;
	padding: 10px 14px;
	border: 1px solid;
	font-size: 13px;
	line-height: 1.5;
	margin-top: 12px;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
}

.login-hint-box__text {
	flex: 1 1 auto;
	min-width: 0;
}

.login-hint-box__close {
	border: 0;
	background: transparent;
	color: inherit;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	padding: 0;
	margin: 0;
	opacity: 0.72;
}

.login-hint-box__close:hover,
.login-hint-box__close:focus {
	opacity: 1;
	outline: none;
}

.login-hint-box--warning {
	background: var(--login-hint-warning-bg);
	border-color: var(--login-hint-warning-border);
	color: var(--login-hint-warning-text);
}

.login-hint-box--danger {
	background: var(--login-hint-danger-bg);
	border-color: var(--login-hint-danger-border);
	color: var(--login-hint-danger-text);
}

/* Send-code button outside the form (inherits fp-btn, needs full width) */
#loginSendCodeBtn {
	margin-top: 10px;
	width: 100%;
}

/* Forgot-password validation alert — floating overlay (Tabler alert-orange style) */
.login-fp-alert-overlay {
	position: fixed;
	inset: 0;
	z-index: 9990;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}
.login-fp-alert {
	pointer-events: auto;
	position: relative;
	width: min(460px, 90vw);
	padding: 1rem 3rem 1rem 1rem;
	background: rgba(247, 103, 7, 0.9);
	border: 1px solid #f76707;
	border-left: 4px solid rgba(255,255,255,0.5);
	border-radius: 6px;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
	display: flex;
	flex-direction: row;
	gap: 0.75rem;
	align-items: flex-start;
}
.login-fp-alert__icon {
	color: #fff;
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	margin-top: 1px;
}
.login-fp-alert__text {
	flex: 1 1 auto;
	font-size: 0.875rem;
	line-height: 1.5;
	color: #fff;
}
.login-fp-alert__close {
	position: absolute;
	top: 0.6rem;
	right: 0.75rem;
	background: transparent;
	border: 0;
	color: #fff;
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
	padding: 0;
	opacity: 0.85;
}
.login-fp-alert__close:hover {
	opacity: 1;
	outline: none;
}

.app-shell {
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
	height: calc(100vh - 34px);
	min-height: calc(100vh - 34px);
}

.app-body {
	display: grid;
	grid-template-columns: 244px minmax(0, 1fr);
	height: 100%;
	min-height: 0;
}

.sidebar {
	position: sticky;
	top: 46px;
	height: calc(100vh - 80px);
	display: flex;
	flex-direction: column;
	background: var(--sidebar-bg);
	border-right: 1px solid var(--border);
	padding: 16px 16px;
}

.brand {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 6px 4px 18px;
	cursor: pointer;
}

.brand-avatar {
	width: 48px;
	height: 48px;
	object-fit: contain;
	flex-shrink: 0;
}

.brand-name { font-weight: 700; font-size: 15px; color: var(--text); line-height: 1.25; }
.brand-subtitle { color: var(--muted); font-size: 12.5px; line-height: 1.3; }

.nav {
	display: flex;
	flex-direction: column;
	padding-top: 12px;
	overflow: auto;
}

.nav-separator {
	height: 0;
	border-top: 1px solid var(--border);
	margin: 14px 6px;
}

.nav-link,
.nav-group {
	width: 100%;
	border: 0;
	border-radius: 4px;
	background: transparent;
	color: var(--muted);
	text-align: left;
	padding: 7px 8px;
	cursor: pointer;
	font-size: 13.5px;
}

.nav > .nav-link {
	padding-left: 0;
	padding-right: 0;
}

.nav-link:hover,
.nav-group:hover {
	background: var(--hover);
	color: var(--text);
}

.nav-link.active {
	background: transparent;
	color: var(--primary);
	font-weight: 650;
}

.nav-group {
	position: relative;
	color: var(--text);
	font-weight: 650;
	padding: 7px 8px 7px 0;
}

.nav-group::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 2px;
	width: 7px;
	height: 7px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-65%) rotate(45deg);
	opacity: 0.65;
}

.nav-group[aria-expanded="false"]::after {
	transform: translateY(-35%) rotate(-45deg);
}

.nav-group-items {
	display: flex;
	flex-direction: column;
	margin: 4px 0 0;
}

.nav-link.child {
	padding-left: 28px;
}

.nav-group.child {
	padding-left: 28px;
}

.nav-group-items.nested {
	margin-top: 0;
}

.nav-link.grandchild {
	padding-left: 42px;
}

.nav-link.danger {
	color: var(--danger);
	margin-top: 8px;
}

.main {
	min-width: 0;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 46px;
	padding: 6px;
	background: var(--panel);
	border-bottom: 1px solid var(--border);
}

.topbar-brand {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

.topbar h1 {
	margin: 0;
	font-size: 21px;
	font-weight: 650;
}

.topbar p {
	margin: 2px 0 0;
	color: var(--muted);
	font-size: 13px;
}

.topbar-actions {
	display: flex;
	align-items: center;
	gap: 4px;
}

.btn {
	border: 1px solid var(--border);
	background: var(--control-bg);
	color: var(--text);
	border-radius: 4px;
	padding: 7px 12px;
	cursor: pointer;
	min-height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
}

.btn:hover { background: var(--hover); }
.btn-primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-dark); }
.btn-danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.btn-danger:hover { background: #b92f2f; }
.btn-icon {
	position: relative;
	width: 34px;
	height: 34px;
	min-height: 34px;
	padding: 0;
	border-color: transparent;
	background: transparent;
	color: var(--muted);
	border-radius: 4px;
	transition: background 0.12s, color 0.12s;
}

.btn-icon:hover,
.btn-icon:focus {
	background: var(--hover);
	color: var(--text);
	border-color: transparent;
	outline: none;
}

.theme-toggle { color: var(--muted); }

.nav-action {
	overflow: visible;
}

.toolbar-icon {
	width: 20px;
	height: 20px;
	display: block;
	color: inherit;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.75;
	stroke-linecap: round;
	stroke-linejoin: round;
}

#themeIconMoon { display: block; }
#themeIconSun { display: none; }
body[data-theme="dark"] #themeIconMoon { display: none !important; }
body[data-theme="dark"] #themeIconSun { display: block !important; }
#loginThemeIconMoon { display: block !important; }
#loginThemeIconSun { display: none !important; }
body[data-theme="dark"] #loginThemeIconMoon { display: none !important; }
body[data-theme="dark"] #loginThemeIconSun { display: block !important; }

.alert-dot {
	position: absolute;
	top: 3px;
	right: 2px;
	width: 8px;
	height: 8px;
	border: 2px solid var(--panel);
	border-radius: 50%;
	background: var(--success);
}

.alert-dot--success {
	background: var(--success);
}

.alert-dot--warning {
	background: #d97706;
}

.alert-dot--error {
	background: var(--danger);
}

.alert-dot.is-flashing {
	animation: alerts-dot-pulse 1.45s ease-in-out infinite;
}

@keyframes alerts-dot-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: 0.28; transform: scale(0.84); }
}

.alerts-panel {
	position: absolute;
	top: 52px;
	right: 126px;
	width: min(380px, calc(100vw - 24px));
	max-height: min(440px, calc(100vh - 90px));
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 44px rgba(15, 23, 42, 0.28);
	overflow: hidden;
	z-index: 1600;
}

.alerts-panel[hidden] {
	display: none;
}

.alerts-panel-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 14px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
	color: var(--text);
}

.alerts-panel-clear {
	border: 0;
	background: transparent;
	color: var(--primary);
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	padding: 0;
}

.alerts-panel-list {
	display: grid;
	gap: 0;
	overflow: auto;
	min-height: 84px;
}

.alerts-panel-empty {
	padding: 18px 14px;
	color: var(--muted);
	font-size: 13px;
}

.alerts-panel-item {
	display: grid;
	gap: 4px;
	padding: 12px 14px;
	border-left: 3px solid transparent;
	border-bottom: 1px solid rgba(127, 145, 170, 0.14);
}

.alerts-panel-item--success {
	border-left-color: var(--success);
	background: color-mix(in srgb, var(--success) 8%, var(--panel));
}

.alerts-panel-item--warning {
	border-left-color: #d97706;
	background: color-mix(in srgb, #d97706 8%, var(--panel));
}

.alerts-panel-item--error {
	border-left-color: var(--danger);
	background: color-mix(in srgb, var(--danger) 8%, var(--panel));
}

.alerts-panel-item--info {
	border-left-color: var(--primary);
	background: color-mix(in srgb, var(--primary) 8%, var(--panel));
}

.alerts-panel-item:last-child {
	border-bottom: 0;
}

.alerts-panel-item.is-unread {
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 10%, transparent);
}

.alerts-panel-item-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.alerts-panel-item-head-actions {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.alerts-panel-item-type {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.alerts-panel-item-type[data-alert-type="error"] {
	color: var(--danger);
}

.alerts-panel-item-type[data-alert-type="warning"] {
	color: #d97706;
}

.alerts-panel-item-type[data-alert-type="success"] {
	color: var(--success);
}

.alerts-panel-item-type[data-alert-type="info"] {
	color: var(--primary);
}

.alerts-panel-item-time {
	color: var(--muted);
	font-size: 11px;
	white-space: nowrap;
}

.alerts-panel-item-text {
	color: var(--text);
	font-size: 13px;
	line-height: 1.45;
	word-break: break-word;
}

.alerts-panel-item-close {
	border: 0;
	background: transparent;
	color: var(--muted);
	font-size: 12px;
	line-height: 1;
	padding: 0;
	cursor: pointer;
}

.alerts-panel-item-close:hover {
	color: var(--text);
}

.user-menu-wrap {
	position: relative;
}

.user-menu {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	text-align: left;
	min-height: 34px;
	padding: 0 8px;
	border-left: 1px solid var(--border);
	border-top: 0;
	border-right: 0;
	border-bottom: 0;
	background: transparent;
	color: var(--text);
	cursor: pointer;
}

.user-menu > div {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
}

.user-menu:hover { background: var(--hover); }

.user-avatar {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	object-fit: cover;
	background: var(--surface);
}



.user-name {
	font-size: 13px;
	font-weight: 650;
	line-height: 1.1;
}

.user-role {
	margin-top: 2px;
	color: var(--muted);
	font-size: 11px;
	line-height: 1.1;
}

.user-dropdown {
	position: absolute;
	right: 0;
	top: calc(100% + 8px);
	z-index: 2000;
	min-width: 160px;
	padding: 6px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--panel);
	box-shadow: var(--shadow);
}

.user-dropdown button {
	width: 100%;
	border: 0;
	border-radius: 4px;
	background: transparent;
	color: var(--text);
	text-align: left;
	padding: 8px 10px;
	cursor: pointer;
}

.user-dropdown button:hover { background: var(--hover); }

.profile-modal-backdrop {
	position: fixed;
	inset: 0;
	z-index: 3000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(15, 23, 42, 0.35);
}

.profile-modal-backdrop[hidden],
.profile-modal[hidden] { display: none; }

.profile-modal {
	width: min(760px, calc(100vw - 48px));
	max-height: min(820px, calc(100vh - 80px));
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
}

.profile-modal form {
	display: flex;
	flex-direction: column;
	max-height: inherit;
}

.profile-modal-head,
.profile-modal-foot {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px;
	border-bottom: 1px solid var(--border);
}

.profile-modal-foot {
	justify-content: flex-end;
	border-top: 1px solid var(--border);
	border-bottom: 0;
	background: var(--surface);
}

.profile-modal-head h2 {
	margin: 0;
	font-size: 18px;
}

.profile-modal-head p {
	margin: 3px 0 0;
	color: var(--muted);
	font-size: 13px;
}

.profile-modal-body {
	padding: 16px;
	overflow: auto;
}

.modal-close {
	width: 30px;
	height: 30px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--control-bg);
	color: var(--muted);
	cursor: pointer;
}

.profile-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.field { margin-bottom: 0; }

.form-label {
	display: block;
	margin-bottom: 5px;
	color: var(--muted);
	font-size: 12px;
	font-weight: 650;
}

.form-control {
	width: 100%;
	min-height: 40px;
	border: 1px solid var(--border);
	border-radius: 0;
	background: var(--control-bg);
	color: var(--text);
	padding: 6px 9px;
	outline: none;
}

input.form-control:not([type="checkbox"]):not([type="radio"]),
select.form-control {
	height: 40px;
	min-height: 40px;
}

input[type="text"],
input[type="search"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
textarea,
select {
	border-radius: 0;
}

input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin: 0;
	vertical-align: top;
	appearance: none;
	-webkit-appearance: none;
	background-color: var(--control-bg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
	border: 1px solid var(--checkbox-border);
	border-radius: 4px;
	box-shadow: rgba(229, 231, 235, 0.06) 0 1px 1px 0;
	flex-shrink: 0;
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

input[type="checkbox"]:checked {
	background-color: var(--primary);
	border-color: rgba(255, 255, 255, 0.75);
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e");
}

input[type="checkbox"]:focus {
	border-color: var(--primary);
	outline: 0;
	box-shadow: rgba(229, 231, 235, 0.06) 0 1px 1px 0, 0 0 0 0.25rem rgba(6, 111, 209, 0.25);
}

input[type="checkbox"]:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.form-control:disabled {
	background: var(--surface);
	color: var(--muted);
}

.avatar-editor {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	align-items: center;
	gap: 12px;
	margin-bottom: 14px;
}

.avatar-preview {
	width: 56px;
	height: 56px;
	border: 1px solid var(--border);
	border-radius: 50%;
	object-fit: cover;
	background: var(--surface);
}

.profile-accordion {
	margin-top: 14px;
	border: 1px solid var(--border);
	border-radius: 6px;
}

.profile-accordion summary {
	padding: 10px 12px;
	cursor: pointer;
	font-weight: 650;
}

.profile-accordion.locked summary {
	color: var(--muted);
	cursor: not-allowed;
}

.accordion-body {
	padding: 0 12px 12px;
}

.profile-alert {
	margin-bottom: 12px;
	border: 1px solid #f1b8b8;
	border-radius: 6px;
	background: #fff1f1;
	color: #b42318;
	padding: 9px 10px;
}

.profile-alert.success {
	border-color: #b7e3c0;
	background: #effaf1;
	color: #1f7a32;
}

.profile-alert.info {
	border-color: #cfd6e2;
	background: #f8fafc;
	color: #475467;
}

.detector-alert {
	border-radius: 6px;
	padding: 10px 14px;
	border: 1px solid;
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.3;
}

.detector-alert svg {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
}

.detector-alert--warning {
	background: #fffbeb;
	border-color: #fcd34d;
	color: #92400e;
}

.detector-alert--danger {
	background: #fff1f1;
	border-color: #f1b8b8;
	color: #b42318;
}

.detector-alert--success {
	background: #effaf1;
	border-color: #b7e3c0;
	color: #1f7a32;
}

/* ── Forgot-password panel ─────────────────────────────────── */

.fp-alert {
	border-radius: 6px;
	padding: 10px 14px;
	border: 1px solid;
	font-size: 13px;
	line-height: 1.4;
	margin-bottom: 14px;
}

.fp-alert--warning {
	background: #fffbeb;
	border-color: #fcd34d;
	color: #92400e;
}

.fp-alert--danger {
	background: #fff1f1;
	border-color: #f1b8b8;
	color: #b42318;
}

.fp-alert--success {
	background: #effaf1;
	border-color: #b7e3c0;
	color: #1f7a32;
}

.fp-btn {
	width: 100%;
	border: 0;
	border-radius: 4px;
	background: var(--primary);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	padding: 10px 0;
	cursor: pointer;
	margin-bottom: 10px;
}

.fp-btn:disabled { opacity: 0.62; cursor: not-allowed; }

.fp-btn--secondary {
	background: transparent;
	color: var(--primary);
	border: 1px solid #d0d7de;
	font-weight: 500;
}

.fp-btn--secondary:hover:not(:disabled) { background: color-mix(in srgb, var(--primary) 8%, #fff); }

.fp-text {
	font-size: 13px;
	color: #475467;
	margin: 0 0 18px;
	line-height: 1.5;
	text-align: center;
}

.fp-otp-inputs {
	display: flex;
	gap: 8px;
	justify-content: center;
	margin-bottom: 18px;
}

.fp-otp-input {
	width: 42px;
	height: 50px;
	text-align: center;
	font-size: 22px;
	font-weight: 700;
	border: 1px solid #d0d7de;
	border-radius: 6px;
	background: #fafbfc;
	outline: none;
	padding: 0;
	color: #111;
}

.fp-otp-input:focus {
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(6, 111, 209, 0.12);
}

.fp-links {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	margin-top: 4px;
}

.fp-links a {
	font-size: 13px;
	color: var(--primary);
	text-decoration: none;
}

.fp-links a:hover { text-decoration: underline; }

/* ── End forgot-password panel ─────────────────────────────── */

.session-login-backdrop {
	position: fixed;
	inset: 0;
	z-index: 6000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(5, 10, 20, 0.82);
	backdrop-filter: grayscale(1) brightness(0.6);
}

.session-login-backdrop[hidden] { display: none; }

.session-exit-confirm-backdrop {
	position: fixed;
	inset: 0;
	z-index: 6100;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(5, 10, 20, 0.82);
	backdrop-filter: grayscale(1) brightness(0.6);
}

.session-exit-confirm-backdrop[hidden] { display: none; }

.session-exit-confirm-backdrop .customer-confirm-body {
	display: block;
	padding: 30px;
}

.session-exit-confirm-backdrop .customer-confirm-body p {
	margin: 0;
	max-width: none;
	white-space: pre-line;
	line-height: 1.6;
}

.session-login-modal {
	width: min(420px, 100%);
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 0;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.28);
}

.session-login-body {
	display: flex;
	flex-direction: column;
	padding: 0;
}

.session-login-message {
	margin: 30px 30px;
	color: var(--text);
	font-size: 14px;
	line-height: 1.5;
}

.session-login-body .field {
	padding: 0 55px;
}

.session-login-username-field {
	margin-bottom: 10px;
}

.session-login-password-field {
	margin-bottom: 30px;
}

.session-exit-confirm-backdrop .customer-confirm-head {
	cursor: move;
	user-select: none;
}

.session-login-body .login-error {
	margin: 0 30px 16px;
}

.session-login-foot {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	padding: 12px 16px;
	margin-top: auto;
	border-top: 1px solid var(--border);
	background: var(--surface);
}

.session-login-foot #sessionLoginExitBtn {
	margin-right: auto;
}



.workspace {
	min-width: 0;
	flex: 1;
	min-height: 0;
	height: 100%;
	padding: 22px;
	overflow: auto;
}

.workspace--database-series {
	overflow: hidden;
	min-height: 0;
}

.database-series-layout {
	display: grid;
	grid-template-columns: minmax(280px, var(--db-series-symbols-width, 420px)) 10px minmax(0, 1fr);
	flex: 1;
	min-height: 0;
	height: 100%;
	overflow: hidden;
}

.database-series-symbols {
	display: flex;
	flex-direction: column;
	min-width: 0;
	min-height: 0;
	height: 100%;
	overflow: hidden;
}

.welcome-panel {
	min-height: calc(100vh - 124px);
	display: grid;
	place-items: center;
}

.welcome-logo {
	max-width: min(560px, 90vw);
	text-align: center;
}

.welcome-logo img {
	max-width: 100%;
	height: auto;
	display: block;
}

.welcome-logo .welcome-img--dark { display: none; }
body[data-theme="dark"] .welcome-logo .welcome-img--light { display: none; }
body[data-theme="dark"] .welcome-logo .welcome-img--dark { display: block; }

.module-panel {
	height: 100%;
	min-height: 560px;
}

.module-card {
	height: 100%;
	min-height: 560px;
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: var(--shadow);
	overflow: hidden;
}

.module-card--frame {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	background: transparent;
}

.module-card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.module-card h2 {
	margin: 0;
	font-size: 17px;
	font-weight: 650;
}

.module-card p {
	margin: 3px 0 0;
	color: var(--muted);
}

.module-frame-wrap {
	position: relative;
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

#moduleFrame {
	width: 100%;
	height: 100%;
	flex: 1;
	border: 0;
	background: var(--panel);
}

/* ── Iframe loading spinner ───────────────────────── */
.module-spinner {
	position: absolute;
	inset: 0;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--panel);
}

.module-spinner-ring {
	width: 40px;
	height: 40px;
	border: 4px solid var(--border);
	border-top-color: var(--primary, #3b82f6);
	border-radius: 50%;
	animation: spin-ring 0.75s linear infinite;
}

@keyframes spin-ring {
	to { transform: rotate(360deg); }
}

/* ── Root info modal ──────────────────────────────── */
.info-modal-backdrop {
	position: fixed;
	inset: 0;
	z-index: 1200;
	background: rgba(0, 0, 0, 0.48);
	display: flex;
	align-items: center;
	justify-content: center;
}

.info-modal-backdrop[hidden] { display: none; }

.info-modal {
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: var(--shadow);
	width: max-content;
	min-width: 460px;
	max-width: min(92vw, 680px);
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

@media (max-width: 640px) {
	.info-modal {
		width: calc(100vw - 24px);
		min-width: 0;
		max-width: calc(100vw - 24px);
	}
}

.info-modal[hidden] { display: none; }

.info-modal-head,
.info-modal-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--border);
}

.info-modal-body {
	padding: 14px 16px;
	text-align: left;
}

.info-modal-title {
	margin: 0;
	font-size: 18px;
	font-weight: 650;
	color: var(--text);
}

.info-modal-text {
	margin: 0;
	font-size: 14px;
	color: var(--muted);
	line-height: 1.5;
}

.info-modal-text strong {
	color: var(--text);
}

.info-modal-foot {
	justify-content: flex-end;
	border-top: 1px solid var(--border);
	border-bottom: 0;
	background: var(--surface);
}

.info-modal-foot .btn {
	justify-content: center;
}

.run-confirm-backdrop {
	position: fixed;
	inset: 0;
	z-index: 2600;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(0, 0, 0, 0.48);
}

.run-confirm-backdrop[hidden],
.run-confirm-modal[hidden] { display: none; }

.run-confirm-modal {
	--run-accent: #206bc4;
	--run-accent-strong: #206bc4;
	width: min(620px, calc(100vw - 48px));
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
	border-top: 3px solid var(--run-accent);
}

.run-confirm-modal--blue  { --run-accent: #206bc4; --run-accent-strong: #1a5eae; }
.run-confirm-modal--orange { --run-accent: #f59f00; --run-accent-strong: #d88e00; }
.run-confirm-modal--green  { --run-accent: #2fb344; --run-accent-strong: #27993a; }

.run-confirm-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--border);
}

.run-confirm-head h2 {
	margin: 0;
	font-size: 18px;
	font-weight: 650;
	color: var(--text);
}

.run-confirm-body {
	padding: 18px 16px;
	display: grid;
	grid-template-columns: 52px minmax(0, 1fr);
	align-items: center;
	column-gap: 14px;
}

.run-confirm-icon-wrap {
	width: 52px;
	height: 52px;
	display: grid;
	place-items: center;
}

.run-confirm-icon {
	width: 48px;
	height: 48px;
	object-fit: contain;
	display: block;
}

.run-confirm-text {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--muted);
	white-space: pre-line;
}

.run-confirm-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 12px 16px;
	border-top: 1px solid var(--border);
	background: var(--surface);
}

.run-confirm-spacer { display: none; }

.run-confirm-close {
	width: 28px;
	height: 28px;
	border: 0;
	border-radius: 4px;
	background: transparent;
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--muted);
	font-size: 20px;
	line-height: 1;
}

.run-confirm-close:hover {
	background: var(--surface);
	color: var(--text);
}

:is(.profile-modal-foot, .run-confirm-foot, .detector-modal-foot, .download-setup-foot, .customer-confirm-foot) [id$="CancelBtn"] {
	min-width: var(--cancel-btn-min-width);
}

.run-confirm-foot #runConfirmCancelBtn {
	border-color: var(--border);
	background: var(--panel);
	color: var(--text);
	padding: 6px 18px;
}

.run-confirm-foot #runConfirmOkBtn {
	border-color: transparent;
	background: var(--run-accent-strong);
	color: #fff;
	padding: 6px 20px;
}

.detector-modal-backdrop {
	position: fixed;
	inset: 0;
	z-index: 3000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(15, 23, 42, 0.48);
}

.detector-modal-backdrop[hidden],
.detector-modal[hidden] { display: none; }

.detector-modal {
	--detector-accent: var(--primary);
	--detector-accent-strong: var(--primary);
	width: min(486px, calc(100vw - 32px));
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 16px 36px rgba(15, 23, 42, 0.2);
	border-top: 3px solid var(--detector-accent);
	color: var(--text);
}

.detector-modal--blue {
	--detector-accent: var(--primary);
	--detector-accent-strong: var(--primary);
}

.detector-modal--green {
	--detector-accent: #2fb344;
	--detector-accent-strong: #27993a;
}

.detector-modal-head,
.detector-modal-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 16px 24px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.detector-modal-head h2 {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--text);
}

.detector-modal-body {
	padding: 41px;
	padding-top: 20px;
	padding-bottom: 20px;
	display: grid;
	gap: 10px;
	background: var(--panel);
}

.detector-password-field {
	padding-top: 0;
	padding-bottom: 14px;
}

.detector-password-field .form-label {
	font-size: 14px;
	padding-top: 12px;
	color: var(--text);
}

.detector-password-wrap {
	margin-bottom: 0;
}

.detector-password-wrap .form-control {
	height: 40px;
	min-height: 40px;
	padding-top: 6px;
	padding-bottom: 6px;
	padding-right: 42px;
	border-radius: 4px;
}

.detector-password-wrap .form-control:disabled {
	background: color-mix(in srgb, var(--surface) 88%, var(--panel));
	color: var(--muted);
}

.detector-clear-row {
	margin-top: 10px;
	text-align: right;
}

.detector-clear-row a {
	color: var(--primary);
	font-size: 13px;
	text-decoration: none;
}

.detector-clear-row a:hover {
	text-decoration: underline;
}

.detector-modal-foot {
	border-top: 1px solid var(--border);
	border-bottom: 0;
	background: var(--surface);
}

.detector-modal-foot .btn {
	height: 40px;
	justify-content: center;
	border-radius: 4px;
}

.detector-modal-close {
	width: 28px;
	height: 28px;
	border: 0;
	border-radius: 4px;
	background: transparent;
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--muted);
	font-size: 31px;
	line-height: 1;
}

.detector-modal-close:hover {
	background: var(--hover);
	color: var(--text);
}

.detector-modal-foot #detectorModalCancelBtn {
	background: var(--surface);
	border: 1px solid var(--border);
	color: var(--text);
}

.detector-modal-foot #detectorModalSaveBtn {
	min-width: 130px;
	border-color: transparent;
	background: var(--detector-accent-strong);
	color: #fff;
}

.download-setup-backdrop {
	position: fixed;
	inset: 0;
	z-index: 5200;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(15, 23, 42, 0.25);
}

.download-setup-backdrop[hidden],
.download-setup-modal[hidden] { display: none; }

.download-setup-backdrop.is-loading::after {
	content: "";
	position: fixed;
	left: 50%;
	top: 50%;
	width: 38px;
	height: 38px;
	border: 3px solid rgba(255, 255, 255, 0.72);
	border-top-color: var(--primary);
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
	transform: translate(-50%, -50%);
	pointer-events: none;
}

.download-setup-modal {
	width: min(524px, calc(100vw - 48px));
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
	overflow: hidden;
}

.download-setup-head,
.download-setup-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 22px;
}

.download-setup-head {
	border-bottom: 1px solid var(--border);
}

.download-setup-head #downloadSetupCloseBtn,
.download-setup-head #downloadSchedulerCloseBtn {
	font-size: 31px;
}

.download-setup-head h2 {
	margin: 0;
	font-size: 16px;
	font-weight: 650;
}

.download-setup-body {
	padding: 34px 31px 48px;
}

.download-setup-foot {
	border-top: 1px solid var(--border);
	background: var(--surface);
}

.download-setup-foot .btn {
	height: 40px;
	justify-content: center;
}

.download-setup-foot .btn-primary {
	min-width: 128px;
}

.download-setup-alert {
	margin-bottom: 18px;
	border: 1px solid #f1b8b8;
	background: #fff1f1;
	color: #b42318;
	border-radius: 4px;
	padding: 9px 11px;
	font-size: 13px;
}

.download-setup-alert.success {
	border-color: #b7e3c0;
	background: #effaf1;
	color: #1f7a32;
}

.download-switch-row {
	display: flex;
	align-items: center;
	gap: 28px;
	margin-bottom: 22px;
}

.download-switch-row--sub {
	padding-left: 60px;
	margin-bottom: 72px;
}

.download-field {
	margin-bottom: 20px;
}

.download-field .form-label {
	font-size: 14px;
	margin-bottom: 6px;
}

.download-field .form-control {
	height: 40px;
	min-height: 40px;
}

.download-field--timeout {
	width: 136px;
	margin-top: 47px;
	margin-bottom: 0;
}

.download-scheduler-modal {
	width: min(524px, calc(100vw - 48px));
	max-height: min(760px, calc(100vh - 48px));
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
	overflow: hidden;
	min-height: 0;
}

.download-scheduler-modal[hidden] { display: none; }

.download-scheduler-modal form {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
}

.download-scheduler-body {
	flex: 1 1 auto;
	min-height: 0;
	padding: 6px 8px 8px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.scheduler-tabs {
	display: flex;
	align-items: flex-end;
	border: 1px solid var(--border);
	border-bottom: 0;
	border-radius: 6px 6px 0 0;
	background: var(--surface);
	padding: 8px 10px 0;
}

.scheduler-tab {
	height: 38px;
	min-width: 100px;
	border: 1px solid transparent;
	border-bottom: 0;
	border-radius: 5px 5px 0 0;
	background: transparent;
	color: var(--text);
	font-size: 16px;
	font-weight: 400;
	cursor: pointer;
}

.scheduler-tab.active {
	background: var(--panel);
	border-color: var(--border);
	font-weight: 650;
}

.scheduler-tab-panel {
	display: none;
	flex: 1 1 auto;
	min-height: 0;
	border: 1px solid var(--border);
	border-top: 0;
	padding: 18px 16px 16px;
	overflow: auto;
}

.scheduler-tab-panel.active {
	display: flex;
	flex-direction: column;
}

.scheduler-enabled-row {
	margin-bottom: 18px;
}

.scheduler-days {
	display: grid;
	grid-template-columns: repeat(7, minmax(40px, 1fr));
	gap: 12px;
	align-items: center;
	margin: 0 54px 42px;
}

.scheduler-day {
	display: grid;
	justify-items: center;
	gap: 10px;
	color: #667085;
	font-size: 13px;
	font-weight: 500;
}

.scheduler-day input {
	width: 22px;
	height: 22px;
	margin: 0;
	accent-color: var(--primary);
}

.scheduler-grid-card {
	border: 1px solid var(--border);
	border-radius: 4px;
	overflow: hidden;
	background: var(--panel);
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.scheduler-grid-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	gap: 0;
	min-height: 40px;
	padding: 7px 14px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.toolbar-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 0;
	gap: 6px;
	height: 26px;
	border: 0;
	padding: 0 6px;
	border-radius: 4px;
	background: transparent;
	color: #667085;
	font-size: 14px;
	cursor: pointer;
	transition: background 0.12s ease, color 0.12s ease;
}

.toolbar-btn:hover,
.toolbar-btn:focus-visible {
	background: var(--hover);
	color: var(--text);
	outline: none;
}

.toolbar-btn:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.toolbar-icon {
	position: relative;
	display: inline-block;
	width: 16px;
	height: 16px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
}

.toolbar-icon-add {
	background-image: url("../images/add.png?v=20260513-1");
}

.toolbar-icon-add::before {
	content: none;
}

.toolbar-icon-edit {
	background-image: url("../images/Edit_16.png");
}

.toolbar-icon-report {
	background-image: url("../images/report.png");
	}

.toolbar-icon-log {
	background-image: url("../images/log.png?v=20260513-1");
}

.toolbar-icon-ignore {
	background-image: url("../images/ignore.png");
}

.toolbar-icon-upload {
	background-image: url("../images/upload-green.png");
}

.toolbar-icon-export {
	background-image: url("../images/Export_16.png");
}

.toolbar-icon-view {
	background-image: url("../images/view-mag.png");
}

.toolbar-icon-refresh {
	background-image: url("../images/refresh.png");
}

.toolbar-icon-run {
	background-image: url("../images/run.png");
}

.toolbar-icon-run::before {
	content: none;
}

.toolbar-icon-delete {
	background-image: url("../images/cross.png");
}

.toolbar-icon-delete::before,
.toolbar-icon-delete::after {
	content: none;
}

.toolbar-icon-delete::before { transform: rotate(45deg); }
.toolbar-icon-delete::after { transform: rotate(-45deg); }

.scheduler-table {
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
}

.scheduler-table th,
.scheduler-table td {
	border-bottom: 1px solid var(--border);
	padding: 0;
	text-align: left;
	font-size: 14px;
	font-weight: 400;
}

.scheduler-table th {
	height: 32px;
	padding: 0 12px;
	color: #475467;
	background: var(--panel);
}

.scheduler-table th:nth-child(2),
.scheduler-table th:nth-child(3) {
	text-align: center;
}

.scheduler-table {
	width: 100%;
	table-layout: fixed;
}

.scheduler-table th span {
	display: none;
}

.scheduler-table td {
	height: 44px;
}

.scheduler-table tbody tr.selected {
	background: var(--sidebar-active);
	box-shadow: inset 3px 0 0 var(--primary);
}

body[data-theme="dark"] .scheduler-table tbody tr.selected {
	background: #243a5a;
}

.scheduler-table-cell {
	display: flex;
	align-items: center;
	height: 43px;
	padding: 0 12px;
	color: var(--text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.scheduler-table-cell--email {
	justify-content: center;
	padding: 0 8px;
}

.scheduler-table-cell--time {
	justify-content: center;
	padding: 0 8px;
	text-align: center;
}

.scheduler-email-tick {
	color: #22c55e;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.metadata-top-row {
	display: flex;
	align-items: center;
	gap: 28px;
	margin-bottom: 18px;
}

.scheduler-checkline {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #475467;
	font-size: 14px;
}

.scheduler-checkline input {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--primary);
}

.scheduler-days--metadata {
	margin-bottom: 18px;
}

.metadata-form-grid {
	display: grid;
	grid-template-columns: 132px 1fr;
	gap: 0 14px;
	padding-bottom: 4px;
}

.metadata-form-grid .download-field:not(.download-field--time) {
	grid-column: 1 / -1;
}

.download-field--time {
	width: 132px;
}

.metadata-run-info {
	margin-top: 8px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	padding: 14px 16px;
	color: #475467;
	font-size: 13px;
	line-height: 1.55;
	min-height: 76px;
}

.metadata-run-info div + div {
	margin-top: 12px;
}

.metadata-run-row {
	display: grid;
	grid-template-columns: 62px 1fr;
	gap: 8px;
	align-items: baseline;
}

.metadata-run-row strong {
	color: var(--text);
}

.metadata-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 20px;
	padding-top: 8px;
	border-top: 1px solid var(--border);
}

.metadata-action-btn {
	height: 32px;
	padding: 0 10px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--panel);
}

.scheduler-edit-modal {
	width: min(430px, calc(100vw - 48px));
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
	overflow: hidden;
}

.scheduler-edit-modal[hidden],
.metadata-log-modal[hidden] {
	display: none;
}

.scheduler-edit-body {
	padding: 22px 26px;
}

.scheduler-edit-grid {
	display: grid;
	grid-template-columns: 46% minmax(0, 2fr);
	gap: 40px;
	align-items: start;
}

.scheduler-edit-warning {
	align-self: start;
	padding-top: 1px;
}

.scheduler-edit-warning-text {
	margin: 14px 0 14px;
	font-weight: 600;
	color: var(--text);
	line-height: 1.45;
	text-align: left;
}

.scheduler-edit-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--text);
	cursor: pointer;
	justify-content: flex-start;
}

.scheduler-edit-checkbox input {
	margin: 0;
}

#schedulerEditForm .download-setup-foot {
	display: flex;
	align-items: center;
	gap: 11px;
}

#schedulerEditForm .scheduler-edit-footnote {
	flex: 1 1 auto;
	margin: 0;
	text-align: left;
}

#schedulerEditForm #schedulerEditCancelBtn,
#schedulerEditForm #schedulerEditSaveBtn {
	min-width: 95px;
	width: 95px;
	flex: 0 0 95px;
}

.scheduler-confirm-modal {
	width: min(560px, calc(100vw - 48px));
}

.scheduler-confirm-history-toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--text);
}

#schedulerConfirmBackdrop {
	z-index: 5400;
}

#schedulerEditBackdrop,
#metadataLogBackdrop {
	z-index: 5350;
}

@media (max-width: 640px) {
	.scheduler-edit-grid {
		grid-template-columns: 1fr;
		gap: 14px;
	}
}

.metadata-log-modal {
	width: min(90vw, calc(100vw - 32px));
	height: min(90vh, calc(100vh - 32px));
	min-width: 460px;
	min-height: 300px;
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 2px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
	overflow: hidden;
	resize: both;
}

.metadata-log-modal .btn,
.metadata-log-modal .form-control,
.metadata-log-modal button,
.metadata-log-modal select,
.metadata-log-modal textarea {
	border-radius: 2px;
}

.metadata-log-body {
	flex: 1;
	min-height: 0;
	padding: 12px 14px;
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 12px;
}

.metadata-log-modal.is-sidebar-collapsed .metadata-log-body {
	grid-template-columns: 44px minmax(0, 1fr);
}

.metadata-log-sidebar {
	display: flex;
	min-width: 0;
	min-height: 0;
	flex-direction: column;
	border: 1px solid var(--border);
	border-radius: 2px;
	background: var(--surface);
	overflow: hidden;
}

.metadata-log-sidebar-toggle {
	width: 100%;
	border: 0;
	border-bottom: 1px solid var(--border);
	background: var(--panel);
	color: var(--text);
	cursor: pointer;
	font-size: 13px;
	font-weight: 700;
	padding: 9px 10px;
	text-align: left;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	position: relative;
}

.metadata-log-sidebar-toggle::after {
	content: "<";
	color: var(--muted);
	font-size: 18px;
	line-height: 1;
	transition: color 0.15s ease;
}

.metadata-log-sidebar-toggle:hover,
.metadata-log-sidebar-toggle:focus-visible {
	background: var(--hover);
	outline: none;
}

.metadata-log-modal.is-sidebar-collapsed .metadata-log-sidebar-toggle {
	height: 100%;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	text-align: center;
	border-bottom: 0;
	padding: 42px 0 16px;
	justify-content: center;
}

.metadata-log-modal.is-sidebar-collapsed .metadata-log-sidebar-toggle::after {
	content: ">";
	position: absolute;
	top: 14px;
	left: 50%;
	transform: translateX(-50%);
}

.metadata-log-modal.is-sidebar-collapsed .metadata-log-summary {
	display: none;
}

.metadata-log-pane {
	border: 0;
	border-radius: 0;
	background: transparent;
	padding: 12px;
	overflow: auto;
	color: #475467;
	font-size: 13px;
	line-height: 1.6;
}

.metadata-log-pane strong {
	color: var(--text);
}

.download-log-attempts-title {
	margin-top: 14px;
	padding-top: 10px;
	border-top: 1px solid var(--border);
	font-weight: 700;
	color: var(--text);
	display: grid;
	gap: 8px;
}

.download-log-attempt-filter {
	width: 100%;
	height: 32px;
	font-size: 12px;
	font-weight: 600;
}

.download-log-attempt {
	width: 100%;
	margin-top: 8px;
	padding: 8px 9px;
	border: 1px solid var(--border);
	border-radius: 2px;
	background: #ffffff;
	color: var(--text);
	text-align: left;
	display: flex;
	flex-direction: column;
	gap: 2px;
	cursor: pointer;
}

.download-log-attempt:hover,
.download-log-attempt.active {
	border-color: var(--primary);
	box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.12);
}

.download-log-attempt[hidden] {
	display: none;
}

.download-log-attempt.is-success {
	border-color: #7cbf92;
	background: #f1fbf4;
}

.download-log-attempt.outcome-failed,
.download-log-attempt.outcome-cancelled {
	border-color: #e6b3b3;
	background: #fff7f7;
}

.download-log-attempt.outcome-partial {
	border-color: #e4c46f;
	background: #fffaf0;
}

.download-log-attempt-head {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	font-weight: 700;
}

.download-log-badge {
	border-radius: 2px;
	background: #16794c;
	color: #ffffff;
	font-size: 11px;
	line-height: 1;
	padding: 4px 6px;
}

.download-log-attempt-main {
	color: #344054;
}

.download-log-attempt-sub,
.download-log-empty {
	color: #667085;
	font-size: 12px;
}

.download-live-status {
	display: flex;
	flex-direction: column;
	gap: 12px;
	color: var(--text);
}

.download-live-status-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--border);
}

.download-live-status-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 74px;
	padding: 2px 8px;
	border-radius: 0;
	font-size: 12px;
	font-weight: 600;
	line-height: 20px;
}

.download-live-status-badge.is-running {
	background: #e8f3ff;
	color: #0054a6;
}

.download-live-status-badge.is-final {
	background: #e9f8ee;
	color: #1f7a32;
}

.download-live-status-badge.is-error {
	background: #fdebec;
	color: #b42318;
}

.download-live-status-grid {
	display: grid;
	grid-template-columns: minmax(70px, auto) 1fr;
	gap: 6px 10px;
	align-items: baseline;
}

.download-live-status-grid span,
.download-live-status-current span {
	color: #667085;
	font-size: 12px;
	font-weight: 600;
}

.download-live-status-grid strong {
	min-width: 0;
	overflow-wrap: anywhere;
	font-size: 13px;
	font-weight: 600;
}

.download-live-status-current {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 10px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--panel);
}

.download-live-status-current div {
	font-size: 13px;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

.download-live-monitor {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	z-index: 6100;
	width: min(70vw, calc(100vw - 48px));
	height: min(70vh, calc(100vh - 48px));
	min-width: min(420px, calc(100vw - 48px));
	min-height: 240px;
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 20px 54px rgba(15, 23, 42, 0.28);
	overflow: hidden;
	resize: both;
}

.download-live-monitor[hidden] {
	display: none;
}

.download-live-monitor-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 12px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
	cursor: move;
	user-select: none;
}

.download-live-monitor-head h2 {
	margin: 0;
	font-size: 15px;
	font-weight: 650;
}

.download-live-subtitle {
	margin-top: 2px;
	font-size: 12px;
	color: var(--muted);
}

.download-live-monitor-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

.download-live-monitor-body {
	flex: 1 1 auto;
	min-height: 0;
	display: grid;
	grid-template-columns: 245px minmax(0, 1fr);
	gap: 12px;
	padding: 12px;
}

.download-live-monitor-summary {
	min-height: 0;
	overflow: auto;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	padding: 12px;
}

.download-live-monitor-text {
	min-height: 0;
	height: 100%;
	resize: none;
	font-family: Consolas, "Liberation Mono", monospace;
	font-size: 12px;
	line-height: 1.45;
}

.download-live-monitor.is-minimized {
	width: min(460px, calc(100vw - 48px));
	height: auto;
	min-width: 280px;
	min-height: 0;
	resize: none;
}

.download-live-monitor.is-minimized .download-live-monitor-body,
.download-live-monitor.is-minimized #downloadLiveCancelBtn,
.download-live-monitor.is-minimized #downloadLiveCloseBtn {
	display: none;
}

.download-live-monitor.is-minimized .download-live-monitor-head {
	border-bottom: 0;
	cursor: pointer;
}

body[data-theme="dark"] .download-live-status-badge.is-running {
	background: #17375f;
	color: #9cc8ff;
}

body[data-theme="dark"] .download-live-status-badge.is-final {
	background: #173f2a;
	color: #9fe3ad;
}

body[data-theme="dark"] .download-live-status-badge.is-error {
	background: #5a1f25;
	color: #ffb4b8;
}

body[data-theme="dark"] .download-live-status-grid span,
body[data-theme="dark"] .download-live-status-current span {
	color: #94a3b8;
}

.metadata-log-text {
	width: 100%;
	height: 100%;
	min-height: 220px;
	resize: none;
	font-family: Consolas, "Courier New", monospace;
	font-size: 12px;
	line-height: 1.45;
	white-space: pre;
}

.metadata-log-text.is-word-wrap {
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}

.metadata-log-foot {
	display: grid;
	grid-template-columns: minmax(120px, 1fr) repeat(4, minmax(0, 1fr));
	gap: 12px;
	align-items: center;
}

.metadata-log-wrap-toggle {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--muted);
	font-size: 13px;
	font-weight: 600;
}

.metadata-log-foot .btn {
	width: 100%;
	justify-content: center;
}

.download-status-modal {
	width: min(1180px, calc(100vw - 32px));
	height: min(820px, calc(100vh - 32px));
	min-width: min(1180px, calc(100vw - 32px));
	min-height: min(820px, calc(100vh - 32px));
	max-width: calc(100vw - 32px);
	max-height: calc(100vh - 32px);
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
	overflow: hidden;
	resize: both;
}

.download-status-modal.is-expanded {
	position: fixed !important;
	inset: 12px !important;
	left: 12px !important;
	top: 12px !important;
	right: 12px !important;
	bottom: 12px !important;
	width: calc(100vw - 24px);
	height: calc(100vh - 24px);
	min-width: 0;
	min-height: 0;
	max-height: calc(100vh - 24px);
	resize: none;
}

.download-status-modal[hidden] {
	display: none;
}

.download-status-modal .download-setup-head {
	flex: 0 0 auto;
	cursor: move;
	user-select: none;
}

.download-status-modal .detector-modal-close {
	cursor: pointer;
}

.download-status-head-actions {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.download-status-expand-btn {
	width: 30px;
	height: 30px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	color: var(--text);
	cursor: pointer;
	font-size: 15px;
	line-height: 1;
}

.download-status-expand-btn:hover {
	background: var(--hover);
}

.download-status-toolbar {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	padding: 10px 14px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.download-status-action-btn {
	height: 30px;
	padding: 0 8px;
	font-size: 13px;
}

.download-status-action-btn.is-running {
	opacity: 0.62;
	cursor: not-allowed;
}

.download-status-toolbar-spacer {
	flex: 1 1 auto;
	min-width: 12px;
}

.download-status-nav-btn {
	width: 36px;
	min-width: 36px;
	height: 36px;
	min-height: 36px;
	padding: 0;
	justify-content: center;
}

.download-status-select {
	width: 83px;
	height: 40px;
	min-height: 40px;
}

.download-status-select--month {
	width: 99px;
}

.download-status-body {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	padding: 14px;
	overflow: hidden;
}

.download-status-calendar {
	height: 100%;
	display: grid;
	grid-template-columns: repeat(7, minmax(118px, 1fr));
	grid-template-rows: 34px repeat(6, minmax(86px, 1fr));
	border: 1px solid var(--border);
	border-radius: 5px;
	overflow: hidden;
	background: var(--border);
	gap: 1px;
}

.download-status-dayname,
.download-status-cell {
	background: var(--panel);
	color: var(--text);
}

.download-status-dayname {
	padding: 8px;
	color: var(--muted);
	font-size: 13px;
	font-weight: 650;
	text-align: center;
}

.download-status-cell {
	min-height: 86px;
	padding: 9px 10px;
	cursor: pointer;
	border: 1px solid transparent;
	text-align: left;
	font: inherit;
	width: 100%;
	min-width: 0;
	overflow: hidden;
}

.download-status-cell:hover {
	background: var(--hover);
}

.download-status-cell.muted {
	background: var(--surface);
	color: var(--muted);
	cursor: default;
}

.download-status-cell.future,
.download-status-cell.future:hover {
	background: var(--panel);
	color: #9aa7b8;
	cursor: default;
}

.download-status-cell.selected {
	border-color: var(--primary);
	box-shadow: inset 0 0 0 1px var(--primary);
}

.download-status-cell.muted .download-status-date {
	color: #aeb8c6;
	font-weight: 500;
}

.download-status-cell.weekend {
	background: repeating-linear-gradient(135deg, #f8fafc 0, #f8fafc 8px, #eef2f7 8px, #eef2f7 16px);
	color: #667085;
}

.download-status-cell.weekend:hover {
	background: repeating-linear-gradient(135deg, #f4f7fb 0, #f4f7fb 8px, #e7edf5 8px, #e7edf5 16px);
}

.download-status-cell.muted.weekend,
.download-status-cell.muted.weekend:hover {
	background: #f8fafc;
}

body[data-theme="dark"] .download-status-toolbar {
	background: #121c2d;
}

body[data-theme="dark"] .download-status-calendar {
	background: #2b3a50;
}

body[data-theme="dark"] .download-status-dayname {
	background: #172338;
	color: #a8b5c7;
}

body[data-theme="dark"] .download-status-cell {
	background: #162235;
	color: #e5edf8;
}

body[data-theme="dark"] .download-status-cell:hover {
	background: #1d2d46;
}

body[data-theme="dark"] .download-status-cell.muted {
	background: #101827;
	color: #68788d;
}

body[data-theme="dark"] .download-status-cell.future,
body[data-theme="dark"] .download-status-cell.future:hover {
	background: #162235;
	color: #68788d;
}

body[data-theme="dark"] .download-status-cell.muted .download-status-date {
	color: #7c8ba0;
}

body[data-theme="dark"] .download-status-cell.weekend {
	background: repeating-linear-gradient(135deg, #162235 0, #162235 8px, #1d2b42 8px, #1d2b42 16px);
	color: #a8b5c7;
}

body[data-theme="dark"] .download-status-cell.weekend:hover {
	background: repeating-linear-gradient(135deg, #1c2b43 0, #1c2b43 8px, #243650 8px, #243650 16px);
}

body[data-theme="dark"] .download-status-cell.muted.weekend,
body[data-theme="dark"] .download-status-cell.muted.weekend:hover {
	background: #101827;
	color: #68788d;
}

body[data-theme="dark"] .download-status-cell.selected {
	border-color: #5aa2f4;
	box-shadow: inset 0 0 0 1px #5aa2f4;
}

.download-status-date {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 650;
	margin-bottom: 5px;
}

.download-status-day {
	display: inline-block;
	min-width: 10px;
}

.download-status-pill {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	border-radius: 0;
	padding: 2px 6px;
	font-size: 11.5px;
	font-weight: 500;
}

.download-status-pill.status-ok { background: #e9f8ee; color: #1f7a32; }
.download-status-pill.status-error { background: #fff1f1; color: #b42318; }
.download-status-pill.status-wait { background: #eff6ff; color: #1d4ed8; }
.download-status-pill.status-missing { background: #fff1f1; color: #b42318; }
.download-status-pill.status-weekend { background: #eef2f7; color: #667085; }
.download-status-pill.status-ignored { background: #fff7e6; color: #b25e09; }

.download-status-detail {
	margin-top: 6px;
	display: grid;
	gap: 3px;
	color: var(--muted);
	font-size: 11.5px;
	line-height: 1.25;
	overflow-wrap: anywhere;
	hyphens: none;
}

.download-status-detail-row {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-variant-numeric: tabular-nums;
}

.download-status-detail-row--files {
	color: var(--text);
	font-weight: 500;
}

.download-status-detail-row--updated {
	color: var(--muted);
}

@media (max-width: 980px) {
	.download-status-modal {
		width: calc(100vw - 16px);
		height: calc(100vh - 16px);
		min-width: calc(100vw - 16px);
		min-height: calc(100vh - 16px);
		max-width: calc(100vw - 16px);
		max-height: calc(100vh - 16px);
	}

	.download-status-modal.is-expanded {
		inset: 8px !important;
		left: 8px !important;
		top: 8px !important;
		right: 8px !important;
		bottom: 8px !important;
		width: calc(100vw - 16px);
		height: calc(100vh - 16px);
		min-width: 0;
		min-height: 0;
		max-height: calc(100vh - 16px);
		resize: none;
	}

	.download-status-body {
		overflow: auto;
	}

	.download-status-calendar {
		min-width: 840px;
		min-height: 620px;
	}
}

body[data-theme="dark"] .download-status-pill.status-ok { background: #173f2a; color: #9fe3ad; }
body[data-theme="dark"] .download-status-pill.status-error,
body[data-theme="dark"] .download-status-pill.status-missing { background: #4a2020; color: #ffb4ad; }
body[data-theme="dark"] .download-status-pill.status-wait { background: #17375f; color: #9cc8ff; }
body[data-theme="dark"] .download-status-pill.status-weekend { background: #243246; color: #b6c2d1; }
body[data-theme="dark"] .download-status-pill.status-ignored { background: #4a3513; color: #ffd37a; }

.download-ftp-picker-modal {
	width: min(620px, calc(100vw - 32px));
	height: min(720px, calc(100vh - 32px));
	min-width: min(420px, calc(100vw - 32px));
	min-height: 320px;
	max-width: calc(100vw - 32px);
	max-height: calc(100vh - 32px);
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
	overflow: hidden;
	resize: both;
}

.download-ftp-picker-modal[hidden] {
	display: none;
}

.download-ftp-picker-body {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 14px;
}

.download-ftp-picker-toolbar {
	display: flex;
	align-items: end;
	gap: 12px;
}

.download-ftp-picker-search {
	flex: 1 1 auto;
	display: grid;
	gap: 5px;
	color: var(--muted);
	font-size: 12px;
	font-weight: 650;
}

.download-ftp-picker-count {
	flex: 0 0 auto;
	color: var(--muted);
	font-size: 12px;
	padding-bottom: 9px;
}

.download-ftp-picker-list {
	flex: 1 1 auto;
	min-height: 0;
	overflow: auto;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

.download-ftp-picker-empty,
.download-ftp-picker-row {
	width: 100%;
	min-height: 34px;
	display: flex;
	align-items: center;
	padding: 7px 10px;
	border: 0;
	border-bottom: 1px solid var(--border);
	background: transparent;
	color: var(--text);
	text-align: left;
	font: inherit;
	font-size: 13px;
}

.download-ftp-picker-row {
	cursor: pointer;
}

.download-ftp-picker-row:hover,
.download-ftp-picker-row.is-selected {
	background: var(--hover);
}

.download-ftp-picker-row.is-selected {
	box-shadow: inset 3px 0 0 var(--primary);
}

.download-ftp-picker-empty {
	color: var(--muted);
}

.download-ftp-viewer-modal {
	width: min(75vw, calc(100vw - 32px));
	height: min(760px, calc(100vh - 32px));
	min-width: min(560px, calc(100vw - 32px));
	min-height: 360px;
	max-width: calc(100vw - 32px);
	max-height: calc(100vh - 32px);
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
	overflow: hidden;
	resize: both;
}

.download-ftp-viewer-modal[hidden] {
	display: none;
}

.download-ftp-viewer-toolbar {
	flex: 0 0 auto;
	display: flex;
	align-items: end;
	gap: 10px;
	padding: 12px 14px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.download-ftp-viewer-search {
	flex: 0 1 320px;
	display: grid;
	gap: 5px;
	color: var(--muted);
	font-size: 12px;
	font-weight: 650;
}

.download-ftp-viewer-status {
	color: var(--muted);
	font-size: 12px;
	padding-bottom: 9px;
}

.download-ftp-viewer-body {
	flex: 1 1 auto;
	min-height: 0;
}

.download-ftp-viewer-scroll {
	flex: 1 1 auto;
	height: 100%;
	min-height: 0;
	overflow: auto;
	background: var(--control-bg);
	scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

.download-ftp-viewer-lines {
	min-width: 100%;
	font-family: Consolas, "Courier New", monospace;
	font-size: 12px;
	line-height: 1.45;
}

.download-ftp-viewer-line {
	display: grid;
	grid-template-columns: max-content minmax(0, 1fr);
	align-items: start;
	min-width: max-content;
	border-bottom: 1px solid rgba(127, 145, 170, 0.12);
}

.download-ftp-viewer-line.is-active {
	background: rgba(6, 111, 209, 0.12);
}

.download-ftp-viewer-line-number {
	position: sticky;
	left: 0;
	width: calc(4ch + 18px);
	min-width: calc(4ch + 18px);
	padding: 4px 10px 4px 6px;
	border-right: 1px solid var(--border);
	background: var(--surface);
	color: var(--muted);
	font-family: Consolas, "Courier New", monospace;
	font-size: 12px;
	line-height: 1.45;
	white-space: pre;
	text-align: right;
	font-variant-numeric: tabular-nums;
	user-select: none;
}

.download-ftp-viewer-line.is-active .download-ftp-viewer-line-number {
	background: rgba(6, 111, 209, 0.18);
	color: var(--text);
}

.download-ftp-viewer-line-text {
	padding: 4px 12px;
	white-space: pre;
	color: var(--text);
}

.download-ftp-viewer-match {
	padding: 0;
	background: #ffdf70;
	color: #1f2937;
}

.download-ftp-picker-list::-webkit-scrollbar,
.download-ftp-viewer-scroll::-webkit-scrollbar {
	width: 12px;
	height: 12px;
}

.download-ftp-picker-list::-webkit-scrollbar-track,
.download-ftp-viewer-scroll::-webkit-scrollbar-track {
	background: var(--scrollbar-track);
}

.download-ftp-picker-list::-webkit-scrollbar-thumb,
.download-ftp-viewer-scroll::-webkit-scrollbar-thumb {
	background: var(--scrollbar-thumb);
	border: 2px solid var(--scrollbar-track);
	border-radius: 10px;
}

.download-ftp-picker-list::-webkit-scrollbar-thumb:hover,
.download-ftp-viewer-scroll::-webkit-scrollbar-thumb:hover {
	background: var(--scrollbar-thumb-hover);
}

.download-ftp-picker-list::-webkit-scrollbar-corner,
.download-ftp-viewer-scroll::-webkit-scrollbar-corner {
	background: var(--scrollbar-track);
}

.adm-toasts {
	position: fixed;
	right: 24px;
	top: 76px;
	z-index: 3600;
	width: min(380px, calc(100vw - 32px));
	border: 1px solid var(--border);
	border-left: 4px solid var(--accent);
	border-radius: 4px;
	background: var(--panel);
	color: var(--text);
	box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
	overflow: hidden;
}

.adm-toasts__handle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 9px 11px 4px;
	border-bottom: 0;
	cursor: move;
	user-select: none;
}

.adm-toasts__title {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.adm-toasts__body {
	padding: 2px 38px 12px 11px;
	font-size: 0.88rem;
	line-height: 1.35;
	word-break: break-word;
}

.adm-toasts__close {
	width: 24px;
	height: 24px;
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	border: 0;
	border-radius: 4px;
	background: transparent;
	color: inherit;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}

.adm-toasts__close:hover {
	background: rgba(15, 23, 42, 0.08);
}

.adm-toasts--error {
	border-color: var(--border);
	border-left-color: var(--danger);
	background: var(--panel);
	color: var(--text);
}

.adm-toasts--warning {
	border-color: var(--border);
	border-left-color: var(--warning);
	background: var(--panel);
	color: var(--text);
}

.adm-toasts--info {
	border-color: var(--border);
	border-left-color: var(--accent);
	background: var(--panel);
	color: var(--text);
}

.adm-toasts--success {
	border-color: var(--border);
	border-left-color: var(--success);
	background: var(--panel);
	color: var(--text);
}

body[data-theme="dark"] .adm-toasts--error {
	border-left-color: #ff8f8f;
	background: var(--panel);
	color: var(--text);
}

body[data-theme="dark"] .adm-toasts--warning {
	border-left-color: #ffd37a;
	background: var(--panel);
	color: var(--text);
}

body[data-theme="dark"] .adm-toasts--info {
	border-left-color: #7ab2ff;
	background: var(--panel);
	color: var(--text);
}

body[data-theme="dark"] .adm-toasts--success {
	border-left-color: #9be2aa;
	background: var(--panel);
	color: var(--text);
}

.database-series-panel {
	height: 100%;
	min-height: 0;
	display: flex;
	flex-direction: column;
	background: var(--panel);
	overflow: hidden;
}

.database-series-panel[hidden] { display: none; }

.database-series-panel.is-loading {
	cursor: progress;
}

.database-series-head {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 18px;
	border-bottom: 1px solid var(--border);
	background: var(--panel);
}

.database-series-head h2 {
	margin: 0;
	font-size: 19px;
}

.database-series-head p {
	margin: 2px 0 0;
	color: var(--muted);
	font-size: 13px;
}

.database-series-splitter {
	position: relative;
	width: 10px;
	background: linear-gradient(90deg, transparent 0, transparent 4px, var(--border) 4px, var(--border) 6px, transparent 6px, transparent 100%);
	cursor: col-resize;
	touch-action: none;
	user-select: none;
	transition: background-color 0.15s ease;
}

.database-series-splitter:hover {
	background-color: color-mix(in srgb, var(--primary) 8%, transparent);
}

.database-series-symbols-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	border: 0;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
	color: var(--text);
	padding: 10px;
	font-weight: 650;
	text-align: left;
	cursor: pointer;
}

.database-series-symbols-header:hover {
	background: var(--hover);
}

.database-series-symbols-chevron {
	display: block;
	width: 7px;
	height: 7px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	color: var(--muted);
	flex: none;
	transform: rotate(135deg);
}

.database-series-symbols-header[aria-expanded="false"] .database-series-symbols-chevron {
	transform: rotate(-45deg);
}

.database-series-layout.is-symbols-collapsed .database-series-symbols-chevron {
	order: -1;
}

.database-series-symbols-content {
	display: flex;
	flex: 1;
	min-height: 0;
	height: 100%;
	flex-direction: column;
}

.database-series-toolbar,
.database-series-controls {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.database-series-toolbar span {
	flex: 1;
	text-align: center;
	color: var(--muted);
	font-size: 12px;
}

.database-series-toolbar .database-series-toolbar-subtitle {
	display: block;
	flex: none;
	text-align: left;
}

.database-series-toolbar .database-series-search-toolbox {
	flex: 0 0 256px;
	width: 256px;
	max-width: 34%;
}

.database-series-pager {
	justify-content: flex-start;
	gap: 48px;
	padding: 10px;
	flex-wrap: nowrap;
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
}

.database-series-pagination-controls {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	flex: 0 0 auto;
	min-width: 0;
}

.database-series-pager .database-series-page-info {
	flex: 0 1 auto;
	min-width: 86px;
	padding: 0 4px;
	text-align: center;
	white-space: nowrap;
	font-size: 12px;
	color: var(--muted);
}

.database-series-page-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 28px;
	width: 28px;
	height: 32px;
	min-width: 28px;
	padding: 0;
	border: 0;
	background: transparent;
	color: color-mix(in srgb, var(--muted) 78%, var(--text));
	box-shadow: none;
	font-size: 17px;
	line-height: 1;
	font-weight: 600;
}

.database-series-page-btn:hover:not(:disabled),
.database-series-page-number:hover:not(:disabled) {
	background: color-mix(in srgb, var(--primary) 8%, transparent);
	color: var(--text);
}

.database-series-page-btn:disabled {
	opacity: 0.35;
	background: transparent;
}

.database-series-page-numbers {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto !important;
	text-align: left !important;
}

.database-series-page-number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: auto;
	height: 36px;
	min-width: 36px;
	padding: 0 10px;
	border-radius: 2px;
	border: 0;
	background: transparent;
	box-shadow: none;
	font-size: 13px;
	line-height: 1;
	color: var(--text);
}

.database-series-page-number.active {
	background: color-mix(in srgb, var(--primary) 12%, transparent);
	color: var(--text);
}

.database-series-page-ellipsis {
	pointer-events: none;
	color: var(--muted);
}

.database-series-page-size,
.database-series-page-jump {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	order: 10;
	margin: 0;
	color: var(--muted);
	font-size: 12px;
	white-space: nowrap;
}

.database-series-page-size .form-control {
	width: 68px;
	height: 36px;
	padding: 4px 28px 4px 10px;
	border-radius: 2px;
}

.database-series-page-jump .form-control {
	width: 58px;
	height: 30px;
	padding: 3px 6px;
	border-radius: 2px;
	text-align: center;
}

.database-series-date-input {
	width: 128px;
	font-variant-numeric: tabular-nums;
	padding-right: 34px;
}

.database-series-date-field {
	position: relative;
	display: inline-flex;
	align-items: stretch;
}

.database-series-date-popup {
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	z-index: 40;
	width: 322px;
	max-width: calc(100vw - 24px);
	padding: 10px;
	border: 1px solid var(--border);
	border-radius: 8px;
	background: var(--surface);
	box-shadow: 0 18px 38px rgba(15, 23, 42, 0.24);
	box-sizing: border-box;
	contain: layout paint;
}

.database-series-date-popup[hidden] {
	display: none;
}

.database-series-date-popup-header {
	display: grid;
	grid-template-columns: 32px minmax(0, 1fr) minmax(0, 88px) 32px;
	gap: 8px;
	align-items: center;
	margin-bottom: 10px;
}

.database-series-date-popup-select {
	width: 100% !important;
	height: 32px;
	padding: 0 8px;
	font-size: 13px;
	line-height: 30px;
	font-variant-numeric: tabular-nums;
}

.database-series-date-popup-nav {
	width: 32px;
	height: 32px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--panel);
	color: var(--muted);
	font-size: 20px;
	line-height: 1;
	padding: 0;
	cursor: pointer;
}

.database-series-date-popup-nav:hover,
.database-series-date-popup-nav:focus-visible {
	background: var(--hover);
	color: var(--text);
	outline: none;
}

.database-series-date-popup-nav:disabled {
	opacity: 0.45;
	cursor: default;
}

.database-series-date-popup-grid {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	grid-template-rows: 30px repeat(6, 40px);
	border: 1px solid var(--border);
	border-radius: 6px;
	overflow: hidden;
	background: var(--border);
	gap: 1px;
}

.database-series-date-popup-grid .download-status-dayname {
	padding: 6px 0;
	font-size: 12px;
	line-height: 1.2;
	text-align: center;
}

.database-series-date-popup-grid .database-series-date-popup-dayname:nth-child(6),
.database-series-date-popup-grid .database-series-date-popup-dayname:nth-child(7) {
	color: #4f637d;
}

.database-series-date-popup-grid .download-status-cell {
	min-height: 40px;
	padding: 4px 0;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.database-series-date-popup-grid .download-status-date {
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	line-height: 1;
}

.database-series-date-popup-day {
	border-radius: 0;
}

.database-series-date-popup-grid .database-series-date-popup-day.weekend:not(.muted) {
	color: #4f637d;
}

.database-series-date-popup-grid .database-series-date-popup-day.weekend:not(.muted):hover {
	color: #42556d;
}

.database-series-date-popup-day--disabled,
.database-series-date-popup-day:disabled {
	cursor: not-allowed;
}

.database-series-date-popup-day:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: -2px;
	position: relative;
	z-index: 1;
}

.database-series-date-native-picker {
	position: absolute;
	right: 0;
	top: 0;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
	border: 0;
	padding: 0;
	margin: 0;
}

.database-series-date-native-picker::-webkit-calendar-picker-indicator {
	opacity: 0;
	pointer-events: none;
	width: 0;
	margin: 0;
	padding: 0;
}

.database-series-date-button {
	position: absolute;
	right: 1px;
	top: 1px;
	bottom: 1px;
	width: 30px;
	display: grid;
	place-items: center;
	border: 0;
	border-left: 1px solid var(--border);
	background: transparent;
	color: var(--muted);
	padding: 0;
	cursor: pointer;
	z-index: 1;
}

.database-series-date-button:hover,
.database-series-date-button:focus-visible {
	color: var(--text);
	background: color-mix(in srgb, var(--hover) 80%, transparent);
	outline: none;
}

.database-series-date-button svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
	stroke-width: 1.9;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	pointer-events: none;
}

.database-series-date-popup-actions {
	display: flex;
	justify-content: flex-end;
	margin-top: 10px;
}

.database-series-date-popup-quick {
	min-width: 78px;
	height: 32px;
	padding: 0 12px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--panel);
	color: var(--text);
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
}

.database-series-date-popup-quick:hover,
.database-series-date-popup-quick:focus-visible {
	background: var(--hover);
	outline: none;
}

.database-series-toolbar--corrections {
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
}

.database-series-toolbar--corrections .form-check.form-switch {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.database-series-toolbar--corrections .form-check-label {
	position: static;
}

.database-series-corrections-scope {
	flex: 1;
	min-width: 240px;
	text-align: left !important;
}

.database-series-main {
	display: grid;
	grid-template-rows: minmax(0, 1fr);
	padding: 0;
	overflow: hidden;
	min-height: 0;
}

.database-series-card {
	min-width: 0;
	min-height: 0;
	border: 1px solid var(--border);
	border-radius: 0;
	background: var(--panel);
	overflow: hidden;
}

.database-series-details {
	display: flex;
	flex-direction: column;
}

.database-series-detail-summary {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 24px;
	align-items: center;
	gap: 10px;
	width: 100%;
	border: 0;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
	padding: 10px 12px;
	text-align: left;
	cursor: pointer;
}

.database-series-detail-summary > span:first-child {
	display: grid;
	grid-template-columns: minmax(110px, .75fr) minmax(140px, 1fr) minmax(220px, 2fr);
	gap: 12px;
	min-width: 0;
	font-size: 13px;
}

.database-series-detail-summary span span {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.database-series-detail-summary strong,
.database-series-detail-grid strong {
	color: var(--muted);
	font-weight: 700;
}

.database-series-detail-chevron {
	text-align: center;
	color: var(--muted);
	font-size: 15px;
}

.database-series-details.is-collapsed .database-series-detail-body {
	display: none;
}

.database-series-details.is-collapsed .database-series-detail-chevron {
	transform: rotate(180deg);
}

.database-series-detail-body {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	padding: 16px;
}

.database-series-detail-body--tab {
	flex: 1;
	min-height: 0;
	overflow: auto;
}

.database-series-metadata-summary {
	padding: 0;
	border-bottom: 1px solid var(--border);
	background: linear-gradient(135deg, rgba(25, 118, 210, 0.10), rgba(25, 118, 210, 0.02)), var(--surface);
	font-size: 13px;
	min-width: 0;
}

.database-series-metadata-hero {
	padding: 18px 20px 16px;
	min-width: 0;
}

.database-series-metadata-eyebrow {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #1d4f91;
	margin-bottom: 8px;
}

.database-series-metadata-title-row {
	display: block;
	margin-bottom: 10px;
}

.database-series-metadata-title {
	margin: 0;
	font-size: 24px;
	line-height: 1.15;
	font-weight: 700;
	color: var(--text);
}


.database-series-metadata-description {
	margin: 0 0 14px;
	max-width: 72ch;
	color: var(--text);
	font-size: 14px;
	line-height: 1.55;
}

.database-series-metadata-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	min-width: 0;
}

.database-series-metadata-chip {
	display: inline-flex;
	flex-direction: column;
	gap: 2px;
	padding: 9px 12px;
	border-radius: 0;
	border: 1px solid rgba(29, 79, 145, 0.14);
	background: rgba(255, 255, 255, 0.75);
	min-width: 124px;
}

.database-series-metadata-chip-label {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
}

.database-series-metadata-chip strong {
	color: var(--text);
	font-size: 13px;
	line-height: 1.35;
}

.database-series-detail-grid {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

.database-series-metadata-panel {
	display: flex;
	flex-direction: column;
	min-width: 0;
	border: 1px solid var(--border);
	border-radius: 0;
	background: var(--panel);
	overflow: hidden;
	box-shadow: none;
}

.database-series-metadata-panel-head {
	padding: 14px 16px 12px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.database-series-metadata-panel-kicker {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: 4px;
}

.database-series-metadata-panel-title {
	margin: 0;
	font-size: 16px;
	line-height: 1.3;
	font-weight: 700;
	color: var(--text);
}

.database-series-metadata-fields {
	display: flex;
	flex-direction: column;
	padding: 0;
}

.database-series-metadata-field {
	display: grid;
	grid-template-columns: 180px minmax(0, 1fr);
	border-top: 1px solid var(--border);
	background: var(--panel);
	min-width: 0;
	min-height: 37px;
}

.database-series-metadata-fields .database-series-metadata-field:first-child {
	border-top: 0;
}

.database-series-metadata-field--wide {
	grid-column: 1 / -1;
}

.database-series-metadata-field--tall .database-series-metadata-value {
	min-height: 2.8em;
	align-items: flex-start;
}

.database-series-metadata-field--multiline .database-series-metadata-value {
	white-space: pre-wrap;
	word-break: break-word;
	overflow-wrap: anywhere;
	padding-top: 10px;
	padding-bottom: 10px;
}

.database-series-metadata-label {
	display: flex;
	align-items: center;
	margin-bottom: 0;
	padding: 8px 10px;
	font-size: 13px;
	line-height: 1.4;
	font-weight: 650;
	letter-spacing: 0;
	text-transform: none;
	color: var(--muted);
	background: var(--surface);
	border-right: 1px solid var(--border);
}

.database-series-metadata-value {
	display: flex;
	align-items: center;
	padding: 8px 10px;
	color: var(--text);
	font-size: 13px;
	line-height: 1.4;
	font-weight: 500;
	white-space: normal;
	word-break: break-word;
}

.database-series-factors {
	min-width: 0;
	min-height: 0;
}

.database-series-table-wrap--factors {
	flex: 1;
	min-height: 0;
	overflow: auto;
}

.database-series-factors .database-series-table {
	min-width: 320px;
}

@media (max-width: 1180px) {
	.database-series-detail-body {
		grid-template-columns: 1fr;
	}

	.database-series-metadata-field {
		grid-template-columns: 1fr;
	}

	.database-series-metadata-label {
		border-right: 0;
		border-bottom: 1px solid var(--border);
	}
}

.database-series-table-wrap {
	flex: 1;
	min-height: 0;
	overflow: auto;
}

#databaseSeriesPanel .database-series-symbols .database-series-table-wrap {
	overflow-x: auto;
	overflow-y: auto;
	scrollbar-gutter: stable both-edges;
}

body[data-theme="dark"] .app-shell,
body[data-theme="dark"] .app-shell * {
	scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

body[data-theme="dark"] .app-shell ::-webkit-scrollbar {
	width: 12px;
	height: 12px;
}

body[data-theme="dark"] .app-shell ::-webkit-scrollbar-track {
	background: var(--scrollbar-track);
}

body[data-theme="dark"] .app-shell ::-webkit-scrollbar-thumb {
	background: var(--scrollbar-thumb);
	border: 2px solid var(--scrollbar-track);
	border-radius: 10px;
}

body[data-theme="dark"] .app-shell ::-webkit-scrollbar-thumb:hover {
	background: var(--scrollbar-thumb-hover);
}

body[data-theme="dark"] .app-shell ::-webkit-scrollbar-corner {
	background: var(--scrollbar-track);
}

body[data-theme="dark"] .download-setup-backdrop,
body[data-theme="dark"] .download-setup-backdrop * {
	scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

body[data-theme="dark"] .download-setup-backdrop ::-webkit-scrollbar {
	width: 12px;
	height: 12px;
}

body[data-theme="dark"] .download-setup-backdrop ::-webkit-scrollbar-track {
	background: var(--scrollbar-track);
}

body[data-theme="dark"] .download-setup-backdrop ::-webkit-scrollbar-thumb {
	background: var(--scrollbar-thumb);
	border: 2px solid var(--scrollbar-track);
	border-radius: 10px;
}

body[data-theme="dark"] .download-setup-backdrop ::-webkit-scrollbar-thumb:hover {
	background: var(--scrollbar-thumb-hover);
}

body[data-theme="dark"] .download-setup-backdrop ::-webkit-scrollbar-corner {
	background: var(--scrollbar-track);
}

.database-series-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 12.5px;
}

#dbSeriesSymbolsTable,
#dbSeriesCorrectionsTable,
#dbSeriesFactorsTable {
	width: max-content;
	min-width: 100%;
}

#databaseSeriesPanel .database-series-symbols .database-series-table {
	width: max-content;
	min-width: max-content;
	white-space: nowrap;
}

#dbSeriesCorrectionsPanel .database-series-table {
	width: max-content;
	min-width: 100%;
	white-space: nowrap;
}

#dbSeriesFactorsTable {
	white-space: nowrap;
}

.database-series-table th,
.database-series-table td {
	padding: 8px 10px;
	border-bottom: 1px solid var(--border);
	text-align: left;
	vertical-align: top;
}

.database-series-table td {
	color: var(--muted);
	font-weight: 500;
}

.database-series-table th {
	position: sticky;
	top: 0;
	z-index: 1;
	background: var(--surface);
	color: var(--muted);
	font-weight: 650;
}

#dbSeriesSymbolsTable th:nth-child(2),
#dbSeriesSymbolsTable td:nth-child(2),
#dbSeriesSymbolsTable .database-series-bates-cell {
	text-align: center;
}

#dbSeriesSymbolsTable th:nth-child(2) .database-series-header-button {
	width: 100%;
	justify-content: center;
}

.database-series-table thead tr {
	height: 40px;
}

.database-series-header-cell {
	position: relative;
	padding-right: 16px !important;
	user-select: none;
}

.database-series-header-button {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border: 0;
	background: transparent;
	color: inherit;
	font: inherit;
	font-weight: inherit;
	padding: 0;
	cursor: pointer;
	white-space: nowrap;
}

.database-series-header-button:hover {
	color: var(--text);
}

.database-series-sort-indicator {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	color: var(--muted);
	min-width: 20px;
	text-align: center;
	vertical-align: middle;
	position: relative;
	top: 2px;
}

.database-series-sort-indicator .triangle-up {
	border-left: 5.4px solid transparent;
	border-right: 5.4px solid transparent;
	border-bottom: 7.2px solid currentColor;
}

.database-series-sort-indicator .triangle-down {
	border-left: 5.4px solid transparent;
	border-right: 5.4px solid transparent;
	border-top: 7.2px solid currentColor;
}

.database-series-column-resizer {
	position: absolute;
	top: 0;
	right: -2px;
	width: 10px;
	height: 100%;
	cursor: col-resize;
	touch-action: none;
	user-select: none;
}

.database-series-column-resizer::before {
	content: "";
	position: absolute;
	top: 8px;
	bottom: 8px;
	left: 4px;
	width: 1px;
	background: color-mix(in srgb, var(--border) 80%, transparent);
}

.database-series-column-resizer:hover::before {
	background: var(--primary);
}

.database-series-table tbody tr {
	cursor: pointer;
}

.database-series-table tbody tr:hover {
	background: var(--hover);
}
.database-series-table tbody tr.selected {
	background: color-mix(in srgb, var(--primary) 14%, var(--panel));
	box-shadow: inset 4px 0 0 var(--primary);
}

.database-series-date-cell {
	color: inherit;
}

.database-series-table--compact th,
.database-series-table--compact td {
	padding: 6px 8px;
}

.empty-cell,
.database-series-empty {
	color: var(--muted);
	font-size: 13px;
	padding: 12px;
}

.database-series-empty--loading {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.customer-inline-spinner {
	width: 14px;
	height: 14px;
	border: 2px solid color-mix(in srgb, var(--muted) 30%, transparent);
	border-top-color: var(--primary);
	border-radius: 50%;
	animation: customer-inline-spinner-rotate 0.8s linear infinite;
	flex: 0 0 auto;
}

@keyframes customer-inline-spinner-rotate {
	to {
		transform: rotate(360deg);
	}
}

.database-series-prices {
	display: flex;
	flex-direction: column;
	min-width: 0;
	min-height: 0;
	height: 100%;
	overflow: hidden;
}

.database-series-controls {
	flex-wrap: wrap;
}

.database-series-controls label {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--muted);
	font-size: 12px;
	flex: 0 0 auto;
}

.database-series-controls {
	display: flex;
	align-items: center;
	gap: 20px;
}

.database-series-date-group {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.database-series-check {
	gap: 6px !important;
}

.database-series-check input[type="checkbox"] {
	margin: 0;
}

.database-series-controls .form-control {
	width: 115px;
	border-radius: 0;
}

.database-series-controls .database-series-date-input {
	width: 125px;
}

.database-series-spinner {
	margin-left: -2px;
}

.database-series-panel .btn,
.database-series-panel .database-series-tab,
.database-series-panel .database-series-table-wrap,
.database-series-panel .database-series-table,
.database-series-panel .database-series-search .form-control,
.database-series-panel .database-series-controls .form-control {
	border-radius: 0;
}

.database-series-show-legacy[hidden] {
	display: none !important;
}

.database-series-controls #dbSeriesSymbolInput {
	width: 128px;
	flex: 0 0 128px;
}

.database-series-check {
	color: var(--muted) !important;
}

.database-series-tabs {
	display: flex;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.database-series-tab {
	border: 0;
	border-right: 1px solid var(--border);
	background: transparent;
	padding: 10px 14px;
	cursor: pointer;
	color: var(--muted);
}

.database-series-tab.active {
	background: var(--panel);
	color: var(--text);
	font-weight: 650;
}

.database-series-tab-panel {
	display: none;
	flex: 1;
	min-height: 0;
	overflow: auto;
}

.database-series-tab-panel.active {
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
}

.database-series-tree {
	padding: 0 8px 8px;
	max-width: 100%;
	min-width: 100%;
	width: max-content;
	flex: 1;
	min-height: 0;
	height: auto;
	overflow: auto;
	scrollbar-gutter: stable both-edges;
	outline: none;
}

.database-series-tree-row {
	display: grid;
	grid-template-columns: 26px var(--db-series-date-width, 170px) minmax(0, max-content);
	align-items: center;
	gap: 8px;
	padding: 7px 8px;
	border-bottom: 1px solid var(--border);
	min-width: max-content;
}

.database-series-tree-row.is-missing-weekday {
	color: var(--muted);
	background: color-mix(in srgb, var(--surface) 58%, transparent);
}

.database-series-tree-row.is-missing-weekday .database-series-values span {
	color: color-mix(in srgb, var(--muted) 72%, transparent);
}

.database-series-tree-row.is-selected-month {
	background: color-mix(in srgb, var(--primary) 16%, var(--panel));
	border-radius: 2px;
	box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--primary) 48%, transparent);
}

.database-series-tree-row.is-selected-row {
	background: color-mix(in srgb, var(--primary) 12%, var(--panel));
	box-shadow: inset 4px 0 0 var(--primary);
}

.database-series-tree-row.is-selected-month.is-selected-row {
	background: color-mix(in srgb, var(--primary) 20%, var(--panel));
	box-shadow: inset 4px 0 0 var(--primary), inset 0 0 0 2px color-mix(in srgb, var(--primary) 48%, transparent);
}

#customerUserDatasourceTreegridBody .database-series-tree-row.is-selected-month,
#customerUserAddGridBody .database-series-tree-row.is-selected-month {
	background: color-mix(in srgb, var(--primary) 18%, var(--panel));
	border-radius: 2px;
	box-shadow: inset 4px 0 0 var(--primary), inset 0 0 0 1px color-mix(in srgb, var(--primary) 42%, transparent);
}

#customerUserDatasourceTreegridBody .database-series-tree-row.is-new-row,
#customerUserAddGridBody .database-series-tree-row.is-new-row {
	background: color-mix(in srgb, var(--success) 16%, var(--panel));
	border-radius: 2px;
	box-shadow: inset 4px 0 0 var(--success), inset 0 0 0 1px color-mix(in srgb, var(--success) 34%, transparent);
}

#customerUserDatasourceTreegridBody .database-series-tree-row.is-pending-add,
#customerUserAddGridBody .database-series-tree-row.is-pending-add {
	background: color-mix(in srgb, var(--primary) 12%, var(--panel));
	border-radius: 2px;
	box-shadow: inset 4px 0 0 var(--primary), inset 0 0 0 1px color-mix(in srgb, var(--primary) 26%, transparent);
}

#customerUserDatasourceTreegridBody .database-series-tree-row.is-new-row.is-selected-month,
#customerUserAddGridBody .database-series-tree-row.is-new-row.is-selected-month {
	background: color-mix(in srgb, var(--success) 22%, var(--panel));
	box-shadow: inset 4px 0 0 var(--success), inset 0 0 0 2px color-mix(in srgb, var(--success) 52%, transparent);
}

#customerUserAddGridBody .database-series-tree-row.is-new-row.is-selected-month {
	background: color-mix(in srgb, var(--success) 30%, var(--panel));
	box-shadow: inset 4px 0 0 var(--success), inset 0 0 0 2px color-mix(in srgb, var(--success) 68%, transparent);
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-selected-month,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-selected-month {
	background: transparent;
	box-shadow: none;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-new-row,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row {
	background: transparent;
	box-shadow: none;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-new-row.is-selected-month,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row.is-selected-month {
	background: transparent;
	box-shadow: none;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"],
#customerUserAddGridBody .database-series-tree-row[data-level="1"] {
	padding-left: 0;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"] .customer-user-access-treegrid-cell--name,
#customerUserAddGridBody .database-series-tree-row[data-level="1"] .customer-user-access-treegrid-cell--name {
	padding-left: 0;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"] .database-series-values,
#customerUserAddGridBody .database-series-tree-row[data-level="1"] .database-series-values {
	position: relative;
	z-index: 0;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"] .database-series-values::before,
#customerUserAddGridBody .database-series-tree-row[data-level="1"] .database-series-values::before {
	content: "";
	position: absolute;
	top: -7px;
	right: 0;
	bottom: -7px;
	left: calc(var(--customer-user-access-datasource-width, 150px) - 28px);
	border-radius: 3px 0 0 3px;
	background: #F7FAFD;
	z-index: 0;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-new-row .database-series-values::before,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row .database-series-values::before {
	background: color-mix(in srgb, var(--success) 12%, var(--panel));
	box-shadow: inset 4px 0 0 var(--success), inset 0 0 0 1px color-mix(in srgb, var(--success) 30%, transparent);
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-pending-add .database-series-values::before,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-pending-add .database-series-values::before {
	background: color-mix(in srgb, var(--primary) 12%, var(--panel));
	box-shadow: inset 4px 0 0 var(--primary), inset 0 0 0 1px color-mix(in srgb, var(--primary) 26%, transparent);
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-new-row.is-selected-month .database-series-values::before,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row.is-selected-month .database-series-values::before {
	background: color-mix(in srgb, var(--success) 18%, var(--panel));
	box-shadow: inset 4px 0 0 var(--success), inset 0 0 0 2px color-mix(in srgb, var(--success) 46%, transparent);
}

#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row.is-selected-month .database-series-values::before {
	background: color-mix(in srgb, var(--success) 26%, var(--panel));
	box-shadow: inset 4px 0 0 var(--success), inset 0 0 0 2px color-mix(in srgb, var(--success) 60%, transparent);
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"] .database-series-values::before,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row[data-level="1"] .database-series-values::before {
	background: #1E2C44;
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-new-row .database-series-values::before,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row .database-series-values::before {
	background: color-mix(in srgb, var(--success) 12%, #1E2C44);
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row.is-pending-add,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row.is-pending-add {
	background: color-mix(in srgb, var(--primary) 16%, var(--panel));
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-pending-add .database-series-values::before,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row[data-level="1"].is-pending-add .database-series-values::before {
	background: color-mix(in srgb, var(--primary) 16%, #1E2C44);
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-new-row.is-selected-month .database-series-values::before,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row.is-selected-month .database-series-values::before {
	background: color-mix(in srgb, var(--success) 18%, #1E2C44);
}

body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row.is-new-row.is-selected-month {
	background: color-mix(in srgb, var(--success) 34%, var(--panel));
}

body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row.is-selected-month .database-series-values::before {
	background: color-mix(in srgb, var(--success) 28%, #1E2C44);
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"] .database-series-values > span,
#customerUserAddGridBody .database-series-tree-row[data-level="1"] .database-series-values > span {
	position: relative;
	z-index: 1;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-selected-month .database-series-values,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-selected-month .database-series-values {
	position: relative;
	z-index: 0;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-selected-month .database-series-values::before,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-selected-month .database-series-values::before {
	content: "";
	position: absolute;
	top: -7px;
	right: 0;
	bottom: -7px;
	left: calc(var(--customer-user-access-datasource-width, 150px) - 28px);
	border-radius: 3px 2px 2px 3px;
	background: color-mix(in srgb, var(--primary) 18%, var(--panel));
	box-shadow: inset 4px 0 0 var(--primary), inset 0 0 0 1px color-mix(in srgb, var(--primary) 42%, transparent);
	z-index: 0;
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-selected-month .database-series-values::before,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row[data-level="1"].is-selected-month .database-series-values::before {
	background: color-mix(in srgb, var(--primary) 18%, var(--panel));
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-selected-month .database-series-values > span,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-selected-month .database-series-values > span {
	position: relative;
	z-index: 2;
}

#customerUserDatasourceTreegridBody .database-series-children > .database-series-tree-row[data-level="1"]:not(:last-child),
#customerUserAddGridBody .database-series-children > .database-series-tree-row[data-level="1"]:not(:last-child) {
	position: relative;
}

#customerUserDatasourceTreegridBody .database-series-children > .database-series-tree-row[data-level="1"]:not(:last-child)::after,
#customerUserAddGridBody .database-series-children > .database-series-tree-row[data-level="1"]:not(:last-child)::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: calc(26px + 8px + 8px + var(--customer-user-access-datasource-width, 150px) - 28px);
	height: 1px;
	background: var(--panel);
	pointer-events: none;
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-children > .database-series-tree-row[data-level="1"]:not(:last-child)::after,
body[data-theme="dark"] #customerUserAddGridBody .database-series-children > .database-series-tree-row[data-level="1"]:not(:last-child)::after {
	background: var(--panel);
}

#customerUserDatasourceTreegridBody .database-series-tree-row.is-category-datasource-root,
#customerUserAddGridBody .database-series-tree-row.is-category-datasource-root {
	background: #F7FAFD;
	box-shadow: none;
}

#customerUserDatasourceTreegridBody .database-series-tree-row.is-category-datasource-root.has-selected-category-child,
#customerUserAddGridBody .database-series-tree-row.is-category-datasource-root.has-selected-category-child {
	background: color-mix(in srgb, var(--primary) 10%, #F7FAFD);
	box-shadow: inset 4px 0 0 var(--primary), inset 0 0 0 1px color-mix(in srgb, var(--primary) 28%, transparent);
}

#customerUserDatasourceTreegridBody .database-series-tree-row.is-category-datasource-root.has-new-category-child,
#customerUserAddGridBody .database-series-tree-row.is-category-datasource-root.has-new-category-child {
	background: color-mix(in srgb, var(--success) 10%, #F7FAFD);
	box-shadow: inset 4px 0 0 var(--success);
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row.is-category-datasource-root,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row.is-category-datasource-root {
	background: color-mix(in srgb, #1E2C44 70%, var(--panel));
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row.is-category-datasource-root.has-selected-category-child,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row.is-category-datasource-root.has-selected-category-child {
	background: color-mix(in srgb, var(--primary) 12%, #1E2C44);
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row.is-category-datasource-root.has-new-category-child,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row.is-category-datasource-root.has-new-category-child {
	background: color-mix(in srgb, var(--success) 10%, #1E2C44);
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"],
#customerUserAddGridBody .database-series-tree-row[data-level="1"] {
	background: #F7FAFD;
	box-shadow: none;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-selected-month,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-selected-month {
	background: color-mix(in srgb, var(--primary) 10%, #F7FAFD);
	box-shadow: inset 4px 0 0 var(--primary), inset 0 0 0 1px color-mix(in srgb, var(--primary) 28%, transparent);
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-new-row,
#customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row {
	background: color-mix(in srgb, var(--success) 10%, #F7FAFD);
	box-shadow: inset 4px 0 0 var(--success);
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"],
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row[data-level="1"] {
	background: color-mix(in srgb, #1E2C44 70%, var(--panel));
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-selected-month,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row[data-level="1"].is-selected-month {
	background: color-mix(in srgb, var(--primary) 12%, #1E2C44);
}

body[data-theme="dark"] #customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"].is-new-row,
body[data-theme="dark"] #customerUserAddGridBody .database-series-tree-row[data-level="1"].is-new-row {
	background: color-mix(in srgb, var(--success) 10%, #1E2C44);
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"] .database-series-values::before,
#customerUserAddGridBody .database-series-tree-row[data-level="1"] .database-series-values::before,
#customerUserDatasourceTreegridBody .database-series-children > .database-series-tree-row[data-level="1"]:not(:last-child)::after,
#customerUserAddGridBody .database-series-children > .database-series-tree-row[data-level="1"]:not(:last-child)::after {
	display: none;
}

.database-series-tree-row[data-level="1"] { padding-left: 26px; }
.database-series-tree-row[data-level="2"] { padding-left: 44px; }

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"],
#customerUserAddGridBody .database-series-tree-row[data-level="1"] {
	padding-left: 8px;
}

#customerUserDatasourceTreegridBody .database-series-tree-row[data-level="1"] .customer-user-access-treegrid-cell--datasource,
#customerUserAddGridBody .database-series-tree-row[data-level="1"] .customer-user-access-treegrid-cell--datasource {
	padding-left: 18px;
}

.database-series-tree-head {
	position: sticky;
	top: 0;
	z-index: 4;
	background: var(--surface);
	color: var(--muted);
	font-size: 12px;
	font-weight: 650;
	height: 40px;
	align-items: center;
	padding-top: 0;
	padding-bottom: 0;
	overflow: hidden;
	border-bottom: 1px solid var(--border);
	box-shadow: none;
}

.database-series-tree-head .database-series-date,
.database-series-tree-head .database-series-value-head {
	position: relative;
	display: inline-flex;
	align-items: center;
	align-self: stretch;
	color: var(--muted);
	font-weight: 650;
	height: 40px;
	box-sizing: border-box;
	padding-right: 16px;
	background: var(--surface);
	user-select: none;
}

.database-series-tree-head .database-series-values {
	gap: 8px;
}

.database-series-tree-head .database-series-column-resizer::before {
	top: 8px;
	bottom: 8px;
}

.database-series-tree-head .database-series-date .database-series-column-resizer,
.database-series-tree-head .database-series-value-head .database-series-column-resizer {
	right: -2px;
}

.database-series-tree-head-button {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border: 0;
	background: transparent;
	color: inherit;
	font: inherit;
	font-weight: inherit;
	padding: 0;
	cursor: pointer;
	white-space: nowrap;
}

.database-series-tree-head-button:hover {
	color: var(--text);
}

.database-series-node-toggle {
	width: 22px;
	height: 22px;
	border: 1px solid currentColor;
	border-radius: 4px;
	background: transparent;
	color: color-mix(in srgb, var(--text) 30%, var(--muted) 70%);
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}

body[data-theme="dark"] .database-series-node-toggle {
	color: color-mix(in srgb, var(--text) 36%, var(--muted) 64%);
	background: transparent;
}

.database-series-node-toggle:hover,
.database-series-node-toggle:focus-visible {
	background: color-mix(in srgb, currentColor 10%, transparent);
	color: color-mix(in srgb, var(--text) 58%, var(--muted) 42%);
	outline: none;
}

.database-series-node-spacer {
	width: 22px;
	position: relative;
}

#customerUserDatasourceTreegridBody .database-series-children {
	position: relative;
}

.database-series-values {
	display: grid;
	gap: 8px;
	color: var(--muted);
	font-size: 12px;
	justify-content: start;
	justify-self: start;
	width: max-content;
}

.database-series-values > span {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	min-height: 22px;
}

.customer-user-access-treegrid-cell--name {
	justify-content: flex-start;
	text-align: left;
}

#customerUserDatasourceTreegridBody .database-series-values > span,
#customerUserAddGridBody .database-series-values > span {
	justify-content: flex-start;
	text-align: left;
}

#customerUserDatasourceTreegridBody .customer-user-access-treegrid-cell,
#customerUserAddGridBody .customer-user-access-treegrid-cell {
	box-sizing: border-box;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#customerUserDatasourceTreegridBody .database-series-values > span .customer-active-mark,
#customerUserAddGridBody .database-series-values > span .customer-active-mark {
	margin-right: auto;
}

.customer-user-access-treegrid-edit-btn {
	min-width: 58px;
	justify-content: center;
	font-weight: 600;
}

.database-series-value-head {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding-right: 14px;
	min-width: 0;
}

.database-series-tree-head .database-series-date {
	padding-right: 16px;
}

.database-series-value-head .database-series-column-resizer {
	right: -2px;
}

.database-series-date {
	color: var(--muted);
	font-weight: 500;
}

.database-series-tree-row .database-series-date,
.database-series-tree-row .database-series-values {
	font-size: 12px;
	line-height: 17.4px;
	align-self: center;
}

.database-series-change {
	font-variant-numeric: tabular-nums;
	font-weight: 650;
}

.database-series-change--up {
	color: #1f9d55;
}

.database-series-change--down {
	color: #d63939;
}

.database-series-change--flat {
	color: var(--muted);
}

.database-series-value-label {
	color: var(--muted);
	font-weight: 400;
}

.database-series-controls--compact {
	border-top: 0;
}

.customers-panel {
	height: 100%;
	min-height: 0;
	display: flex;
	flex-direction: column;
	background: var(--panel);
}

.customers-panel[hidden] { display: none; }

.customers-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 14px 16px;
	border-bottom: 1px solid var(--border);
	background: var(--panel);
}

.customers-head h2 {
	margin: 0;
	font-size: 19px;
}

.customers-head p {
	margin: 2px 0 0;
	color: var(--muted);
	font-size: 13px;
}

.customers-actions {
	display: flex;
	align-items: center;
	gap: 8px;
}

.toolbar-search-field,
.customers-search-field {
	width: 240px;
}

.input-icon {
	position: relative;
	display: block;
}

.input-icon .form-control {
	padding-right: 40px;
}

.input-icon-addon {
	position: absolute;
	top: 50%;
	right: 12px;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--muted);
	pointer-events: none;
}

.input-icon-addon svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
}

.toolbar-search-field .form-control,
.customers-search-field .form-control {
	min-height: 40px;
	padding-left: 14px;
	padding-right: 40px;
}

.customers-table-wrap {
	flex: 1;
	min-height: 0;
	overflow: auto;
}

.customers-table {
	width: 100%;
	min-width: 980px;
	border-collapse: collapse;
	font-size: 13px;
}

.customers-table th,
.customers-table td {
	padding: 9px 10px;
	border-bottom: 1px solid var(--border);
	text-align: left;
	white-space: nowrap;
}

.customers-table th {
	position: sticky;
	top: 0;
	z-index: 1;
	background: var(--surface);
	color: var(--muted);
	font-weight: 650;
}

.customers-table tbody tr {
	cursor: pointer;
}

.customers-table tbody tr:hover {
	background: var(--hover);
}
.customers-table tbody tr.selected {
	background: color-mix(in srgb, var(--primary) 14%, var(--panel));
	box-shadow: inset 4px 0 0 var(--primary);
}

.customer-active-name { color: var(--success); font-weight: 600; }
.customer-inactive-name { color: var(--danger); font-weight: 600; }
.customer-active-mark {
	display: inline-flex;
	align-items: center;
	border-radius: 0;
	padding: 2px 7px;
	font-size: 12px;
}
.customer-active-mark.is-active { background: #e9f8ee; color: #1f7a32; }
.customer-active-mark.is-inactive { background: #fff1f1; color: #b42318; }
body[data-theme="dark"] .customer-active-mark.is-active { background: #123824; color: #8ee0a4; }
body[data-theme="dark"] .customer-active-mark.is-inactive { background: #481d22; color: #ffb4b4; }
.customer-users { color: var(--primary); }

.customer-editor-view {
	min-height: 100%;
}

.customer-editor-view form {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-height: 100%;
}

.customer-editor-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 10px;
}

.customer-editor-head h2 {
	margin: 0;
	font-size: 18px;
	line-height: 1.25;
}

.customer-editor-head p {
	margin: 3px 0 0;
	color: var(--muted);
	font-size: 13px;
}

.customer-editor-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
}

.customer-modal-switches {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	margin-left: auto;
}

.customer-tabs-card {
	display: flex;
	flex-direction: column;
	min-height: 0;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--panel);
	box-shadow: var(--shadow);
}

.customer-tabs-head {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 0 12px;
	border-bottom: 1px solid var(--border);
	background: var(--panel);
}

.customer-tab {
	height: 46px;
	padding: 0 14px;
	border: 0;
	border-bottom: 2px solid transparent;
	background: transparent;
	color: var(--muted);
	font: inherit;
	font-weight: 500;
	cursor: pointer;
}

.customer-tab.active {
	color: var(--primary);
	border-bottom-color: var(--primary);
}

.customer-tab-panel {
	display: none;
	padding: 16px;
}

.customer-tab-panel.active {
	display: block;
}

.customer-form-top {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px 18px;
	padding: 0 0 16px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--border);
}

.customer-workspace-split {
	display: grid;
	grid-template-columns: minmax(320px, var(--customer-left-width, min(560px, 50%))) 8px minmax(340px, 1fr);
	min-height: 520px;
	border: 1px solid var(--border);
	border-radius: 4px;
	overflow: hidden;
	background: var(--panel);
}

.customer-workspace-split.is-left-collapsed {
	grid-template-columns: 44px 8px minmax(340px, 1fr);
}

.customer-left-pane,
.customer-right-pane {
	min-width: 0;
	background: var(--panel);
}

.customer-right-pane {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.customer-splitter {
	width: 8px;
	border-left: 1px solid var(--border);
	border-right: 1px solid var(--border);
	background: linear-gradient(90deg, transparent 0, transparent 3px, var(--border) 3px, var(--border) 4px, transparent 4px);
	cursor: col-resize;
	touch-action: none;
	user-select: none;
}

.customer-accordion {
	border: 0;
	height: 100%;
}

.customer-collapse-toggle {
	display: flex;
	align-items: center;
	gap: 8px;
	position: relative;
	width: 100%;
	min-height: 44px;
	padding: 0 16px;
	border: 0;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
	color: var(--text);
	font: inherit;
	font-weight: 650;
	cursor: pointer;
}

.customer-collapse-toggle::after {
	content: "";
	width: 8px;
	height: 8px;
	margin-left: auto;
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	transform: rotate(135deg);
	transition: transform 0.15s ease;
}

.customer-collapse-toggle[aria-expanded="true"]::after {
	transform: rotate(135deg);
}

.customer-workspace-split.is-left-collapsed .customer-collapse-toggle {
	height: 100%;
	min-height: 520px;
	padding: 42px 0 16px;
	justify-content: center;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	border-bottom: 0;
	border-right: 1px solid var(--border);
}

.customer-workspace-split.is-left-collapsed .customer-collapse-toggle::after {
	position: absolute;
	left: 50%;
	top: 16px;
	margin: 0;
	transform: translateX(-50%) rotate(315deg);
}

.customer-workspace-split.is-left-collapsed .customer-accordion-body {
	display: none;
}

.customer-accordion-body {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 12px;
	background: var(--surface);
}

.customer-stack-panel {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 14px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--panel);
}

.customer-stack-panel h3 {
	margin: -14px -14px 0;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
	color: var(--text);
	font-size: 14px;
	font-weight: 650;
}

.customer-stack-panel h3 .customer-stack-accordion-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
	min-height: 38px;
	padding: 10px 14px;
	border: 0;
	background: transparent;
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: pointer;
}

.customer-stack-panel h3 .customer-stack-accordion-toggle::after {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.15s ease;
	opacity: 0.75;
}

.customer-stack-panel.is-collapsed h3 {
	margin-bottom: -14px;
	border-bottom: 0;
}

.customer-stack-panel.is-collapsed h3 .customer-stack-accordion-toggle::after {
	transform: rotate(-45deg);
}

.customer-stack-panel.is-collapsed > :not(h3) {
	display: none;
}

.customer-name-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.customer-name-label-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 16px;
}

.customer-field-label {
	color: var(--text);
	font-size: 13px;
	font-weight: 650;
}

.customer-field-label b {
	color: var(--danger);
	font-weight: 700;
}

.customer-name-field .form-control {
	width: 100%;
	height: 40px;
	min-height: 40px;
	padding: 6px 12px;
	line-height: 1.4285714;
	font-weight: 650;
	background: var(--control-bg);
	border-color: #dce1e7;
	box-shadow: none;
}

.customer-demo-inline {
	min-height: 22px;
	padding-bottom: 0;
}

.customer-side-tabs {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 0 10px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.customer-side-tab {
	height: 42px;
	padding: 0 12px;
	border: 0;
	border-bottom: 2px solid transparent;
	background: transparent;
	color: var(--muted);
	font: inherit;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
}

.customer-side-tab.active {
	color: var(--primary);
	border-bottom-color: var(--primary);
}

.customer-side-panel {
	display: none;
	padding: 12px;
}

.customer-side-panel.active {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}

#customerSideNotes.active {
	gap: 12px;
	min-height: 0;
}

#customerSideChangeLog.active {
	gap: 12px;
	min-height: 0;
}

.customer-change-log {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 12px;
	min-height: 0;
	overflow: auto;
	padding: 4px;
}

.customer-change-log-group {
	border: 1px solid var(--border);
	border-radius: 12px;
	background: var(--surface);
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
	overflow: hidden;
}

.customer-change-log-group-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 14px;
	border-bottom: 1px solid var(--border);
	background: color-mix(in srgb, var(--surface) 82%, #dbeafe 18%);
}

.customer-change-log-group-title {
	font-weight: 700;
	color: var(--text);
}

.customer-change-log-group-meta {
	font-size: 12px;
	color: var(--muted);
	text-align: right;
}

.customer-change-log-rows {
	display: grid;
	gap: 0;
}

.customer-change-log-row {
	display: grid;
	grid-template-columns: minmax(140px, 180px) minmax(0, 1fr) minmax(0, 1fr);
	gap: 12px;
	padding: 12px 14px;
	border-top: 1px solid var(--border);
	align-items: start;
}

.customer-change-log-row:first-child {
	border-top: 0;
}

.customer-change-log-field {
	font-weight: 700;
	color: var(--text);
}

.customer-change-log-value-label {
	display: block;
	margin-bottom: 4px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--muted);
}

.customer-change-log-value {
	font-size: 13px;
	line-height: 1.45;
	color: var(--text);
	word-break: break-word;
	white-space: pre-wrap;
}

.customer-change-log-value.is-empty {
	color: var(--muted);
	font-style: italic;
}

@media (max-width: 900px) {
	.customer-change-log-row {
		grid-template-columns: 1fr;
	}

	.customer-change-log-group-head {
		flex-direction: column;
		align-items: flex-start;
	}

	.customer-change-log-group-meta {
		text-align: left;
	}
}

.customer-json-settings-form {
	display: grid;
	gap: 14px;
	padding: 4px;
}

.customer-rate-limit-hint {
	border: 1px solid var(--border);
	border-left: 3px solid var(--primary);
	border-radius: 4px;
	background: var(--panel);
	color: var(--muted);
	font-size: 13px;
	line-height: 1.45;
	padding: 10px 12px;
}

.customer-rate-limit-panel {
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--surface);
	display: grid;
	gap: 14px;
	padding: 14px;
}

.customer-rate-limit-panel h3 {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0;
}

.customer-json-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.customer-json-switch {
	justify-self: start;
}

.customer-form-top .user-edit-ds-toggle-inline,
.customer-user-editor-switches .user-edit-ds-toggle-inline,
.customer-datasource-switches .user-edit-ds-toggle-inline,
.customer-json-settings-form .user-edit-ds-toggle-inline {
	display: flex;
	align-items: center;
	min-height: 34px;
}

.customer-form-top .user-edit-ds-toggle-inline .sarus-toggle,
.customer-user-editor-switches .user-edit-ds-toggle-inline .sarus-toggle,
.customer-datasource-switches .user-edit-ds-toggle-inline .sarus-toggle,
.customer-json-settings-form .user-edit-ds-toggle-inline .sarus-toggle {
	--sarus-toggle-width: 58px;
	margin: 0;
	font-weight: 400;
}

.customer-json-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-top: 4px;
}

.customer-json-message {
	color: var(--success);
	font-size: 13px;
}

.customer-json-message.error {
	color: var(--danger);
}

.customer-json-raw-field {
	gap: 6px;
}

.customer-json-editor {
	position: relative;
	min-height: 220px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	overflow: hidden;
}

.customer-json-raw {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	min-height: 220px;
	z-index: 1;
	margin: 0;
	padding: 10px 12px;
	border: 0;
	border-radius: 0;
	background: var(--surface);
	color: var(--text);
	-webkit-text-fill-color: currentColor;
	caret-color: var(--text);
	font-family: "Cascadia Mono", Consolas, monospace;
	font-size: 12px;
	line-height: 1.45;
	resize: none;
	overflow: auto;
	white-space: pre;
	tab-size: 2;
}

.customer-field textarea.customer-json-raw.form-control {
	height: 100%;
	min-height: 220px;
	padding: 10px 12px;
	line-height: 1.45;
	background: var(--surface);
	border-color: transparent;
}

.customer-field .customer-json-editor.customer-json-editor--highlight-ready .customer-json-raw {
	background: transparent;
	border-color: transparent;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.customer-json-editor:not(.customer-json-editor--highlight-ready) .customer-json-preview {
	display: none;
}

.customer-json-raw::selection {
	background: rgba(32, 107, 196, 0.28);
}

.customer-json-raw:focus {
	box-shadow: none;
}

.customer-json-raw:disabled {
	cursor: not-allowed;
	opacity: 1;
	background: var(--surface-secondary);
}

.customer-json-editor-highlight {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	margin: 0;
	padding: 10px 12px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--text);
	overflow: auto;
	white-space: pre;
	tab-size: 2;
	scrollbar-width: none;
}

.customer-json-editor-highlight::-webkit-scrollbar {
	display: none;
}

.customer-json-validation {
	border: 1px solid #f1b8b8;
	background: #fff1f1;
	color: #b42318;
	border-radius: 4px;
	padding: 8px 10px;
	font-size: 13px;
}

.customer-json-preview {
	min-height: 110px;
	max-height: 220px;
	overflow: auto;
	margin: 0;
	padding: 10px 12px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	color: var(--text);
	font-family: "Cascadia Mono", Consolas, monospace;
	font-size: 12px;
	line-height: 1.45;
}

.customer-json-editor .customer-json-preview {
	position: absolute;
	inset: 0;
	min-height: 100%;
	max-height: none;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.customer-json-editor.customer-json-editor--highlight-ready .customer-json-raw:disabled {
	display: none;
}

.customer-json-preview .json-key { color: #206bc4; }
.customer-json-preview .json-string { color: #2fb344; }
.customer-json-preview .json-number { color: #d97706; }
.customer-json-preview .json-boolean { color: #ae3ec9; }
.customer-json-preview .json-null { color: #667085; }

.customer-mini-toolbar {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 5px 0;
	border-bottom: 1px solid var(--border);
}

.customer-mini-toolbar .btn-sm {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 28px;
	padding: 4px 8px;
	font-size: 12px;
	border: 0;
	background: transparent;
	box-shadow: none;
	color: #667085;
	border-radius: 4px;
	transition: background 0.12s ease, color 0.12s ease;
}

.customer-mini-toolbar .btn-sm:hover,
.customer-mini-toolbar .btn-sm:focus-visible {
	background: var(--hover);
	color: var(--text);
	outline: none;
}

.customer-mini-toolbar .btn-sm::before {
	content: "";
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
	transition: filter 0.12s ease, opacity 0.12s ease;
}

.customer-mini-toolbar :is(#customerNoteAddBtn, #customerUserAddBtn, #customerUserNoteAddBtn)::before {
	background-image: url("../images/add.png?v=20260513-1");
}

.customer-mini-toolbar :is(#customerNoteEditBtn, #customerUserEditBtn, #customerUserNoteViewBtn)::before {
	background-image: url("../images/view-mag.png?v=20260513-1");
	filter: brightness(0);
	opacity: 0.82;
}

.customer-mini-toolbar :is(#customerNoteRefreshBtn, #customerUserRefreshBtn, #customerUserNoteRefreshBtn)::before {
	background-image: url("../images/refresh.png");
}

body[data-theme="dark"] .customer-mini-toolbar :is(#customerNoteEditBtn, #customerUserEditBtn, #customerUserNoteViewBtn, #customerNoteRefreshBtn, #customerUserRefreshBtn, #customerUserNoteRefreshBtn)::before {
	filter: brightness(0) invert(1);
	opacity: 0.92;
}

.customer-mini-toolbar .btn-sm:disabled {
	background: transparent;
	color: #98a2b3;
}

.customer-mini-toolbar .btn-sm:disabled::before {
	opacity: 0.55;
}

.customer-slickgrid-wrap {
	flex: 1 1 auto;
	min-height: 360px;
	height: auto;
	border: 1px solid var(--border);
	background: var(--panel);
	min-width: 0;
}

.customer-slickgrid-wrap--user {
	min-height: 320px;
}

.customer-slickgrid-host {
	width: 100%;
	height: 100%;
	font-size: 13px;
	background: var(--panel);
}

.customer-slickgrid-host .slick-header-columns {
	border-bottom: 0;
	background: var(--surface);
	color: var(--muted);
	font-weight: 650;
}

.customer-slickgrid-host .slick-header,
.customer-slickgrid-host .slick-header.slick-state-default {
	border-bottom: 0;
	box-shadow: none;
	background: var(--surface);
}

.customer-slickgrid-host .slick-header-column {
	height: 36px;
	padding: 8px 10px;
	border: 0;
	border-right: 1px solid var(--border);
	line-height: 20px;
	box-sizing: border-box;
	background: transparent;
}

.customer-slickgrid-host .slick-header-column .slick-column-name {
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.customer-slickgrid-host .slick-header-column.customer-slick-header-indicator {
	justify-content: center;
	text-align: center;
	padding-left: 0;
	padding-right: 0;
}

.customer-slickgrid-host .slick-resizable-handle {
	background: transparent;
	box-shadow: none;
	opacity: 0;
}

.customer-slickgrid-host .slick-viewport {
	background: var(--panel);
}

.customer-slickgrid-host .slick-row {
	border-bottom: 0;
	background: var(--panel);
	transition: background 0.12s ease;
	cursor: pointer;
}

.customer-slickgrid-host .slick-row:hover {
	background: var(--hover);
}

.customer-slickgrid-host .slick-row.is-selected {
	background: color-mix(in srgb, var(--primary) 14%, var(--panel));
	box-shadow: inset 4px 0 0 var(--primary);
}

.customer-slickgrid-host .slick-row.customer-slick-row-amendment,
.customer-slickgrid-host .slick-row.customer-slick-row-empty-child,
.customer-slickgrid-host .slick-row.customer-slick-row-loading {
	background: color-mix(in srgb, var(--surface) 80%, var(--panel));
	cursor: default;
}

.customer-slickgrid-host .slick-row.customer-slick-row-amendment:hover,
.customer-slickgrid-host .slick-row.customer-slick-row-empty-child:hover,
.customer-slickgrid-host .slick-row.customer-slick-row-loading:hover {
	background: color-mix(in srgb, var(--surface) 80%, var(--panel));
}

.customer-slickgrid-host .slick-cell {
	padding: 4px 10px;
	border-right: 0;
	border-bottom: 0;
	display: flex;
	align-items: center;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	box-sizing: border-box;
	color: var(--text);
	background: transparent;
	line-height: 1.35;
	font-size: 13px;
}

.customer-slickgrid-host .slick-cell:last-child,
.customer-slickgrid-host .slick-header-column:last-child {
	border-right: 0;
}

.customer-slickgrid-host .slick-cell.l2 {
	align-items: stretch;
	padding-top: 6px;
	padding-bottom: 6px;
	white-space: normal;
	text-overflow: clip;
	line-height: 1.4;
}

.customer-slick-empty {
	color: var(--muted);
	font-size: 13px;
}

.customer-slick-tree-cell {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
}

.customer-slick-tree-cell.is-child {
	justify-content: flex-start;
	padding-left: 8px;
}

.customer-slick-tree-toggle,
.customer-slick-tree-toggle-spacer {
	width: 18px;
	min-width: 18px;
	height: 18px;
	flex: 0 0 18px;
}

.customer-slick-tree-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--muted);
	font-size: 18px;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
}

.customer-slick-tree-toggle:hover {
	color: var(--text);
}

.customer-user-datasource-treegrid-toolbar > :first-child {
	flex: 1 1 auto;
	min-width: 0;
}

.customer-user-datasource-treegrid-toolbar .toolbar-search-field {
	margin-left: auto;
}

.customer-slick-indicator-cell {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.customer-slick-caption-wrap {
	display: grid;
	gap: 2px;
	min-width: 0;
	align-content: center;
}

.customer-slick-caption {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: 500;
	color: var(--text);
}

.customer-slick-caption-meta {
	color: var(--muted);
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.customer-slick-date {
	color: var(--primary);
	font-weight: 500;
	white-space: nowrap;
}

.customer-slick-updates-btn,
.customer-slick-updates-zero {
	margin: 0 auto;
	font-weight: 600;
	text-align: center;
}

.customer-slick-amendment {
	display: grid;
	gap: 4px;
	min-width: 0;
	white-space: normal;
	align-content: center;
}

.customer-slick-amendment-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	color: var(--muted);
}

.customer-slick-amendment-head strong {
	color: var(--text);
	font-size: 12px;
	font-weight: 650;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.customer-slick-amendment-meta {
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
}

.customer-slick-amendment-caption {
	font-size: 13px;
	font-weight: 650;
	color: var(--text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.customer-slick-amendment-message {
	white-space: pre-wrap;
	overflow-wrap: anywhere;
	line-height: 1.45;
	color: var(--text);
}

.customer-slick-row-note.is-completed .customer-slick-caption,
.customer-slick-row-note.is-completed .customer-slick-date,
.customer-slick-row-note.is-completed .customer-slick-updates-btn,
.customer-slick-row-note.is-completed .customer-slick-updates-zero {
	color: #1f7a38;
	font-weight: 600;
}

.customer-note-updates-btn {
	min-width: 22px;
	min-height: 22px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	text-align: center;
	}

.customer-note-type-pill {
	--customer-note-type-bg: #eaf2ff;
	--customer-note-type-fg: #1559b7;
	--customer-note-type-border: transparent;
	display: inline-flex;
	align-items: center;
	min-height: 18px;
	padding: 1px 7px;
	border-radius: 0;
	border: 1px solid var(--customer-note-type-border);
	background: var(--customer-note-type-bg);
	color: var(--customer-note-type-fg);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	}

.customer-note-type-information {
	--customer-note-type-bg: #eff6ff;
	--customer-note-type-fg: #1d4ed8;
	--customer-note-type-border: #b6cef0;
	--customer-note-type-dot-fill: #eff6ff;
	--customer-note-type-dot-border: #b6cef0;
	}

.customer-note-type-service-problem {
	--customer-note-type-bg: #f1c26a;
	--customer-note-type-fg: #5a5853;
	--customer-note-type-border: #f69d04;
	--customer-note-type-dot-fill: #f1c26a;
	--customer-note-type-dot-border: #f69d04;
	}

.customer-note-type-complaint {
	--customer-note-type-bg: #ffc2c2;
	--customer-note-type-fg: #ed0202;
	--customer-note-type-border: #fd3f3f;
	--customer-note-type-dot-fill: #ffc2c2;
	--customer-note-type-dot-border: #fd3f3f;
	}

.customer-note-type-error {
	--customer-note-type-bg: #ff7a7a;
	--customer-note-type-fg: #fafafa;
	--customer-note-type-border: #b90404;
	--customer-note-type-dot-fill: #ff7a7a;
	--customer-note-type-dot-border: #b90404;
	}

.customer-note-type-critical {
	--customer-note-type-bg: #e03131;
	--customer-note-type-fg: #ffffff;
	--customer-note-type-border: #e03131;
	--customer-note-type-dot-fill: #e03131;
	--customer-note-type-dot-border: #e03131;
	}

body[data-theme="dark"] .customer-note-type-information {
	--customer-note-type-bg: #172337;
	--customer-note-type-fg: #9cc8ff;
	--customer-note-type-border: #47668f;
	--customer-note-type-dot-fill: #172337;
	--customer-note-type-dot-border: #47668f;
	}

body[data-theme="dark"] .customer-note-type-service-problem {
	--customer-note-type-bg: #413114;
	--customer-note-type-fg: #ffd37a;
	--customer-note-type-border: #8f6b20;
	--customer-note-type-dot-fill: #413114;
	--customer-note-type-dot-border: #8f6b20;
	}

body[data-theme="dark"] .customer-note-type-complaint {
	--customer-note-type-bg: rgba(255, 193, 7, 0.18);
	--customer-note-type-fg: #ffd27a;
	--customer-note-type-border: #7a5f21;
	--customer-note-type-dot-fill: rgba(255, 193, 7, 0.18);
	--customer-note-type-dot-border: #7a5f21;
	}

body[data-theme="dark"] .customer-note-type-error {
	--customer-note-type-bg: #3a1f25;
	--customer-note-type-fg: #ffb4b4;
	--customer-note-type-border: #74414c;
	--customer-note-type-dot-fill: #3a1f25;
	--customer-note-type-dot-border: #74414c;
	}

body[data-theme="dark"] .customer-note-type-critical {
	--customer-note-type-bg: #e03131;
	--customer-note-type-fg: #ffffff;
	--customer-note-type-border: #e03131;
	--customer-note-type-dot-fill: #e03131;
	--customer-note-type-dot-border: #e03131;
	}

.customer-note-type-dot {
	--customer-note-type-dot-fill: #eaf2ff;
	--customer-note-type-dot-border: #6c7a91;
	width: 10px;
	height: 10px;
	border-radius: 999px;
	background: var(--customer-note-type-dot-fill);
	border: 2px solid var(--customer-note-type-dot-border);
	display: inline-block;
	box-sizing: border-box;
	vertical-align: middle;
	}

.customer-note-priority-pill {
	display: inline-flex;
	align-items: center;
	min-height: 18px;
	padding: 1px 7px;
	border-radius: 0;
	font-size: 12px;
	font-weight: 650;
	line-height: 1.2;
	white-space: nowrap;
	border: 1px solid transparent;
}

.customer-note-priority-low {
	background: #e8f0fc;
	color: #667085;
	border-color: #bcc5d2;
}

.customer-note-priority-normal {
	background: #e9f8ee;
	color: #078d10;
	border-color: #b7e4c7;
}

.customer-note-priority-high {
	background: #ffc2c2;
	color: #ed0202;
	border-color: #fd3f3f;
}

.customer-note-priority-critical {
	background: #e03131;
	color: #ffffff;
	border-color: #e03131;
}

body[data-theme="dark"] .customer-note-priority-low {
	background: #233041;
	color: #9aa8bd;
	border-color: #455468;
}

body[data-theme="dark"] .customer-note-priority-normal {
	background: #111827;
	color: #5ea169;
	border-color: #2e6a43;
}

body[data-theme="dark"] .customer-note-priority-high {
	background: rgba(255, 193, 7, 0.18);
	color: #ffd27a;
	border-color: #7a5f21;
}

body[data-theme="dark"] .customer-note-priority-critical {
	background: #e03131;
	color: #ffffff;
	border-color: #e03131;
}

.customer-note-type-dot {
	--customer-note-type-dot-fill: #eaf2ff;
	--customer-note-type-dot-border: #6c7a91;
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--customer-note-type-dot-fill);
	border: 2px solid var(--customer-note-type-dot-border);
	box-sizing: border-box;
	vertical-align: middle;
}

.customer-note-completed-dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 20%, transparent);
}

.customer-note-completed-dot.is-outstanding {
	background: #f59f00;
	color: #f59f00;
}

.customer-note-completed-dot.is-completed {
	background: #2fb344;
	color: #2fb344;
}

.customer-note-modal {
	width: min(640px, calc(100vw - 48px));
	min-width: min(640px, calc(100vw - 32px));
	max-width: calc(100vw - 32px);
	height: min(540px, calc(100vh - 48px));
	min-height: min(540px, calc(100vh - 32px));
	max-height: calc(100vh - 32px);
	resize: both;
	overflow: hidden;
}

.customer-note-amend-modal {
	width: min(600px, calc(100vw - 48px));
	min-width: min(600px, calc(100vw - 32px));
	max-width: calc(100vw - 32px);
	height: min(500px, calc(100vh - 48px));
	min-height: min(500px, calc(100vh - 32px));
	max-height: calc(100vh - 32px);
}

.customer-note-body {
	display: grid;
	grid-template-rows: auto auto minmax(150px, 1fr) auto auto;
	gap: 14px;
	padding: 18px;
	min-height: 0;
	flex: 1 1 auto;
	overflow: hidden;
}

.customer-note-message {
	height: 100%;
	min-height: 150px;
	resize: none;
}

.customer-field textarea.customer-note-message.form-control {
	height: 100%;
	min-height: 150px;
	resize: none;
}

.customer-note-message-field {
	min-height: 0;
}

.customer-note-message-field .customer-note-message {
	height: 100%;
}

.customer-note-audit {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px 16px;
	padding: 12px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--surface);
}

.customer-note-audit div {
	display: grid;
	gap: 2px;
}

.customer-note-audit span {
	color: var(--muted);
	font-size: 12px;
}

.customer-note-audit strong {
	font-size: 13px;
	font-weight: 600;
}

.customer-note-status-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: fit-content;
	min-height: 32px;
	padding: 5px 10px;
	border-radius: 0;
	background: #fff4de;
	color: #ad5700;
	font-weight: 600;
}

.customer-note-status-pill.is-compact {
	min-height: 18px;
	padding: 1px 7px;
	font-size: 12px;
	line-height: 1.2;
}

.customer-note-status-field {
	align-items: end;
	justify-items: end;
	text-align: right;
}

.customer-note-complete-switch {
	justify-self: end;
	align-self: center;
	margin-top: 0;
	margin-left: auto;
}

.customer-note-status-pill.is-completed {
	background: #2fb344;
	color: #fff;
}

.customer-note-foot {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 12px;
	padding: 0 18px 18px;
}

.customer-note-foot-group {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	width: 100%;
}

.customer-note-foot-group--left {
	display: flex;
	justify-content: flex-start;
}

.customer-note-foot-group--center {
	justify-content: center;
}

.customer-note-foot-group--right {
	justify-content: flex-end;
}

.customer-note-history {
	display: grid;
	flex: 1 1 auto;
	min-height: 0;
	align-content: start;
	gap: 20px;
	padding: 16px 18px;
	overflow-x: hidden;
	overflow-y: auto;
}

.customer-note-history h3 {
	margin: 0;
	font-size: 14px;
	font-weight: 650;
}

.customer-note-history-tree {
	position: relative;
	display: grid;
	align-content: start;
	gap: 10px;
	padding-left: 18px;
	min-width: 0;
}

.customer-note-history-tree::before {
	content: "";
	position: absolute;
	top: 18px;
	bottom: 5px;
	left: 5px;
	width: 1px;
	background: var(--border);
}

.customer-note-history-item {
	position: relative;
	display: grid;
	align-content: start;
	gap: 14px;
	padding: 26px 12px 24px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--surface);
}

.customer-note-tree-node {
	position: absolute;
	top: 16px;
	left: -18px;
	width: 11px;
	height: 11px;
	border: 2px solid var(--primary);
	border-radius: 50%;
	background: var(--panel);
	z-index: 1;
}

.customer-note-history-item.is-root .customer-note-tree-node {
	background: var(--primary);
}

.customer-note-history-item.is-completed {
	box-shadow: inset 3px 0 0 #2fb344;
}

.customer-note-history-item.is-completed .customer-note-tree-node {
	background: #2fb344;
	border-color: #2fb344;
}

.customer-note-history-item.is-selected {
	border-color: color-mix(in srgb, #fff 86%, var(--primary));
	box-shadow: 0 0 0 1px color-mix(in srgb, #fff 86%, var(--primary)), inset 3px 0 0 var(--primary);
}

.customer-note-history-item.is-selected .customer-note-tree-node {
	box-shadow: 0 0 0 3px color-mix(in srgb, #fff 78%, transparent);
}

.customer-note-history-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	color: var(--muted);
	font-size: 12px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--border);
}

.customer-note-history-head strong {
	color: var(--text);
	font-size: 13px;
	font-weight: 650;
}

.customer-note-history-meta {
	color: var(--muted);
}

.customer-note-history-message {
	margin: 0;
	line-height: 1.45;
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}

.customer-note-history-record {
	display: block;
	line-height: 1.4;
	white-space: normal;
	overflow-wrap: anywhere;
}

.customer-note-history-type-line {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.customer-note-history-type-line .customer-note-type-dot {
	width: 8px;
	height: 8px;
	flex: 0 0 auto;
}

.customer-note-history-message-text {
	white-space: pre-wrap;
}

.customer-note-history-more {
	margin-left: 4px;
	font-weight: 600;
}

.customer-note-amend-head {
	cursor: move;
	user-select: none;
}

.customer-note-amend-body {
	display: grid;
	grid-template-rows: auto auto auto minmax(190px, 1fr);
	gap: 16px;
	padding: 18px;
	min-height: 0;
	flex: 1 1 auto;
	overflow: hidden;
}

.customer-note-amend-parent {
	padding: 8px 10px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--surface);
	color: var(--text);
	font-size: 13px;
	font-weight: 650;
	line-height: 1.35;
	white-space: normal;
	overflow: visible;
	overflow-wrap: anywhere;
}

.customer-note-amend-message-field {
	min-height: 0;
}

.customer-note-amend-message {
	height: 100%;
	min-height: 190px;
	resize: none;
}

.customer-note-amend-message.form-control,
.customer-note-amend-message-field .customer-note-amend-message.form-control {
	height: 100%;
	min-height: 190px;
	padding-top: 10px;
	padding-bottom: 10px;
	line-height: 1.45;
}

.customer-note-amend-foot {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 10px;
}

.customer-note-history-caption {
	font-size: 13px;
	font-weight: 650;
	color: var(--text);
}

.customer-note-history-backdrop {
	position: fixed;
	inset: 0;
	z-index: 3700;
	display: flex;
	justify-content: flex-end;
	background: rgba(15, 23, 42, 0.36);
	pointer-events: none;
}

.customer-note-history-backdrop[hidden],
.customer-note-history-offcanvas[hidden] {
	display: none;
}

.customer-note-history-offcanvas {
	width: min(460px, calc(100vw - 28px));
	min-width: 320px;
	max-width: calc(100vw - 28px);
	height: 100%;
	min-height: 0;
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border-left: 1px solid var(--border);
	box-shadow: -18px 0 42px rgba(15, 23, 42, 0.24);
	resize: none;
	overflow: hidden;
	pointer-events: auto;
}

.customer-note-history-splitter {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 10px;
	background: linear-gradient(90deg, transparent 0, transparent 4px, var(--border) 4px, var(--border) 5px, transparent 5px);
	cursor: col-resize;
	touch-action: none;
	user-select: none;
	z-index: 2;
}

.customer-note-history-offcanvas-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 18px;
	border-bottom: 1px solid var(--border);
}

.customer-note-history-offcanvas-head h2 {
	margin: 0;
	font-size: 18px;
	font-weight: 650;
}

.customer-note-history-offcanvas-head p {
	margin: 3px 0 0;
	color: var(--muted);
	font-size: 12px;
}

body[data-theme="dark"] input[type="date"].form-control,
body[data-theme="dark"] input[type="time"].form-control,
body[data-theme="dark"] input[type="datetime-local"].form-control {
	color-scheme: dark;
	background-color: #0f1726;
	color: #e5edf8;
}

body[data-theme="dark"] input[type="time"].form-control {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e5edf8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 16px 16px;
	padding-right: 40px;
}

body[data-theme="dark"] input[type="number"].form-control {
	color-scheme: dark;
}

body[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
body[data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator,
body[data-theme="dark"] input[type="datetime-local"]::-webkit-calendar-picker-indicator {
	filter: invert(1) brightness(2.35) contrast(1.45);
	opacity: 1;
	background: rgba(255, 255, 255, 0.14);
	border-radius: 4px;
	padding: 2px;
}

body[data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator {
	opacity: 0.02;
	background: transparent;
	border-radius: 0;
	padding: 0;
	width: 18px;
	height: 18px;
	margin-right: 10px;
	cursor: pointer;
}

body[data-theme="dark"] input[type="number"]::-webkit-inner-spin-button,
body[data-theme="dark"] input[type="number"]::-webkit-outer-spin-button {
	filter: invert(1) brightness(1.8) contrast(1.25);
	opacity: 1;
}

body[data-theme="dark"] .database-series-metadata-summary {
	background: linear-gradient(135deg, rgba(11, 36, 74, 0.94), rgba(19, 28, 45, 0.96)), #131c2d;
	border-bottom-color: rgba(103, 128, 167, 0.42);
}

body[data-theme="dark"] .database-series-date-button {
	color: rgba(255, 255, 255, 0.75);
	border-left-color: rgba(103, 128, 167, 0.42);
}

body[data-theme="dark"] .database-series-date-button:hover,
body[data-theme="dark"] .database-series-date-button:focus-visible {
	background: rgba(255, 255, 255, 0.08);
	color: rgba(255, 255, 255, 0.92);
	outline: none;
}

body[data-theme="dark"] .database-series-date-button:active {
	background: rgba(255, 255, 255, 0.14);
	color: #f4f7fc;

body[data-theme="dark"] .database-series-date-popup {
	background: #121c2d;
	border-color: #2b3a50;
	box-shadow: 0 20px 40px rgba(3, 8, 18, 0.65);
}

body[data-theme="dark"] .database-series-date-popup-select {
	background: #172338;
	border-color: #2b3a50;
	color: #e5edf8;
}

body[data-theme="dark"] .database-series-date-popup-select:disabled {
	background: #101827;
	border-color: #2b3a50;
	color: #68788d;
}

body[data-theme="dark"] .database-series-date-popup-nav {
	background: #172338;
	border-color: #2b3a50;
	color: #a8b5c7;
}

body[data-theme="dark"] .database-series-date-popup-nav:hover,
body[data-theme="dark"] .database-series-date-popup-nav:focus-visible {
	background: #1d2d46;
	color: #e5edf8;
}

body[data-theme="dark"] .database-series-date-popup-grid .database-series-date-popup-dayname:nth-child(6),
body[data-theme="dark"] .database-series-date-popup-grid .database-series-date-popup-dayname:nth-child(7) {
	color: #8ea0b8;
}

body[data-theme="dark"] .database-series-date-popup-grid .database-series-date-popup-day.weekend:not(.muted) {
	color: #8ea0b8;
}

body[data-theme="dark"] .database-series-date-popup-grid .database-series-date-popup-day.weekend:not(.muted):hover {
	color: #9aaac0;
}
}

body[data-theme="dark"] .database-series-metadata-eyebrow {
	color: #9fc3ff;
}

body[data-theme="dark"] .database-series-metadata-description {
	color: #dbe7f7;
}

body[data-theme="dark"] .database-series-metadata-chip {
	background: #162235;
	border-color: rgba(124, 160, 214, 0.32);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .database-series-metadata-chip-label {
	color: #9bb0cf;
}

body[data-theme="dark"] .database-series-metadata-chip strong {
	color: #f4f7fc;
}

body[data-theme="dark"] .database-series-metadata-panel-head,
body[data-theme="dark"] .database-series-metadata-label {
	background: #141e30;
}

body[data-theme="dark"] .database-series-metadata-panel-title,
body[data-theme="dark"] .database-series-metadata-value,
body[data-theme="dark"] .database-series-detail-summary strong {
	color: #eef4ff;
}

body[data-theme="dark"] .database-series-detail-summary {
	background: #141e30;
}

body[data-theme="dark"] .database-series-detail-summary strong,
body[data-theme="dark"] .database-series-detail-grid strong,
body[data-theme="dark"] .database-series-metadata-panel-kicker,
body[data-theme="dark"] .database-series-metadata-label {
	color: #9bb0cf;
}

.customer-logo-panel {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: 18px;
	padding: 18px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--panel);
}

.customer-logo-preview-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 170px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--surface);
}

.customer-logo-preview {
	max-width: 180px;
	max-height: 140px;
	object-fit: contain;
}

.customer-logo-empty {
	color: var(--muted);
	font-size: 13px;
}

.customer-logo-controls {
	display: grid;
	align-content: start;
	gap: 14px;
}

.customer-logo-dropzone {
	display: grid;
	gap: 6px;
	padding: 28px 18px;
	border: 1px dashed var(--border);
	border-radius: 6px;
	background: var(--surface);
	color: var(--text);
	cursor: pointer;
	transition: border-color 0.15s ease, background 0.15s ease;
}

.customer-logo-dropzone:hover,
.customer-logo-dropzone.is-dragging {
	border-color: var(--primary);
	background: rgba(32, 107, 196, 0.06);
}

.customer-logo-dropzone-title {
	font-weight: 650;
}

.customer-logo-dropzone-note {
	color: var(--muted);
	font-size: 13px;
}

.customer-logo-actions {
	display: flex;
	gap: 10px;
}

.customer-edit-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr);
	gap: 16px;
}

.customer-form-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--panel);
	padding: 0;
	overflow: hidden;
}

.customer-card-main {
	padding-top: 0;
}

.customer-form-card h3 {
	margin: 0 0 2px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
	color: var(--text);
	font-size: 15px;
	font-weight: 650;
}

.customer-form-card > .customer-field,
.customer-form-card > .customer-form-row,
.customer-form-card > .sarus-toggle,
.customer-form-card > .sarus-switch,
.customer-form-card > .customer-switch {
	margin-left: 16px;
	margin-right: 16px;
}

.customer-form-card > :last-child {
	margin-bottom: 16px;
}

.customer-side-stack {
	display: grid;
	gap: 16px;
	align-content: start;
}

.customer-hdkey-switch {
	margin-top: -2px;
}

.customer-form-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.customer-form-row--three {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.customer-form-row--two {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	color: var(--text);
	font-size: 13px;
}

.customer-field .form-control {
	width: 100%;
	height: 40px;
	min-height: 40px;
	padding: 6px 12px;
	line-height: 1.4285714;
	background: var(--control-bg);
	box-shadow: none;
}

.customer-field b {
	color: var(--danger);
	font-weight: 700;
}

.customer-users-placeholder {
	min-height: 180px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px dashed var(--border);
	border-radius: 4px;
	background: var(--surface);
	color: var(--muted);
}

.customer-users-split {
	display: grid;
	--customer-users-left-width: minmax(300px, 42%);
	grid-template-columns: var(--customer-users-left-width) 8px minmax(360px, 1fr);
	min-height: 520px;
	border: 1px solid var(--border);
	border-radius: 4px;
	overflow: hidden;
	background: var(--panel);
}

.customer-users-split.is-left-collapsed {
	grid-template-columns: 44px 8px minmax(360px, 1fr);
}

.customer-users-left,
.customer-users-right {
	min-width: 0;
	background: var(--panel);
}

.customer-users-right {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.customer-users-right {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.customer-users-left {
	overflow: auto;
}

.customer-users-accordion {
	border: 0;
	height: 100%;
}

.customer-users-accordion-body {
	height: 100%;
	padding: 0;
	gap: 0;
	background: var(--panel);
}

.customer-users-split.is-left-collapsed .customer-users-left {
	overflow: hidden;
}

.customer-users-split.is-left-collapsed .customer-collapse-toggle {
	height: 100%;
	min-height: 520px;
	padding: 42px 0 16px;
	justify-content: center;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	border-bottom: 0;
	border-right: 1px solid var(--border);
}

.customer-users-split.is-left-collapsed .customer-collapse-toggle::after {
	position: absolute;
	left: 50%;
	top: 16px;
	margin: 0;
	transform: translateX(-50%) rotate(315deg);
}

.customer-users-split.is-left-collapsed .customer-users-accordion-body {
	display: none;
}

.customer-users-splitter {
	width: 8px;
	border-left: 1px solid var(--border);
	border-right: 1px solid var(--border);
	background: linear-gradient(90deg, transparent 0, transparent 3px, var(--border) 3px, var(--border) 4px, transparent 4px);
	cursor: col-resize;
	touch-action: none;
	user-select: none;
}

.customer-users-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.customer-users-table th,
.customer-users-table td {
	padding: 8px 10px;
	border-bottom: 1px solid var(--border);
	text-align: left;
	vertical-align: top;
}

.customer-users-table th {
	background: var(--surface);
	color: var(--muted);
	font-weight: 650;
}

.customer-users-table tbody tr {
	cursor: default;
}

.customer-users-table tbody tr.selected {
	background: color-mix(in srgb, var(--primary) 14%, var(--panel));
	box-shadow: inset 4px 0 0 var(--primary);
}

.customer-users-table tbody tr:hover {
	background: var(--hover);
}

.customer-user-name {
	border: 0;
	background: transparent;
	padding: 0;
	font-weight: 650;
	color: var(--text);
	font: inherit;
	cursor: pointer;
	text-align: left;
}

.customer-user-name:hover {
	color: var(--primary);
	text-decoration: underline;
}

.customer-user-cats {
	color: var(--muted);
	font-size: 12px;
}

.customer-user-editor {
	display: grid;
	align-content: start;
	grid-auto-rows: max-content;
	gap: 12px;
	padding: 0;
	min-height: 0;
}

.customer-user-editor[hidden] {
	display: none;
}

.customer-user-editor-toolbar {
	position: sticky;
	top: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	background: var(--panel);
	border-bottom: 1px solid var(--border);
	padding: 12px;
}

.customer-user-editor-toolbar h3 {
	margin: 0;
	font-size: 14px;
	font-weight: 650;
	color: var(--text);
}

.customer-user-editor-toolbar p {
	margin: 3px 0 0;
	color: var(--muted);
	font-size: 14px;
}

.customer-user-editor-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
}

.customer-user-editor > .customer-stack-panel {
	margin: 0 12px;
}

.customer-user-editor > .customer-stack-panel:last-child {
	margin-bottom: 12px;
}

.customer-user-editor-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	padding: 10px 12px;
	margin: 0 12px;
	color: var(--text);
}

.customer-user-editor-switches {
	display: flex;
	align-items: center;
	gap: 10px 18px;
	flex-wrap: wrap;
}

.customer-user-editor-head > div:not(.customer-user-editor-switches) > span {
	display: block;
	color: var(--muted);
	font-size: 12px;
	font-weight: 650;
}

.customer-user-editor-head strong {
	color: var(--text);
	font-size: 14px;
}

.customer-user-summary {
	display: grid;
	gap: 10px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--panel);
	padding: 14px;
	color: var(--text);
	font-size: 13px;
}

.customer-user-summary-row {
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr);
	gap: 12px;
	align-items: start;
}

.customer-user-summary-row span:first-child {
	color: var(--muted);
	font-weight: 650;
}

.customer-user-side-tab {
	height: 42px;
	padding: 0 12px;
	border: 0;
	border-bottom: 2px solid transparent;
	background: transparent;
	color: var(--muted);
	font: inherit;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
}

.customer-user-side-tab.active {
	color: var(--primary);
	border-bottom-color: var(--primary);
}

.customer-user-side-panel {
	display: none;
	padding: 12px;
}

.customer-user-side-panel.active {
	display: block;
}

#customerUserNotesTab.active {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-height: 0;
}

#customerUserDataSourcesTab.active {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-height: 0;
	overflow: auto;
}

.customer-datasource-toolbar {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 0 0 10px;
	border-bottom: 1px solid var(--border);
	flex-wrap: wrap;
}

.customer-datasource-toolbar-group {
	display: flex;
	align-items: center;
	gap: 6px;
	position: relative;
	padding-right: 16px;
	margin-right: 2px;
	border-right: 0;
}

.customer-datasource-toolbar-group::after {
	content: "";
	position: absolute;
	right: 0;
	top: 2px;
	bottom: 2px;
	width: 1px;
	background: var(--border);
	opacity: 0.95;
}

.customer-datasource-toolbar-group:last-child {
	padding-right: 0;
	margin-right: 0;
}

.customer-datasource-toolbar-group:last-child::after {
	display: none;
}

.customer-datasource-toolbtn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 28px;
	padding: 4px 9px;
	font-size: 12px;
	border: 0;
	background: transparent;
	box-shadow: none;
	color: #667085;
	border-radius: 4px;
	transition: background 0.12s ease, color 0.12s ease, opacity 0.12s ease;
}

.customer-datasource-toolbtn:hover,
.customer-datasource-toolbtn:focus-visible {
	background: var(--hover);
	color: var(--text);
	outline: none;
}

.customer-datasource-toolbtn:disabled {
	background: transparent;
	color: #98a2b3;
	opacity: 0.72;
}

.customer-datasource-toolbtn img {
	width: 16px;
	height: 16px;
	object-fit: contain;
	flex: 0 0 auto;
}

.customer-datasource-layout {
	display: grid;
	grid-template-columns: minmax(190px, 220px) minmax(0, 1fr);
	gap: 12px;
	min-height: 0;
	flex: 0 0 auto;
}

.customer-datasource-layout--editor {
	grid-template-columns: minmax(160px, 190px) minmax(320px, 1.35fr) minmax(260px, .95fr) minmax(260px, .85fr);
}

.customer-datasource-filters,
.customer-datasource-tree-panel,
.customer-datasource-browser,
.customer-datasource-editor {
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--panel);
	min-height: 0;
}

.customer-datasource-filters {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.customer-datasource-filters-head {
	padding-left: 8px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.customer-datasource-filter-label {
	flex: 0 0 auto;
	font-size: 12px;
	font-weight: 700;
	color: var(--muted);
	justify-self: end;
	padding-right: 10px;
}

.customer-datasource-filter-row--head {
	padding: 8px 10px;
	border-radius: 0;
	color: var(--text);
	background: transparent;
}

.customer-datasource-filter-row--head:hover {
	background: transparent;
}

.customer-datasource-filters-body {
	display: grid;
	gap: 2px;
	padding: 8px;
	overflow: auto;
	max-height: 420px;
}

.customer-datasource-filter-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 10px;
	border-radius: 4px;
	font-size: 12px;
	color: var(--text);
	background: transparent;
}

.customer-datasource-filter-row:hover {
	background: var(--hover);
}

.customer-datasource-filter-row label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	flex: 1 1 auto;
	cursor: pointer;
}

.customer-datasource-filter-row span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.customer-datasource-filter-count {
	flex: 0 0 auto;
	min-width: 26px;
	min-height: 22px;
	padding: 1px 7px;
	border-radius: 999px;
	border: 1px solid var(--border);
	background: color-mix(in srgb, var(--panel) 70%, var(--surface));
	color: var(--muted);
	font-size: 11px;
	font-weight: 700;
	text-align: center;
}

.customer-datasource-filter-count--empty {
	background: color-mix(in srgb, var(--panel) 70%, var(--surface));
	color: transparent;
}

.customer-datasource-tree-panel {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.customer-datasource-browser,
.customer-datasource-editor {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 10px;
	padding: 12px;
	overflow: hidden;
}

.customer-datasource-panel-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	min-height: 28px;
}

.customer-datasource-panel-head strong {
	font-size: 13px;
	font-weight: 650;
}

.customer-datasource-panel-head--stack {
	align-items: flex-start;
}

.customer-datasource-panel-subtitle {
	margin-top: 4px;
	color: var(--muted);
	font-size: 12px;
	line-height: 1.4;
}

.customer-datasource-panel-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: nowrap;
	justify-content: flex-end;
}

.customer-datasource-panel-actions .btn {
	flex: 0 0 auto;
	white-space: nowrap;
}

.customer-datasource-add-shell {
	display: grid;
	grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
	gap: 16px;
	min-height: 0;
}

.customer-datasource-add-split {
	--customer-datasource-add-left-width: 340px;
	grid-template-columns: minmax(0, var(--customer-datasource-add-left-width)) 8px minmax(0, 1fr);
	gap: 0;
}

.customer-datasource-add-sidebar,
.customer-datasource-add-main {
	border: 1px solid var(--border);
	border-radius: 8px;
	background: var(--panel);
	min-height: 0;
	overflow: hidden;
}

.customer-datasource-add-sidebar {
	display: flex;
	flex-direction: column;
}

.customer-datasource-add-accordion {
	position: relative;
	border-right: 0;
	border-radius: 8px 0 0 8px;
}

.customer-datasource-add-collapse-toggle {
	position: relative;
	top: auto;
	right: auto;
	width: 100%;
	min-height: 44px;
	padding: 0 16px;
	border: 0;
	border-bottom: 1px solid var(--border);
	border-radius: 8px 0 0 0;
	background: var(--surface);
	font-size: inherit;
	z-index: auto;
}

.customer-datasource-add-collapse-toggle:hover {
	background: color-mix(in srgb, var(--surface) 92%, rgba(32, 107, 196, 0.08));
	border-color: transparent;
}

.customer-datasource-add-collapse-toggle::after {
	margin-left: 0;
}

.customer-datasource-add-accordion-body {
	display: flex;
	flex-direction: column;
	min-height: 0;
	flex: 1 1 auto;
	background: var(--surface);
	padding: 0;
}

.customer-datasource-add-splitter {
	width: 8px;
	border-left: 1px solid var(--border);
	border-right: 1px solid var(--border);
	background: linear-gradient(90deg, transparent 0, transparent 3px, var(--border) 3px, var(--border) 4px, transparent 4px);
	cursor: col-resize;
	touch-action: none;
	user-select: none;
}

.customer-datasource-add-main {
	border-radius: 0 8px 8px 0;
}

.customer-datasource-add-split.is-left-collapsed {
	grid-template-columns: 52px 8px minmax(0, 1fr);
}

.customer-datasource-add-split.is-left-collapsed .customer-datasource-add-collapse-toggle {
	height: 100%;
	min-height: 520px;
	padding: 42px 0 16px;
	justify-content: center;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	border-bottom: 0;
	border-right: 1px solid var(--border);
	border-radius: 8px 0 0 8px;
}

.customer-datasource-add-split.is-left-collapsed .customer-datasource-add-collapse-toggle::after {
	position: absolute;
	left: 50%;
	top: 16px;
	margin: 0;
	transform: translateX(-50%) rotate(315deg);
}

.customer-datasource-add-split.is-left-collapsed .customer-datasource-add-accordion-body {
	display: none;
}

.customer-datasource-add-tabs {
	display: flex;
	gap: 6px;
	padding: 8px 10px 0;
	border-bottom: 1px solid var(--border);
	background: color-mix(in srgb, var(--surface) 82%, var(--panel));
}

.customer-datasource-add-tab {
	appearance: none;
	border: 1px solid transparent;
	border-radius: 7px 7px 0 0;
	padding: 7px 12px;
	text-align: left;
	background: transparent;
	color: var(--muted);
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
	transition: color 0.16s ease, background 0.16s ease, border-color 0.16s ease;
}

.customer-datasource-add-tab:hover {
	color: var(--text);
	background: rgba(32, 107, 196, 0.05);
}

.customer-datasource-add-tab.is-active {
	color: var(--primary);
	background: var(--panel);
	border-color: var(--border);
	border-bottom-color: var(--panel);
	margin-bottom: -1px;
}

.customer-datasource-add-panel {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 6px 10px 10px;
	min-height: 0;
	flex: 1 1 auto;
	overflow: hidden;
}

.customer-datasource-add-search-row {
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

.customer-datasource-category-toolbar {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.customer-datasource-category-toolbar--search {
	gap: 8px;
}

.customer-datasource-category-datasource {
	flex: 1 1 auto;
	min-width: 0;
	color: var(--text);
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.customer-datasource-category-search {
	flex: 1 1 auto;
	min-width: 140px;
	width: auto;
}

.customer-datasource-category-toolbar .btn {
	flex: 0 0 auto;
}

.customer-datasource-catalog-list {
	display: grid;
	gap: 0;
	overflow: auto;
	padding-right: 0;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--panel);
}

.customer-datasource-catalog-item {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 12px;
	align-items: start;
	padding: 10px 12px;
	border: 0;
	border-bottom: 1px solid var(--border);
	border-radius: 0;
	background: transparent;
	cursor: pointer;
	transition: background 0.16s ease, box-shadow 0.16s ease;
}

.customer-datasource-catalog-item:hover {
	background: rgba(32, 107, 196, 0.05);
	box-shadow: none;
}

.customer-datasource-catalog-item.is-active {
	background: rgba(32, 107, 196, 0.06);
}

.customer-datasource-catalog-item.is-selected {
	background: color-mix(in srgb, rgba(32, 107, 196, 0.12) 100%, var(--surface));
	box-shadow: inset 3px 0 0 rgba(32, 107, 196, 0.88);
}

.customer-datasource-catalog-item.is-disabled {
	opacity: 0.72;
	background: color-mix(in srgb, var(--panel) 92%, var(--surface));
}

.customer-datasource-catalog-item:last-child {
	border-bottom: 0;
}

.customer-datasource-catalog-copy {
	display: grid;
	gap: 8px;
	min-width: 0;
}

.customer-datasource-catalog-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}

.customer-datasource-catalog-head strong {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

.customer-datasource-catalog-desc {
	color: var(--muted);
	font-size: 12px;
	line-height: 1.5;
	overflow-wrap: anywhere;
}

.customer-datasource-desc-toggle {
	appearance: none;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--primary);
	font: inherit;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
}

.customer-datasource-desc-toggle:hover {
	text-decoration: underline;
}

.customer-datasource-add-main {
	display: flex;
	flex-direction: column;
	padding: 14px;
	gap: 12px;
}

.customer-datasource-add-search {
	width: min(225px, 100%);
}

.customer-datasource-add-panel .toolbar-search-field {
	width: 100%;
}

.customer-datasource-refresh-btn {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--surface);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	cursor: pointer;
	transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.customer-datasource-refresh-btn:hover {
	border-color: rgba(32, 107, 196, 0.34);
	background: color-mix(in srgb, var(--surface) 82%, rgba(32, 107, 196, 0.08));
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
}

.customer-datasource-refresh-btn img {
	width: 16px;
	height: 16px;
	display: block;
}

.customer-datasource-add-grid {
	min-height: 420px;
	height: min(62vh, 720px);
	overflow: auto;
	border: 1px solid var(--border);
	border-radius: 8px;
	background: var(--surface);
}

.customer-datasource-browser-actions {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px;
}

.customer-datasource-category-list {
	display: grid;
	align-content: start;
	gap: 6px;
	min-height: 140px;
	overflow: auto;
}

.customer-datasource-category-item {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px;
	align-items: center;
	padding: 8px;
	border: 1px solid var(--border);
	border-radius: 8px;
	background: var(--surface);
}

.customer-datasource-category-item:hover,
.customer-datasource-category-item.is-pending {
	border-color: var(--primary);
	background: rgba(32, 107, 196, 0.06);
}

.customer-datasource-category-item.is-disabled {
	opacity: 0.72;
	background: color-mix(in srgb, var(--panel) 92%, var(--surface));
}

.customer-datasource-category-item strong,
.customer-datasource-category-item em {
	display: block;
	overflow-wrap: anywhere;
}

.customer-datasource-category-item strong {
	font-size: 12px;
	font-weight: 650;
}

.customer-datasource-category-item em {
	margin-top: 2px;
	color: var(--muted);
	font-size: 11px;
	font-style: normal;
}

.customer-datasource-pending {
	display: grid;
	gap: 8px;
	padding-top: 8px;
	border-top: 1px solid var(--border);
}

.customer-datasource-pending-list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	min-height: 34px;
}

.customer-datasource-token-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 100%;
	padding: 4px 8px;
	border: 1px solid rgba(32, 107, 196, 0.28);
	border-radius: 999px;
	background: rgba(32, 107, 196, 0.08);
	color: var(--primary);
	font-size: 12px;
	font-weight: 650;
	cursor: pointer;
}

.customer-datasource-switches {
	display: grid;
	gap: 10px;
}

.customer-datasource-editor-help {
	padding: 8px 10px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	color: var(--muted);
	font-size: 12px;
}

.customer-datasource-validation {
	display: grid;
	gap: 8px;
	margin-bottom: 10px;
}

.customer-datasource-alert {
	padding: 8px 10px;
	border: 1px solid var(--border);
	border-radius: 4px;
	font-size: 12px;
}

.customer-datasource-alert ul {
	margin: 5px 0 0 18px;
	padding: 0;
}

.customer-datasource-alert.is-error {
	border-color: rgba(211, 47, 47, 0.35);
	background: rgba(211, 47, 47, 0.08);
	color: var(--danger);
}

.customer-datasource-alert.is-warning {
	border-color: rgba(187, 120, 0, 0.34);
	background: rgba(187, 120, 0, 0.08);
	color: #8a5d00;
}

.customer-datasource-summary {
	padding: 10px 12px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
	font-size: 12px;
	color: var(--muted);
}

.customer-datasource-summary.is-error {
	color: var(--danger);
}

.customer-datasource-tree {
	display: grid;
	gap: 10px;
	padding: 10px;
	overflow: auto;
	min-height: 0;
	max-height: 480px;
}

.customer-datasource-empty {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 220px;
	border: 1px dashed var(--border);
	border-radius: 4px;
	background: var(--surface);
	color: var(--muted);
	font-size: 13px;
	text-align: center;
	padding: 18px;
}

.customer-datasource-group {
	border: 1px solid var(--border);
	border-radius: 4px;
	overflow: hidden;
	background: var(--datasource-card-bg);
	box-shadow: var(--shadow);
}

.customer-datasource-group--tree {
	padding: 0;
}

.customer-datasource-group-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 12px;
	border-bottom: 1px solid var(--border);
	background: var(--datasource-card-head-bg);
}

.customer-datasource-group-title {
	min-width: 0;
	display: grid;
	gap: 2px;
}

.customer-datasource-group-title strong {
	font-size: 13px;
	color: var(--text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.customer-datasource-group-title span {
	font-size: 12px;
	color: var(--muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.customer-datasource-group-badges {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.customer-datasource-badge,
.customer-datasource-tag {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 2px 8px;
	border-radius: 0;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
}

.customer-datasource-badge {
	background: var(--datasource-badge-bg);
	color: var(--datasource-badge-text);
}

.customer-datasource-badge.is-premium {
	background: var(--datasource-premium-bg);
	color: var(--datasource-premium-text);
}

.customer-datasource-badge.is-stale {
	background: #fff4d6;
	color: #8a5a00;
	border: 1px solid #f0c36a;
}

.customer-datasource-badge--type {
	background: color-mix(in srgb, var(--primary) 10%, var(--datasource-badge-bg));
	color: color-mix(in srgb, var(--primary) 58%, var(--text));
	border: 1px solid color-mix(in srgb, var(--primary) 18%, transparent);
}

.customer-user-access-premium-stars {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 100%;
	color: var(--customer-premium-star);
	font-size: 13px;
	letter-spacing: 1px;
	text-shadow: 0 0 0.01px currentColor;
}

.database-locks-panel {
	color: var(--text);
	padding: 18px 22px 24px;
	height: 100%;
	overflow: auto;
}

.database-locks-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 14px;
}

.database-locks-head h2 {
	margin: 0;
	font-size: 18px;
	line-height: 1.25;
}

.database-locks-head p {
	margin: 4px 0 0;
	color: var(--muted);
	font-size: 13px;
}

.database-locks-actions {
	display: flex;
	align-items: center;
	gap: 10px;
}

.database-locks-refresh-state {
	color: var(--muted);
	font-size: 12px;
	white-space: nowrap;
}

.database-locks-summary {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	min-height: 36px;
	margin-bottom: 12px;
	padding: 8px 10px;
	border: 1px solid var(--border);
	background: var(--surface);
	border-radius: 6px;
	font-size: 13px;
}

.database-locks-summary span {
	display: inline-flex;
	gap: 4px;
	align-items: center;
}

.database-locks-settings {
	display: grid;
	grid-template-columns: minmax(260px, 1fr) minmax(170px, 220px) minmax(190px, 260px) auto minmax(160px, auto);
	gap: 10px;
	align-items: end;
	margin-bottom: 12px;
	padding: 10px;
	border: 1px solid var(--border);
	background: var(--panel);
	border-radius: 6px;
	box-shadow: var(--shadow);
}

.database-locks-settings h3 {
	margin: 0;
	font-size: 14px;
	line-height: 1.25;
}

.database-locks-settings p {
	margin: 3px 0 0;
	color: var(--muted);
	font-size: 12px;
	line-height: 1.35;
}

.database-locks-settings label {
	display: grid;
	gap: 4px;
	color: var(--muted);
	font-size: 12px;
	font-weight: 700;
}

.database-locks-settings .form-control {
	height: 32px;
	font-size: 13px;
}

.database-locks-setting-hint {
	color: var(--muted);
	font-size: 11px;
	font-weight: 500;
	line-height: 1.3;
}

.database-locks-settings-message {
	min-height: 18px;
	color: var(--muted);
	font-size: 12px;
}

.database-locks-settings-message.is-success {
	color: var(--success);
}

.database-locks-settings-message.is-error {
	color: var(--danger);
}

.database-locks-help {
	display: grid;
	gap: 12px;
	margin-bottom: 12px;
	padding: 12px;
	border: 1px solid var(--border);
	background: var(--panel);
	border-radius: 6px;
	box-shadow: var(--shadow);
}

.database-locks-help-intro {
	display: grid;
	gap: 5px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--border);
}

.database-locks-help h3 {
	margin: 0;
	font-size: 14px;
	line-height: 1.25;
}

.database-locks-help h4 {
	margin: 0 0 4px;
	font-size: 13px;
	line-height: 1.25;
}

.database-locks-help p {
	margin: 0;
	color: var(--muted);
	font-size: 12px;
	line-height: 1.45;
}

.database-locks-help-scroll {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px 14px;
	max-height: 156px;
	overflow: auto;
	padding-right: 4px;
}

.database-locks-help-scroll article {
	min-width: 0;
}

.database-locks-alert {
	font-weight: 600;
}

.database-locks-alert.is-success {
	color: var(--success);
}

.database-locks-alert.is-error {
	color: var(--danger);
}

.database-locks-layout {
	display: grid;
	grid-template-columns: minmax(620px, 1fr) 360px;
	gap: 14px;
	align-items: start;
}

.database-locks-main {
	display: grid;
	gap: 14px;
	min-width: 0;
}

.database-locks-table-wrap,
.database-locks-detail,
.database-locks-audit {
	border: 1px solid var(--border);
	background: var(--panel);
	border-radius: 6px;
	box-shadow: var(--shadow);
}

.database-locks-table-wrap {
	overflow: auto;
}

.database-locks-table {
	width: 100%;
	border-collapse: collapse;
	min-width: 920px;
	font-size: 13px;
}

.database-locks-table th,
.database-locks-table td {
	padding: 10px 12px;
	border-bottom: 1px solid var(--border);
	text-align: left;
	vertical-align: middle;
}

.database-locks-table th {
	color: var(--muted);
	background: var(--surface);
	font-size: 12px;
	font-weight: 700;
}

.database-locks-table tr.is-selected {
	background: var(--hover);
	box-shadow: inset 3px 0 0 var(--primary);
}

.database-locks-table td:first-child strong {
	display: block;
	color: var(--text);
}

.database-locks-table td:first-child span,
.database-locks-heartbeat span {
	display: block;
	color: var(--muted);
	font-size: 12px;
	margin-top: 2px;
}

.database-locks-badge {
	display: inline-flex;
	align-items: center;
	min-height: 22px;
	padding: 2px 8px;
	border-radius: 4px;
	font-weight: 700;
	font-size: 12px;
	border: 1px solid transparent;
}

.database-locks-badge.is-free {
	background: rgba(47, 179, 68, 0.12);
	color: var(--success);
	border-color: rgba(47, 179, 68, 0.26);
}

.database-locks-badge.is-success {
	background: rgba(47, 179, 68, 0.16);
	color: var(--success);
	border-color: rgba(47, 179, 68, 0.32);
}

.database-locks-badge.is-held,
.database-locks-badge.is-error {
	background: rgba(214, 57, 57, 0.12);
	color: var(--danger);
	border-color: rgba(214, 57, 57, 0.28);
}

.database-locks-badge.is-warning {
	background: rgba(245, 159, 0, 0.13);
	color: var(--warning);
	border-color: rgba(245, 159, 0, 0.3);
}

.database-locks-badge.is-info {
	background: color-mix(in srgb, var(--primary) 13%, transparent);
	color: var(--primary);
	border-color: color-mix(in srgb, var(--primary) 28%, transparent);
}

.database-locks-row-actions {
	display: flex;
	gap: 6px;
	white-space: nowrap;
}

.database-locks-detail {
	padding: 14px;
	position: sticky;
	top: 10px;
}

.database-locks-detail h3 {
	margin: 0 0 6px;
	font-size: 16px;
}

.database-locks-detail h4 {
	margin: 14px 0 6px;
	font-size: 13px;
	color: var(--muted);
	text-transform: uppercase;
	letter-spacing: 0;
}

.database-locks-detail p {
	margin: 0 0 12px;
	color: var(--muted);
	font-size: 13px;
	line-height: 1.4;
}

.database-locks-detail-grid {
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr);
	gap: 7px 10px;
	font-size: 12px;
}

.database-locks-detail-grid span {
	color: var(--muted);
}

.database-locks-detail-grid strong {
	min-width: 0;
	overflow-wrap: anywhere;
	font-weight: 600;
}

.database-locks-metadata {
	max-height: 260px;
	overflow: auto;
	margin: 0;
	padding: 10px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	color: var(--text);
	font-size: 12px;
	line-height: 1.4;
	white-space: pre-wrap;
}

.database-locks-audit {
	min-height: 112px;
	overflow: hidden;
}

.database-locks-audit-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 14px;
	border-bottom: 1px solid var(--border);
	background: var(--surface);
}

.database-locks-audit-head h3 {
	margin: 0;
	font-size: 15px;
	line-height: 1.25;
}

.database-locks-audit-head p {
	margin: 4px 0 0;
	color: var(--muted);
	font-size: 12px;
	overflow-wrap: anywhere;
}

.database-locks-audit-list {
	display: grid;
}

.database-locks-audit-empty {
	padding: 14px;
	color: var(--muted);
	font-size: 13px;
}

.database-locks-audit-row {
	display: grid;
	gap: 7px;
	padding: 12px 14px;
	border-bottom: 1px solid var(--border);
	font-size: 13px;
}

.database-locks-audit-row:last-child {
	border-bottom: 0;
}

.database-locks-audit-main {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}

.database-locks-audit-main strong {
	display: block;
	color: var(--text);
}

.database-locks-audit-main div > span {
	display: block;
	margin-top: 2px;
	color: var(--muted);
	font-size: 12px;
}

.database-locks-audit-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	color: var(--muted);
	font-size: 12px;
}

.database-locks-audit-meta strong {
	color: var(--text);
	font-weight: 600;
}

.database-locks-audit-row p {
	margin: 0;
	color: var(--text);
	overflow-wrap: anywhere;
}

.database-locks-audit-details {
	color: var(--muted);
	font-size: 12px;
}

.database-locks-audit-details summary {
	cursor: pointer;
	color: var(--primary);
	font-weight: 700;
}

.database-locks-audit-details h4 {
	margin: 8px 0 4px;
	color: var(--muted);
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0;
}

.database-locks-audit-details pre {
	max-height: 220px;
	overflow: auto;
	margin: 0;
	padding: 8px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	color: var(--text);
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}

.database-locks-confirm {
	position: fixed;
	inset: 0;
	z-index: 80;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(8, 15, 28, 0.55);
	padding: 20px;
}

.database-locks-confirm[hidden] {
	display: none;
}

.database-locks-confirm-card {
	width: min(460px, 100%);
	border: 1px solid var(--border);
	background: var(--panel);
	border-radius: 6px;
	box-shadow: var(--shadow);
	padding: 16px;
}

.database-locks-confirm-card h3 {
	margin: 0 0 8px;
	font-size: 16px;
}

.database-locks-confirm-card p {
	margin: 0 0 14px;
	color: var(--muted);
	line-height: 1.45;
}

.database-locks-confirm-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
}

.eod-datasources-panel {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-height: calc(100vh - 142px);
}

.eod-datasources-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 18px;
	background: var(--panel);
	border: 1px solid var(--border);
	box-shadow: var(--shadow);
}

.eod-datasources-head h2 {
	margin: 0 0 4px;
	font-size: 20px;
	font-weight: 700;
}

.eod-datasources-head p {
	margin: 0;
	color: var(--muted);
}

.eod-datasources-actions,
.eod-toolbar,
.eod-download-toolbar,
.eod-tree-toolbar {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}

.eod-tabs,
.eod-subtabs {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 6px;
	background: var(--panel);
	border: 1px solid var(--border);
	box-shadow: var(--shadow);
	overflow-x: auto;
}

.eod-tab,
.eod-subtab {
	border: 1px solid transparent;
	background: transparent;
	color: var(--muted);
	padding: 8px 12px;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
}

.eod-tab:hover,
.eod-subtab:hover {
	background: var(--hover);
	color: var(--text);
}

.eod-tab.active,
.eod-subtab.active {
	background: var(--sidebar-active);
	border-color: var(--border);
	color: var(--text);
}

.eod-panel-grid {
	display: grid;
	grid-template-columns: minmax(250px, 310px) minmax(0, 1fr);
	gap: 12px;
	min-height: 0;
	flex: 1 1 auto;
}

.eod-side-panel,
.eod-main-panel,
.eod-settings-card,
.eod-import-card {
	background: var(--panel);
	border: 1px solid var(--border);
	box-shadow: var(--shadow);
}

.eod-side-panel {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: 0;
	padding: 12px;
}

.eod-import-card {
	box-shadow: none;
	padding: 12px;
}

.eod-import-card h3,
.eod-settings-card h3 {
	margin: 0 0 6px;
	font-size: 15px;
}

.eod-import-card p,
.eod-settings-card p {
	margin: 0 0 12px;
	color: var(--muted);
}

.eod-tree-toolbar {
	padding: 8px;
	background: var(--surface);
	border: 1px solid var(--border);
}

.eod-tree {
	border: 1px solid var(--border);
	background: var(--surface);
	overflow: auto;
	min-height: 280px;
}

.eod-tree-row {
	display: grid;
	grid-template-columns: 22px minmax(0, 1fr) auto;
	align-items: center;
	gap: 6px;
	padding: 8px 10px;
	border-bottom: 1px solid var(--datasource-row-border);
	color: var(--text);
}

.eod-tree-row.is-selected {
	background: var(--sidebar-active);
}

.eod-tree-children .eod-tree-row {
	padding-left: 24px;
}

.eod-node-toggle {
	width: 18px;
	height: 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--control-bg);
	border: 1px solid var(--border);
	font-weight: 700;
}

.eod-row-chip {
	padding: 2px 7px;
	background: var(--datasource-badge-bg);
	color: var(--datasource-badge-text);
	font-size: 12px;
	font-weight: 700;
}

.eod-main-panel {
	min-width: 0;
	padding: 12px;
	overflow: hidden;
}

.eod-tab-panel,
.eod-download-panel {
	display: none;
}

.eod-tab-panel.active,
.eod-download-panel.active {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-height: 0;
}

.eod-toolbar {
	padding: 10px;
	background: var(--surface);
	border: 1px solid var(--border);
}

.eod-toolbar .toolbar-search-field {
	min-width: 240px;
}

.eod-toolbar .input-icon-addon svg {
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.eod-table-wrap {
	max-height: 420px;
}

.eod-table tbody tr.selected {
	background: var(--sidebar-active);
}

.eod-form-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(150px, 1fr));
	gap: 12px;
	padding: 12px;
	background: var(--surface);
	border: 1px solid var(--border);
}

.eod-field-wide {
	grid-column: span 2;
}

.eod-viewer-summary,
.eod-current-download {
	display: grid;
	grid-template-columns: repeat(3, minmax(140px, 1fr));
	gap: 10px;
	padding: 12px;
	background: var(--surface);
	border: 1px solid var(--border);
}

.eod-viewer-summary div,
.eod-current-download div {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 10px;
	background: var(--panel);
	border: 1px solid var(--border);
}

.eod-viewer-summary span,
.eod-current-download span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
}

.eod-settings-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(220px, 1fr));
	gap: 12px;
}

.eod-settings-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 14px;
	box-shadow: none;
}

.eod-download-toolbar {
	padding: 10px;
	background: var(--surface);
	border: 1px solid var(--border);
}

.eod-download-toolbar label {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-left: auto;
	color: var(--muted);
	font-weight: 700;
}

.eod-download-toolbar label + label {
	margin-left: 0;
}

.eod-download-toolbar .form-control {
	width: 88px;
}

.eod-log-viewer {
	min-height: 320px;
	padding: 12px;
	background: #0b1220;
	color: #d6e4ff;
	border: 1px solid var(--border);
	font-family: Consolas, "Courier New", monospace;
	overflow: auto;
}

.eod-log-line {
	padding: 5px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.eod-log-line span {
	color: #9cc8ff;
	margin-right: 12px;
}

@media (max-width: 1100px) {
	.eod-panel-grid,
	.eod-settings-grid {
		grid-template-columns: 1fr;
	}

	.eod-form-grid,
	.eod-viewer-summary,
	.eod-current-download {
		grid-template-columns: repeat(2, minmax(140px, 1fr));
	}
}

@media (max-width: 720px) {
	.eod-datasources-head {
		flex-direction: column;
	}

	.eod-form-grid,
	.eod-viewer-summary,
	.eod-current-download {
		grid-template-columns: 1fr;
	}

	.eod-field-wide {
		grid-column: auto;
	}

	.eod-download-toolbar label {
		margin-left: 0;
	}
}

@media (max-width: 1120px) {
	.database-locks-layout {
		grid-template-columns: 1fr;
	}

	.database-locks-detail {
		position: static;
	}

	.database-locks-settings {
		grid-template-columns: 1fr 1fr;
	}

	.database-locks-help-scroll {
		grid-template-columns: 1fr;
		max-height: 220px;
	}
}

.customer-datasource-table {
	display: grid;
	gap: 8px;
	padding: 10px;
}

.customer-datasource-tree-branch {
	display: grid;
	gap: 10px;
}

.customer-datasource-tree-inline-badges {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	flex-wrap: wrap;
}

.customer-datasource-row--tree-root-card {
	border-color: color-mix(in srgb, var(--primary) 26%, var(--datasource-row-border));
	background: color-mix(in srgb, var(--datasource-card-bg) 88%, var(--surface));
}

.customer-datasource-tree-root-hint {
	font-size: 12px;
	font-weight: 600;
	color: var(--muted);
}

.customer-datasource-tree-children {
	position: relative;
	display: grid;
	gap: 8px;
	margin-left: 18px;
	padding-left: 22px;
}

.customer-datasource-tree-children::before {
	content: "";
	position: absolute;
	left: 0;
	top: -8px;
	bottom: 16px;
	width: 2px;
	background: var(--datasource-row-border);
}

.customer-datasource-row {
	display: grid;
	gap: 10px;
	padding: 10px 12px;
	border: 1px solid var(--datasource-row-border);
	border-radius: 4px;
	align-items: start;
	font-size: 12px;
	color: var(--text);
	background: var(--panel);
	cursor: pointer;
}

.customer-datasource-row.is-selected {
	border-color: var(--primary);
	box-shadow: 0 0 0 2px rgba(32, 107, 196, 0.16);
}

.customer-datasource-row.is-draft-new {
	border-left: 4px solid #0ca6d8;
}

.customer-datasource-row.is-draft-edit {
	border-left: 4px solid #f59f00;
}

.customer-datasource-row.is-draft-delete {
	opacity: .58;
	border-left: 4px solid var(--muted);
	text-decoration: line-through;
}

.customer-datasource-row.has-errors {
	border-color: var(--danger);
}

.customer-datasource-row.has-warnings {
	border-color: #d98c00;
}

.customer-datasource-row.is-stale {
	border-left: 4px solid #d98c00;
}

.customer-datasource-state {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 2px 7px;
	border-radius: 0;
	background: var(--datasource-tag-unknown-bg);
	color: var(--datasource-tag-unknown-text);
	font-size: 11px;
	font-weight: 700;
}

.customer-datasource-state.is-new { background: #e6f7fc; color: #08799d; }
.customer-datasource-state.is-edited { background: #fff4dd; color: #8a5d00; }
.customer-datasource-state.is-deleted { background: #f2f4f7; color: #667085; }
.customer-datasource-state.is-error { background: #fdebec; color: #b42318; }
.customer-datasource-state.is-warning { background: #fff4dd; color: #8a5d00; }

.customer-datasource-row--category {
	background: var(--datasource-row-alt);
}

.customer-datasource-row--root-summary {
	margin-left: 0;
}

.customer-datasource-row--tree-child {
	position: relative;
	gap: 6px;
	padding: 8px 10px 8px 16px;
	border: 1px solid var(--datasource-row-border);
	border-radius: 4px;
	background: var(--datasource-row-alt);
}

.customer-datasource-row--tree-child::before {
	content: "";
	position: absolute;
	left: -23px;
	top: 18px;
	width: 22px;
	height: 2px;
	background: var(--datasource-row-border);
}

.customer-datasource-row--tree-child + .customer-datasource-row--tree-child {
	border-top: 1px solid var(--datasource-row-border);
}

.customer-datasource-row--tree-child .customer-datasource-row-head {
	align-items: center;
}

.customer-datasource-row--tree-child .customer-datasource-row-head-meta {
	gap: 8px;
}

.customer-datasource-row--tree-child .customer-datasource-node {
	font-size: 13px;
	font-weight: 600;
}

.customer-datasource-row--tree-child .customer-datasource-row-desc {
	padding-left: 18px;
	font-size: 12px;
}

.customer-datasource-row--tree-child .customer-datasource-row-meta,
.customer-datasource-row--tree-child .customer-datasource-row-token {
	padding-left: 18px;
}

.customer-datasource-row--tree-child-compact {
	gap: 4px;
	padding-top: 7px;
	padding-bottom: 7px;
}

.customer-datasource-row--tree-child-compact .customer-datasource-row-head {
	align-items: center;
}

.customer-datasource-row--tree-child-compact .customer-datasource-node--child {
	padding-left: 10px;
}

.customer-datasource-row--tree-child-compact .customer-datasource-row-head-meta {
	gap: 8px;
}

.customer-datasource-tree-child-subline {
	padding-left: 28px;
	font-size: 11px;
	color: var(--muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.customer-datasource-node--root {
	font-size: 15px;
	font-weight: 700;
}

.customer-datasource-node--root .customer-datasource-node-bullet {
	width: 10px;
	height: 10px;
	background: var(--primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 18%, transparent);
}

.customer-datasource-row-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
}

.customer-datasource-row-head-meta {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	flex-wrap: wrap;
	text-align: right;
}

.customer-datasource-access-box {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	color: var(--text);
}

.customer-datasource-row-created {
	display: inline-grid;
	gap: 1px;
	justify-items: end;
	color: var(--muted);
	font-size: 11px;
}

.customer-datasource-row-created strong {
	font-size: 12px;
	font-weight: 700;
	color: var(--text);
}

.customer-datasource-row-desc {
	font-size: 13px;
	color: var(--muted);
	line-height: 1.45;
}

.customer-datasource-row-meta {
	display: grid;
	gap: 8px;
}

.customer-datasource-node {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	font-weight: 600;
	font-size: 14px;
}

.customer-datasource-node--child {
	padding-left: 18px;
	font-weight: 500;
	font-size: 13px;
}

.customer-datasource-node-bullet {
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: var(--datasource-node-bg);
	flex: 0 0 auto;
}

.customer-datasource-node--child .customer-datasource-node-bullet {
	background: var(--datasource-node-child-bg);
}

.customer-datasource-cell-muted {
	color: var(--muted);
	font-size: 12px;
	line-height: 1.45;
}

.customer-datasource-flag-wrap {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.customer-datasource-toggle {
	pointer-events: none;
	user-select: none;
	flex: 0 0 auto;
	margin: 0;
	font-weight: 400;
}

.customer-datasource-flag {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 4px 10px;
	border: 1px solid var(--border);
	border-radius: 999px;
	background: var(--surface);
	color: var(--text);
	font-size: 12px;
	font-weight: 600;
}

.customer-datasource-flag-indicator {
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: var(--muted);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--panel) 75%, transparent);
	flex: 0 0 auto;
}

.customer-datasource-flag.is-on.is-active .customer-datasource-flag-indicator,
.customer-datasource-flag.is-on.is-latest .customer-datasource-flag-indicator,
.customer-datasource-flag.is-on.is-history .customer-datasource-flag-indicator {
	background: var(--success);
}

.customer-datasource-flag.is-off .customer-datasource-flag-indicator {
	background: var(--danger);
}

.customer-datasource-flag-label {
	white-space: nowrap;
}

.customer-datasource-dates {
	display: grid;
	grid-template-columns: repeat(4, minmax(120px, 1fr));
	gap: 10px;
}

.customer-datasource-detail {
	display: grid;
	gap: 2px;
	min-width: 0;
}

.customer-datasource-detail span {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--muted);
}

.customer-datasource-detail-value {
	font-size: 12px;
	font-weight: 600;
	color: var(--text);
	min-width: 0;
	word-break: break-word;
}

.customer-datasource-row-token {
	font-size: 11px;
	color: var(--muted);
	line-height: 1.4;
}

.customer-datasource-tag.is-full {
	background: var(--datasource-tag-full-bg);
	color: var(--datasource-tag-full-text);
}

.customer-datasource-tag.is-simulated {
	background: var(--datasource-tag-simulated-bg);
	color: var(--datasource-tag-simulated-text);
}

.customer-datasource-tag.is-unknown {
	background: var(--datasource-tag-unknown-bg);
	color: var(--datasource-tag-unknown-text);
}

.customer-datasource-tag.is-active {
	background: var(--datasource-tag-active-bg);
	color: var(--datasource-tag-active-text);
}

.customer-datasource-tag.is-inactive {
	background: var(--datasource-tag-inactive-bg);
	color: var(--datasource-tag-inactive-text);
}

.customer-datasource-tag.is-latest {
	background: var(--datasource-tag-latest-bg);
	color: var(--datasource-tag-latest-text);
}

.customer-datasource-tag.is-history {
	background: var(--datasource-tag-history-bg);
	color: var(--datasource-tag-history-text);
}

.customer-datasource-empty-value {
	color: var(--datasource-empty-text);
}

@media (max-width: 1180px) {
	.customer-datasource-layout {
		grid-template-columns: 1fr;
	}

	.customer-datasource-filters-body {
		max-height: 180px;
	}

	.customer-datasource-row-head {
		flex-direction: column;
		align-items: stretch;
	}

	.customer-datasource-row-head-meta {
		justify-content: flex-start;
		text-align: left;
	}

	.customer-datasource-tree-children {
		margin-left: 10px;
		padding-left: 12px;
	}

	.customer-datasource-dates {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.customer-confirm-backdrop {
	position: fixed;
	inset: 0;
	z-index: 3700;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(15, 23, 42, 0.48);
}

.customer-confirm-backdrop[hidden],
.customer-confirm-modal[hidden] {
	display: none;
}

.customer-confirm-modal {
	width: min(500px, calc(100vw - 48px));
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
}

.customer-confirm-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 16px 18px;
	border-bottom: 1px solid var(--border);
}

.customer-confirm-head h2 {
	margin: 0;
	font-size: 18px;
	font-weight: 650;
	color: var(--text);
}

.customer-confirm-body {
	display: grid;
	grid-template-columns: 42px minmax(0, 1fr);
	align-items: center;
	gap: 14px;
	padding: 18px;
}

.customer-confirm-icon {
	display: block;
	width: 32px;
	height: 32px;
	color: var(--danger);
	flex: 0 0 auto;
}

.customer-confirm-body p {
	margin: 0;
	color: var(--text);
	font-size: 14px;
	line-height: 1.5;
	white-space: pre-line;
}

.customer-confirm-foot {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	padding: 14px 18px;
	border-top: 1px solid var(--border);
	background: var(--surface);
}

.customer-confirm-foot .btn {
	min-width: 92px;
}

.user-edit-ds-backdrop {
	background: rgba(15, 23, 42, 0.2);
	z-index: 3650;
}

.user-add-ds-backdrop {
	background: rgba(15, 23, 42, 0.2);
	z-index: 3625;
}

.user-add-ds-modal {
	width: min(1240px, calc(100vw - 40px));
	height: min(780px, calc(100vh - 40px));
	min-width: min(840px, calc(100vw - 40px));
	min-height: min(560px, calc(100vh - 40px));
	max-width: calc(100vw - 40px);
	max-height: calc(100vh - 40px);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	resize: both;
}

.user-add-ds-form {
	display: flex;
	flex-direction: column;
	min-height: 0;
	flex: 1 1 auto;
}

.user-add-ds-head {
	gap: 16px;
	cursor: move;
	user-select: none;
}

.user-add-ds-head .detector-modal-close {
	flex: 0 0 auto;
	cursor: pointer;
}

.user-add-ds-body {
	display: grid;
	gap: 12px;
	padding: 18px;
	overflow: auto;
	min-height: 0;
	flex: 1 1 auto;
}

.user-add-ds-body .customer-datasource-layout {
	min-height: 0;
}

.user-add-ds-body .customer-datasource-add-shell {
	min-height: 0;
}

.user-quick-add-backdrop {
	background: rgba(15, 23, 42, 0.3);
	z-index: 3660;
}

.user-quick-add-modal {
	width: min(560px, calc(100vw - 32px));
	max-height: calc(100vh - 32px);
	overflow: hidden;
}

.user-quick-add-form {
	display: flex;
	flex-direction: column;
	min-height: 0;
	flex: 1 1 auto;
}

.user-quick-add-body {
	display: grid;
	gap: 14px;
	padding: 18px;
	overflow: auto;
	min-height: 0;
	flex: 1 1 auto;
}

.user-quick-add-textarea {
	min-height: 180px;
	resize: vertical;
	font-family: Consolas, "Courier New", monospace;
	font-size: 13px;
	line-height: 1.5;
}

.user-quick-add-help {
	margin: 0;
	text-align: left;
}

.user-quick-add-foot {
	justify-content: space-between;
}

.user-edit-ds-modal {
	width: min(520px, calc(100vw - 32px));
	max-height: calc(100vh - 32px);
	overflow: hidden;
}

.user-edit-ds-form {
	display: flex;
	flex-direction: column;
	min-height: 0;
	flex: 1 1 auto;
}

.user-edit-ds-head {
	cursor: move;
	user-select: none;
}

.user-edit-ds-head button {
	cursor: pointer;
	user-select: none;
}

.user-edit-ds-body {
	display: grid;
	gap: 14px;
	padding: 18px;
	overflow: auto;
	min-height: 0;
	flex: 1 1 auto;
}

.user-edit-ds-banner {
	padding: 12px 14px;
	border: 1px solid rgba(32, 107, 196, 0.35);
	border-radius: 6px;
	background: rgba(32, 107, 196, 0.12);
	color: var(--primary);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-align: center;
}

.user-edit-ds-body .customer-field {
	font-weight: 400;
}

.user-edit-ds-body .customer-field .form-control,
.user-edit-ds-body .customer-field select.form-control {
	font-weight: 400;
}

.user-edit-ds-body .customer-field .form-control::placeholder {
	color: var(--muted);
	opacity: 1;
}

.user-edit-ds-inline-message {
	padding: 8px 10px;
	border: 1px solid #f0a7a7;
	border-radius: 6px;
	background: #fff3f2;
	color: #c23434;
	font-size: 12.5px;
	line-height: 1.4;
}

body[data-theme="dark"] .user-edit-ds-inline-message {
	border-color: #8a3b41;
	background: #3a1f24;
	color: #ffb7b7;
}

.user-edit-ds-access-grid {
	display: grid;
	grid-template-columns: minmax(0, 244px) auto;
	gap: 14px 18px;
	align-items: end;
	justify-content: space-between;
}

.user-edit-ds-toggle-inline {
	display: flex;
	align-items: center;
	min-height: 34px;
}

.user-edit-ds-toggle-inline .sarus-toggle {
	margin: 0;
	font-weight: 400;
}

.sarus-toggle.user-edit-ds-toggle {
	margin: 0;
	font-weight: 400;
}

.user-edit-ds-toggle-inline--access {
	justify-content: flex-end;
	padding-bottom: 2px;
}

.user-edit-ds-governed-group {
	display: grid;
	gap: 10px;
}

.user-edit-ds-toggle-inline--governor {
	margin-top: 20px;
	padding-left: 32px;
}

.user-edit-ds-date-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.user-edit-ds-date-grid--governed {
	width: min(360px, calc(100% - 56px));
	margin-left: 60px;
	gap: 10px 54px;
}

.user-edit-ds-date-grid--governed .customer-field {
	gap: 8px;
}


.user-edit-ds-date-field {
	display: flex;
	width: 100%;
	align-items: stretch;
}

.user-edit-ds-date-field .database-series-date-input {
	width: 100%;
	min-width: 0;
	padding-right: 34px;
	letter-spacing: 0.02em;
	font-variant-numeric: tabular-nums;
}

.user-edit-ds-date-popup {
	position: fixed;
	left: 12px;
	top: 12px;
	right: auto;
	z-index: 3720;
}

.user-edit-ds-help {
	margin: 30px 0 0;
	text-align: center;
}

.user-edit-ds-foot {
	justify-content: space-between;
}

@media (max-width: 720px) {
	.user-add-ds-modal {
		width: min(100%, calc(100vw - 24px));
	}

	.user-add-ds-body {
		padding: 14px;
	}

	.customer-datasource-add-shell {
		grid-template-columns: 1fr;
	}

	.customer-datasource-add-split {
		grid-template-columns: 1fr;
	}

	.customer-datasource-add-splitter {
		display: none;
	}

	.customer-datasource-add-accordion,
	.customer-datasource-add-main {
		border-radius: 8px;
	}

	.customer-datasource-add-grid {
		height: 52vh;
	}

	.user-edit-ds-modal {
		width: min(100%, calc(100vw - 24px));
	}

	.user-edit-ds-backdrop {
		padding: 12px;
	}

	.user-edit-ds-access-grid,
	.user-edit-ds-date-grid {
		grid-template-columns: 1fr;
	}

	.user-edit-ds-access-grid {
		justify-content: stretch;
	}

	.user-edit-ds-toggle-inline {
		min-height: 0;
	}

	.user-edit-ds-toggle-inline--access,
	.user-edit-ds-toggle-inline--governor {
		justify-content: flex-start;
		padding-left: 0;
		padding-bottom: 0;
	}

	.user-edit-ds-date-grid--governed {
		width: 100%;
		margin-left: 0;
		gap: 10px 12px;
	}

	.user-edit-ds-foot {
		flex-direction: column-reverse;
	}

	.user-edit-ds-foot .btn {
		width: 100%;
	}
}

body[data-theme="dark"] .user-edit-ds-head .modal-close {
	background: rgba(2, 6, 23, 0.42);
	color: rgba(255, 255, 255, 0.88);
	border-color: rgba(148, 163, 184, 0.24);
}

body[data-theme="dark"] .database-series-date-popup-quick {
	background: var(--control-bg);
	border-color: #344052;
	color: rgba(226, 232, 240, 0.92);
}

body[data-theme="dark"] .database-series-date-popup-quick:hover,
body[data-theme="dark"] .database-series-date-popup-quick:focus-visible {
	background: color-mix(in srgb, var(--hover) 80%, transparent);
}

body[data-theme="dark"] .customer-name-field .form-control {
	background: var(--control-bg);
}

body[data-theme="dark"] .customer-tabs-card {
	background: var(--panel);
}

body[data-theme="dark"] .customer-tabs-head {
	background: var(--panel);
}

body[data-theme="dark"] .customer-form-card h3 {
	background: var(--surface);
}

body[data-theme="dark"] .customer-users-placeholder {
	background: #1e2937;
}

body[data-theme="dark"] .customer-workspace-split,
body[data-theme="dark"] .customer-left-pane,
body[data-theme="dark"] .customer-right-pane,
body[data-theme="dark"] .customer-json-preview,
body[data-theme="dark"] .customer-logo-panel,
body[data-theme="dark"] .customer-logo-preview-wrap,
body[data-theme="dark"] .customer-logo-dropzone,
body[data-theme="dark"] .customer-users-split,
body[data-theme="dark"] .customer-users-left,
body[data-theme="dark"] .customer-users-right {
	background: var(--panel);
}

body[data-theme="dark"] .customer-json-validation {
	background: rgba(220, 53, 69, 0.16);
	border-color: rgba(220, 53, 69, 0.4);
	color: #ffb4b4;
}

body[data-theme="dark"] .customer-json-preview .json-key { color: #74c0fc; }
body[data-theme="dark"] .customer-json-preview .json-string { color: #8ce99a; }
body[data-theme="dark"] .customer-json-preview .json-number { color: #ffd43b; }
body[data-theme="dark"] .customer-json-preview .json-boolean { color: #da77f2; }
body[data-theme="dark"] .customer-json-preview .json-null { color: #adb5bd; }

body[data-theme="dark"] .customer-accordion-body {
	background: var(--surface);
}

body[data-theme="dark"] .customer-stack-panel {
	background: var(--panel);
}

@media (max-width: 860px) {
	.customer-workspace-split,
	.customer-edit-layout {
		grid-template-columns: 1fr;
	}

	.customer-splitter {
		display: none;
	}
}

@media (max-width: 640px) {
	.customer-editor-head,
	.customer-editor-actions,
	.customer-tabs-head {
		flex-direction: column;
		align-items: stretch;
	}

	.customer-form-top {
		gap: 12px;
	}

	.customer-form-row,
	.customer-form-row--two,
	.customer-name-label-row {
		grid-template-columns: 1fr;
	}

	.customer-demo-inline {
		align-self: start;
	}

	.customer-logo-panel {
		grid-template-columns: 1fr;
	}
}

.download-status-foot {
	flex: 0 0 auto;
	align-items: flex-end;
	gap: 18px;
}

.download-status-foot-left {
	display: grid;
	gap: 12px;
	min-width: 0;
}

.download-status-legend {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	color: #667085;
	font-size: 12px;
}

.download-status-legend span {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.download-status-legend .download-status-legend-muted {
	color: var(--muted);
}

.download-status-next {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--text);
	font-size: 13px;
	font-weight: 600;
}

.download-status-next img {
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
}

.download-status-last-run {
	margin-top: 4px;
	color: var(--text-muted, #666);
	font-size: 12px;
	font-weight: 500;
}

.download-status-last-run[hidden] {
	display: none;
}

.customer-confirm-content {
	display: grid;
	gap: 10px;
}

.customer-confirm-check {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--muted);
	font-size: 13px;
	font-weight: 600;
}

.status-dot-cell {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	display: inline-block;
}

.status-dot-cell.status-ok { background: #2fb344; }
.status-dot-cell.status-error { background: #d63939; }
.status-dot-cell.status-wait { background: #206bc4; }
.status-dot-cell.status-missing { background: #d63939; }
.status-dot-cell.status-weekend { background: #98a2b3; }
.status-dot-cell.status-ignored { background: #f59f00; }

.error-modal-backdrop {
	position: fixed;
	inset: 0;
	z-index: 12000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(15, 23, 42, 0.48);
}

.error-modal-backdrop[hidden],
.error-modal[hidden] { display: none; }

.error-modal {
	width: min(620px, calc(100vw - 48px));
	max-height: min(760px, calc(100vh - 80px));
	display: flex;
	flex-direction: column;
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 6px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
}

.error-modal .modal-close {
	color: var(--muted);
}

.error-modal .modal-close:hover {
	background: var(--hover);
	color: var(--text);
}

.error-modal--danger {
	width: min(570px, calc(100vw - 48px));
	background: #1f2a3a;
	border-color: #1f2a3a;
	border-radius: 0;
	color: #fff;
	box-shadow: 0 18px 44px rgba(15, 23, 42, 0.34);
}

.error-modal-wide {
	width: min(980px, calc(100vw - 48px));
}

.error-modal-head,
.error-modal-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--border);
}

.error-modal-foot {
	justify-content: space-between;
	border-top: 1px solid var(--border);
	border-bottom: 0;
	background: var(--surface);
}

.error-modal-head h2 {
	margin: 0;
	font-size: 18px;
	font-weight: 650;
}

.error-modal--danger .error-modal-head {
	background: #1f2a3a;
	border-bottom: 0;
	color: #fff;
	padding: 20px 20px 8px;
}

.error-modal--danger #errorModalMessage {
	border: 0;
	background: transparent;
	color: #fff;
	padding: 0;
	font-size: 16px;
	line-height: 1.45;
}

.error-modal--danger .error-modal-foot {
	border-top-color: #344052;
	background: #1f2a3a;
	padding: 18px 28px 20px;
}

.error-modal--danger .modal-close {
	border: 0;
	background: transparent;
	color: #94a3b8;
	font-size: 22px;
}

.error-modal--danger .modal-close:hover {
	background: transparent;
	color: #fff;
}

.error-modal--danger #errorMoreBtn {
	background: transparent;
	border-color: #344052;
	color: #fff;
	min-width: 138px;
	min-height: 40px;
	font-size: 16px;
}

.error-modal--danger #errorMoreBtn:hover {
	background: #263449;
}

.error-modal--danger #errorCloseBtn {
	background: var(--danger);
	border-color: var(--danger);
	color: #fff;
	min-width: 92px;
	min-height: 40px;
	font-size: 16px;
}

.error-modal-body {
	padding: 14px 16px;
	overflow: auto;
}

.error-modal--danger .error-modal-body {
	padding: 36px 28px 56px;
}

.error-modal-message-row {
	display: flex;
	align-items: center;
	gap: 14px;
}

.error-modal-warning-icon {
	display: none;
}

.error-modal--danger .error-modal-warning-icon {
	display: grid;
	place-items: center;
	width: 46px;
	height: 40px;
	flex: 0 0 auto;
	color: #ff4d4f;
	font-size: 24px;
	line-height: 1;
	font-weight: 500;
	clip-path: polygon(50% 0, 100% 100%, 0 100%);
	border: 2px solid #ff4d4f;
	background: transparent;
	padding-top: 7px;
}

.error-details-body .profile-grid {
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.error-details-textarea {
	min-height: 340px;
	resize: vertical;
	font-family: Consolas, "Courier New", monospace;
	font-size: 12px;
	line-height: 1.45;
	white-space: pre;
}

.btn-success {
	background: var(--success);
	color: #fff;
	border: none;
	cursor: pointer;
	border-radius: 4px;
	font-weight: 500;
	font-size: 14px;
	padding: 8px 16px;
	transition: background 0.12s;
}

.btn-success:hover {
	background: #27a13c;
}

.statusbar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	min-height: 34px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 6px 12px;
	background: var(--sidebar-bg);
	border-top: 1px solid var(--border);
	color: var(--muted);
	font-size: 12px;
}

.status-left,
.status-right {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
}

.statusbar strong {
	color: var(--text);
	font-weight: 650;
}

.status-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--warning);
}

.status-dot.ok { background: var(--success); }
.status-dot.error { background: var(--danger); }

/* Modern dialog layer: prompts must sit above form modals such as Download Status. */
.info-modal-backdrop,
.run-confirm-backdrop,
.customer-confirm-backdrop,
.detector-modal-backdrop,
.session-exit-confirm-backdrop,
.database-locks-confirm,
#schedulerConfirmBackdrop {
	z-index: 12100;
}

.adm-toasts {
	z-index: 12200;
}

.info-modal,
.run-confirm-modal,
.customer-confirm-modal,
.detector-modal,
.database-locks-confirm-card {
	background: var(--panel);
	border-color: var(--border);
	color: var(--text);
}

/* Form modals can open prompts; keep the prompt layer above these editor forms. */
.customer-confirm-backdrop:is(
	#customerNoteBackdrop,
	#customerNoteAmendBackdrop,
	#userAddDsBackdrop,
	#userQuickAddBackdrop,
	#userEditDsBackdrop
) {
	z-index: 11000;
}

@media (max-width: 900px) {
	body { padding-bottom: 70px; }
	.login-card { width: min(836px, 100%); }
	.login-theme-toggle {
		top: 14px;
		left: auto;
		right: 14px;
		transform: none;
	}
	.login-right { display: none; }
	.login-left { width: 100%; }
	.app-body { grid-template-columns: 1fr; }
	.sidebar {
		position: static;
		height: auto;
		border-right: 0;
		border-bottom: 1px solid var(--border);
	}
	.statusbar {
		align-items: flex-start;
		flex-direction: column;
	}
	.topbar {
		align-items: flex-start;
		flex-direction: column;
	}
	.topbar-actions {
		flex-wrap: wrap;
	}
}
