/* EverSight: EverGrid Technology look, matching www.evergridtech.com (navy #12294D, red #C0392B, IBM Plex Sans +
   Space Grotesk, 4px buttons, 8px cards). Injected by /usr/local/bin/egviewer_sync.sh into the copied NEP build. */

/* Theme variables: the portal reads these (antReset.scss maps most Ant Design colours to --base-color).
   [theme-oem] raises specificity above the portal's own :root[theme-mode=...] rules. */
:root[theme-mode="light"][theme-oem] {
	--login-bg: linear-gradient(135deg, #0D1E39 0%, #12294D 55%, #1E3A66 100%);
	--sider-color: #fff;
	--base-color: #C0392B;
	--base-color-light: #C0392B1F;
	--bg-color: #F4F6F9;
	--text-color: #1B2430;
}
:root[theme-mode="dark"][theme-oem] {
	--login-bg: linear-gradient(135deg, #0D1E39 0%, #12294D 55%, #1E3A66 100%);
	--sider-color: #0D1E39;
	--base-color: #E0604F;
	--base-color-light: #E0604F26;
}

/* Type */
body, body [class^="ant-"], body [class*=" ant-"], #web-view {
	font-family: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
.login-layout-box .head, .login-layout-box .head *, .ant-modal-title, .ant-drawer-title, .ant-card-head-title, h1, h2, h3 {
	font-family: 'Space Grotesk', 'IBM Plex Sans', system-ui, sans-serif !important;
	letter-spacing: 0.2px;
}

/* Buttons: EverGrid red, 4px corners, like the website */
#web-view .ant-btn, #web-view .ant-btn-round { border-radius: 4px; }
#web-view .ant-btn-primary { background: #C0392B; border-color: #C0392B; font-weight: 600; }
#web-view .ant-btn-primary:hover, #web-view .ant-btn-primary:focus { background: #A33024; border-color: #A33024; }
:root[theme-mode="dark"] #web-view .ant-btn-primary { background: #E0604F; border-color: #E0604F; }

/* Sign-in page: navy hero like the homepage, white wordmark, white card */
.login-layout-box .top .logo { content: url(/egviewer-logo-white.png); width: 168px !important; height: auto !important; }
.login-layout-box .square, .login-layout-box .circle { opacity: 0.18; }
.login-layout-box .container {
	border-radius: 8px !important;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.30) !important;
	border-top: 4px solid #C0392B;
}
.login-layout-box .ant-btn-primary { height: 46px; font-size: 15px; letter-spacing: 0.2px; }
.login-layout-box .rt-btn { color: #12294D !important; }
.login-layout-box .rt-btn:hover { color: #C0392B !important; }
.login-layout-box .bd-b:focus-within { border-bottom-color: #C0392B !important; }
.login-layout-box .lang-select { color: #12294D; }

/* Footer and links */
#footer-layout { color: #56606E; font-size: 13px; }
#footer-layout .link { color: #12294D; }
#footer-layout .link:hover { color: #C0392B; }
a:focus-visible, button:focus-visible { outline: 3px solid #E0604F; outline-offset: 2px; }

/* No NEP app: hide the "Download APP" side button (it offers the NEPViewer app) */
.side-menus a[aria-label="Download APP"] { display: none !important; }

/* ---------- v4: sign-in pages laid out like the evergridtech.com theme (Claude design, evergrid theme 1.1.0) ----------
   #eg-chrome (header, hero copy, footer) is added to <body> by the head_snippet script while a .login-layout-box
   (sign in / sign up / forgot password) is on screen; html[data-eg-auth] is set at the same time. */
#eg-chrome { display: none; }
html[data-eg-auth] #eg-chrome { display: block; }
html[data-eg-auth] #right-layout { padding: 80px clamp(16px, 5vw, 64px) 64px; }

/* Header: white bar, text wordmark, site navigation (theme .eg-header) */
.eg-h { position: fixed; top: 0; left: 0; right: 0; z-index: 30; height: 80px; box-sizing: border-box; display: flex; align-items: center; gap: 32px;
	padding: 0 calc(clamp(16px, 5vw, 64px) + 200px) 0 clamp(16px, 5vw, 64px); background: #fff; border-bottom: 1px solid #DEE3EA; }
.eg-logo { text-decoration: none !important; display: inline-flex; flex-direction: column; gap: 3px; line-height: 1; flex-shrink: 0; }
.eg-logo .eg-word { white-space: nowrap; line-height: 1; }
.eg-logo .eg-ever, .eg-logo .eg-grid { font-family: 'Space Grotesk', 'IBM Plex Sans', system-ui, sans-serif; font-weight: 700; font-size: 30px; letter-spacing: 0.5px; }
.eg-logo .eg-ever { color: #12294D; }
.eg-logo .eg-grid { color: #C0392B; }
.eg-logo .eg-sub { display: block; font-family: 'IBM Plex Sans', system-ui, sans-serif; font-size: 10px; letter-spacing: 3px; font-weight: 700; color: #56606E; }
.eg-nav { flex-grow: 1; display: flex; justify-content: center; gap: 36px; }
.eg-nav a { font-family: 'IBM Plex Sans', system-ui, sans-serif; color: #1B2430; font-weight: 500; font-size: 16px; padding: 10px 0; border-bottom: 2px solid transparent; text-decoration: none; white-space: nowrap; }
.eg-nav a:hover { color: #C0392B; }
.eg-nav a.is-current { color: #12294D; font-weight: 700; border-bottom-color: #C0392B; }

/* The portal's own top row (logo + language picker) moves into the header bar; its logo is replaced by the wordmark */
html[data-eg-auth] .login-layout-box .top { position: fixed; top: 0; left: auto; right: clamp(16px, 5vw, 64px); height: 80px; z-index: 31; display: flex; align-items: center; }
html[data-eg-auth] .login-layout-box .top .logo { display: none !important; }
html[data-eg-auth] .login-layout-box .lang-select { background: #fff !important; border: 1px solid #DEE3EA; border-radius: 4px; height: 44px; color: #1B2430; }
html[data-eg-auth] .login-layout-box .lang-select:hover { border-color: #12294D; }
html[data-eg-auth] .login-layout-box .square, html[data-eg-auth] .login-layout-box .circle { display: none; }

/* Hero copy on the navy band, sign-in card on the right (theme .eg-hero) */
.eg-hero-copy { position: fixed; top: 50%; transform: translateY(-50%); left: max(clamp(16px, 5vw, 64px), calc((100vw - 1248px) / 2)); width: min(560px, 46vw); z-index: 1; }
.eg-hero-copy > * { margin: 0; }
.eg-eyebrow { font-family: 'IBM Plex Sans', system-ui, sans-serif; font-size: 13px; letter-spacing: 3px; font-weight: 700; text-transform: uppercase; color: #F2B8AE; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.eg-eyebrow .eg-rule { display: inline-block; width: 48px; height: 2px; background: #C0392B; }
.eg-eyebrow .eg-soft { color: #C9D1DD; }
.eg-hero-copy h1 { font-family: 'Space Grotesk', 'IBM Plex Sans', system-ui, sans-serif; font-weight: 700; color: #fff; font-size: clamp(34px, 4.2vw, 56px); line-height: 1.1; letter-spacing: -0.5px; margin-top: 22px; text-wrap: balance; }
.eg-hero-copy .eg-lead { font-family: 'IBM Plex Sans', system-ui, sans-serif; font-size: 18px; line-height: 1.6; color: #C9D1DD; margin-top: 20px; max-width: 52ch; }
.eg-hero-copy .eg-points { list-style: none; padding: 0; margin-top: 28px; display: flex; flex-direction: column; gap: 12px; }
.eg-hero-copy .eg-points li { font-family: 'IBM Plex Sans', system-ui, sans-serif; color: #fff; font-size: 16px; font-weight: 500; display: flex; align-items: center; gap: 12px; }
.eg-hero-copy .eg-points li::before { content: ""; width: 8px; height: 8px; background: #C0392B; flex-shrink: 0; }
@media (min-width: 1000px) {
	html[data-eg-auth] #right-layout { align-items: flex-end; padding-right: max(clamp(16px, 5vw, 64px), calc((100vw - 1248px) / 2)); }
	html[data-eg-auth] .login-layout-box .container { width: 400px; }
}
@media (max-width: 999px), (max-height: 620px) { .eg-hero-copy { display: none; } }

/* Sign-in card (theme .eg-card + .eg-form) */
html[data-eg-auth] .login-layout-box .container { border-top: 0 !important; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.30) !important; }
html[data-eg-auth] .login-layout-box .head h2 { color: #12294D; font-weight: 700; }
html[data-eg-auth] .login-layout-box .head::before { content: "EverSight"; display: block; margin-bottom: 8px; font-family: 'IBM Plex Sans', system-ui, sans-serif;
	font-size: 13px; letter-spacing: 2.4px; font-weight: 700; text-transform: uppercase; color: #C0392B; }
html[data-eg-auth] .login-layout-box .bd-b { border: 1px solid #B9C1CD !important; border-radius: 4px !important; background: #fff; min-height: 48px; padding: 4px 14px !important; }
html[data-eg-auth] .login-layout-box .bd-b:hover { border-color: #56606E !important; }
html[data-eg-auth] .login-layout-box .bd-b:focus-within { border-color: #C0392B !important; box-shadow: 0 0 0 3px rgba(192, 57, 43, 0.15); }
html[data-eg-auth] .login-layout-box .bd-b input { font-size: 16px; color: #1B2430; }
html[data-eg-auth] .login-layout-box .ant-btn-primary { height: 48px; }

/* Footer bar (theme .eg-footer-bottom on navy-dark) */
.eg-f { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; min-height: 56px; box-sizing: border-box; padding: 12px clamp(16px, 5vw, 64px);
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 24px; background: #0D1E39; border-top: 1px solid #25385A;
	font-family: 'IBM Plex Sans', system-ui, sans-serif; font-size: 14px; color: #C9D1DD; }
.eg-f a { color: #C9D1DD; text-decoration: none; }
.eg-f a:hover { color: #fff; }
.eg-f nav { display: flex; gap: 24px; }

@media (max-width: 900px) { .eg-nav { display: none; } .eg-h { padding-right: 0; } }
@media (max-width: 600px) {
	.eg-h { height: 68px; }
	.eg-logo .eg-ever, .eg-logo .eg-grid { font-size: 24px; }
	html[data-eg-auth] .login-layout-box .top { height: 68px; }
	html[data-eg-auth] .login-layout-box .lang-select { max-width: 150px; }
	html[data-eg-auth] #right-layout { padding-top: 92px; padding-bottom: 96px; }
	html[data-eg-auth] .login-layout-box .container { width: auto !important; max-width: 100%; }
	.eg-f { justify-content: center; text-align: center; }
}
/* Short windows: the card needs the room, the fixed footer would cover it */
@media (max-height: 700px) { .eg-f { display: none; } html[data-eg-auth] #right-layout { padding-bottom: 24px; } }