/* ============================================================
   TOPMATIC B2B ENTERPRISE 10.1
   APT-inspired control center, TopMatic visual identity
   ============================================================ */

:root{
  --tmv-red:#ef1028;
  --tmv-red-2:#d90b21;
  --tmv-red-soft:#fff3f5;
  --tmv-ink:#0d1118;
  --tmv-ink-2:#151b25;
  --tmv-side:#0c1119;
  --tmv-side-2:#111824;
  --tmv-bg:#f4f5f7;
  --tmv-panel:#fff;
  --tmv-border:#e8ebf0;
  --tmv-muted:#6b7280;
  --tmv-good:#18a66a;
  --tmv-warn:#e6a116;
  --tmv-shadow:0 18px 55px rgba(15,23,42,.075);
}

body.tm-b2b-standalone-portal{
  margin:0!important;
  background:var(--tmv-bg)!important;
  overflow-x:hidden;
}
body.tm-b2b-standalone-portal #wpadminbar{display:none!important}
html:has(body.tm-b2b-standalone-portal){margin-top:0!important}

.tm-portal-host-shell{min-height:100vh;background:var(--tmv-bg)}

.tm-b2b.tm-b2b-portal{
  width:100%;
  max-width:none;
  min-height:100vh;
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  background:var(--tmv-bg);
  overflow:visible;
  color:#111827;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

.tm-b2b .tm-b2b-layout{
  display:grid;
  grid-template-columns:264px minmax(0,1fr);
  min-height:100vh;
  width:100%;
  background:var(--tmv-bg);
}

.tm-b2b .tm-b2b-workspace{
  min-width:0;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  background:var(--tmv-bg);
}

/* Sidebar */
.tm-b2b .tm-b2b-nav{
  position:sticky;
  top:0;
  z-index:70;
  align-self:start;
  height:100vh;
  max-height:100vh;
  overflow:auto;
  padding:18px 14px 16px;
  border:0;
  border-right:1px solid rgba(255,255,255,.06);
  background:
    radial-gradient(circle at 20% -10%,rgba(239,16,40,.18),transparent 31%),
    linear-gradient(180deg,var(--tmv-side),var(--tmv-side-2));
  scrollbar-width:thin;
  scrollbar-color:#2a3342 transparent;
}
.tm-b2b .tm-b2b-nav::-webkit-scrollbar{width:5px}
.tm-b2b .tm-b2b-nav::-webkit-scrollbar-thumb{background:#2a3342;border-radius:10px}

.tm-b2b .tm-b2b-nav__brand{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:62px;
  margin:0 2px 18px;
  padding:0 4px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.tm-b2b .tm-b2b-nav__logo{
  min-width:0;
  display:flex;
  align-items:center;
  gap:11px;
  color:#fff!important;
  text-decoration:none!important;
}
.tm-b2b .tm-b2b-nav__mark{
  width:38px;height:38px;flex:0 0 38px;
  display:grid;place-items:center;
  border-radius:10px;
  background:linear-gradient(135deg,#ff223e,var(--tmv-red-2));
  box-shadow:0 10px 24px rgba(239,16,40,.26);
  color:#fff;font-weight:900;font-size:12px;letter-spacing:.5px;
}
.tm-b2b .tm-b2b-nav__brandcopy{display:flex;flex-direction:column;min-width:0}
.tm-b2b .tm-b2b-nav__brandcopy strong{color:#fff;font-size:15px;line-height:1.1;letter-spacing:-.2px}
.tm-b2b .tm-b2b-nav__brandcopy small{margin-top:4px;color:#8e9aab;font-size:9px;line-height:1;text-transform:uppercase;letter-spacing:1.05px;font-weight:700}
.tm-b2b .tm-b2b-nav__close{display:none!important;width:34px;height:34px;padding:0!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:9px!important;background:rgba(255,255,255,.04)!important;color:#fff!important;font-size:22px!important}

.tm-b2b .tm-b2b-nav__head{
  margin:0 10px 8px;
  padding:0;
  color:#69778b;
  font-size:9px;
  font-weight:800;
  letter-spacing:1.5px;
  text-transform:uppercase;
}
.tm-b2b .tm-b2b-nav__head--secondary{margin-top:20px}
.tm-b2b .tm-b2b-nav__items{display:flex;flex-direction:column;gap:4px;padding:0!important}
.tm-b2b .tm-b2b-nav__item{
  position:relative;
  width:100%;
  min-height:43px;
  margin:0!important;
  padding:0 12px!important;
  display:flex!important;
  align-items:center;
  gap:10px;
  border:1px solid transparent!important;
  border-radius:9px!important;
  background:transparent!important;
  color:#9aa6b7!important;
  box-shadow:none!important;
  font-size:11px!important;
  font-weight:720!important;
  text-align:left;
  transform:none!important;
  transition:background .18s ease,color .18s ease,border-color .18s ease!important;
}
.tm-b2b .tm-b2b-nav__item:hover,
.tm-b2b .tm-b2b-nav__item:focus{
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(255,255,255,.05)!important;
  color:#fff!important;
}
.tm-b2b .tm-b2b-nav__item.is-active{
  background:linear-gradient(90deg,rgba(239,16,40,.18),rgba(239,16,40,.07))!important;
  border-color:rgba(239,16,40,.22)!important;
  color:#fff!important;
}
.tm-b2b .tm-b2b-nav__item.is-active:before{
  content:"";position:absolute;left:-1px;top:9px;bottom:9px;width:3px;border-radius:0 4px 4px 0;background:var(--tmv-red)
}
.tm-b2b .tm-b2b-nav__icon{width:17px;height:17px;flex:0 0 17px;color:#6f7d90}
.tm-b2b .tm-b2b-nav__item:hover .tm-b2b-nav__icon,
.tm-b2b .tm-b2b-nav__item.is-active .tm-b2b-nav__icon{color:var(--tmv-red)}
.tm-b2b .tm-b2b-nav__label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit!important}
.tm-b2b .tm-b2b-nav__dot{margin-left:auto;width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:transparent!important;box-shadow:none!important}
.tm-b2b .tm-b2b-nav__dot.is-on{background:var(--tmv-red)!important;box-shadow:0 0 0 4px rgba(239,16,40,.12)!important}

.tm-b2b .tm-b2b-nav__external{display:flex;flex-direction:column;gap:4px}
.tm-b2b .tm-b2b-nav__external a{
  min-height:39px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;
  border-radius:8px;color:#7f8b9d!important;text-decoration:none!important;font-size:10px;font-weight:700;
  transition:.18s ease;
}
.tm-b2b .tm-b2b-nav__external a:hover{background:rgba(255,255,255,.04);color:#fff!important}
.tm-b2b .tm-b2b-nav__external b{color:var(--tmv-red);font-size:12px}
.tm-b2b .tm-b2b-nav__footer{
  margin-top:24px;padding:15px 10px 4px;border-top:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;gap:8px
}
.tm-b2b .tm-b2b-nav__footer small{color:#5f6c7d;font-size:8px;line-height:1.4}
.tm-b2b .tm-b2b-nav__status{display:flex;align-items:center;gap:7px;color:#8793a4;font-size:9px;font-weight:700}
.tm-b2b .tm-b2b-nav__status i{width:6px;height:6px;border-radius:50%;background:var(--tmv-good);box-shadow:0 0 0 4px rgba(24,166,106,.11)}

/* Topbar */
.tm-b2b .tm-b2b-top{
  position:sticky;top:0;z-index:55;
  min-height:74px;
  padding:12px 22px;
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  border:0;border-bottom:1px solid var(--tmv-border);
  background:rgba(255,255,255,.97);
  color:#111827;
  box-shadow:0 3px 14px rgba(15,23,42,.025);
  backdrop-filter:none;
}
.tm-b2b .tm-b2b-top__left{display:flex;align-items:center;gap:13px;min-width:0}
.tm-b2b .tm-b2b-top__titles{min-width:0;display:flex;flex-direction:column;gap:4px}
.tm-b2b .tm-b2b-breadcrumbs{display:flex;align-items:center;gap:7px;min-width:0;color:#9aa1ac;font-size:10px;font-weight:700;white-space:nowrap}
.tm-b2b .tm-b2b-breadcrumbs a{color:var(--tmv-red)!important;text-decoration:none!important;font-weight:850}
.tm-b2b .tm-b2b-breadcrumbs b{min-width:0;overflow:hidden;text-overflow:ellipsis;color:#202633;font-size:12px}
.tm-b2b .tm-b2b-kicker{color:#98a0ac!important;font-size:8px;line-height:1;text-transform:uppercase;letter-spacing:1.3px;font-weight:800}
.tm-b2b .tm-b2b-top__right{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0;max-width:none}
.tm-b2b .tm-b2b-system-live{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 9px;border:1px solid #dff2e9;border-radius:30px;background:#f6fdf9;color:#45836a;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.55px}
.tm-b2b .tm-b2b-system-live i{width:5px;height:5px;border-radius:50%;background:var(--tmv-good)}
.tm-b2b .tm-b2b-top .tm-b2b-pill,
.tm-b2b .tm-b2b-top .tm-b2b-meta{
  min-height:32px;padding:0 10px;display:inline-flex;align-items:center;gap:6px;
  border:1px solid var(--tmv-border);border-radius:7px;background:#fafbfc!important;color:#596273!important;
  box-shadow:none!important;font-size:9px;font-weight:700
}
.tm-b2b .tm-b2b-meta__item{color:inherit!important}
.tm-b2b .tm-b2b-meta__sep{color:#c2c7cf}
.tm-b2b .tm-b2b-top-shop{
  min-height:36px;padding:0 12px;display:inline-flex;align-items:center;gap:7px;border:1px solid #202733;border-radius:7px;background:#141a23;color:#fff!important;text-decoration:none!important;font-size:9px;font-weight:800;letter-spacing:.25px;transition:.18s ease
}
.tm-b2b .tm-b2b-top-shop svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tm-b2b .tm-b2b-top-shop:hover{background:var(--tmv-red);border-color:var(--tmv-red)}
.tm-b2b .tm-b2b-bell{
  width:36px!important;height:36px!important;min-width:36px;padding:0!important;display:grid!important;place-items:center!important;border:1px solid var(--tmv-border)!important;border-radius:8px!important;background:#fff!important;color:#5d6675!important;box-shadow:none!important
}
.tm-b2b .tm-b2b-bell:hover{color:var(--tmv-red)!important;border-color:rgba(239,16,40,.25)!important}
.tm-b2b .tm-b2b-bell .tm-b2b-ico{width:15px;height:15px;fill:currentColor}
.tm-b2b .tm-b2b-bell__dot{width:6px;height:6px;background:transparent}
.tm-b2b .tm-b2b-bell.has-new .tm-b2b-bell__dot{background:var(--tmv-red);box-shadow:0 0 0 3px rgba(239,16,40,.12)}
.tm-b2b .tm-b2b-avatar{width:36px;height:36px;flex:0 0 36px;border:1px solid var(--tmv-border)!important;border-radius:9px;background:#fff!important;box-shadow:none!important;color:#111827!important;font-size:10px;font-weight:900}
.tm-b2b .tm-b2b-avatar img{width:100%;height:100%;object-fit:contain;border-radius:8px;padding:3px}
.tm-b2b .tm-b2b-btn--logout{min-height:36px!important;padding:0 11px!important;border:1px solid #f0d9dc!important;border-radius:7px!important;background:#fff7f8!important;color:#bd1728!important;font-size:9px!important;font-weight:800!important}
.tm-b2b .tm-b2b-btn--logout:hover{background:var(--tmv-red)!important;color:#fff!important;border-color:var(--tmv-red)!important}
.tm-b2b .tm-b2b-nav-toggle{display:none!important;width:38px;height:38px;padding:0!important;border:1px solid var(--tmv-border)!important;border-radius:9px!important;background:#fff!important;align-items:center!important;justify-content:center!important;flex-direction:column!important;gap:4px!important}
.tm-b2b .tm-b2b-nav-toggle span{display:block;width:16px;height:2px;border-radius:4px;background:#222b38}
.tm-b2b .tm-b2b-nav-backdrop{display:none;position:fixed;inset:0;z-index:64;border:0!important;background:rgba(5,9,14,.48)!important;backdrop-filter:none!important}

/* Main */
.tm-b2b .tm-b2b-main{
  flex:1;min-width:0;overflow:visible;
  padding:22px;
  background:var(--tmv-bg);
}
.tm-b2b .tm-b2b-tabpanel{min-width:0}
.tm-b2b .tm-b2b-dashboard{gap:14px}

/* Dashboard hero */
.tm-b2b .tm-b2b-hero{
  position:relative;
  min-height:150px;
  padding:25px 27px;
  overflow:hidden;
  border:1px solid #1c2532;
  border-radius:13px;
  background:
    radial-gradient(circle at 92% 10%,rgba(239,16,40,.22),transparent 33%),
    linear-gradient(135deg,#0d121a,#151d29 72%);
  box-shadow:0 15px 40px rgba(11,17,26,.14);
  color:#fff;
}
.tm-b2b .tm-b2b-hero:after{content:"";position:absolute;right:-80px;bottom:-120px;width:330px;height:330px;border:1px solid rgba(255,255,255,.06);border-radius:50%;box-shadow:0 0 0 45px rgba(255,255,255,.018),0 0 0 90px rgba(255,255,255,.012)}
.tm-b2b .tm-b2b-hero>div{position:relative;z-index:2}
.tm-b2b .tm-b2b-hero__eyebrow{margin-bottom:8px;color:#8f9bad!important;font-size:8px!important;letter-spacing:1.55px!important;font-weight:850!important}
.tm-b2b .tm-b2b-hero h2{margin:0 0 8px!important;color:#fff!important;font-size:29px!important;line-height:1.06!important;letter-spacing:-1px!important}
.tm-b2b .tm-b2b-hero p{max-width:720px;color:#b9c1cc!important;font-size:11.5px!important;line-height:1.65!important}
.tm-b2b .tm-b2b-hero--client{background:radial-gradient(circle at 91% 8%,rgba(239,16,40,.28),transparent 35%),linear-gradient(135deg,#171018,#21141c 72%)}
.tm-b2b .tm-b2b-hero__actions{margin-top:18px}

/* Cards/KPIs */
.tm-b2b .tm-b2b-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.tm-b2b .tm-b2b-kpis--admin{grid-template-columns:repeat(3,minmax(0,1fr))}
.tm-b2b .tm-b2b-kpi{
  position:relative;min-height:112px;padding:17px!important;overflow:hidden;
  border:1px solid var(--tmv-border)!important;border-radius:11px!important;background:#fff!important;
  box-shadow:0 7px 20px rgba(15,23,42,.035)!important;color:#111827!important;text-decoration:none!important;transition:.2s ease!important
}
.tm-b2b .tm-b2b-kpi:before{content:"";position:absolute;left:0;top:17px;bottom:17px;width:2px;border-radius:2px;background:#d8dde5}
.tm-b2b .tm-b2b-kpi--accent:before,.tm-b2b .tm-b2b-kpi:hover:before{background:var(--tmv-red)}
.tm-b2b .tm-b2b-kpi:hover{transform:translateY(-2px);border-color:rgba(239,16,40,.19)!important;box-shadow:0 12px 28px rgba(15,23,42,.065)!important}
.tm-b2b .tm-b2b-kpi .label{color:#818895!important;font-size:9px!important;line-height:1!important;font-weight:800!important;letter-spacing:.65px!important;text-transform:uppercase}
.tm-b2b .tm-b2b-kpi .value{margin-top:11px!important;color:#171c25!important;font-size:24px!important;line-height:1!important;font-weight:900!important;letter-spacing:-.8px!important}
.tm-b2b .tm-b2b-kpi .value.red{color:var(--tmv-red)!important}
.tm-b2b .tm-b2b-kpi__hint{margin-top:8px!important;color:#9aa1ad!important;font-size:8.5px!important;line-height:1.45!important}

.tm-b2b .tm-b2b-dashboard-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:11px}
.tm-b2b .tm-b2b-dashboard-grid--client{grid-template-columns:1.4fr 1fr}
.tm-b2b .tm-b2b-card{
  min-width:0;padding:18px!important;border:1px solid var(--tmv-border)!important;border-radius:11px!important;background:#fff!important;box-shadow:0 7px 24px rgba(15,23,42,.035)!important;color:#111827!important
}
.tm-b2b .tm-b2b-card--soft{background:linear-gradient(180deg,#fff,#fcfcfd)!important}
.tm-b2b .tm-b2b-card h2,.tm-b2b .tm-b2b-card h3{color:#171c25!important;letter-spacing:-.35px}
.tm-b2b .tm-b2b-card h3{font-size:15px!important}
.tm-b2b .tm-b2b-section-head p,.tm-b2b .tm-b2b-subtitle{color:#858c98!important;font-size:10.5px!important}
.tm-b2b .tm-b2b-eyebrow{color:var(--tmv-red)!important;font-size:8px!important;font-weight:850!important;letter-spacing:1.25px!important}

/* buttons */
.tm-b2b .tm-b2b-btn,
.tm-b2b .tm-btn,
.tm-b2b button:not(.tm-b2b-nav__item):not(.tm-b2b-bell):not(.tm-b2b-nav-toggle):not(.tm-b2b-nav__close):not(.tm-b2b-nav-backdrop),
.tm-b2b input[type="submit"],
.tm-b2b .button,
.tm-b2b a.button{
  min-height:37px;
  padding:0 12px;
  border-radius:7px!important;
  border:1px solid #dde1e7;
  background:#fff;
  color:#26303d!important;
  box-shadow:none;
  font-size:9px;
  line-height:1;
  font-weight:800;
  transition:.18s ease;
}
.tm-b2b .tm-b2b-btn:hover,.tm-b2b .tm-btn:hover,.tm-b2b .button:hover{background:#141a23;color:#fff!important;border-color:#141a23;filter:none!important}
.tm-b2b .tm-b2b-btn--primary,.tm-b2b .tm-btn-primary{background:linear-gradient(180deg,#f51a32,var(--tmv-red-2))!important;border-color:var(--tmv-red-2)!important;color:#fff!important;box-shadow:0 8px 18px rgba(239,16,40,.14)!important}
.tm-b2b .tm-b2b-btn--primary:hover,.tm-b2b .tm-btn-primary:hover{background:#c90a1e!important;border-color:#c90a1e!important;color:#fff!important}
.tm-b2b .tm-b2b-btn--danger{background:#fff4f5!important;color:#ba1728!important;border-color:#f0ccd2!important}
.tm-b2b .tm-b2b-btn--danger:hover{background:#ba1728!important;color:#fff!important}
.tm-b2b .tm-b2b-quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.tm-b2b .tm-b2b-quick-grid .tm-b2b-btn{width:100%;justify-content:center}

/* forms */
.tm-b2b input[type="text"],.tm-b2b input[type="email"],.tm-b2b input[type="password"],.tm-b2b input[type="number"],.tm-b2b input[type="search"],.tm-b2b input[type="url"],.tm-b2b input[type="tel"],.tm-b2b select,.tm-b2b textarea{
  min-height:40px;padding:8px 10px;border:1px solid #dfe3e8!important;border-radius:7px!important;background:#fff!important;color:#1b2230!important;box-shadow:none!important;font-size:11px!important;outline:none!important
}
.tm-b2b textarea{min-height:92px}
.tm-b2b input:focus,.tm-b2b select:focus,.tm-b2b textarea:focus{border-color:rgba(239,16,40,.55)!important;box-shadow:0 0 0 3px rgba(239,16,40,.07)!important}
.tm-b2b label{color:#5f6876!important;font-size:9px!important;font-weight:800!important}

/* tables */
.tm-b2b .tm-b2b-tablewrap,.tm-b2b .tm-table-wrap{border:1px solid var(--tmv-border);border-radius:9px;overflow:auto;background:#fff}
.tm-b2b .tm-b2b-table,.tm-b2b .tm-table{width:100%;border-collapse:collapse!important;table-layout:auto!important}
.tm-b2b .tm-b2b-table th,.tm-b2b .tm-table th{padding:10px!important;background:#f8f9fb!important;border-bottom:1px solid var(--tmv-border)!important;color:#737d8c!important;font-size:8px!important;line-height:1.2!important;font-weight:850!important;text-transform:uppercase;letter-spacing:.55px;white-space:nowrap}
.tm-b2b .tm-b2b-table td,.tm-b2b .tm-table td{padding:11px 10px!important;border-bottom:1px solid #f0f2f5!important;background:#fff!important;color:#333b48!important;font-size:10.5px!important;line-height:1.45!important;box-shadow:none!important}
.tm-b2b .tm-b2b-table tr:last-child td,.tm-b2b .tm-table tr:last-child td{border-bottom:0!important}
.tm-b2b .tm-b2b-table tbody tr:hover td,.tm-b2b .tm-table tbody tr:hover td{background:#fcfcfd!important}

/* system status */
.tm-b2b-system-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.tm-b2b-system-item{min-height:70px;padding:12px;border:1px solid var(--tmv-border);border-radius:8px;background:#fafbfc;display:flex;align-items:center;justify-content:space-between;gap:12px}
.tm-b2b-system-item__copy{min-width:0}
.tm-b2b-system-item__copy strong{display:block;color:#222a36;font-size:10px;line-height:1.25}
.tm-b2b-system-item__copy span{display:block;margin-top:4px;color:#939aa5;font-size:8.5px;line-height:1.35}
.tm-b2b-system-state{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;color:#5b6573;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.35px}
.tm-b2b-system-state i{width:6px;height:6px;border-radius:50%;background:#aab1bc}
.tm-b2b-system-state.is-ok i{background:var(--tmv-good);box-shadow:0 0 0 4px rgba(24,166,106,.09)}
.tm-b2b-system-state.is-warn i{background:var(--tmv-warn);box-shadow:0 0 0 4px rgba(230,161,22,.09)}
.tm-b2b-index-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
.tm-b2b-index-meta{color:#8f97a3;font-size:8.5px;line-height:1.55}

/* Search status on product admin */
.tm-b2b-products-status{margin-top:10px;min-height:16px;color:#7d8490;font-size:9px;font-weight:700}
.tm-b2b-products-status.is-success{color:var(--tmv-good)}
.tm-b2b-products-status.is-error{color:#bd1728}
.tm-b2b-product-image-preview{min-height:80px;margin-top:10px;padding:8px;border:1px dashed #dfe3e8;border-radius:8px;background:#fafbfc;display:flex;align-items:center;justify-content:center;color:#9ba2ad;font-size:9px}
.tm-b2b-product-image-preview img{max-width:100%;max-height:110px;object-fit:contain}

/* Powered badge */
.tm-b2b .tm-b2b-powered{position:fixed!important;right:16px!important;bottom:12px!important;z-index:40!important;padding:6px 9px!important;border:1px solid #e6e9ee!important;border-radius:6px!important;background:rgba(255,255,255,.92)!important;color:#8b929e!important;text-decoration:none!important;font-size:7px!important;box-shadow:0 5px 15px rgba(15,23,42,.04)!important}
.tm-b2b .tm-b2b-powered strong{color:#303846!important}

/* Standalone portal login */
.tm-portal-login{
  min-height:100vh;padding:28px;display:grid;place-items:center;
  background:
    radial-gradient(circle at 15% 15%,rgba(239,16,40,.16),transparent 25%),
    radial-gradient(circle at 85% 80%,rgba(239,16,40,.08),transparent 28%),
    linear-gradient(145deg,#090e15,#111925 70%,#0c1119);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
.tm-portal-login__card{width:min(480px,100%);padding:32px;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:rgba(17,24,35,.94);box-shadow:0 30px 80px rgba(0,0,0,.32);color:#fff}
.tm-portal-login__brand{display:flex;align-items:center;gap:11px;margin-bottom:34px}
.tm-portal-login__brand>span{width:42px;height:42px;display:grid;place-items:center;border-radius:11px;background:linear-gradient(135deg,#ff223e,#d90b21);box-shadow:0 12px 28px rgba(239,16,40,.26);font-size:12px;font-weight:900}
.tm-portal-login__brand div{display:flex;flex-direction:column;gap:3px}
.tm-portal-login__brand strong{color:#fff;font-size:16px}
.tm-portal-login__brand small{color:#7f8b9c;font-size:8px;text-transform:uppercase;letter-spacing:1.2px;font-weight:800}
.tm-portal-login__eyebrow{margin-bottom:9px;color:#f95466;font-size:8px;font-weight:850;letter-spacing:1.45px}
.tm-portal-login h1{margin:0 0 13px;color:#fff;font-size:31px;line-height:1.05;letter-spacing:-1.1px}
.tm-portal-login p{margin:0 0 18px;color:#aab3c0;font-size:11.5px;line-height:1.7}
.tm-portal-login__status{margin-bottom:20px;padding:10px 11px;border:1px solid rgba(255,255,255,.07);border-radius:8px;background:rgba(255,255,255,.03);display:flex;align-items:center;gap:8px;color:#91a0b3;font-size:9px;font-weight:700}
.tm-portal-login__status span{width:6px;height:6px;border-radius:50%;background:var(--tmv-good);box-shadow:0 0 0 4px rgba(24,166,106,.09)}
.tm-portal-login .tm-b2b-btn{width:100%;min-height:44px;border:1px solid #d90b21;border-radius:8px;background:linear-gradient(180deg,#f51a32,#d90b21);color:#fff;font-size:10px;font-weight:850;cursor:pointer}
.tm-portal-login__links{margin-top:16px;display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.tm-portal-login__links a{color:#8794a7;text-decoration:none;font-size:9px;font-weight:700}.tm-portal-login__links a:hover{color:#fff}

/* Auth modal polish */
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-modal__panel{border-radius:13px!important;border:1px solid #e6e8ed!important;box-shadow:0 25px 80px rgba(10,14,20,.22)!important}
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-modal__header{background:#fff!important;border-bottom:1px solid #eceef1!important}
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-modal__title{color:#171c25!important;font-weight:900!important}
.tm-b2b-auth-tab{border-radius:7px!important;font-size:9px!important;font-weight:800!important}.tm-b2b-auth-tab.is-active{background:var(--tmv-red)!important;color:#fff!important}

/* Responsive */
@media(max-width:1200px){
  .tm-b2b .tm-b2b-layout{grid-template-columns:232px minmax(0,1fr)}
  .tm-b2b .tm-b2b-kpis--admin{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tm-b2b .tm-b2b-top .tm-b2b-meta,.tm-b2b .tm-b2b-pill--company{display:none!important}
  .tm-b2b .tm-b2b-dashboard-grid{grid-template-columns:1fr 1fr}
  .tm-b2b .tm-b2b-dashboard-grid>*:first-child{grid-column:1/-1}
}

@media(max-width:900px){
  .tm-b2b .tm-b2b-layout{display:block;min-height:100vh}
  .tm-b2b .tm-b2b-nav{
    position:fixed;left:0;top:0;bottom:0;z-index:70;width:min(290px,86vw);height:100dvh;max-height:none;
    transform:translate3d(-102%,0,0);transition:transform .28s cubic-bezier(.22,.61,.36,1);box-shadow:18px 0 50px rgba(0,0,0,.18)
  }
  .tm-b2b.is-nav-open .tm-b2b-nav{transform:translate3d(0,0,0)}
  .tm-b2b.is-nav-open .tm-b2b-nav-backdrop{display:block}
  .tm-b2b .tm-b2b-nav__close{display:grid!important;place-items:center!important}
  .tm-b2b .tm-b2b-nav-toggle{display:flex!important}
  .tm-b2b .tm-b2b-top{padding:10px 14px;min-height:66px}
  .tm-b2b .tm-b2b-system-live,.tm-b2b .tm-b2b-top-shop span,.tm-b2b .tm-b2b-pill{display:none!important}
  .tm-b2b .tm-b2b-top-shop{width:36px;height:36px;min-height:36px;padding:0;justify-content:center}
  .tm-b2b .tm-b2b-main{padding:14px}
  .tm-b2b .tm-b2b-kpis,.tm-b2b .tm-b2b-kpis--admin{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tm-b2b .tm-b2b-dashboard-grid,.tm-b2b .tm-b2b-dashboard-grid--client{grid-template-columns:1fr}
  .tm-b2b .tm-b2b-dashboard-grid>*:first-child{grid-column:auto}
  .tm-b2b-system-grid{grid-template-columns:1fr}
}

@media(max-width:620px){
  .tm-b2b .tm-b2b-main{padding:10px}
  .tm-b2b .tm-b2b-top{gap:8px}
  .tm-b2b .tm-b2b-breadcrumbs b{max-width:140px}
  .tm-b2b .tm-b2b-top__right{gap:5px}
  .tm-b2b .tm-b2b-avatar{display:none}
  .tm-b2b .tm-b2b-btn--logout{width:36px!important;min-width:36px!important;padding:0!important;font-size:0!important}
  .tm-b2b .tm-b2b-btn--logout:after{content:"↪";font-size:14px}
  .tm-b2b .tm-b2b-kpis,.tm-b2b .tm-b2b-kpis--admin{grid-template-columns:1fr 1fr;gap:8px}
  .tm-b2b .tm-b2b-kpi{min-height:98px;padding:14px!important}
  .tm-b2b .tm-b2b-kpi .value{font-size:20px!important}
  .tm-b2b .tm-b2b-hero{min-height:135px;padding:20px!important}
  .tm-b2b .tm-b2b-hero h2{font-size:24px!important}
  .tm-b2b .tm-b2b-card{padding:14px!important;border-radius:9px!important}
  .tm-b2b .tm-b2b-quick-grid{grid-template-columns:1fr}
  .tm-b2b .tm-b2b-powered{display:none!important}
  .tm-portal-login{padding:14px}.tm-portal-login__card{padding:23px 18px;border-radius:12px}.tm-portal-login h1{font-size:27px}
}

@media(max-width:390px){
  .tm-b2b .tm-b2b-kpis,.tm-b2b .tm-b2b-kpis--admin{grid-template-columns:1fr}
  .tm-b2b .tm-b2b-breadcrumbs b{max-width:105px}
}

@media(prefers-reduced-motion:reduce){
  .tm-b2b *, .tm-b2b *:before,.tm-b2b *:after,.tm-portal-login *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* portal.topmatic.at is an admin-only surface; customer registration remains available on the normal site header/client portal. */
body.tm-b2b-standalone-portal .tm-b2b-auth-tab[data-tm-auth-tab="register"],
body.tm-b2b-standalone-portal .tm-b2b-auth-panel[data-tm-auth-panel="register"]{display:none!important}
body.tm-b2b-standalone-portal .tm-b2b-auth-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}

/* ============================================================
   TOPMATIC B2B ENTERPRISE 10.2
   APT-style information architecture, TopMatic white/red identity
   ============================================================ */

:root{
  --tmv-red:#e71919;
  --tmv-red-2:#c81010;
  --tmv-red-soft:#fff3f4;
  --tmv-ink:#141414;
  --tmv-ink-2:#232323;
  --tmv-side:#ffffff;
  --tmv-side-2:#ffffff;
  --tmv-bg:#f5f5f5;
  --tmv-panel:#ffffff;
  --tmv-border:#e4e4e4;
  --tmv-muted:#777b84;
  --tmv-good:#15965f;
  --tmv-warn:#d98b12;
  --tmv-shadow:0 14px 40px rgba(17,24,39,.055);
}

body.tm-b2b-standalone-portal,
.tm-portal-host-shell,
.tm-b2b.tm-b2b-portal,
.tm-b2b .tm-b2b-layout,
.tm-b2b .tm-b2b-workspace,
.tm-b2b .tm-b2b-main{
  background:var(--tmv-bg)!important;
}

/* Fixed, non-scrolling desktop navigation. The workspace is the only page scroll. */
.tm-b2b .tm-b2b-nav{
  position:sticky!important;
  top:0!important;
  height:100dvh!important;
  max-height:100dvh!important;
  overflow:hidden!important;
  padding:15px 12px 13px!important;
  border-right:1px solid #e5e5e5!important;
  background:#fff!important;
  box-shadow:8px 0 28px rgba(17,24,39,.025)!important;
  scrollbar-width:none!important;
}
.tm-b2b .tm-b2b-nav::-webkit-scrollbar{display:none!important}

.tm-b2b .tm-b2b-nav__brand{
  min-height:58px!important;
  margin:0 3px 13px!important;
  padding:0 5px 13px!important;
  border-bottom:1px solid #ececec!important;
}
.tm-b2b .tm-b2b-nav__logo{color:#181818!important}
.tm-b2b .tm-b2b-nav__mark{
  width:38px!important;height:38px!important;flex-basis:38px!important;
  border-radius:9px!important;
  background:linear-gradient(145deg,#f31c31,#d80f23)!important;
  box-shadow:0 9px 22px rgba(231,25,25,.18)!important;
}
.tm-b2b .tm-b2b-nav__brandcopy strong{color:#171717!important;font-size:14px!important;font-weight:900!important}
.tm-b2b .tm-b2b-nav__brandcopy small{color:#a3a3a8!important;font-size:8px!important;letter-spacing:1.15px!important}
.tm-b2b .tm-b2b-nav__close{border-color:#e7e7e7!important;background:#fff!important;color:#333!important}

.tm-b2b .tm-b2b-nav__head{
  margin:0 10px 6px!important;
  color:#a0a0a6!important;
  font-size:8px!important;
  letter-spacing:1.4px!important;
}
.tm-b2b .tm-b2b-nav__head--secondary{margin-top:12px!important}
.tm-b2b .tm-b2b-nav__items{gap:3px!important}
.tm-b2b .tm-b2b-nav__item{
  min-height:38px!important;
  padding:0 10px!important;
  border-radius:8px!important;
  color:#606168!important;
  font-size:10px!important;
  font-weight:780!important;
}
.tm-b2b .tm-b2b-nav__item:hover,
.tm-b2b .tm-b2b-nav__item:focus{
  background:#fafafa!important;
  border-color:#eeeeee!important;
  color:#151515!important;
}
.tm-b2b .tm-b2b-nav__item.is-active{
  background:linear-gradient(90deg,#fff0f2,#fff8f8)!important;
  border-color:#f3d3d8!important;
  color:#171717!important;
}
.tm-b2b .tm-b2b-nav__item.is-active:before{
  left:-1px!important;top:7px!important;bottom:7px!important;width:3px!important;background:var(--tmv-red)!important
}
.tm-b2b .tm-b2b-nav__icon{color:#91939a!important}
.tm-b2b .tm-b2b-nav__item:hover .tm-b2b-nav__icon,
.tm-b2b .tm-b2b-nav__item.is-active .tm-b2b-nav__icon{color:var(--tmv-red)!important}
.tm-b2b .tm-b2b-nav__dot.is-on{background:var(--tmv-red)!important;box-shadow:0 0 0 4px rgba(231,25,25,.09)!important}

.tm-b2b .tm-b2b-nav__external{gap:2px!important}
.tm-b2b .tm-b2b-nav__external a{
  min-height:33px!important;
  padding:0 10px!important;
  border:1px solid transparent!important;
  border-radius:7px!important;
  color:#7b7d84!important;
  font-size:9px!important;
}
.tm-b2b .tm-b2b-nav__external a:hover{
  background:#fafafa!important;border-color:#ededed!important;color:#171717!important
}
.tm-b2b .tm-b2b-nav__external b{color:var(--tmv-red)!important}
.tm-b2b .tm-b2b-nav__footer{
  margin-top:auto!important;
  padding:11px 10px 1px!important;
  border-top:1px solid #ededed!important;
  gap:5px!important;
}
.tm-b2b .tm-b2b-nav__footer small{color:#aaa!important;font-size:7px!important}
.tm-b2b .tm-b2b-nav__status{color:#787b82!important;font-size:8px!important}

/* Compact mode for short laptop screens – no sidebar scrollbar. */
@media (min-width:901px) and (max-height:760px){
  .tm-b2b .tm-b2b-nav{padding-top:9px!important;padding-bottom:8px!important}
  .tm-b2b .tm-b2b-nav__brand{min-height:49px!important;margin-bottom:8px!important;padding-bottom:8px!important}
  .tm-b2b .tm-b2b-nav__mark{width:32px!important;height:32px!important;flex-basis:32px!important;font-size:10px!important}
  .tm-b2b .tm-b2b-nav__item{min-height:32px!important;font-size:9px!important}
  .tm-b2b .tm-b2b-nav__head--secondary{margin-top:7px!important}
  .tm-b2b .tm-b2b-nav__external a{min-height:28px!important;font-size:8px!important}
  .tm-b2b .tm-b2b-nav__footer{padding-top:7px!important;margin-top:6px!important}
}

/* Topbar: APT information density, TopMatic colors */
.tm-b2b .tm-b2b-top{
  min-height:70px!important;
  padding:10px 20px!important;
  border-bottom:1px solid #e5e5e5!important;
  background:rgba(255,255,255,.985)!important;
  box-shadow:0 3px 12px rgba(17,24,39,.02)!important;
}
.tm-b2b .tm-b2b-breadcrumbs a{color:var(--tmv-red)!important}
.tm-b2b .tm-b2b-breadcrumbs b{color:#181818!important}
.tm-b2b .tm-b2b-kicker{color:#9b9ca2!important}
.tm-b2b .tm-b2b-system-live{border-color:#daf0e5!important;background:#f6fcf9!important;color:#3e7f63!important}
.tm-b2b .tm-b2b-top-shop{background:#191919!important;border-color:#191919!important}
.tm-b2b .tm-b2b-top-shop:hover{background:var(--tmv-red)!important;border-color:var(--tmv-red)!important}

/* Main content is the scrolling surface; sidebar stays fixed. */
.tm-b2b .tm-b2b-workspace{min-height:100dvh!important}
.tm-b2b .tm-b2b-main{
  min-height:calc(100dvh - 70px)!important;
  padding:18px 20px 40px!important;
  overflow:visible!important;
}

/* Dashboard hero becomes white – same logic as APT, TopMatic identity. */
.tm-b2b .tm-b2b-hero{
  min-height:136px!important;
  padding:22px 24px!important;
  border:1px solid #e2e2e2!important;
  border-radius:11px!important;
  background:
    radial-gradient(circle at 92% 12%,rgba(231,25,25,.085),transparent 31%),
    linear-gradient(135deg,#ffffff,#fafafa 75%)!important;
  box-shadow:0 9px 28px rgba(17,24,39,.04)!important;
  color:#181818!important;
}
.tm-b2b .tm-b2b-hero:after{border-color:rgba(231,25,25,.06)!important;box-shadow:0 0 0 45px rgba(231,25,25,.015),0 0 0 90px rgba(231,25,25,.008)!important}
.tm-b2b .tm-b2b-hero__eyebrow{color:var(--tmv-red)!important}
.tm-b2b .tm-b2b-hero h2{color:#171717!important;font-size:27px!important}
.tm-b2b .tm-b2b-hero p{color:#70737b!important}
.tm-b2b .tm-b2b-hero--client{background:radial-gradient(circle at 90% 10%,rgba(231,25,25,.09),transparent 34%),linear-gradient(135deg,#fff,#fbfbfb 74%)!important}

/* KPI cards: stronger hierarchy and clean currency rendering */
.tm-b2b .tm-b2b-kpi{
  min-height:118px!important;
  border-color:#e2e2e2!important;
  box-shadow:0 6px 18px rgba(17,24,39,.03)!important;
}
.tm-b2b .tm-b2b-kpi:before{background:#dedede!important}
.tm-b2b .tm-b2b-kpi--accent:before,.tm-b2b .tm-b2b-kpi:hover:before{background:var(--tmv-red)!important}
.tm-b2b .tm-b2b-kpi .label{color:#85868c!important}
.tm-b2b .tm-b2b-kpi .value{
  margin-top:10px!important;
  color:#171717!important;
  font-size:27px!important;
  font-variant-numeric:tabular-nums!important;
  white-space:nowrap!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
}
.tm-b2b .tm-b2b-kpi__hint{color:#9b9ca3!important}

/* APT-like page title strip for every functional area */
.tm-b2b .tm-b2b-page-head{
  margin-bottom:12px;
  padding:17px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border:1px solid #e3e3e3;
  border-radius:10px;
  background:#fff;
  box-shadow:0 5px 16px rgba(17,24,39,.025);
}
.tm-b2b .tm-b2b-page-head__copy{min-width:0}
.tm-b2b .tm-b2b-page-head__eyebrow{display:block;margin-bottom:5px;color:var(--tmv-red);font-size:8px;font-weight:900;letter-spacing:1.25px;text-transform:uppercase}
.tm-b2b .tm-b2b-page-head h2{margin:0!important;color:#171717!important;font-size:20px!important;line-height:1.15!important;letter-spacing:-.5px!important}
.tm-b2b .tm-b2b-page-head p{margin:5px 0 0!important;max-width:720px;color:#85868d!important;font-size:9.5px!important;line-height:1.5!important}
.tm-b2b .tm-b2b-page-head__actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}

/* Generic panels and section heads */
.tm-b2b .tm-b2b-card{border-color:#e2e2e2!important;border-radius:10px!important;box-shadow:0 6px 20px rgba(17,24,39,.03)!important}
.tm-b2b .tm-b2b-section-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:16px!important;margin-bottom:14px!important;padding-bottom:12px!important;border-bottom:1px solid #ededed!important}
.tm-b2b .tm-b2b-section-head h3{margin:0!important;color:#171717!important;font-size:14px!important;font-weight:900!important}
.tm-b2b .tm-b2b-section-head p{margin:4px 0 0!important;color:#888a91!important;font-size:9px!important;line-height:1.45!important}
.tm-b2b .tm-b2b-toolbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.tm-b2b .tm-b2b-search{min-width:220px!important}

/* Customer/registration/order cards become compact ERP rows. */
.tm-b2b .tm-b2b-regcard,.tm-b2b .tm-b2b-ordercard,.tm-b2b .tm-b2b-doccard{
  border:1px solid #e4e4e4!important;
  border-radius:9px!important;
  background:#fff!important;
  box-shadow:none!important;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease!important;
}
.tm-b2b .tm-b2b-regcard:hover,.tm-b2b .tm-b2b-ordercard:hover,.tm-b2b .tm-b2b-doccard:hover{
  border-color:#efd0d4!important;box-shadow:0 7px 18px rgba(17,24,39,.04)!important;transform:translateY(-1px)!important
}

/* Analytics */
.tm-b2b .tm-b2b-analytics-grid{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr);
  gap:11px;
}
.tm-b2b .tm-b2b-analytics-card{min-height:280px!important;padding:18px!important}
.tm-b2b .tm-b2b-chart-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.tm-b2b .tm-b2b-chart-head h3{margin:0!important;color:#171717!important;font-size:14px!important}
.tm-b2b .tm-b2b-chart-head p{margin:4px 0 0!important;color:#92949a!important;font-size:8.5px!important}
.tm-b2b .tm-b2b-chart-total{text-align:right}
.tm-b2b .tm-b2b-chart-total span{display:block;color:#9b9ca2;font-size:7.5px;font-weight:850;text-transform:uppercase;letter-spacing:.7px}
.tm-b2b .tm-b2b-chart-total strong{display:block;margin-top:4px;color:#171717;font-size:18px;font-weight:950;font-variant-numeric:tabular-nums}
.tm-b2b .tm-b2b-chart{position:relative;height:190px;overflow:hidden;border:1px solid #ececec;border-radius:9px;background:linear-gradient(180deg,#fff,#fcfcfc)}
.tm-b2b .tm-b2b-chart svg{display:block;width:100%;height:100%}
.tm-b2b .tm-b2b-chart-grid line{stroke:#efefef;stroke-width:1}
.tm-b2b .tm-b2b-chart-line{fill:none;stroke:var(--tmv-red);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:800;stroke-dashoffset:800;animation:tmvChartDraw .9s ease forwards}
.tm-b2b .tm-b2b-chart-area{fill:url(#tmvRevenueFill);opacity:.9}
.tm-b2b .tm-b2b-chart-dot{fill:#fff;stroke:var(--tmv-red);stroke-width:2;vector-effect:non-scaling-stroke}
@keyframes tmvChartDraw{to{stroke-dashoffset:0}}
.tm-b2b .tm-b2b-chart-labels{display:flex;justify-content:space-between;gap:4px;margin-top:7px;color:#a0a1a7;font-size:7px;font-weight:750}
.tm-b2b .tm-b2b-status-bars{display:grid;gap:10px;margin-top:4px}
.tm-b2b .tm-b2b-status-row{display:grid;grid-template-columns:90px minmax(0,1fr) 32px;align-items:center;gap:8px}
.tm-b2b .tm-b2b-status-row>span{color:#74767e;font-size:8.5px;font-weight:750}
.tm-b2b .tm-b2b-status-track{height:7px;overflow:hidden;border-radius:10px;background:#f0f0f0}
.tm-b2b .tm-b2b-status-track i{display:block;height:100%;width:0;border-radius:10px;background:linear-gradient(90deg,#e71919,#ff4a59);transition:width .7s cubic-bezier(.22,.61,.36,1)}
.tm-b2b .tm-b2b-status-row b{text-align:right;color:#2e3035;font-size:9px;font-variant-numeric:tabular-nums}
.tm-b2b .tm-b2b-sync-strip{margin-top:12px;padding:10px 11px;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #ededed;border-radius:8px;background:#fafafa;color:#7c7e85;font-size:8px}
.tm-b2b .tm-b2b-sync-strip strong{color:#171717;font-size:8.5px}

/* Message reliability indicator */
.tm-b2b .tm-b2b-live-sync{display:inline-flex;align-items:center;gap:6px;min-height:27px;padding:0 9px;border:1px solid #dceee5;border-radius:999px;background:#f6fcf9;color:#4c7a65;font-size:7.5px;font-weight:850;text-transform:uppercase;letter-spacing:.5px}
.tm-b2b .tm-b2b-live-sync i{width:5px;height:5px;border-radius:50%;background:var(--tmv-good);box-shadow:0 0 0 4px rgba(21,150,95,.08)}

/* Modal and registration scroll on every device. */
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-modal__panel{
  max-height:calc(100dvh - 28px)!important;
  margin:14px auto!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-modal__header{flex:0 0 auto!important}
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-modal__body{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
}
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-tabs{position:sticky;top:-1px;z-index:3;background:#f7f7f8!important}

/* Mobile */
@media(max-width:1200px){
  .tm-b2b .tm-b2b-layout{grid-template-columns:222px minmax(0,1fr)!important}
}

@media(max-width:900px){
  .tm-b2b .tm-b2b-layout{display:block!important}
  .tm-b2b .tm-b2b-nav{
    position:fixed!important;
    left:0!important;top:0!important;bottom:0!important;
    width:min(280px,88vw)!important;
    height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
    transform:translate3d(-102%,0,0)!important;
    box-shadow:18px 0 50px rgba(0,0,0,.14)!important;
  }
  .tm-b2b.is-nav-open .tm-b2b-nav{transform:translate3d(0,0,0)!important}
  .tm-b2b .tm-b2b-nav__item{min-height:36px!important}
  .tm-b2b .tm-b2b-nav__external a{min-height:31px!important}
  .tm-b2b .tm-b2b-analytics-grid{grid-template-columns:1fr!important}
  .tm-b2b .tm-b2b-page-head{align-items:flex-start!important;flex-direction:column!important}
  .tm-b2b .tm-b2b-page-head__actions{width:100%;justify-content:flex-start!important}
}

@media(max-width:620px){
  .tm-b2b .tm-b2b-main{padding:10px 10px 30px!important}
  .tm-b2b .tm-b2b-page-head{padding:14px!important}
  .tm-b2b .tm-b2b-page-head h2{font-size:18px!important}
  .tm-b2b .tm-b2b-page-head__actions .tm-b2b-btn,.tm-b2b .tm-b2b-page-head__actions .tm-b2b-search{width:100%!important;min-width:0!important}
  .tm-b2b .tm-b2b-kpi .value{font-size:19px!important}
  .tm-b2b .tm-b2b-chart{height:165px}
  .tm-b2b .tm-b2b-status-row{grid-template-columns:78px minmax(0,1fr) 27px}
  .tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-modal__panel{width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px)!important;margin:8px auto!important;border-radius:11px!important}
  .tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-tab{padding:0 4px!important;font-size:7px!important;letter-spacing:.2px!important}
}

@media(max-width:390px){
  .tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-tabs{grid-template-columns:1fr!important;position:static!important}
}

@media(prefers-reduced-motion:reduce){
  .tm-b2b .tm-b2b-chart-line{animation:none!important;stroke-dasharray:none!important;stroke-dashoffset:0!important}
}

/* Frontend shortcode portals always use the full application viewport, even if
   the Elementor/WordPress page content is constrained to a normal content width. */
.tm-b2b.tm-b2b-portal{
  position:relative!important;
  left:50%!important;
  width:100vw!important;
  max-width:100vw!important;
  margin-left:-50vw!important;
  margin-right:-50vw!important;
}
body.tm-b2b-standalone-portal .tm-b2b.tm-b2b-portal{
  left:auto!important;margin-left:0!important;margin-right:0!important;
}

/* Normalize legacy inline/dark utility surfaces to TopMatic white/red. */
.tm-b2b .tm-b2b-typeahead,
.tm-b2b .tm-b2b-suggest{
  background:#fff!important;
  color:#262626!important;
  border:1px solid #e2e2e2!important;
  box-shadow:0 14px 34px rgba(17,24,39,.10)!important;
}
.tm-b2b .tm-b2b-typeahead [data-tm-ship-prod-pick]{border-bottom-color:#eeeeee!important;color:#262626!important}
.tm-b2b .tm-b2b-typeahead [data-tm-ship-prod-pick]:hover{background:#fff4f5!important;color:#171717!important}

/* ============================================================
   v10.2 final portal ergonomics
   - the navigation rail never scrolls
   - only the right workspace scrolls
   - light TopMatic identity for every portal/auth surface
   ============================================================ */

.tm-b2b.tm-b2b-portal{
  height:100dvh!important;
  min-height:0!important;
  overflow:hidden!important;
}
.tm-b2b .tm-b2b-layout{
  height:100dvh!important;
  min-height:0!important;
  overflow:hidden!important;
  align-items:stretch!important;
}
.tm-b2b .tm-b2b-nav{
  position:relative!important;
  top:auto!important;
  align-self:stretch!important;
  height:100%!important;
  max-height:100%!important;
  min-height:0!important;
  overflow:hidden!important;
}
.tm-b2b .tm-b2b-workspace{
  height:100%!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-gutter:stable;
}
.tm-b2b .tm-b2b-main{
  min-height:calc(100% - 70px)!important;
  overflow:visible!important;
}
.tm-b2b .tm-b2b-top{
  position:sticky!important;
  top:0!important;
  z-index:58!important;
}

/* The sidebar must fit even on short laptop screens; it never gets its own scrollbar. */
@media (min-width:901px) and (max-height:650px){
  .tm-b2b .tm-b2b-nav{padding:7px 9px 6px!important}
  .tm-b2b .tm-b2b-nav__brand{min-height:42px!important;margin-bottom:5px!important;padding-bottom:5px!important}
  .tm-b2b .tm-b2b-nav__mark{width:29px!important;height:29px!important;flex-basis:29px!important;font-size:8px!important}
  .tm-b2b .tm-b2b-nav__brandcopy strong{font-size:12px!important}
  .tm-b2b .tm-b2b-nav__brandcopy small{font-size:6.5px!important;margin-top:2px!important}
  .tm-b2b .tm-b2b-nav__head{margin-bottom:3px!important;font-size:6.8px!important}
  .tm-b2b .tm-b2b-nav__head--secondary{margin-top:4px!important}
  .tm-b2b .tm-b2b-nav__items{gap:1px!important}
  .tm-b2b .tm-b2b-nav__item{min-height:27px!important;padding:0 8px!important;font-size:8px!important;border-radius:6px!important}
  .tm-b2b .tm-b2b-nav__icon{width:13px!important;height:13px!important;flex-basis:13px!important}
  .tm-b2b .tm-b2b-nav__external{gap:0!important}
  .tm-b2b .tm-b2b-nav__external a{min-height:23px!important;padding:0 8px!important;font-size:7px!important}
  .tm-b2b .tm-b2b-nav__footer{margin-top:3px!important;padding:5px 8px 0!important;gap:2px!important}
  .tm-b2b .tm-b2b-nav__footer small{display:none!important}
  .tm-b2b .tm-b2b-nav__status{font-size:6.8px!important}
}

/* Standalone login follows the same light TopMatic system instead of the old dark shell. */
.tm-portal-login{
  background:
    radial-gradient(circle at 15% 12%,rgba(231,25,25,.08),transparent 28%),
    radial-gradient(circle at 88% 88%,rgba(231,25,25,.04),transparent 30%),
    #f5f5f5!important;
}
.tm-portal-login__card{
  border:1px solid #e3e3e3!important;
  background:#fff!important;
  box-shadow:0 24px 70px rgba(17,24,39,.10)!important;
  color:#171717!important;
}
.tm-portal-login__brand strong,.tm-portal-login h1{color:#171717!important}
.tm-portal-login__brand small,.tm-portal-login p,.tm-portal-login__links a{color:#7b7d84!important}
.tm-portal-login__status{border-color:#e7e7e7!important;background:#fafafa!important;color:#627068!important}
.tm-portal-login__links a:hover{color:var(--tmv-red)!important}

/* Customer management dashboard: compact ERP metrics above the customer table. */
.tm-b2b .tm-b2b-mini-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
  margin-bottom:11px;
}
.tm-b2b .tm-b2b-mini-kpi{
  min-width:0;
  min-height:82px;
  padding:13px 14px;
  border:1px solid #e3e3e3;
  border-radius:9px;
  background:#fff;
  box-shadow:0 5px 16px rgba(17,24,39,.025);
}
.tm-b2b .tm-b2b-mini-kpi span{
  display:block;
  color:#909198;
  font-size:7.5px;
  line-height:1.2;
  font-weight:850;
  letter-spacing:.65px;
  text-transform:uppercase;
}
.tm-b2b .tm-b2b-mini-kpi strong{
  display:block;
  margin-top:8px;
  color:#171717;
  font-size:21px;
  line-height:1;
  font-weight:950;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.tm-b2b .tm-b2b-mini-kpi.is-accent{border-color:#efd3d7;background:linear-gradient(145deg,#fff,#fff7f8)}
.tm-b2b .tm-b2b-mini-kpi.is-accent strong{color:var(--tmv-red)}
.tm-b2b .tm-b2b-customer-company{display:flex;align-items:center;gap:9px;min-width:150px}
.tm-b2b .tm-b2b-customer-logo{
  width:34px;height:34px;flex:0 0 34px;display:grid;place-items:center;overflow:hidden;
  border:1px solid #e6e6e6;border-radius:8px;background:#fafafa;color:#9a9a9f;font-size:8px;font-weight:900
}
.tm-b2b .tm-b2b-customer-logo img{width:100%;height:100%;object-fit:contain;padding:2px}
.tm-b2b .tm-b2b-customer-company strong{display:block;overflow:hidden;text-overflow:ellipsis;color:#1f2227;font-size:10.5px;white-space:nowrap}
.tm-b2b .tm-b2b-customer-company small{display:block;margin-top:3px;color:#999ba1;font-size:7.5px;font-weight:700;text-transform:uppercase;letter-spacing:.35px}
.tm-b2b .tm-b2b-role-pill{
  display:inline-flex;align-items:center;min-height:23px;padding:0 7px;border:1px solid #e5e5e5;border-radius:999px;
  background:#fafafa;color:#74767d;font-size:7px;font-weight:850;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap
}
.tm-b2b .tm-b2b-role-pill.is-admin{border-color:#f1d0d5;background:#fff4f5;color:#c80f23}
.tm-b2b .tm-b2b-customer-actions{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-wrap:wrap;min-width:220px}

@media(max-width:900px){
  .tm-b2b.tm-b2b-portal,.tm-b2b .tm-b2b-layout{height:100dvh!important}
  .tm-b2b .tm-b2b-workspace{height:100%!important}
  .tm-b2b .tm-b2b-nav{position:fixed!important;height:100dvh!important;max-height:100dvh!important;overflow:hidden!important}
  .tm-b2b .tm-b2b-mini-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:520px){
  .tm-b2b .tm-b2b-mini-kpis{grid-template-columns:1fr 1fr;gap:7px}
  .tm-b2b .tm-b2b-mini-kpi{min-height:70px;padding:11px}
  .tm-b2b .tm-b2b-mini-kpi strong{font-size:17px}
  .tm-b2b .tm-b2b-customer-actions{min-width:190px}
}

/* Respect the standard WordPress admin toolbar height without letting the portal
   itself create a second page scrollbar for logged-in administrators. */
body.admin-bar .tm-b2b.tm-b2b-portal,
body.admin-bar .tm-b2b.tm-b2b-portal .tm-b2b-layout{height:calc(100dvh - 32px)!important}
@media(max-width:782px){
  body.admin-bar .tm-b2b.tm-b2b-portal,
  body.admin-bar .tm-b2b.tm-b2b-portal .tm-b2b-layout{height:calc(100dvh - 46px)!important}
}
body.tm-b2b-standalone-portal .tm-b2b.tm-b2b-portal,
body.tm-b2b-standalone-portal .tm-b2b.tm-b2b-portal .tm-b2b-layout{height:100dvh!important}

/* ============================================================
   v10.2.4 – final auth contrast + mobile ergonomics
   ============================================================ */
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-tab:hover,
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-tab.is-active,
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-btn:hover,
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-iconbtn:hover{
  background:var(--tmv-red,#ef1028)!important;
  border-color:var(--tmv-red,#ef1028)!important;
  color:#fff!important;
}
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-btn--primary:hover{background:#c90a1e!important;border-color:#c90a1e!important;color:#fff!important}
.tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-modal__body{overflow:auto!important;overscroll-behavior:contain!important}
@media(max-width:600px){
  .tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important;position:sticky!important;top:0!important}
  .tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-tabs--admin{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-panel .tm-b2b-row{display:grid!important;grid-template-columns:1fr!important}
  .tm-b2b-modal[data-tm-b2b-modal] .tm-b2b-auth-panel .tm-b2b-row .tm-b2b-field{width:100%!important;min-width:0!important}
}