/* Tropto 1.8.3. Keep navigation, status colours and application behaviour. */
:root{--nav:#143b2a;--ink:#173c2c;--muted:#47614f;--bg:#eaf4e4;--border:#bfd3b7;--teal:#18794e;--surface:#f5faef;--field:#fcfef9;--accent:#236644;--accent-hover:#174e32;--soft:#dfedd6;--shadow:0 8px 30px #143b2a08}
[data-theme=dark]{--nav:#102a20;--ink:#eff6e9;--muted:#b8ceb8;--bg:#101f18;--border:#3a5644;--surface:#192f23;--field:#203a2b;--accent:#b5dc85;--accent-hover:#c7e99f;--soft:#2c4934;--teal:#9ace9b;color-scheme:dark}
body{background:var(--bg);color:var(--ink)}
a{color:var(--accent)}
button,input,select,textarea,[data-theme=dark] button,[data-theme=dark] input,[data-theme=dark] select{background:var(--field);border-color:var(--border);color:var(--ink)}
button:hover,[data-theme=dark] button:hover{background:var(--soft)}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #729b3e;outline-offset:3px}
.primary,[data-theme=dark] .primary{background:var(--accent);border-color:var(--accent);color:#fff}
.primary:hover,[data-theme=dark] .primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
[data-theme=dark] .primary{color:#132b1d}
.ghost,[data-theme=dark] .ghost{background:transparent;border-color:transparent}
.danger,[data-theme=dark] .danger{color:#b03345}[data-theme=dark] .danger{color:#ff9aab}
.panel,.topbar,.vehicle-card,.map-wrap,.metric-grid>div,.insights button,.login-form,dialog,.activity-panel,
[data-theme=dark] .panel,[data-theme=dark] .topbar,[data-theme=dark] .vehicle-card,[data-theme=dark] .map-wrap,[data-theme=dark] .metric-grid>div,[data-theme=dark] .insights button,[data-theme=dark] .login-form,[data-theme=dark] dialog,[data-theme=dark] .activity-panel{background:var(--surface);border-color:var(--border);color:var(--ink)}
.sidebar{background:var(--nav);color:#f2f8ed}
.sidebar small,.sidebar-foot{color:#bdd3bc}.sidebar-foot{border-color:#42634d}
.nav button,[data-theme=dark] .nav button{background:transparent;color:#d3e3cc}.nav .navicon{color:#c4e294}
.nav button:hover,[data-theme=dark] .nav button:hover{background:#254c35}
.nav button.active,[data-theme=dark] .nav button.active{background:#bddf93;color:#18341f;font-weight:650}
.nav button.active .navicon{color:#254d30}.avatar{background:var(--soft);color:var(--ink)}
.tropto-brand-mark{display:grid;place-items:center;width:33px;height:33px;flex-shrink:0;border-radius:11px;background:#c2e695;color:#143b2a;font-size:29px;line-height:1;letter-spacing:0;font-weight:600}
.vehicle-card.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.note:not(.warning),[data-theme=dark] .note:not(.warning){background:var(--soft);color:var(--ink);border-color:var(--border)}
.data-table td,[data-theme=dark] .data-table td{border-color:var(--border)}
.tabs button[aria-pressed=true],[data-theme=dark] .tabs button[aria-pressed=true]{background:var(--accent);color:#fff;border-color:var(--accent)}
[data-theme=dark] .tabs button[aria-pressed=true]{color:#132b1d}
.code,[data-theme=dark] .code{background:var(--soft);color:var(--ink)}
.activity-grid small,.activity-note,[data-theme=dark] .activity-grid small,[data-theme=dark] .activity-note{color:var(--muted)}
.altitude-chart text{fill:var(--muted)}
.mobile-nav,[data-theme=dark] .mobile-nav{background:var(--surface);border-color:var(--border)}
.mobile-nav button[aria-current=page],.mobile-nav button.active,[data-theme=dark] .mobile-nav button[aria-current=page],[data-theme=dark] .mobile-nav button.active{background:var(--soft);color:var(--ink)}
.login-page{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(360px,.85fr);min-height:100dvh;background:var(--bg)}
.login-story{padding:35px clamp(28px,4.7vw,78px) 25px;gap:22px;background:var(--bg);color:var(--ink);justify-content:center;min-width:0}
.login-story .brand{align-self:flex-start;font-size:1.6rem;letter-spacing:.06em;margin-bottom:18px}
.login-intro{position:relative;z-index:1}
.login-eyebrow{font-size:.71rem;font-weight:750;letter-spacing:.16em;color:var(--muted);margin-bottom:16px}
.login-story h1{font-size:clamp(2rem,3.6vw,3.75rem);line-height:1.07;letter-spacing:-.055em;margin:0 0 16px;max-width:620px;color:var(--ink)}
.login-story p{display:block;color:var(--muted);font-size:1rem;max-width:470px;margin:0;line-height:1.65}
.login-landscape{display:block;width:100%;height:auto;max-height:330px;object-fit:cover;object-position:center;border-radius:28px;background:#eaf4e4}
.login-activities{display:flex;gap:12px 18px;flex-wrap:wrap;justify-content:flex-start;color:var(--ink)}
.login-activities span{display:inline-flex;align-items:center;gap:8px;font-size:.82rem;font-weight:650}
.login-activities svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.login-caption{font-size:.73rem;color:var(--muted);margin-top:3px}
.login-form{padding:38px clamp(28px,4.5vw,76px);border-left:1px solid var(--border)}
.login-form form{max-width:380px;width:100%}.login-form h2{font-size:1.85rem;color:var(--ink)}
.login-form .primary{min-height:49px;border-radius:10px}
.login-preferences{margin-bottom:34px}.login-foot{display:flex;gap:22px;flex-wrap:wrap;font-size:.84rem;margin-top:20px}
.login-foot p{margin:0}.login-foot a{font-weight:600;text-underline-offset:3px}
.login-story .line{display:none}
@media(min-width:761px) and (max-width:1050px){.login-page{grid-template-columns:minmax(0,1fr) minmax(340px,.9fr)}.login-story{padding:28px;gap:20px}.login-form{padding:32px 27px}.login-activities{gap:15px}.login-landscape{max-height:285px}}
@media(max-width:760px){.login-page{display:flex;flex-direction:column}.login-story{padding:calc(22px + env(safe-area-inset-top)) 22px 20px;gap:14px}.login-story .brand{font-size:1.2rem;margin:0}.login-eyebrow,.login-story p,.login-caption{display:none}.login-story h1{font-size:1.85rem;margin:0}.login-landscape{height:150px;max-height:150px;object-position:50% 55%;border-radius:18px}.login-activities{gap:8px}.login-activities span{font-size:.73rem;gap:5px}.login-activities svg{width:21px;height:21px}.login-form{padding:25px 22px calc(28px + env(safe-area-inset-bottom));border-left:0;border-top:1px solid var(--border)}.login-preferences{margin-bottom:20px}.login-form h2{font-size:1.65rem}}
@media print{:root,[data-theme=dark]{--ink:#17283f;--muted:#52605a;--bg:#fff;--surface:#fff;--border:#ddd;--field:#fff;--accent:#173c2c}body{background:#fff}.panel,.activity-panel{background:#fff}}

.brand img.tropto-logo-light,.brand img.tropto-logo-dark{width:170px;height:51px;object-fit:contain}.brand .tropto-logo-light{display:block;mix-blend-mode:multiply}.brand .tropto-logo-dark{display:none}.sidebar .brand .tropto-logo-light,[data-theme=dark] .brand .tropto-logo-light{display:none}.sidebar .brand .tropto-logo-dark,[data-theme=dark] .brand .tropto-logo-dark{display:block;mix-blend-mode:screen}.sidebar .brand img{width:164px;height:47px}.login-story .brand img{width:192px;height:57px}@media(max-width:760px){.login-story .brand img{width:140px;height:42px}}

@media(max-width:420px){.login-activities{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 6px}}

/* Preserve the approved logo on both green backgrounds. */
.brand .tropto-logo-light,.sidebar .brand .tropto-logo-light,[data-theme=dark] .brand .tropto-logo-light{display:block}.sidebar .brand .tropto-logo-light,[data-theme=dark] .brand .tropto-logo-light{filter:invert(1) hue-rotate(180deg);mix-blend-mode:screen}.login-landscape{object-fit:contain}#toast{background:var(--nav);color:#f4faef}
@media(max-width:760px){.login-landscape{height:120px;max-height:120px;object-fit:contain}.login-story h1{font-size:1.6rem}.login-story{gap:12px}}

.login-landscape{object-fit:cover;object-position:50% 54%}
