/* North State Sales internal operations theme.
   This file is intentionally additive: remove its <link> from base.html to disable it. */
:root {
  --navy:#1a1f25;
  --navy2:#2a3139;
  --orange:#b52b2f;
  --paper:#f3f2ef;
  --ink:#20262d;
  --muted:#68717a;
  --line:#d8d8d3;
  --green:#26725a;
  --shadow:0 8px 22px rgba(22,27,32,.06);
  --sidebar-width:272px;
  --surface:#fff;
  --surface-subtle:#f8f7f4;
  --steel:#87919b;
  --focus:rgba(181,43,47,.17);
}

html { min-height:100%; background:var(--paper); }
body { min-height:100vh; letter-spacing:.005em; }

aside {
  width:var(--sidebar-width);
  padding:22px 18px 20px;
  background:linear-gradient(180deg,#161a1f 0%,#20262d 62%,#181d22 100%);
  border-right:1px solid #303840;
  box-shadow:8px 0 24px rgba(20,24,28,.08);
}
.brand { display:block; margin:0 0 13px; }
.brand-logo-frame {
  display:flex;
  align-items:center;
  min-height:67px;
  padding:10px 11px;
  overflow:hidden;
  background:#fff;
  border:1px solid #c7c7c2;
  border-radius:3px;
}
.brand-logo { display:block; width:100%; height:auto; }
.brand-product { display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-top:11px; color:#f4f2ee; font-size:14px; letter-spacing:.03em; }
.brand-product small { display:inline; color:#9ca5ae; font-size:9px; letter-spacing:.13em; }
.internal-badge {
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:25px;
  padding:8px 10px;
  border:1px solid rgba(232,237,240,.17);
  border-radius:3px;
  background:rgba(255,255,255,.045);
  color:#c6ccd2;
  font-size:9px;
  font-weight:750;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.internal-badge span { width:7px; height:7px; border-radius:50%; background:#dd5458; box-shadow:0 0 0 4px rgba(221,84,88,.12); }
aside nav { gap:3px; }
aside nav a { display:flex; align-items:center; gap:11px; padding:10px 11px; border:1px solid transparent; border-radius:3px; color:#c8ced4; font-size:13px; font-weight:550; }
aside nav a:hover { background:#293039; border-color:#353d46; }
aside nav a.active { background:#f7f6f2; border-color:#f7f6f2; color:#20262d; box-shadow:0 3px 12px rgba(0,0,0,.18); }
.nav-icon { width:22px; color:#717d88; font:700 9px/1 Consolas,monospace; letter-spacing:.08em; }
aside nav a.active .nav-icon { color:var(--orange); }
.nav-section { margin:20px 11px 7px; color:#707a85; font-size:9px; font-weight:750; letter-spacing:.16em; text-transform:uppercase; }
.sidebar-foot { padding:16px 10px 0; border-top:1px solid rgba(255,255,255,.1); }
.environment-line { display:flex; align-items:center; gap:8px; }
.environment-line > span:last-child { display:grid; }
.environment-line b { color:#e4e7ea; font-size:11px; letter-spacing:.05em; text-transform:uppercase; }
.environment-line small { color:#78838e; font-size:9px; }
.status-dot { flex:0 0 auto; background:#48a982; box-shadow:0 0 0 4px rgba(72,169,130,.12); }
.sidebar-foot form { margin-top:7px; }
.sidebar-foot .link { color:#b8c0c7; font-size:11px; }
.sidebar-foot .link:hover { color:#fff; }

main { margin-left:var(--sidebar-width); max-width:none; padding:0 38px 34px; }
.internal-topbar { display:flex; justify-content:space-between; align-items:center; height:38px; margin:0 -38px 27px; padding:0 38px; background:#e8e6e1; border-bottom:1px solid #d2d0ca; color:#6d747a; font-size:9px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.internal-topbar b { padding-left:20px; color:#8d2428; position:relative; }
.internal-topbar b::before { content:""; position:absolute; left:0; top:50%; width:7px; height:7px; margin-top:-4px; border-radius:50%; background:var(--orange); }
header { align-items:center; margin-bottom:24px; }
header h1 { color:#20262d; font-size:26px; letter-spacing:-.025em; }
.eyebrow { color:#8d2428; font-size:9px; letter-spacing:.16em; }

.btn { min-height:38px; border-color:#c9cbc9; border-radius:3px; box-shadow:0 1px 0 rgba(20,24,28,.03); }
.btn:hover { border-color:#9fa3a4; background:#faf9f6; }
.btn.primary { background:#9f272b; border-color:#9f272b; box-shadow:0 3px 10px rgba(159,39,43,.16); }
.btn.primary:hover { background:#861f23; border-color:#861f23; }
input,textarea,select { border-color:#c8cbc9; border-radius:3px; background:#fff; }
input:focus,textarea:focus,select:focus { outline:3px solid var(--focus); border-color:#a84044; }

.hero { position:relative; overflow:hidden; border-radius:4px; border:1px solid #353d45; background:linear-gradient(112deg,#20262d 0%,#303942 72%,#222930 100%); box-shadow:var(--shadow); }
.hero::after { content:"NSS / FREIGHT OPS"; position:absolute; right:-13px; bottom:-14px; color:rgba(255,255,255,.035); font-size:48px; font-weight:900; letter-spacing:.06em; white-space:nowrap; }
.hero > * { position:relative; z-index:1; }
.hero h2 { letter-spacing:-.02em; }
.hero p { color:#bac1c8; }
.stats>div,.stats>a,.panel,.template-card,.integration-card,.capability-card { border-radius:4px; border-color:var(--line); box-shadow:var(--shadow); }
.stats>div,.stats>a { position:relative; overflow:hidden; }
.stats>div::before,.stats>a::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:#aeb3b5; }
.stats>a::before { background:var(--orange); }
.panel { background:var(--surface); }
.panel-head { padding-bottom:13px; border-bottom:1px solid #e3e3df; }
.panel-head a,.card-actions a,.card-actions .link,.document-downloads a { color:#92262a; }
th { background:#f4f3f0; color:#616b74; }
td { border-color:#e7e7e3; }
tbody tr:hover td { background:#faf9f6; }
.badge { border-radius:3px; }

.login-main { padding:0; background:#171c21; }
.login-shell { display:grid; grid-template-columns:minmax(340px,1.15fr) minmax(360px,.85fr); width:min(960px,calc(100% - 40px)); min-height:555px; border:1px solid #343b42; border-radius:4px; overflow:hidden; box-shadow:0 28px 80px rgba(0,0,0,.35); }
.login-context { display:flex; flex-direction:column; justify-content:space-between; padding:48px; background:linear-gradient(145deg,#262d34,#191e23); color:#fff; }
.login-internal-label { align-self:flex-start; padding:7px 9px; border:1px solid rgba(255,255,255,.2); color:#c8cdd2; font-size:9px; font-weight:750; letter-spacing:.16em; text-transform:uppercase; }
.login-logo { width:min(430px,100%); padding:16px; background:#fff; border-radius:2px; }
.login-context h1 { margin:0 0 7px; font-size:29px; }
.login-context p { max-width:480px; color:#aeb6bd; }
.login-context small { color:#747f89; font-size:9px; letter-spacing:.13em; text-transform:uppercase; }
.login-card { align-self:stretch; display:flex; flex-direction:column; justify-content:center; width:auto; padding:48px; border-radius:0; box-shadow:none; }
.login-card-heading { display:flex; align-items:center; gap:13px; margin-bottom:20px; }
.login-card-heading h2 { margin:1px 0 0; font-size:25px; }
.login-lock { display:grid; place-items:center; width:43px; height:43px; background:#20262d; color:#fff; border-radius:3px; font:800 10px/1 Consolas,monospace; letter-spacing:.06em; }
.access-notice { margin:20px 0 0; padding-top:15px; border-top:1px solid #e4e4e0; color:#8b9195; font-size:9px; text-align:center; letter-spacing:.07em; text-transform:uppercase; }

@media(max-width:900px) {
  aside { position:static; width:auto; padding:14px 18px; }
  .brand { display:flex; align-items:center; gap:12px; margin-bottom:10px; }
  .brand-logo-frame { width:205px; min-height:0; padding:7px; }
  .brand-product { display:none; }
  .internal-badge { position:absolute; right:18px; top:18px; margin:0; }
  aside nav { display:flex; padding-top:9px; border-top:1px solid rgba(255,255,255,.1); }
  aside nav a { flex:0 0 auto; white-space:nowrap; }
  .nav-section,.nav-icon { display:none; }
  main { margin-left:0; padding:0 20px 24px; }
  .internal-topbar { margin:0 -20px 22px; padding:0 20px; }
  .login-main { padding:20px; }
  .login-shell { grid-template-columns:1fr; width:min(520px,100%); }
  .login-context { gap:24px; padding:30px; }
  .login-logo { width:min(360px,100%); }
  .login-context > div { display:none; }
  .login-card { padding:36px 30px; }
}
@media(max-width:580px) {
  .internal-badge { display:none; }
  .brand-logo-frame { width:175px; }
  .internal-topbar span { display:none; }
  .internal-topbar { justify-content:flex-end; }
  .login-main { padding:0; }
  .login-shell { width:100%; min-height:100vh; border:0; }
  .login-context { padding:24px; }
  .login-card { padding:34px 24px; }
  .panel { overflow-x:auto; }
  .orders-panel { overflow:hidden; }
}
