/* Shared portal presentation. Source of truth: staff/menu.php. */
:root {
  --klasse-green:#94c83d; --klasse-green-dark:#6fa52b; --klasse-green-light:#f0f7e7;
  --klasse-navy:#142542; --klasse-text:#344767; --klasse-muted:#6c7585;
  --klasse-border:#dde2e8; --klasse-border-strong:#d7dce2; --klasse-bg:#eef1f4;
}
body.klasse-portal:where(:not([data-theme="dark"] *)) {
  --bg:#eef1f4; --panel:#fff; --surface:#fff; --bg-elevated:#fff; --card-bg:#fff;
  --ink:#142542; --navy:#142542; --text:#344767; --black:#142542; --dark:#142542;
  --muted:#6c7585; --ink-soft:#6c7585; --ink-muted:#6c7585;
  --line:#dde2e8; --line2:#d7dce2; --line-strong:#d7dce2;
  --border:#dde2e8; --card-border:#dde2e8; --card-border-strong:#d7dce2;
  --accent:#6fa52b; --accent2:#94c83d; --accent-bright:#94c83d; --accent-deep:#527c20;
  --accent-soft:#f0f7e7; --accent-ink:#fff; --green:#94c83d; --green-hover:#6fa52b;
  --brand-grey:#142542; --brand-green:#94c83d; --focus:#6fa52b;
  --dark-btn:#142542; --dark-btn-contrast:#fff;
  --font-display:'Inter','Segoe UI',Arial,sans-serif;
  --font-body:'Inter','Segoe UI',Arial,sans-serif;
  --sans:'Inter','Segoe UI',Arial,sans-serif;
  --mono:'Inter','Segoe UI',Arial,sans-serif; --font-mono:'Inter','Segoe UI',Arial,sans-serif;
  --radius:16px; --shadow:0 18px 50px rgba(20,37,66,.17);
  margin:0; min-height:100vh; color:var(--klasse-navy);
  font-family:Inter,'Segoe UI',Arial,sans-serif; line-height:1.5;
  background-color:#eef1f4 !important; background-position:center; background-size:cover; background-attachment:fixed; background-repeat:no-repeat;
  -webkit-font-smoothing:antialiased;
}
body.klasse-portal:where(:not([data-theme="dark"] *)) {
  background-image:linear-gradient(rgba(255,255,255,.38),rgba(255,255,255,.38)),url('../img/klasse-background.jpg') !important;
}
.klasse-portal:where(:not([data-theme="dark"] *)) *, .klasse-portal:where(:not([data-theme="dark"] *)) *::before, .klasse-portal:where(:not([data-theme="dark"] *)) *::after { box-sizing:border-box; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(button,input,select,textarea) { font-family:inherit; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(img,svg,canvas) { max-width:100%; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(a,button,input,select,textarea,summary):focus-visible { outline:3px solid var(--klasse-green-dark); outline-offset:3px; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(button,input[type=submit]):disabled { opacity:.55; cursor:not-allowed; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(input[type=checkbox],input[type=radio]) { accent-color:var(--klasse-green-dark); }
.klasse-portal:where(:not([data-theme="dark"] *)):not(.portal-menu) :is(h1,h2,h3,h4,h5,h6) { color:var(--klasse-navy); font-family:inherit; font-weight:800; line-height:1.2; overflow-wrap:anywhere; }
.klasse-portal:where(:not([data-theme="dark"] *)):not(.portal-menu) h1 { font-size:clamp(29px,3.3vw,46px); letter-spacing:-1px; }
.klasse-portal:where(:not([data-theme="dark"] *)):not(.portal-menu) :is(h2,.page-heading,.project-heading) { font-size:clamp(23px,2.3vw,28px); }
.klasse-portal:where(:not([data-theme="dark"] *)):not(.portal-menu) h3 { font-size:clamp(21px,2vw,26px); }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.text-secondary,.muted,.sub,.brand-sub,.project-reference,.project-name,.small-text) { color:var(--klasse-muted) !important; }
/* Existing containers retain their widths and interactive layout rules. */
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.portal-container,.page-wrap,.wrap,.app,.app-shell,.shell) { min-width:0; max-width:calc(100% - 32px); }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.portal-container,.page-wrap,.wrap) { margin-left:auto; margin-right:auto; padding-top:64px; padding-bottom:64px; }
.klasse-portal:where(:not([data-theme="dark"] *)) .container-fluid.py-4 { width:min(1400px,calc(100% - 48px)); margin:auto; padding-top:44px !important; padding-bottom:44px !important; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.card,.portal-card,.card-box,.panel,.sheet,.result-card,.hero-card,.stat-card,.kpi,.file-card,.page-header-box,.page-box,.hero) {
  background:rgba(255,255,255,.97); border:1px solid var(--klasse-border); border-radius:16px;
  box-shadow:0 8px 24px rgba(20,37,66,.09); color:var(--klasse-navy);
}
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.folder-card,.document-row,.section-card,.task-card,.category-tile) { border-color:var(--klasse-border); border-radius:12px; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.card-body,.portal-card-body) { padding:28px 32px; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.page-box,.hero) :is(.text-white,.text-white-50) { color:var(--klasse-navy) !important; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.page-box,.hero) p { color:var(--klasse-muted) !important; }
/* Replace legacy floating logo strips with a white, divided card header. */
.klasse-portal:where(:not([data-theme="dark"] *)) .card-header.mt-n4 { margin:0 !important; padding:20px 32px !important; border-bottom:1px solid var(--klasse-border); border-radius:16px 16px 0 0; }
.klasse-portal:where(:not([data-theme="dark"] *)) .card-header .bg-gradient-dark { background:#fff !important; box-shadow:none !important; padding:0 !important; }
.klasse-portal:where(:not([data-theme="dark"] *)) .card-header img { width:140px; height:auto; }
.klasse-portal:where(:not([data-theme="dark"] *)) .page-header[style] { background-image:none !important; background:transparent; }
.klasse-portal:where(:not([data-theme="dark"] *)) .page-header > .mask { display:none; }
.klasse-portal:where(:not([data-theme="dark"] *)) .page-header > .container.my-auto { padding-top:64px; padding-bottom:64px; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.topbar,.header,header.bar,.tracking-header) {
  background:rgba(255,255,255,.97); color:var(--klasse-navy); border-color:var(--klasse-border);
}
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.topbar,.header) { min-height:78px; height:auto; align-items:center; gap:18px; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.header,.topbar) :is(.brand,.brand-wrap) { min-width:0; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.header,.topbar) :is(.brand-logo,.logo,.brand img) { width:140px; height:auto; object-fit:contain; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.header,.topbar) h1 { font-size:23px; letter-spacing:-.5px; }
.klasse-portal:where(:not([data-theme="dark"] *)) .brand-mark { border-radius:10px; background:var(--klasse-navy); }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.tabs,.view-toggle) { border-color:var(--klasse-border); }
.klasse-portal:where(:not([data-theme="dark"] *)):not(.portal-menu) :is(.tab,.view-btn,.filter-btn) { font-family:inherit; font-weight:700; text-transform:none; letter-spacing:0; border-radius:10px 10px 0 0; min-height:44px; }
.klasse-portal:where(:not([data-theme="dark"] *)):not(.portal-menu) :is(.tab.active,.view-btn.active,.filter-btn.active) {
  background:var(--klasse-green-light); color:var(--klasse-navy); border-color:var(--klasse-green-dark);
  box-shadow:inset 0 -3px var(--klasse-green-dark);
}
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.btn,.btn-primary,.btn-ghost,.btn-open,.back-to-menu,.back-menu,.back-button,.staff-login-btn,.pod-download-btn,.white-pod-btn) {
  border-radius:10px; font-family:inherit; font-size:14px; font-weight:700;
  text-transform:none; letter-spacing:0; min-height:44px; padding:10px 16px;
  text-decoration:none; transition:background .18s ease,border-color .18s ease;
}
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.btn-primary,.btn.primary,.btn-green,.bg-gradient-green,.btn-open) {
  background:var(--klasse-green-dark) !important; border-color:var(--klasse-green-dark) !important; color:#fff !important;
  box-shadow:none;
}
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.btn-primary,.btn.primary,.btn-green,.bg-gradient-green,.btn-open):hover { background:#5f9024 !important; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.back-to-menu,.back-menu,.back-button,.btn-ghost,.btn.ghost,.btn-outline-dark,.btn-outline-secondary) {
  background:#fff; color:var(--klasse-navy); border:1px solid var(--klasse-border); box-shadow:none;
}
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.back-to-menu,.back-menu,.back-button,.btn-ghost,.btn.ghost):hover { border-color:var(--klasse-green-dark); background:var(--klasse-green-light); }
/* Preserve floating label placement managed by the existing dashboard script. */
.klasse-portal:where(:not([data-theme="dark"] *)) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]):not([type=submit]):not([type=button]):not([type=color]),select,textarea) {
  color:var(--klasse-navy); background-color:#fff; border-color:var(--klasse-border-strong); border-radius:10px; min-height:44px; max-width:100%;
}
.klasse-portal:where(:not([data-theme="dark"] *)) :is(input,select,textarea):focus { border-color:var(--klasse-green-dark) !important; }
.klasse-portal:where(:not([data-theme="dark"] *)) .input-group-outline.is-focused .form-label { color:var(--klasse-green-dark) !important; }
.klasse-portal:where(:not([data-theme="dark"] *)) .input-group-outline.is-focused .form-control { border-color:var(--klasse-green-dark) !important; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.table-scroll,.table-responsive,.table-wrap,.table-container) { max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; }
.klasse-portal:where(:not([data-theme="dark"] *)) table { border-color:var(--klasse-border); background:#fff; }
.klasse-portal:where(:not([data-theme="dark"] *)) thead th { background:#f0f7e7; color:var(--klasse-navy); border-color:var(--klasse-border); font-family:inherit; font-weight:700; padding:12px 16px; }
.klasse-portal:where(:not([data-theme="dark"] *)) tbody td { border-color:var(--klasse-border); padding:12px 16px; }
/* Semantic warning, stock, product-range and chart colours remain page-specific. */
.klasse-portal:where(:not([data-theme="dark"] *)) pre { max-width:100%; overflow:auto; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.top-actions,.header-actions,.toolbar,.top,.page-heading,.panel-heading) { gap:16px; }
.portal-admin-customer-portal .grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); }
.portal-reporting-index main, .portal-reporting-setup main { padding-top:44px; }
.portal-sales-trip-planner-print { padding:32px; }
.portal-sourcing-mcp-test { padding:32px; }
/* Fullscreen embedded tracking app retains its iframe behaviour. */
.portal-tracking-embed { padding:0; }
@media(max-width:980px) {
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.topbar,.header) { flex-wrap:wrap; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.topbar,.header) :is(.brand,.brand-wrap) { flex-wrap:wrap; gap:12px; }
}
@media(max-width:680px) {
  body.klasse-portal:where(:not([data-theme="dark"] *)) { background-attachment:scroll !important; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.portal-container,.page-wrap,.wrap,.app,.app-shell,.shell) { max-width:calc(100% - 28px); }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.portal-container,.page-wrap,.wrap) { padding:36px 0; }
  .klasse-portal:where(:not([data-theme="dark"] *)) .container-fluid.py-4 { width:calc(100% - 28px); padding:36px 0 !important; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.card-body,.portal-card-body) { padding:20px 18px; }
  .klasse-portal:where(:not([data-theme="dark"] *)) .card-header.mt-n4 { padding:18px !important; }
  .klasse-portal:where(:not([data-theme="dark"] *)) .card-header img { width:112px; }
  .klasse-portal:where(:not([data-theme="dark"] *)) .page-header > .container.my-auto { padding-top:36px; padding-bottom:36px; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.topbar,.header) { min-height:70px; padding:16px; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.header,.topbar) :is(.brand-logo,.logo,.brand img) { width:112px; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.top,.page-heading,.panel-heading,.header-actions,.top-actions,.search-row) { flex-wrap:wrap; }
  .klasse-portal:where(:not([data-theme="dark"] *)):not(.portal-menu) .tabs { flex-wrap:wrap; gap:4px; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.btn,.btn-primary,.btn-ghost) { white-space:normal; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(input,select,textarea) { font-size:16px; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.result-card,.sheet) { width:calc(100% - 28px); max-width:100%; margin-left:auto; margin-right:auto; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.grid-2,.grid-3,.meta) { grid-template-columns:1fr; }
  .klasse-portal:where(:not([data-theme="dark"] *)) table { display:block; max-width:100%; overflow-x:auto; }
  .portal-logistics-orders .panel { min-width:0; overflow-x:auto; }
  .portal-sales-trip-planner-index :is(.topbar,.tabs,.shell) { width:100%; max-width:none; }
  .portal-sales-trip-planner-index .topbar { padding:9px 12px; min-height:54px; }
  .portal-sales-trip-planner-index .tabs { flex-wrap:nowrap; }
  .portal-sales-trip-planner-print { padding:16px; }
}
@media(prefers-reduced-motion:reduce) {
  .klasse-portal:where(:not([data-theme="dark"] *)) *, .klasse-portal:where(:not([data-theme="dark"] *)) *::before, .klasse-portal:where(:not([data-theme="dark"] *)) *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
@media print {
  body.klasse-portal:where(:not([data-theme="dark"] *)) { background:#fff !important; color:#142542; }
  .klasse-portal:where(:not([data-theme="dark"] *)) :is(.card,.panel,.sheet,.hero-card,.result-card) { box-shadow:none; }
  .klasse-portal:where(:not([data-theme="dark"] *)) table { display:table; overflow:visible; }
}

/* Plain submit controls on administration and connection pages. */
.klasse-portal:where(:not([data-theme="dark"] *)) button[type=submit]:not(.btn-danger):not(.danger):not(.btn-outline-danger),
.klasse-portal:where(:not([data-theme="dark"] *)) input[type=submit] {
  background:var(--klasse-green-dark); color:#fff; border:1px solid var(--klasse-green-dark);
  border-radius:10px; padding:10px 16px; min-height:44px; font:700 14px/1.5 Inter,'Segoe UI',Arial,sans-serif;
}
.klasse-portal:where(:not([data-theme="dark"] *)) button[type=submit]:not(.btn-danger):not(.danger):not(.btn-outline-danger):hover { background:#5f9024; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(td.num,.price,.stat-value) { font-variant-numeric:tabular-nums; }
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.portal-diagnostic,.box:not(.success):not(.error):not(.info)) { border-radius:16px; }
.portal-sourcing-mcp-test { max-width:none; }
.portal-sourcing-mcp-test .portal-diagnostic {
  max-width:900px; margin:32px auto; padding:28px 32px; background:rgba(255,255,255,.97);
  border:1px solid var(--klasse-border); box-shadow:0 18px 50px rgba(20,37,66,.17);
}
@media(max-width:680px) {
  .portal-sourcing-mcp-test { padding:14px; }
  .portal-sourcing-mcp-test .portal-diagnostic { margin:22px auto; padding:20px 18px; }
}

/* Preserve the existing explicit Sell Desk dark theme and white TV gauges. */
body.klasse-portal.tv-mode { background:#fff !important; }

/* Card titles use the menu action-card scale; page headings stay prominent. */
.klasse-portal:where(:not([data-theme="dark"] *)) :is(.card,.category-tile,.downloads-card,.calc-card) h3 { font-size:16px; letter-spacing:0; }