/* MMTNEXUS NEXT — Team design layer.
   Same system as mmtnexus.com, app.mmtnexus.com and Nour: neutral surfaces, Inter + IBM Plex Sans Arabic,
   violet accent by default. A workspace's own colours (Settings → Appearance → --workspace-primary/accent) always win. */
@import url("fonts/fonts.css");

html:root{
  --nx-bg:#F9F9F8;--nx-side:#F3F3F1;--nx-panel:#FFFFFF;--nx-sunk:#F2F2F0;
  --nx-ink:#252627;--nx-ink2:#3E4046;--nx-muted:#656870;--nx-faint:#9A9CA3;
  --nx-line:#E9E9E6;--nx-line2:#DCDCD8;
  --nx-brand:var(--workspace-primary,#654FDB);
  --nx-brand-soft:color-mix(in srgb,var(--nx-brand) 10%,#fff);
  --nx-brand-text:color-mix(in srgb,var(--nx-brand) 82%,#252627);
  --nx-ok:#0E8A7C;--nx-ok-soft:#E3F6F3;--nx-warn:#B4700A;--nx-warn-soft:#FFF3DF;--nx-bad:#D93A47;--nx-bad-soft:#FDE9EB;
  --nx-font:"MMT Inter",Inter,"MMT Plex Arabic",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,Arial,sans-serif;
  --nx-radius:12px;
  /* Team shell tokens */
  --mmt-shell-bg:var(--nx-bg);--mmt-shell-sidebar:var(--nx-side);--mmt-shell-line:var(--nx-line);
  --mmt-shell-text:var(--nx-ink);--mmt-shell-muted:var(--nx-muted);--mmt-shell-accent:var(--nx-brand);
  /* tokens used by individual Team pages */
  --ink:var(--nx-ink);--ink2:var(--nx-ink2);--muted:var(--nx-muted);--line:var(--nx-line);--soft:var(--nx-sunk);--bg:var(--nx-bg);--card:var(--nx-panel);
  --serif:var(--nx-font);--sans:var(--nx-font);
  color-scheme:light;
}

/* ---------- Type: Inter everywhere, no serif, no Arial ---------- */
html body,html body.mmt-unified-shell{font-family:var(--nx-font)!important;color:var(--nx-ink);-webkit-font-smoothing:antialiased;font-feature-settings:"cv11","ss01"}
html body button,html body input,html body select,html body textarea,html body .btn{font-family:var(--nx-font)!important}
html body textarea.diagram-editor,html body textarea[spellcheck="false"],html body code,html body pre,html body kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important}
html body h1,html body h2,html body .pj h1,html body .hm h1,html body .pp-title,html body .ec-head h1{font-family:var(--nx-font)!important;font-weight:700!important;letter-spacing:-.03em!important;color:var(--nx-ink)}
html body h3,html body h4{font-family:var(--nx-font)!important;font-weight:650!important;letter-spacing:-.015em}
html body .eyebrow,html body [class*="eyebrow"],html body .mmt-shell-label{letter-spacing:.06em!important;font-weight:600!important}

/* ---------- Surfaces ---------- */
html body,html body.mmt-unified-shell{background:var(--nx-bg)!important}
html body .mmt-unified-sidebar,html body .mmt-shell-sidebar{background:var(--nx-side)!important;border-color:var(--nx-line)!important}
html body .mmt-shell-content,html body main{background:transparent}
html body [class*="card"]:not(button):not(a):not(img),html body .panel,html body section.box{border-color:var(--nx-line)}
html body hr{border-color:var(--nx-line)}
html body ::selection{background:var(--nx-brand-soft)}

/* ---------- Sidebar navigation ---------- */
html body .mmt-unified-sidebar nav a{color:var(--nx-ink2)!important;border-radius:9px!important}
html body .mmt-unified-sidebar nav a:hover{background:rgba(37,38,39,.045)!important;color:var(--nx-ink)!important}
html body .mmt-unified-sidebar nav a.active{background:var(--nx-brand-soft)!important;color:var(--nx-brand-text)!important;font-weight:600!important}
html body .mmt-shell-brand strong,html body .mmt-shell-workspace strong{font-weight:750!important;letter-spacing:-.03em}

/* ---------- Buttons and controls ---------- */
html body .btn.primary,html body button.primary,html body .build-primary,html body .new-request,html body button[type="submit"].primary{background:var(--nx-brand)!important;border-color:var(--nx-brand)!important;color:#fff!important;border-radius:10px!important;font-weight:600!important;box-shadow:none!important}
html body .btn.primary:hover,html body button.primary:hover,html body .build-primary:hover{background:color-mix(in srgb,var(--nx-brand) 84%,#000)!important}
html body .btn:not(.primary),html body .build-secondary{border-radius:10px!important}
html body input[type="text"],html body input[type="email"],html body input[type="password"],html body input[type="search"],html body input[type="url"],html body input[type="number"],html body select,html body textarea{border-color:var(--nx-line2)!important;border-radius:10px!important;background:#fff;color:var(--nx-ink)}
html body input:focus,html body select:focus,html body textarea:focus{border-color:var(--nx-brand)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--nx-brand) 16%,transparent)!important;outline:0!important}
html body input[type="checkbox"],html body input[type="radio"]{accent-color:var(--nx-brand)}
html body a:not(.btn):not([class*="nav"]):not(.mmt-unified-sidebar a){text-decoration-color:color-mix(in srgb,currentColor 35%,transparent)}

/* ---------- Status colours from the MMT logo ---------- */
html body .ready,html body .check-pass,html body .status-ok{color:var(--nx-ok)}
html body .notice.warn{background:var(--nx-warn-soft)!important;border-color:color-mix(in srgb,var(--nx-warn) 25%,#fff)!important;color:#7a4b07!important}
html body .notice.err{background:var(--nx-bad-soft)!important;border-color:color-mix(in srgb,var(--nx-bad) 25%,#fff)!important;color:#9b2330!important}

/* ---------- Readable sizes (some screens used 8–10px) ---------- */
html body .nx-tiny{font-size:11.5px!important;line-height:1.5!important}
html body .nx-small{font-size:12.5px!important;line-height:1.5!important}

/* ---------- Sidebar v2: same menu as app.mmtnexus.com ---------- */
@media(min-width:851px){
  html body .mmt-unified-sidebar{width:264px!important;box-sizing:border-box!important}
  html body.mmt-unified-shell{padding-left:264px!important}
}
html body .mmt-unified-sidebar{padding:12px 10px 10px!important;gap:0;font-family:var(--nx-font)!important;color:var(--nx-ink)!important}
html body .mmt-unified-sidebar .mmt-shell-brand{height:auto!important;min-height:42px;padding:2px 6px 10px!important;gap:10px!important}
html body .mmt-unified-sidebar .mmt-shell-brand strong{font-size:15px!important;font-weight:650!important;letter-spacing:-.02em!important;color:var(--nx-ink)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body .mmt-unified-sidebar .mmt-shell-mark,html body .mmt-unified-sidebar .mmt-shell-logo{width:30px!important;height:30px!important;border-radius:8px!important;flex:none;font-size:13px!important}
html body .mmt-unified-sidebar .mmt-shell-brand button{width:30px;height:30px;padding:0!important;border-radius:8px!important;display:grid!important;place-items:center;color:var(--nx-muted)!important}
html body .mmt-unified-sidebar .mmt-shell-brand button:hover{background:rgba(37,38,39,.06)!important;color:var(--nx-ink)!important}
html body .mmt-unified-sidebar .mmt-shell-brand button svg{width:17px!important;height:17px!important}
html body .mmt-unified-sidebar .mmt-shell-workspace{align-items:center;gap:8px;padding:8px 10px!important;margin:0 0 12px!important;border:1px solid var(--nx-line)!important;border-radius:10px!important;background:var(--nx-panel)!important;font-size:13px!important;font-weight:500;color:var(--nx-ink)!important;cursor:pointer}
html body .mmt-unified-sidebar .mmt-shell-workspace span:first-child{font-size:13px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body .mmt-unified-sidebar .mmt-shell-workspace .nx-ico{color:var(--nx-muted);flex:none}
html body .mmt-unified-sidebar nav{display:flex!important;flex-direction:column;gap:1px!important}
html body .mmt-unified-sidebar nav a{display:flex!important;align-items:center;gap:10px!important;min-height:34px;padding:0 10px!important;border-radius:8px!important;font-size:14px!important;line-height:1.3!important;font-weight:400!important;color:var(--nx-ink2)!important;text-decoration:none!important}
html body .mmt-unified-sidebar nav a .nx-ico{flex:none;color:var(--nx-muted);transition:color .12s}
html body .mmt-unified-sidebar nav a:hover{background:rgba(37,38,39,.05)!important;color:var(--nx-ink)!important}
html body .mmt-unified-sidebar nav a:hover .nx-ico{color:var(--nx-ink2)}
html body .mmt-unified-sidebar nav a.active,html body .mmt-unified-sidebar nav a[aria-current="page"]{background:color-mix(in srgb,var(--nx-brand) 9%,transparent)!important;color:var(--nx-ink)!important;font-weight:500!important}
html body .mmt-unified-sidebar nav a.active .nx-ico,html body .mmt-unified-sidebar nav a[aria-current="page"] .nx-ico{color:var(--nx-brand)!important}
html body .mmt-unified-sidebar nav a.active::before{display:none!important}
html body .mmt-unified-sidebar .mmt-shell-label{margin:14px 0 0!important;padding:4px 10px 6px!important;font-size:11.5px!important;font-weight:500!important;letter-spacing:.01em!important;text-transform:none!important;color:var(--nx-faint)!important}
html body .mmt-unified-sidebar .mmt-shell-group>summary.mmt-shell-label{border-radius:8px;cursor:pointer}
html body .mmt-unified-sidebar .mmt-shell-group>summary.mmt-shell-label:hover{color:var(--nx-ink2)!important;background:rgba(37,38,39,.04)}
html body .mmt-unified-sidebar .mmt-shell-group>summary::after{content:''!important;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);margin-right:4px}
html body .mmt-unified-sidebar .mmt-shell-group[open]>summary::after{transform:rotate(225deg) translate(-1px,-1px)}
html body .mmt-unified-sidebar .mmt-shell-secondary a{color:var(--nx-ink2)!important}
/* signed-in user + log out */
html body .mmt-unified-sidebar .mmt-session-footer{background:var(--nx-side)!important;padding:8px 0 2px!important;border-top:1px solid var(--nx-line)}
html body .mmt-unified-sidebar .mmt-shell-user{display:flex!important;align-items:center;gap:10px!important;height:auto!important;min-height:48px;padding:6px 6px!important;border:0!important;font-size:13px!important}
html body .mmt-unified-sidebar .nx-user-avatar{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;background:color-mix(in srgb,var(--nx-brand) 12%,#fff);color:var(--nx-brand-text);font-size:12px;font-weight:600}
html body .mmt-unified-sidebar .nx-user-meta{display:flex;flex-direction:column;min-width:0;flex:1}
html body .mmt-unified-sidebar .nx-user-meta strong{font-size:13.5px!important;font-weight:600!important;color:var(--nx-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body .mmt-unified-sidebar .nx-user-meta small{font-size:12px!important;color:var(--nx-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body .mmt-unified-sidebar .nx-user-gear{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:var(--nx-muted)!important;flex:none}
html body .mmt-unified-sidebar .nx-user-gear:hover{background:rgba(37,38,39,.06);color:var(--nx-ink)!important}
html body .mmt-unified-sidebar .mmt-session-action .mmt-logout-button{min-height:38px!important;font-size:13.5px!important;font-weight:500!important;border-radius:10px!important;border-color:var(--nx-line)!important;color:var(--nx-ink2)!important;background:var(--nx-panel)!important}
html body .mmt-unified-sidebar .mmt-session-action .mmt-logout-button:hover{background:var(--nx-bad-soft)!important;border-color:color-mix(in srgb,var(--nx-bad) 30%,#fff)!important;color:#9b2330!important}
html body .mmt-unified-sidebar .mmt-shell-user>span.nx-user-meta{width:auto!important;height:auto!important;border-radius:0!important;background:none!important;color:inherit!important;display:flex!important;place-items:normal!important;align-items:flex-start!important;text-align:start!important;padding:0!important;font-size:inherit!important}
html body .mmt-unified-sidebar .mmt-shell-user>span.nx-user-avatar{width:30px!important;height:30px!important;font-size:12px!important}
html body .mmt-unified-sidebar .nx-user-meta small{font-weight:400!important}html body .mmt-unified-sidebar .nx-user-meta strong{font-weight:600!important}

/* ---------- Home: "Continue a project" and "Recent results" as two separate cards ---------- */
html body main.hm .grid{gap:20px!important;align-items:stretch!important;margin-top:8px}
html body main.hm .grid>section.card{background:var(--nx-panel)!important;border:1px solid var(--nx-line)!important;border-radius:14px!important;padding:20px 22px 14px!important;box-shadow:0 1px 2px rgba(37,38,39,.04)!important;display:flex;flex-direction:column}
html body main.hm .grid>section.card .head{margin:0 0 6px!important;padding-bottom:14px;border-bottom:1px solid var(--nx-line)}
html body main.hm .grid>section.card .head h2{font-size:16px!important;font-weight:650!important}
html body main.hm .grid>section.card .head a{font-size:13px!important;color:var(--nx-brand-text)!important;text-decoration:none!important;font-weight:500}
html body main.hm .grid>section.card .head a:hover{text-decoration:underline!important}
html body main.hm .proj,html body main.hm .res{margin:0 -10px;padding:12px 10px!important;border-radius:10px;border-top:1px solid var(--nx-line)!important}
html body main.hm .proj:first-of-type,html body main.hm .res:first-of-type{border-top:0!important}
html body main.hm .proj:hover,html body main.hm .res:hover{background:var(--nx-sunk)}
html body main.hm .proj b{font-size:15px!important;font-weight:600!important}
html body main.hm .res b{font-size:14px!important;font-weight:600!important}
html body main.hm .meta{font-size:12.5px!important;color:var(--nx-muted)!important}
html body main.hm .bar i.on{background:var(--nx-brand)!important}
html body main.hm .jb{font-size:12px!important}
html body main.hm .jb.ok{background:var(--nx-ok-soft)!important;color:var(--nx-ok)!important}
html body main.hm .status{margin-top:auto!important;padding-top:14px!important;border-top:1px solid var(--nx-line)!important}
html body main.hm .status .dot{background:var(--nx-ok)!important}html body main.hm .status .dot.busy{background:var(--nx-warn)!important}
@media(max-width:860px){html body main.hm .grid{grid-template-columns:1fr!important}}