/* Loranet reference-style login */
.navbar-brand.navbar-home {
    min-width: 150px !important;
    display: flex !important;
    align-items: center !important;
}

.navbar-brand.navbar-home .app-logo {
    content: url("/assets/loranet/loranet_logo.png") !important;
    width: 136px !important;
    max-width: 136px !important;
    max-height: 30px !important;
    height: auto !important;
    object-fit: contain !important;
}

html:has(body[data-path="login"]) {
    height: 100dvh !important;
    overflow: hidden !important;
}
body[data-path="login"] {
    height: 100dvh !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: #02040a !important;
    color: #061638 !important;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}
body[data-path="login"] nav.navbar,
body[data-path="login"] header,
body[data-path="login"] .web-header,
body[data-path="login"] .page-breadcrumbs,
body[data-path="login"] .page-header-wrapper,
body[data-path="login"] footer,
body[data-path="login"] .page-footer { display: none !important; }
body[data-path="login"] #page-login,
body[data-path="login"] .web-page,
body[data-path="login"] .page-content-wrapper,
body[data-path="login"] .page_content { width: 100% !important; height: 100dvh !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; background: transparent !important; }
body[data-path="login"] main.container { box-sizing: border-box !important; max-width: none !important; width: 100% !important; height: 100dvh !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: stretch !important; justify-content: stretch !important; overflow: hidden !important; }
.loranet-login-page { width: 100%; height: 100%; }
.loranet-login-frame {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    max-height: none;
    min-height: 0;
    margin: 0;
    padding: clamp(28px, 4.4vh, 72px) clamp(48px, 7.2vw, 138px) 58px;
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(620px, 1fr) minmax(420px, clamp(460px, 26vw, 576px));
    gap: clamp(54px, 7vw, 140px);
    align-items: center;
    border: 2px solid #1682ff;
    border-radius: 0;
    background:
        radial-gradient(circle at 35% 20%, rgba(183, 220, 255, .62), transparent 18%),
        radial-gradient(circle at 55% 48%, rgba(46, 145, 255, .16), transparent 18%),
        linear-gradient(135deg, #f8fbff 0%, #eef7ff 48%, #ffffff 100%);
    box-shadow: 0 24px 90px rgba(0,0,0,.5);
}
.loranet-login-frame::before {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 58px;
    height: 150px;
    background: linear-gradient(160deg, transparent 0 18%, rgba(14,118,255,.18) 19% 34%, rgba(0,105,255,.72) 35% 48%, rgba(109,137,255,.34) 49% 60%, transparent 61%);
    transform: skewY(-4deg);
    pointer-events: none;
}
.loranet-login-frame[style*="display: none"] { display: none !important; }
.login-footer { position: absolute; left: 0; right: 0; bottom: 0; height: 48px; padding: 0 64px; display: flex; align-items: center; justify-content: space-between; color: #63718c; font-size: 13px; background: rgba(255,255,255,.76); border-top: 1px solid rgba(217,225,238,.8); z-index: 5; }
.login-footer a { color: #006eef !important; }
.loranet-showcase { position: relative; z-index: 2; align-self: stretch; display: flex; flex-direction: column; justify-content: flex-start; padding-top: 2px; }
.showcase-logo { width: 210px; height: auto; margin-bottom: clamp(18px, 3.2vh, 34px); }
.showcase-pill { width: fit-content; padding: 6px 13px; border-radius: 999px; color: #075fd5; background: #ddecff; font-size: 15px; font-weight: 500; margin-bottom: 10px; }
.loranet-showcase h1 { margin: 0; max-width: 760px; color: #071a43; font-size: clamp(32px, 2.65vw, 44px); line-height: 1.12; font-weight: 800; letter-spacing: 0; }
.loranet-showcase h1 span { color: #0878ff; }
.loranet-showcase p { margin: clamp(12px, 2vh, 18px) 0 0; color: #405171; font-size: clamp(17px, 1.4vw, 19px); line-height: 1.4; }
.dashboard-preview { width: min(100%, 730px); height: min(360px, 39vh); margin-top: clamp(18px, 4vh, 36px); display: grid; grid-template-columns: 58px 1fr; overflow: hidden; border-radius: 16px; background: #fff; border: 1px solid rgba(217,225,238,.96); box-shadow: 0 24px 70px rgba(56,96,150,.2); }
.dashboard-rail { background: #061638; padding: 18px 0; display: flex; align-items: center; flex-direction: column; gap: 18px; color: #fff; }
.dashboard-rail b { width: 28px; height: 28px; border-radius: 7px; display: grid; place-items: center; background: #0b73f6; }
.dashboard-rail i { width: 15px; height: 15px; border-radius: 4px; border: 1px solid rgba(255,255,255,.65); }
.dashboard-main { padding: 20px 24px; }
.dashboard-main strong { display: block; margin-bottom: 16px; font-size: 16px; color: #102344; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.metric-grid div, .chart-card, .customer-card { background: #fff; border-radius: 8px; padding: 14px; box-shadow: 0 10px 26px rgba(22,54,96,.08); border: 1px solid #eef2f8; }
.metric-grid small { display: block; color: #6b7890; font-size: 10px; }
.metric-grid b { display: block; margin: 8px 0; color: #071a43; }
.metric-grid em { color: #16a064; font-style: normal; font-size: 11px; }
.metric-grid .down { color: #d74444; }
.dashboard-row { display: grid; grid-template-columns: 1.1fr .9fr; gap: 16px; margin-top: 14px; }
.chart-card, .customer-card { height: 138px; }
.chart-card span, .customer-card span { color: #102344; font-size: 13px; }
.chart-line { height: 74px; margin-top: 18px; background: linear-gradient(135deg, transparent 48%, #1478ff 49% 52%, transparent 53%), linear-gradient(#edf4ff 1px, transparent 1px); background-size: 100% 100%, 100% 28px; }
.customer-card p { display: flex; justify-content: space-between; margin: 13px 0 0; color: #102344; font-size: 12px; }
.loranet-auth-card { box-sizing: border-box; position: relative; z-index: 4; width: 100%; min-height: 0; height: min(720px, calc(100dvh - 112px)); padding: clamp(36px, 5vh, 58px) 56px 34px !important; border: 0 !important; border-radius: 22px !important; background: rgba(255,255,255,.92) !important; box-shadow: 0 30px 80px rgba(30,55,90,.16) !important; backdrop-filter: blur(18px) saturate(150%); display: flex; flex-direction: column; }
.auth-badge { width: clamp(70px, 8vh, 86px); height: clamp(70px, 8vh, 86px); margin: 0 auto clamp(14px, 2.4vh, 20px); border-radius: 999px; display: grid; place-items: center; color: #fff; background: radial-gradient(circle, #0b73f6 0 34%, #eaf4ff 35% 100%); font-size: 38px; font-weight: 800; }
.loranet-auth-card h2 { margin: 0; text-align: center; color: #061638; font-size: 26px; line-height: 1.22; font-weight: 800; }
.auth-subtitle { margin: 10px 0 clamp(24px, 4vh, 36px); text-align: center; color: #60708c; font-size: 16px; }
.loranet-auth-card .form-group { margin-bottom: 20px !important; }
.loranet-auth-card .form-label { position: static !important; width: auto !important; height: auto !important; clip: auto !important; overflow: visible !important; display: block; margin: 0 0 11px; color: #061638; font-size: 14px; font-weight: 700; }
.loranet-auth-card .form-control { width: 100%; height: 50px !important; border-radius: 7px !important; border: 1px solid #d9e1ee !important; background: rgba(255,255,255,.86) !important; padding: 0 16px !important; color: #263955 !important; font-size: 15px !important; box-shadow: none !important; }
.loranet-auth-card .form-control:focus { border-color: #0b73f6 !important; box-shadow: 0 0 0 3px rgba(11,115,246,.12) !important; }
.password-field { position: relative; }
.password-field .form-control { padding-right: 58px !important; }
.toggle-password { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-size: 13px !important; color: #66758f !important; }
.forgot-password-message { margin: -6px 0 22px !important; text-align: right; }
.forgot-password-message a { color: #006eef !important; font-size: 14px; }
.loranet-auth-card .btn-primary { width: 100%; height: 50px; border: 0 !important; border-radius: 7px !important; background: linear-gradient(180deg, #087cff, #0067df) !important; color: #fff !important; font-size: 16px !important; font-weight: 700 !important; box-shadow: 0 12px 28px rgba(0,103,223,.24) !important; }
.loranet-auth-card .btn-primary::after { content: "→"; float: right; font-size: 24px; line-height: 14px; }
.social-logins { margin-top: 22px; }
.login-divider { display: flex; align-items: center; gap: 18px; margin: 20px 0 !important; color: #66758f !important; font-size: 15px; }
.login-divider::before, .login-divider::after { content: ""; height: 1px; flex: 1; background: #d9e1ee; }
.login-button-wrapper { margin-top: 12px; }
.btn-login-option { width: 100%; min-height: 50px; display: flex !important; align-items: center; justify-content: center; border: 1px solid #d9e1ee !important; border-radius: 7px !important; background: #fff !important; color: #061638 !important; font-size: 15px !important; font-weight: 700 !important; box-shadow: none !important; }
.secure-note { margin-top: auto; padding-top: 24px; text-align: center; color: #66758f; font-size: 15px; }
.secure-note::before { content: "🔒 "; }
.sign-up-message { margin-top: 18px !important; }
@media (max-width: 1100px) {
    html:has(body[data-path="login"]),
    body[data-path="login"] { height: auto !important; min-height: 100dvh !important; overflow: auto !important; }
    body[data-path="login"] main.container { height: auto !important; min-height: 100dvh !important; padding: 0 !important; align-items: flex-start !important; overflow: visible !important; }
    .loranet-login-page { min-height: 100dvh; height: auto; }
    .loranet-login-frame { grid-template-columns: 1fr; height: auto; min-height: 100dvh; padding: 32px 20px 82px; }
    .loranet-showcase { align-items: center; text-align: center; }
    .showcase-logo { margin-bottom: 24px; }
    .loranet-showcase p, .dashboard-preview { display: none; }
    .loranet-auth-card { width: min(100%, 520px); margin: 24px auto 0; min-height: auto; padding: 40px 28px !important; }
    .login-footer { padding: 0 20px; font-size: 12px; }
}

/* Compact the auth card so every action fits in one viewport. */
.loranet-auth-card {
    height: min(640px, calc(100dvh - 86px)) !important;
    padding: clamp(24px, 3.4vh, 36px) 48px 22px !important;
}
.auth-badge {
    width: clamp(54px, 6.2vh, 66px) !important;
    height: clamp(54px, 6.2vh, 66px) !important;
    margin-bottom: clamp(10px, 1.6vh, 14px) !important;
    font-size: 30px !important;
}
.loranet-auth-card h2 {
    font-size: clamp(21px, 2.7vh, 24px) !important;
    line-height: 1.15 !important;
}
.auth-subtitle {
    margin: 8px 0 clamp(16px, 2.7vh, 24px) !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
}
.loranet-auth-card .form-group {
    margin-bottom: clamp(12px, 2vh, 16px) !important;
}
.loranet-auth-card .form-label {
    margin-bottom: 7px !important;
    font-size: 13px !important;
}
.loranet-auth-card .form-control {
    height: 42px !important;
    font-size: 14px !important;
}
.forgot-password-message {
    margin: -2px 0 14px !important;
}
.forgot-password-message a {
    font-size: 13px !important;
}
.loranet-auth-card .btn-primary {
    height: 44px !important;
    font-size: 15px !important;
}
.loranet-auth-card .btn-primary::after {
    font-size: 20px !important;
}
.social-logins {
    margin-top: 14px !important;
}
.login-divider {
    margin: 12px 0 !important;
    font-size: 13px !important;
}
.login-button-wrapper {
    margin-top: 8px !important;
}
.btn-login-option {
    min-height: 42px !important;
    font-size: 14px !important;
}
.secure-note {
    padding-top: 16px !important;
    font-size: 13px !important;
}
.login-footer {
    height: 42px !important;
    font-size: 12px !important;
}

/* Brand polish: use the real Loranet logo and keep the card contents visible. */
.loranet-auth-card {
    height: min(590px, calc(100dvh - 96px)) !important;
    padding: clamp(20px, 2.8vh, 30px) 46px 18px !important;
}
.auth-badge {
    width: 190px !important;
    height: 58px !important;
    margin: 0 auto 10px !important;
    border-radius: 0 !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.auth-badge img {
    width: 180px !important;
    height: auto !important;
    display: block !important;
}
.loranet-auth-card h2 {
    font-size: clamp(20px, 2.4vh, 23px) !important;
}
.auth-subtitle {
    margin-bottom: clamp(14px, 2.2vh, 18px) !important;
}
.loranet-auth-card .form-control {
    height: 40px !important;
}
.loranet-auth-card .btn-primary,
.btn-login-option {
    min-height: 40px !important;
    height: 40px !important;
}
.secure-note {
    margin-top: 12px !important;
    padding-top: 0 !important;
    color: #66758f !important;
}

/* Keep password visibility toggle centered inside the field. */
.password-field .form-control {
    padding-right: 64px !important;
}
.toggle-password {
    top: 0 !important;
    right: 14px !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
    line-height: 1 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

/* Keep the original Ventures login from being crushed by portal_login.css */
body[data-path="login"]:has(.loranet-login-page) {
	background: #02040a !important;
	animation: none !important;
}
body[data-path="login"]:has(.loranet-login-page)::before,
body[data-path="login"]:has(.loranet-login-page)::after {
	content: none !important;
	display: none !important;
}
body[data-path="login"]:has(.loranet-login-page) #page-login,
body[data-path="login"]:has(.loranet-login-page) .page-content-wrapper,
body[data-path="login"]:has(.loranet-login-page) main.container {
	display: flex !important;
	align-items: stretch !important;
	justify-content: stretch !important;
	max-width: none !important;
	width: 100% !important;
	height: 100dvh !important;
	padding: 0 !important;
	margin: 0 !important;
}
body[data-path="login"]:has(.loranet-login-page) section.for-login,
body[data-path="login"]:has(.loranet-login-page) section.for-signup,
body[data-path="login"]:has(.loranet-login-page) section.for-forgot,
body[data-path="login"]:has(.loranet-login-page) section.for-login-with-email-link {
	max-width: none !important;
	width: 100% !important;
	margin: 0 !important;
	padding: clamp(28px, 4.4vh, 72px) clamp(48px, 7.2vw, 138px) 58px !important;
	background: transparent !important;
	border: 2px solid #1682ff !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	animation: none !important;
	transform: none !important;
	backdrop-filter: none !important;
}