/*
 * Stage 2 visual parity bridge.
 *
 * The authenticated Next.js shell intentionally reuses the current Classic
 * Operations Hub styles through /next/css/style.css + /next/css/ui-redesign.css.  These
 * small rules only neutralize pilot-specific globals and restore the few login
 * declarations that live inline in public/login.html rather than login.css.
 */

/* Keep the Classic sidebar geometry independent from the route body class.
   During App Router loading, BodyClassSync can briefly be between commits.
   globals.css also defines .sidebar with 22px/16px padding + 24px gap; if this
   reset depends on next-classic-shell-active, the logo drops ~22px and the
   first page icon drops another ~24px. Apply the reset directly to the shell
   sidebar so loading and settled states stay pixel-identical. */
.classic-app-shell > .sidebar {
  padding: 0 !important;
  gap: 0 !important;
  color: #f8f9ff;
}

.classic-app-shell > .sidebar .sidebar-brand-toggle {
  border: 0;
  background: transparent;
}

.classic-app-shell > .sidebar .sidebar-nav .nav-link {
  font-size: 14px;
  text-decoration: none;
}

body.next-classic-shell-active .classic-app-shell .main-content {
  color: #0f172a;
}

body.next-classic-shell-active .classic-app-shell .next-classic-page-content {
  width: 100%;
}

body.next-classic-shell-active .classic-app-shell .notif-center-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

body.next-classic-shell-active .classic-app-shell .notif-center-footer button,
body.next-classic-shell-active .classic-app-shell .notif-center-footer a {
  cursor: pointer;
}

/* Route-loading shells must be stable before BodyClassSync/useEffect runs.
   During client navigation there is a short frame where the previous body classes
   are already gone but the new loading body classes have not mounted yet. The
   legacy stylesheet makes .sidebar position:fixed in that frame, which lets the
   black rail escape below the rounded app shell. Anchor every Classic loading
   sidebar to its own shell directly, without depending on a body class. */
.classic-app-shell[class*="next-classic-"][class*="-loading"] {
  position: relative !important;
  overflow: hidden !important;
}

.classic-app-shell[class*="next-classic-"][class*="-loading"] > .main-content {
  height: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

@media (min-width: 769px) {
  .classic-app-shell[class*="next-classic-"][class*="-loading"] > .sidebar,
  body.sidebar-collapsed .classic-app-shell[class*="next-classic-"][class*="-loading"] > .sidebar {
    position: absolute !important;
    top: 18px !important;
    bottom: 18px !important;
    left: 18px !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden !important;
    z-index: 70 !important;
  }

  body.sidebar-collapsed .classic-app-shell[class*="next-classic-"][class*="-loading"] > .sidebar {
    transform: translateX(calc(-100% - 24px)) !important;
  }
}

@media (min-width: 769px) and (max-width: 900px) {
  .classic-app-shell[class*="next-classic-"][class*="-loading"] > .sidebar,
  body.sidebar-collapsed .classic-app-shell[class*="next-classic-"][class*="-loading"] > .sidebar {
    top: 14px !important;
    bottom: 14px !important;
    left: 14px !important;
  }
}


/* -------------------------------------------------------------------------
 * Global Classic shell stabilization (Stage 2 shell hotfix)
 *
 * The legacy ui-redesign.css positions the sidebar against the browser
 * viewport.  Inside the Next pilot the black dashboard frame is a bounded
 * app-container, so anchoring the rail to the viewport can make it drift
 * outside that frame at tablet widths / browser zoom levels.  Keep the same
 * Classic geometry, but anchor it to the shell itself.  The page canvas stays
 * independently scrollable while the sidebar nav owns its own vertical scroll.
 * ---------------------------------------------------------------------- */
body.next-classic-shell-active .classic-app-shell {
  position: relative !important;
}

@media (min-width: 769px) {
  body.next-classic-shell-active .classic-app-shell > .sidebar,
  body.next-classic-shell-active.sidebar-collapsed .classic-app-shell > .sidebar {
    position: absolute !important;
    top: 18px !important;
    bottom: 18px !important;
    left: 18px !important;
    height: auto !important;
    max-height: none !important;
    z-index: 70 !important;
  }

  body.next-classic-shell-active.sidebar-collapsed .classic-app-shell > .sidebar {
    transform: translateX(calc(-100% - 24px)) !important;
  }
}

@media (min-width: 769px) and (max-width: 900px) {
  body.next-classic-shell-active .classic-app-shell > .sidebar,
  body.next-classic-shell-active.sidebar-collapsed .classic-app-shell > .sidebar {
    top: 14px !important;
    bottom: 14px !important;
    left: 14px !important;
  }
}

.classic-app-shell > .sidebar .sidebar-nav {
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scrollbar-gutter: stable;
  scroll-padding-block: 12px 24px;
}

.classic-app-shell > .sidebar .sidebar-nav .nav-list {
  flex: 0 0 auto !important;
  min-height: max-content;
  padding-bottom: 14px !important;
}

.classic-app-shell > .sidebar .sidebar-nav .nav-list > li {
  flex: 0 0 auto !important;
}

/* Keep the route-loading shell geometrically identical to the loaded shell.
   The old CSS sizes #menu-toggle .menu-toggle-logo, while loading placeholders
   deliberately use a div (no id). Without these rules the raw logo expands to
   its intrinsic image size during navigation. */
.next-classic-loading-menu {
  flex: 0 0 auto;
}

.next-classic-loading-menu .menu-toggle-logo {
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
  object-fit: contain !important;
}

.next-classic-loading-brand .brand-logo-icon {
  width: 34px !important;
  height: 34px !important;
  max-width: 34px !important;
  max-height: 34px !important;
  object-fit: contain !important;
}

@media (min-width: 769px) {
  .next-classic-loading-menu {
    display: none !important;
  }
}

@media (max-width: 768px) {
  .next-classic-loading-menu {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border-radius: 14px !important;
    background: #fff !important;
    border: 1px solid #E9EDF3 !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.06) !important;
  }
}

/* Login declarations copied from the inline Classic login page. */
body.next-classic-login-active .login-card {
  animation: classicLoginCardSlideUp .8s ease-out forwards;
}

@keyframes classicLoginCardSlideUp {
  from { opacity: 0; transform: translateY(50px); }
  to { opacity: 1; transform: translateY(0); }
}

body.next-classic-login-active .login-logo {
  animation: classicLoginLogoFloat 3s infinite ease-in-out;
}

@keyframes classicLoginLogoFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-15px); }
}

body.next-classic-login-active .input-with-icon {
  position: relative;
}

body.next-classic-login-active .input-with-icon .input-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #9ca3af;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 2;
}

body.next-classic-login-active .input-with-icon .input-icon svg {
  width: 18px;
  height: 18px;
}

body.next-classic-login-active .input-with-icon input {
  padding-left: 2.65rem;
}

body.next-classic-login-active .input-with-icon:focus-within .input-icon {
  color: #d97706;
}

body.next-classic-login-active .login-btn {
  position: relative;
  overflow: hidden;
  transition: all .4s ease;
}

body.next-classic-login-active .login-btn:hover:not(:disabled) {
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(102,126,234,.3);
}

body.next-classic-login-active .toggle-password {
  transition: all .3s ease;
}

body.next-classic-login-active .toggle-password:hover {
  background: rgba(0,0,0,.05);
  border-radius: 50%;
}

body.next-classic-login-active .error-message {
  animation: classicLoginShake .6s ease-in-out;
}

@keyframes classicLoginShake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-10px); }
  40%, 80% { transform: translateX(10px); }
}

@media (prefers-reduced-motion: reduce) {
  body.next-classic-login-active .login-card,
  body.next-classic-login-active .login-logo,
  body.next-classic-login-active .error-message {
    animation: none !important;
  }
}

/* Keep route loading states inside the same Classic visual language. */
.next-classic-login-loading-card {
  opacity: 1;
  transform: none;
  animation: none;
}

.next-classic-login-loading-form {
  display: grid;
  gap: 14px;
}

.next-classic-login-loading-field,
.next-classic-login-loading-button,
.next-classic-login-loading-link,
.next-classic-loading-line,
.next-classic-loading-nav-icon,
.next-classic-loading-circle,
.next-classic-loading-avatar,
.next-classic-loading-title,
.next-classic-loading-analysis,
.next-classic-loading-kpi,
.next-classic-loading-panel {
  position: relative;
  overflow: hidden;
  background: #eef1f5;
}

.next-classic-login-loading-field::after,
.next-classic-login-loading-button::after,
.next-classic-loading-link::after,
.next-classic-loading-line::after,
.next-classic-loading-nav-icon::after,
.next-classic-loading-circle::after,
.next-classic-loading-avatar::after,
.next-classic-loading-title::after,
.next-classic-loading-analysis::after,
.next-classic-loading-kpi::after,
.next-classic-loading-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.72), transparent);
  animation: nextClassicShimmer 1.35s infinite;
}

@keyframes nextClassicShimmer {
  100% { transform: translateX(100%); }
}

.next-classic-login-loading-field { height: 48px; border-radius: 10px; }
.next-classic-login-loading-link { width: 92px; height: 12px; border-radius: 999px; justify-self: end; }
.next-classic-login-loading-button { height: 48px; border-radius: 10px; }

body.next-classic-shell-active .next-classic-home-loading .next-classic-loading-brand {
  cursor: default;
}

body.next-classic-shell-active .next-classic-home-loading .next-classic-loading-nav {
  pointer-events: none;
}

body.next-classic-shell-active .next-classic-home-loading .next-classic-loading-nav-icon {
  display: block;
  width: 22px;
  height: 22px;
  border-radius: 7px;
  background: rgba(255,255,255,.19);
}

body.next-classic-shell-active .next-classic-home-loading .next-classic-loading-menu {
  cursor: default;
}

.next-classic-loading-search {
  min-width: 180px;
}

.next-classic-loading-line {
  display: block;
  width: 88px;
  height: 10px;
  border-radius: 999px;
}

.next-classic-loading-circle,
.next-classic-loading-avatar {
  display: inline-block;
  flex: 0 0 auto;
  border-radius: 50%;
}

.next-classic-loading-circle { width: 38px; height: 38px; }
.next-classic-loading-avatar { width: 42px; height: 42px; }
.next-classic-loading-title { width: 132px; height: 22px; border-radius: 7px; }
.next-classic-loading-analysis { width: 112px; height: 38px; border-radius: 10px; }

.next-classic-loading-kpis {
  min-height: 280px;
}

.next-classic-loading-kpi {
  min-height: 210px;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  background: #f8fafc;
}

.next-classic-loading-grid {
  margin-top: 18px;
}

.next-classic-loading-panel {
  min-height: 250px;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  background: #f8fafc;
}

@media (prefers-reduced-motion: reduce) {
  .next-classic-login-loading-field::after,
  .next-classic-login-loading-button::after,
  .next-classic-login-loading-link::after,
  .next-classic-loading-line::after,
  .next-classic-loading-nav-icon::after,
  .next-classic-loading-circle::after,
  .next-classic-loading-avatar::after,
  .next-classic-loading-title::after,
  .next-classic-loading-analysis::after,
  .next-classic-loading-kpi::after,
  .next-classic-loading-panel::after {
    animation: none;
  }
}

/* Stage 2B — Current Orders + Orders Review Classic parity ------------------ */
body.current-orders-page .next-classic-orders-parity,
body.orders-review-page .next-classic-orders-parity {
  width: 100%;
  min-width: 0;
}

body.current-orders-page .next-classic-orders-parity .tab-portfolio,
body.orders-review-page .next-classic-orders-parity .tab-portfolio,
body.current-orders-page .next-classic-orders-parity .orders-type-filter__option,
body.orders-review-page .next-classic-orders-parity .orders-type-filter__option {
  font-family: inherit;
  cursor: pointer;
}

body.current-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio,
body.orders-review-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
  border: 0;
}

body.current-orders-page .next-classic-orders-parity #current-orders,
body.orders-review-page .next-classic-orders-parity #sv-orders {
  margin: 0;
}

body.current-orders-page .next-classic-orders-parity .co-card,
body.orders-review-page .next-classic-orders-parity .co-card {
  width: 100%;
  text-align: left;
  font-family: inherit;
}

body.current-orders-page .next-classic-orders-parity .co-status-btn.rejected-reason-trigger,
body.orders-review-page .next-classic-orders-parity .co-item-status.sv-rejected-reason-trigger {
  font-family: inherit;
  cursor: pointer;
}

body.current-orders-page .next-classic-orders-parity .next-classic-track-fragment,
body.orders-review-page .next-classic-orders-parity .next-classic-track-fragment {
  display: contents;
}

body.current-orders-page .next-classic-orders-parity .co-submodal-overlay.is-open,
body.orders-review-page .next-classic-orders-parity .co-submodal-overlay.is-open {
  z-index: 1250;
}

body.current-orders-page .next-classic-orders-parity .co-submodal-overlay.is-open + .co-submodal-overlay.is-open,
body.orders-review-page .next-classic-orders-parity .co-submodal-overlay.is-open + .co-submodal-overlay.is-open {
  z-index: 1300;
}

.orders-parity-success {
  position: sticky;
  top: 10px;
  z-index: 45;
  width: fit-content;
  max-width: min(620px, 100%);
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 12px;
  padding: 10px 14px;
  border: 1px solid #A7F3D0;
  border-radius: 14px;
  background: rgba(236, 253, 245, .96);
  color: #065F46;
  box-shadow: 0 12px 30px rgba(6, 95, 70, .09);
  font-size: 13px;
  font-weight: 850;
  backdrop-filter: blur(10px);
}
.orders-parity-success svg { width: 17px; height: 17px; flex: 0 0 auto; }

/* React keeps the same native dropdown visual language while replacing the
   legacy JS-generated options. */
.next-classic-orders-parity .orders-type-filter__option {
  color: inherit;
  font: inherit;
}
.next-classic-orders-parity .orders-type-filter__option-icon svg,
.next-classic-orders-parity .orders-type-filter__option-check svg {
  display: block;
}

/* Inline quantity editor used by the React review modal. The Classic page
   opens the same controls in a small popover; keeping them inside the item
   avoids viewport clipping while preserving the exact controls and styling. */
.next-classic-qty-editor {
  width: min(230px, 100%);
  display: grid;
  gap: 8px;
  margin-top: 9px;
  margin-left: auto;
  padding: 10px;
  border: 1px solid #E5E7EB;
  border-radius: 15px;
  background: #FFFFFF;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .10);
}
.next-classic-qty-editor .sv-qty-input {
  width: 100%;
  min-height: 38px;
}
.next-classic-qty-editor .sv-qty-actions {
  align-items: center;
}
.next-classic-qty-editor .sv-qty-actions .ro-action-btn {
  min-height: 34px;
  padding: 0 12px;
}

.next-classic-review-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.next-classic-review-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.next-classic-review-actions .btn svg { width: 15px; height: 15px; }
.next-classic-review-actions .btn-success {
  background: #DCFCE7;
  color: #166534;
  border: 1px solid #BBF7D0;
}
.next-classic-review-actions .btn-success:hover { background: #D1FAE5; }

/* Lightweight React version of the Classic Created By profile popover. */
.next-classic-creator-fields {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}
.next-classic-creator-fields > div {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  background: rgba(248, 250, 252, .88);
}
.next-classic-creator-fields span {
  color: #6B7280;
  font-size: 12px;
  font-weight: 750;
}
.next-classic-creator-fields strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #111827;
  font-size: 13px;
  font-weight: 850;
}

/* The classic shell has one global search input. Stage 2B makes that input the
   functional page search, so the duplicate pilot toolbar search is removed. */
body.current-orders-page .classic-app-shell .main-header .searchbar,
body.orders-review-page .classic-app-shell .main-header .searchbar {
  display: flex;
}

/* Keep modal status/action positions stable when the React menu is rendered. */
body.current-orders-page .next-classic-orders-parity .co-modal-dialog,
body.orders-review-page .next-classic-orders-parity .co-modal-dialog {
  isolation: isolate;
}

@media (max-width: 640px) {
  .orders-parity-success { width: 100%; }
  .next-classic-qty-editor { width: 100%; }
  .next-classic-review-actions { justify-content: stretch; }
  .next-classic-review-actions .btn { flex: 1 1 auto; }
  .next-classic-creator-fields > div { grid-template-columns: 1fr; gap: 3px; }
}

/* Stage 2B loading state: keep the Classic shell/order-card geometry visible
   while server data is resolving so navigation never flashes back to Pilot UI. */
.next-classic-orders-loading .next-classic-loading-nav { pointer-events: none; }
.next-classic-orders-loading .next-classic-loading-menu { cursor: default; }
.next-classic-orders-loading .orders-toolbar { pointer-events: none; }
.next-classic-orders-loading-section { margin-top: 14px; }
.next-classic-orders-loading-section .co-cards { min-height: 360px; }

.next-classic-order-loading-line,
.next-classic-order-loading-qty,
.next-classic-order-loading-pill,
.next-classic-order-loading-circle,
.next-classic-order-loading-tab-icon,
.next-classic-order-loading-tab-label,
.next-classic-order-loading-filter,
.next-classic-order-loading-thumb {
  position: relative;
  overflow: hidden;
  background: #EEF1F5;
}
.next-classic-order-loading-line::after,
.next-classic-order-loading-qty::after,
.next-classic-order-loading-pill::after,
.next-classic-order-loading-circle::after,
.next-classic-order-loading-tab-icon::after,
.next-classic-order-loading-tab-label::after,
.next-classic-order-loading-filter::after,
.next-classic-order-loading-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.82), transparent);
  animation: nextClassicOrderShimmer 1.35s infinite;
}
@keyframes nextClassicOrderShimmer { to { transform: translateX(100%); } }

.next-classic-order-loading-thumb { border-radius: inherit; }
.next-classic-order-loading-line { display: block; border-radius: 999px; }
.next-classic-order-loading-line--title { width: min(210px, 72%); height: 13px; margin: 3px 0 9px; }
.next-classic-order-loading-line--sub { width: min(138px, 52%); height: 9px; }
.next-classic-order-loading-line--total { width: 92px; height: 10px; }
.next-classic-order-loading-qty { width: 48px; height: 26px; border-radius: 999px; }
.next-classic-order-loading-pill { width: 88px; height: 28px; border-radius: 999px; }
.next-classic-order-loading-circle { width: 36px; height: 36px; border-radius: 50%; flex: 0 0 auto; }
.next-classic-order-loading-tab-icon { display: inline-block; width: 17px; height: 17px; border-radius: 5px; flex: 0 0 auto; }
.next-classic-order-loading-tab-label { display: inline-block; width: 54px; height: 9px; border-radius: 999px; }
.next-classic-order-loading-filter { min-width: 112px; min-height: 37px; }

@media (prefers-reduced-motion: reduce) {
  .next-classic-order-loading-line::after,
  .next-classic-order-loading-qty::after,
  .next-classic-order-loading-pill::after,
  .next-classic-order-loading-circle::after,
  .next-classic-order-loading-tab-icon::after,
  .next-classic-order-loading-tab-label::after,
  .next-classic-order-loading-filter::after,
  .next-classic-order-loading-thumb::after {
    animation: none;
  }
}

/* Stage 2C — Operations Orders + Maintenance Orders Classic parity ---------- */
body.operations-orders-page .next-classic-orders-parity,
body.page-maintenance-orders .next-classic-orders-parity {
  width: 100%;
  min-width: 0;
}

body.operations-orders-page .next-classic-orders-parity .tab-portfolio,
body.page-maintenance-orders .next-classic-orders-parity .tab-portfolio,
body.operations-orders-page .next-classic-orders-parity .orders-type-filter__option,
body.page-maintenance-orders .next-classic-orders-parity .orders-type-filter__option {
  font-family: inherit;
  cursor: pointer;
}

body.operations-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio,
body.page-maintenance-orders .next-classic-orders-parity .orders-toolbar .tab-portfolio {
  border: 0;
}

body.operations-orders-page .next-classic-orders-parity #requested-list,
body.page-maintenance-orders .next-classic-orders-parity #requested-list {
  margin: 0;
}

body.operations-orders-page .next-classic-orders-parity .co-card,
body.page-maintenance-orders .next-classic-orders-parity .co-card {
  width: 100%;
  text-align: left;
  font-family: inherit;
}

body.operations-orders-page .next-classic-orders-parity .co-right-ico,
body.page-maintenance-orders .next-classic-orders-parity .co-right-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.operations-orders-page .next-classic-orders-parity .co-status-btn,
body.operations-orders-page .next-classic-orders-parity .co-item-status,
body.page-maintenance-orders .next-classic-orders-parity .co-status-btn,
body.page-maintenance-orders .next-classic-orders-parity .co-item-status {
  background: var(--tag-bg, #e5e7eb);
  color: var(--tag-fg, #374151);
  border-color: var(--tag-border, #d1d5db);
}

body.operations-orders-page .next-classic-orders-parity .next-classic-track-fragment,
body.page-maintenance-orders .next-classic-orders-parity .next-classic-track-fragment {
  display: contents;
}

body.operations-orders-page .next-classic-orders-parity .co-modal-overlay.is-open,
body.page-maintenance-orders .next-classic-orders-parity .co-modal-overlay.is-open,
body.operations-orders-page .next-classic-orders-parity .co-submodal-overlay.is-open,
body.page-maintenance-orders .next-classic-orders-parity .co-submodal-overlay.is-open {
  display: flex;
}

body.operations-orders-page .next-classic-orders-parity .co-submodal-overlay.is-open,
body.page-maintenance-orders .next-classic-orders-parity .co-submodal-overlay.is-open {
  z-index: 1300;
}

.next-classic-textarea {
  min-height: 110px;
  resize: vertical;
  padding-top: 12px;
}

.next-classic-wide-submodal .co-submodal-dialog {
  width: min(920px, calc(100vw - 28px));
  max-width: 920px;
  max-height: min(88vh, 820px);
}

.next-classic-wide-submodal .co-submodal-body {
  overflow: auto;
}

.next-classic-wide-submodal .req-maintenance-log-dialog {
  width: min(760px, 94vw);
  max-height: min(88dvh, 760px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.next-classic-wide-submodal .req-maintenance-log-body {
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 4px;
}








.maintenance-track-pill {
  grid-template-columns: auto 1fr auto 1fr auto;
}



.next-classic-maintenance-log-card .maintenance-spares__heading .ro-action-btn {
  width: auto;
}





@media (max-width: 720px) {
  .next-classic-wide-submodal .co-submodal-dialog {
    width: min(100% - 16px, 920px);
    max-height: 92vh;
  }

  body.operations-orders-page .next-classic-orders-parity .co-bottom,
  body.page-maintenance-orders .next-classic-orders-parity .co-bottom {
    align-items: flex-end;
  }
}


/* ========================================================================== */
/* Stage 2D — Shopping Cart / Create Order Classic parity                     */
/* ========================================================================== */
.classic-cart-page{width:100%;padding:1.25rem 1rem 2.25rem;color:#0f172a}
.classic-cart-page *{box-sizing:border-box}
.classic-cart-order-type-step{position:relative;margin-bottom:1.5rem;padding:1.55rem;border-radius:28px;border:1px solid rgba(226,232,240,.95);background:radial-gradient(circle at top right,rgba(251,146,60,.14),transparent 32%),radial-gradient(circle at bottom left,rgba(15,23,42,.05),transparent 34%),linear-gradient(180deg,rgba(255,255,255,.98),#fff);box-shadow:0 28px 60px -44px rgba(15,23,42,.4);overflow:hidden}
.classic-cart-order-step-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.15rem}
.classic-cart-order-step-kicker{display:inline-flex;align-items:center;gap:.5rem;min-height:34px;padding:0 .9rem;border-radius:999px;background:rgba(15,23,42,.06);color:#0f172a;font-size:.8rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase;margin-bottom:.85rem}
.classic-cart-order-type-title{font-size:clamp(1.45rem,2vw,1.95rem);font-weight:900;color:#0f172a;margin:0;letter-spacing:-.02em}
.classic-cart-order-type-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.classic-cart-order-type-btn{position:relative;display:flex;align-items:flex-start;justify-content:flex-start;gap:1rem;min-height:116px;height:auto;padding:1rem;text-align:left;border-radius:24px;border:1px solid rgba(226,232,240,.98);background:rgba(255,255,255,.96);color:#0f172a;box-shadow:0 22px 40px -32px rgba(15,23,42,.28);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;overflow:hidden;cursor:pointer;font:inherit}
.classic-cart-order-type-btn::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(249,115,22,.08),transparent 48%);opacity:0;transition:opacity .18s ease;pointer-events:none}
.classic-cart-order-type-btn:hover{transform:translateY(-3px);border-color:rgba(249,115,22,.26);box-shadow:0 32px 52px -34px rgba(15,23,42,.34);background:#fff}
.classic-cart-order-type-btn:hover::before{opacity:1}
.classic-cart-order-type-icon{position:relative;z-index:1;width:60px;height:60px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(135deg,#111827 0%,#1f2937 100%);color:#fff;box-shadow:0 18px 26px -20px rgba(15,23,42,.65);flex:0 0 auto}
.classic-cart-order-type-copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:.45rem;min-width:0;flex:1 1 auto}
.classic-cart-order-type-copy strong{display:block;color:inherit;font-size:1.05rem;font-weight:900;letter-spacing:-.01em;line-height:1.2}
.classic-cart-order-type-copy small{display:block;color:#64748b;font-weight:700;line-height:1.45;font-size:.92rem}
.classic-cart-order-type-arrow{position:relative;z-index:1;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:rgba(15,23,42,.06);color:#334155;margin-left:auto;flex:0 0 auto;transition:transform .18s ease,background .18s ease,color .18s ease}
.classic-cart-order-type-btn:hover .classic-cart-order-type-arrow{transform:translateX(2px)}
.classic-cart-order-type-btn.theme-request-products::before{background:linear-gradient(135deg,rgba(34,197,94,.1),transparent 48%)}
.classic-cart-order-type-btn.theme-request-products:hover{border-color:rgba(34,197,94,.28)}
.classic-cart-order-type-btn.theme-request-products .classic-cart-order-type-icon{background:linear-gradient(135deg,#22c55e 0%,#16a34a 100%);box-shadow:0 18px 26px -20px rgba(22,163,74,.55)}
.classic-cart-order-type-btn.theme-withdraw-products::before{background:linear-gradient(135deg,rgba(239,68,68,.1),transparent 48%)}
.classic-cart-order-type-btn.theme-withdraw-products:hover{border-color:rgba(239,68,68,.28)}
.classic-cart-order-type-btn.theme-withdraw-products .classic-cart-order-type-icon{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);box-shadow:0 18px 26px -20px rgba(220,38,38,.55)}
.classic-cart-order-type-btn.theme-request-maintenance::before{background:linear-gradient(135deg,rgba(234,179,8,.11),transparent 48%)}
.classic-cart-order-type-btn.theme-request-maintenance:hover{border-color:rgba(234,179,8,.3)}
.classic-cart-order-type-btn.theme-request-maintenance .classic-cart-order-type-icon{background:linear-gradient(135deg,#f59e0b 0%,#eab308 100%);box-shadow:0 18px 26px -20px rgba(234,179,8,.5)}
.classic-cart-order-type-loading{min-height:116px;padding:1rem 1.1rem;border-radius:24px;border:1px dashed rgba(148,163,184,.46);background:rgba(255,255,255,.74);display:flex;align-items:center;gap:10px;color:#64748b;font-weight:800}
.classic-cart-order-type-loading>span{width:10px;height:10px;border-radius:999px;background:#94a3b8;animation:classicCartPulse 1s infinite ease-in-out}
@keyframes classicCartPulse{0%,100%{opacity:.35;transform:scale(.95)}50%{opacity:1;transform:scale(1)}}

.classic-cart-type-pill{display:flex;align-items:center;flex-wrap:wrap;gap:.8rem;margin:0 0 1rem;padding:1rem 1.1rem;border-radius:22px;border:1px solid rgba(226,232,240,.95);background:rgba(255,255,255,.96);box-shadow:0 22px 42px -34px rgba(15,23,42,.32)}
.classic-cart-back-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;border:1px solid #e5e7eb;background:#fff;color:#0f172a;cursor:pointer;box-shadow:0 14px 28px -24px rgba(15,23,42,.55);transition:transform .15s ease,background .15s ease}
.classic-cart-back-btn:hover{background:#f1f5f9;transform:translateY(-1px)}
.classic-cart-type-value{display:inline-flex;align-items:center;gap:.6rem;min-height:42px;padding:.35rem .95rem .35rem .45rem;border-radius:999px;background:#0f172a;color:#fff;font-weight:900;box-shadow:0 18px 30px -26px rgba(15,23,42,.72)}

.classic-cart-type-value.theme-request-products{background:linear-gradient(135deg,#f0fdf4 0%,#d1fae5 100%);color:#166534;border:1px solid #a7f3d0;box-shadow:0 18px 30px -26px rgba(22,163,74,.28)}
.classic-cart-type-value.theme-request-products .classic-cart-type-value-icon{background:#22c55e;color:#fff}
.classic-cart-type-value.theme-withdraw-products{background:linear-gradient(135deg,#fef2f2 0%,#fee2e2 100%);color:#991b1b;border:1px solid #fecaca;box-shadow:0 18px 30px -26px rgba(220,38,38,.28)}
.classic-cart-type-value.theme-withdraw-products .classic-cart-type-value-icon{background:#ef4444;color:#fff}
.classic-cart-type-value.theme-request-maintenance{background:linear-gradient(135deg,#fffbeb 0%,#fef3c7 100%);color:#92400e;border:1px solid #fde68a;box-shadow:0 18px 30px -26px rgba(234,179,8,.3)}
.classic-cart-type-value.theme-request-maintenance .classic-cart-type-value-icon{background:#eab308;color:#fff}
.classic-cart-save-state{margin-left:auto;color:#25825b;font-size:.78rem;font-weight:850;min-height:18px}
.classic-cart-save-state.is-error{color:#c0364b}

.classic-cart-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:1.25rem;align-items:start}
.classic-cart-card,.classic-cart-summary-card{background:#fff;border:1px solid rgba(226,232,240,.95);border-radius:24px;box-shadow:0 30px 70px -46px rgba(15,23,42,.3);overflow:hidden}
.classic-cart-body{display:flex;flex-direction:column;gap:.8rem;padding:.95rem;background:transparent}
.classic-cart-row{display:flex;flex-direction:column;gap:.8rem;padding:.95rem;border:1px solid rgba(226,232,240,.98);border-radius:22px;background:#fff;box-shadow:0 18px 38px -30px rgba(15,23,42,.18);align-items:stretch}
.classic-cart-card-main{display:flex;align-items:flex-start;gap:.85rem;width:100%;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;font:inherit}
.classic-cart-card-main:focus-visible,.classic-cart-note--editable:focus-visible{outline:none;border-radius:18px;box-shadow:0 0 0 4px rgba(148,163,184,.2)}
.classic-cart-thumb{width:76px;height:76px;border-radius:18px;display:grid;place-items:center;overflow:hidden;flex:0 0 auto;padding:0;background:linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%);border:1px solid #e2e8f0;color:#475569;box-shadow:inset 0 1px 0 rgba(255,255,255,.72);font-size:1.18rem;font-weight:900}
button.classic-cart-thumb{cursor:zoom-in}
.classic-cart-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.classic-cart-prod-meta{display:flex;flex:1 1 auto;min-width:0;flex-direction:column;gap:.24rem;padding-top:.1rem}
.classic-cart-prod-meta>strong{font-size:1.16rem;line-height:1.16;font-weight:900;color:#0f172a;margin:0}
.classic-cart-prod-meta>small{font-size:.84rem;line-height:1.32;color:#64748b;white-space:normal;font-weight:700}
.classic-cart-prod-meta>small.part{font-size:.82rem;font-weight:800;color:#475569}
.classic-cart-card-metrics{display:grid;grid-template-columns:minmax(250px,1.1fr) minmax(120px,.65fr) minmax(120px,.65fr);border:1px solid #edf2f7;border-radius:18px;background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);overflow:hidden}
.classic-cart-card-metric{min-width:0;padding:.78rem .85rem;display:flex;flex-direction:column;justify-content:center;gap:.38rem}
.classic-cart-card-metric+.classic-cart-card-metric{border-left:1px solid #edf2f7}
.classic-cart-card-metric>span,.classic-cart-note>span{font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b}
.classic-cart-card-metric>strong{font-size:1.05rem;line-height:1.04;font-weight:900;color:#0f172a;white-space:nowrap}
.classic-cart-card-qty-unit-row{display:flex;align-items:center;gap:.6rem;min-width:0}
.classic-cart-qty-control{width:124px;min-width:124px;height:40px;padding:0 .08rem;border:1px solid #e2e8f0;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:space-between;box-shadow:inset 0 1px 0 rgba(255,255,255,.7);overflow:hidden}
.classic-cart-qty-control button{width:36px;height:36px;border:0;background:#fff;color:#0f172a;font:inherit;font-size:1.02rem;font-weight:900;cursor:pointer}
.classic-cart-qty-control button:hover{background:#f1f5f9}
.classic-cart-qty-control b{min-width:34px;text-align:center;font-size:.92rem;font-weight:900}
.classic-cart-unit-badge{display:inline-flex;align-items:center;justify-content:center;min-width:68px;max-width:128px;height:40px;padding:0 .78rem;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc;color:#64748b;font-size:.9rem;font-weight:900;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.classic-cart-note{border:1px solid #edf2f7;border-radius:18px;background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);padding:.82rem .9rem;display:flex;flex-direction:column;gap:.4rem;min-width:0;width:100%;text-align:left;font:inherit;color:inherit}
.classic-cart-note--editable{cursor:pointer}
.classic-cart-note>strong{font-size:.95rem;line-height:1.45;font-weight:800;color:#0f172a;white-space:pre-wrap;word-break:break-word}
.classic-cart-note>strong.is-empty{color:#94a3b8;font-weight:700}
.classic-cart-card-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
.classic-cart-action{min-width:0;height:46px;border-radius:999px;border:1px solid #e5e7eb;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:900;font-size:.92rem;text-decoration:none;transition:transform .15s ease,background .15s ease,border-color .15s ease,box-shadow .15s ease,opacity .15s ease;font-family:inherit;cursor:pointer}
.classic-cart-action:hover{transform:translateY(-1px)}
.classic-cart-action--open{background:#fff;color:#0f172a;border-color:#dbe4ee;box-shadow:0 10px 20px -18px rgba(15,23,42,.46)}
.classic-cart-action--open:hover{background:#f8fafc}
.classic-cart-action--open:disabled{opacity:.48;cursor:not-allowed;pointer-events:none;box-shadow:none;transform:none}
.classic-cart-action--delete{background:linear-gradient(180deg,#ef4444 0%,#dc2626 100%);border-color:#ef4444;color:#fff;box-shadow:0 16px 28px -22px rgba(220,38,38,.58)}
.classic-cart-action--delete:hover{background:linear-gradient(180deg,#dc2626 0%,#b91c1c 100%);border-color:#dc2626}
.classic-cart-footer{padding:1rem 1.25rem;border-top:1px solid #f1f5f9;background:#fff}
.classic-cart-update-btn{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 1.25rem;border-radius:999px;border:1px solid #0b1220;background:#0b1220;color:#fff;font-weight:900;font-family:inherit;cursor:pointer;box-shadow:0 14px 28px -24px rgba(15,23,42,.55);transition:transform .15s ease,background .15s ease}
.classic-cart-update-btn:hover{background:#050a14;transform:translateY(-1px)}
.classic-cart-empty,.classic-cart-loading{min-height:210px;display:grid;place-items:center;align-content:center;gap:12px;padding:2rem;color:#64748b;text-align:center}
.classic-cart-empty strong,.classic-cart-loading strong{color:#0f172a}
.classic-cart-loading-spinner{width:30px;height:30px;border:3px solid #e5e7eb;border-top-color:#0f172a;border-radius:50%;animation:classicCartSpin .8s linear infinite}
@keyframes classicCartSpin{to{transform:rotate(360deg)}}

.classic-cart-summary{width:100%;margin-left:0;position:sticky;top:1rem}
.classic-cart-summary-card{padding:1.35rem}
.classic-cart-summary-title{font-size:1.15rem;font-weight:900;color:#0f172a;margin-bottom:1rem}
.classic-cart-summary-lines{display:flex;flex-direction:column;gap:.65rem;padding:.95rem 0;border-top:1px solid #f1f5f9;border-bottom:1px solid #f1f5f9}
.classic-cart-summary-lines>div{display:flex;align-items:center;justify-content:space-between;gap:1rem;color:#64748b;font-weight:800}
.classic-cart-summary-lines strong{color:#0f172a;font-weight:900}
.classic-cart-summary-total{padding-top:.55rem;margin-top:.15rem;border-top:1px dashed #e2e8f0;font-size:1.02rem}
.classic-cart-summary-field{display:grid;gap:.45rem;margin-top:1rem}
.classic-cart-summary-field>span{color:#475569;font-size:.88rem;font-weight:900}
.classic-cart-summary-field input,.classic-cart-voucher-row input{width:100%;height:44px;padding:0 .9rem;border:1px solid #e5e7eb;border-radius:12px;background:#fff;color:#0f172a;font:inherit;font-weight:700;outline:none}
.classic-cart-summary-field input:focus,.classic-cart-voucher-row input:focus{border-color:#94a3b8;box-shadow:0 0 0 4px rgba(148,163,184,.16)}
.classic-cart-voucher-row{display:block;margin-top:1rem}
.classic-cart-checkout-btn{width:100%;height:46px;margin-top:1rem;border:1px solid #0b1220;border-radius:999px;background:#0b1220;color:#fff;font:inherit;font-weight:900;cursor:pointer;box-shadow:0 14px 28px -24px rgba(15,23,42,.55);transition:transform .15s ease,background .15s ease}
.classic-cart-checkout-btn:hover:not(:disabled){background:#050a14;transform:translateY(-1px)}
.classic-cart-checkout-btn:disabled{opacity:.62;cursor:wait}

.classic-cart-modal-overlay{position:fixed;inset:0;z-index:1300;display:flex;align-items:center;justify-content:center;padding:1rem;background:rgba(15,23,42,.62);backdrop-filter:blur(4px)}
.classic-cart-modal-card{width:min(620px,100%);max-height:92vh;overflow:auto;background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:1.25rem;box-shadow:0 30px 90px rgba(15,23,42,.35)}
.classic-cart-modal-title{margin:0 0 1rem;font-size:1.25rem;font-weight:900;color:#0f172a}
.classic-cart-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.classic-cart-modal-grid .full{grid-column:1/-1}
.classic-cart-mfield{display:flex;flex-direction:column;gap:.45rem}
.classic-cart-mfield>span{color:#475569;font-size:.88rem;font-weight:900}
.classic-cart-mfield em{color:#ef4444;font-style:normal;font-weight:900}
.classic-cart-mfield input,.classic-cart-mfield select,.classic-cart-mfield textarea{width:100%;border:1px solid #e5e7eb;border-radius:12px;background:#fff;color:#0f172a;font:inherit;font-weight:700;outline:none}
.classic-cart-mfield input{height:44px;padding:0 .85rem}
.classic-cart-mfield select{height:44px;padding:0 .7rem;line-height:1.35}
.classic-cart-mfield select option{padding:.48rem .55rem}
.classic-cart-mfield textarea{min-height:110px;padding:.8rem;resize:vertical;line-height:1.5}
.classic-cart-mfield input:focus,.classic-cart-mfield select:focus,.classic-cart-mfield textarea:focus{border-color:#94a3b8;box-shadow:0 0 0 4px rgba(148,163,184,.16)}




.classic-cart-qty-input-with-unit b.is-placeholder{color:#94a3b8;font-weight:750}











.classic-cart-modal-error{margin:0;padding:.7rem .8rem;border:1px solid #fecaca;border-radius:12px;background:#fef2f2;color:#991b1b;font-size:.84rem;font-weight:800}
.classic-cart-modal-actions{display:flex;justify-content:flex-end;gap:.75rem;margin-top:1rem;padding-top:1rem;border-top:1px solid #f1f5f9}
.classic-cart-btn-ghost,.classic-cart-btn-solid{height:40px;padding:0 1.1rem;border-radius:999px;font:inherit;font-weight:900;cursor:pointer}
.classic-cart-btn-ghost{border:1px solid #e5e7eb;background:#fff;color:#0f172a}
.classic-cart-btn-ghost:hover{background:#f8fafc}
.classic-cart-btn-solid{border:1px solid #0b1220;background:#0b1220;color:#fff}
.classic-cart-btn-solid:hover{background:#050a14}
.classic-cart-toast{position:fixed;right:20px;top:20px;z-index:1400;display:grid;grid-template-columns:1fr auto;gap:12px;width:min(390px,calc(100vw - 32px));padding:14px 15px;border:1px solid #b7e4cc;border-radius:14px;background:#effbf4;color:#147447;box-shadow:0 18px 45px rgba(15,23,42,.18)}
.classic-cart-toast.is-error{border-color:#f3a9b4;background:#fff2f4;color:#aa2e43}
.classic-cart-toast.is-info{border-color:#c8c3fa;background:#f4f2ff;color:#5144c4}
.classic-cart-toast strong,.classic-cart-toast span{display:block}.classic-cart-toast strong{font-size:.9rem}.classic-cart-toast span{margin-top:4px;font-size:.8rem;line-height:1.55}.classic-cart-toast button{border:0;background:transparent;color:inherit;font-size:18px;cursor:pointer}
.classic-cart-saving-overlay{position:fixed;inset:0;z-index:1500;display:grid;place-items:center;background:rgba(15,23,42,.48);backdrop-filter:blur(3px)}
.classic-cart-saving-box{display:flex;align-items:center;gap:.8rem;padding:1rem 1.25rem;border-radius:16px;background:#fff;color:#0f172a;box-shadow:0 24px 60px rgba(15,23,42,.28)}
.classic-cart-saving-spinner{width:24px;height:24px;border:3px solid #e5e7eb;border-top-color:#0f172a;border-radius:50%;animation:classicCartSpin .8s linear infinite}

/* Route loading state: same shell/content silhouette as Classic Shopping Cart. */
.classic-cart-loading-page{padding:1.25rem 1rem 2.25rem}
.classic-cart-loading-type{height:240px;border:1px solid #e2e8f0;border-radius:28px;background:linear-gradient(90deg,#f1f5f9,#fff,#f1f5f9);background-size:200% 100%;animation:classicCartShimmer 1.35s linear infinite}
.classic-cart-loading-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:1.25rem;margin-top:1rem}
.classic-cart-loading-grid>div,.classic-cart-loading-grid>aside{height:360px;border:1px solid #e2e8f0;border-radius:24px;background:linear-gradient(90deg,#f1f5f9,#fff,#f1f5f9);background-size:200% 100%;animation:classicCartShimmer 1.35s linear infinite}
@keyframes classicCartShimmer{to{background-position:-200% 0}}

@media(max-width:1180px){.classic-cart-grid,.classic-cart-loading-grid{grid-template-columns:1fr}.classic-cart-summary{position:static}.classic-cart-loading-grid>aside{height:240px}}
@media(max-width:900px){.classic-cart-order-step-header{flex-direction:column}.classic-cart-order-type-tabs{grid-template-columns:1fr}.classic-cart-order-type-btn{min-height:104px}}
@media(max-width:640px){.classic-cart-page,.classic-cart-loading-page{padding-left:.5rem;padding-right:.5rem;padding-bottom:calc(8rem + env(safe-area-inset-bottom,0px))}.classic-cart-order-type-step{padding:1rem;border-radius:24px}.classic-cart-order-type-btn{padding:.9rem;border-radius:20px}.classic-cart-order-type-icon{width:54px;height:54px;border-radius:18px}.classic-cart-type-pill{padding:.9rem}.classic-cart-body{gap:.72rem;padding:.78rem}.classic-cart-row{padding:.82rem;border-radius:20px;gap:.78rem}.classic-cart-card-main{gap:.72rem}.classic-cart-thumb{width:60px;height:60px;border-radius:16px;font-size:1rem}.classic-cart-prod-meta>strong{font-size:.98rem}.classic-cart-prod-meta>small{font-size:.8rem}.classic-cart-card-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.classic-cart-card-metric{padding:.7rem .78rem;gap:.34rem}.classic-cart-card-metric--qty{border-bottom:1px solid #edf2f7}.classic-cart-card-metric:nth-child(2){border-left:1px solid #edf2f7;border-bottom:1px solid #edf2f7}.classic-cart-card-metric:nth-child(3){grid-column:1/-1;border-left:0}.classic-cart-card-metric>strong{font-size:.95rem}.classic-cart-note{padding:.72rem .78rem}.classic-cart-note>strong{font-size:.88rem}.classic-cart-card-actions{gap:.58rem}.classic-cart-action{height:42px;font-size:.86rem}.classic-cart-modal-overlay{align-items:flex-end;padding:0}.classic-cart-modal-card{width:100%;max-height:94vh;border-radius:22px 22px 0 0;padding:1rem}.classic-cart-modal-grid{grid-template-columns:1fr}.classic-cart-modal-grid .full{grid-column:auto}.classic-cart-modal-actions{display:grid;grid-template-columns:1fr 1fr}.classic-cart-btn-ghost,.classic-cart-btn-solid{width:100%}.classic-cart-toast{right:16px;top:16px}.classic-cart-save-state{width:100%;margin-left:46px}}
@media(max-width:420px){.classic-cart-thumb{width:56px;height:56px}.classic-cart-card-metrics{grid-template-columns:1fr}.classic-cart-card-metric,.classic-cart-card-metric+.classic-cart-card-metric,.classic-cart-card-metric:nth-child(3){grid-column:auto;border-left:0;border-bottom:1px solid #edf2f7}.classic-cart-card-metric:last-child{border-bottom:0}.classic-cart-qty-control{width:100%;min-width:0}.classic-cart-card-qty-unit-row{align-items:stretch;flex-direction:column}.classic-cart-unit-badge{max-width:none;width:100%}}

/* ========================================================================== */
/* Stage 2B — Current Orders polish -----------------------------------------
 * Keep the Classic data/actions, but make the Next.js route easier to scan on
 * phone-sized screens and expose the status/type context without opening each
 * order. These rules are intentionally scoped to Current Orders only.
 */
body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-wrap {
  display: grid;
  gap: 8px;
  margin: 10px 0 14px;
  padding: 10px;
  border: 1px solid rgba(226, 232, 240, .96);
  border-radius: 24px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 16px 34px rgba(15, 23, 42, .07);
}

body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-summary {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 1px 4px 0;
  color: #64748b;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.2;
}

body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-summary span,
body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-summary strong,
body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-summary em {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  white-space: nowrap;
}

body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-summary span {
  color: #475569;
  background: #f8fafc;
  border: 1px solid #e8edf3;
}

body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-summary strong {
  color: #0f172a;
  background: #eef2ff;
  border: 1px solid #e0e7ff;
  font-weight: 850;
}

body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-summary em {
  color: #9a3412;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  font-style: normal;
  font-weight: 850;
}

body.current-orders-page .next-classic-orders-parity .orders-toolbar {
  gap: 9px;
  margin: 0;
  padding: 0;
}

body.current-orders-page .next-classic-orders-parity .orders-toolbar__scroll {
  border-radius: 18px;
}

body.current-orders-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs {
  gap: 5px;
  min-width: max-content;
  padding: 4px;
  border-radius: 18px;
  background: #f8fafc;
  border: 1px solid #edf1f5;
}

body.current-orders-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs::before {
  border-radius: 14px;
  background: linear-gradient(180deg, #101827 0%, #020617 100%);
  box-shadow: 0 10px 22px rgba(2, 6, 23, .18);
}

body.current-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
  flex: 0 0 auto;
  width: auto;
  min-width: 88px;
  min-height: 48px;
  flex-direction: row;
  justify-content: flex-start;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 14px;
  text-align: left;
}

body.current-orders-page .next-classic-orders-parity .order-status-tab__icon {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  box-shadow: none;
}

body.current-orders-page .next-classic-orders-parity .order-status-tab__icon svg {
  width: 15px;
  height: 15px;
}

body.current-orders-page .next-classic-orders-parity .order-status-tab__copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

body.current-orders-page .next-classic-orders-parity .order-status-tab__label {
  display: block !important;
  max-width: none;
  color: inherit;
  font-size: 11px;
  line-height: 1.05;
  white-space: nowrap;
}

body.current-orders-page .next-classic-orders-parity .order-status-tab__count {
  display: block;
  color: #94a3b8;
  font-size: 9px;
  font-weight: 850;
  line-height: 1;
}

body.current-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio.active .order-status-tab__count,
body.current-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio.is-active .order-status-tab__count {
  color: rgba(255, 255, 255, .68);
}

body.current-orders-page .next-classic-orders-parity .orders-toolbar__divider {
  height: 42px;
  background: #e2e8f0;
}

body.current-orders-page .next-classic-orders-parity .orders-type-filter__button {
  min-height: 46px;
  max-width: 190px;
  padding: 0 14px;
  border-radius: 15px;
  background: #fff;
  box-shadow: none;
}

body.current-orders-page .next-classic-orders-parity .orders-type-filter__button-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.current-orders-page .next-classic-orders-parity .orders-type-filter__panel {
  top: calc(100% + 9px);
  width: min(330px, calc(100vw - 28px));
  border-radius: 20px;
  padding: 10px;
  z-index: 120;
}

body.current-orders-page .next-classic-orders-parity .orders-type-filter__option {
  min-height: 58px;
  padding: 9px 10px;
  border-radius: 15px;
}

body.current-orders-page .next-classic-orders-parity .orders-type-filter__option-icon {
  flex-basis: 36px;
  width: 36px;
  height: 36px;
  border-radius: 12px;
}

body.current-orders-page .next-classic-orders-parity .orders-type-filter__option-title {
  font-size: 12.5px;
}

body.current-orders-page .next-classic-orders-parity .orders-type-filter__option-sub {
  font-size: 10.5px;
}

body.current-orders-page .next-classic-orders-parity #current-orders.card {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.current-orders-page .next-classic-orders-parity .co-cards {
  gap: 10px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card {
  position: relative;
  overflow: hidden;
  border-color: #e7ebf1;
  border-radius: 20px;
  padding: 12px 13px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .055);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(180deg, rgba(249, 115, 22, .78), rgba(249, 115, 22, .16));
  opacity: .55;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card:hover {
  transform: translateY(-1px);
  border-color: #dce2ea;
  box-shadow: 0 15px 30px rgba(15, 23, 42, .08);
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-top {
  gap: 11px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-thumb {
  width: 48px;
  height: 48px;
  border-radius: 14px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-thumb svg {
  width: 22px;
  height: 22px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-title {
  font-size: 16px;
  letter-spacing: -.015em;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  margin-top: 4px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-meta .co-sub {
  margin: 0;
  font-size: 10.5px;
  white-space: nowrap;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-type {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 180px;
  height: 20px;
  padding: 0 7px;
  border-radius: 999px;
  background: #f8fafc;
  border: 1px solid #edf1f5;
  color: #64748b;
  font-size: 9px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-qty {
  padding: 4px 7px;
  margin-left: 4px;
  border: 1px solid #edf1f5;
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  font-size: 10px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-divider {
  margin: 9px 0;
  background: #eef2f6;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-est-label {
  font-size: 10px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-est-value {
  margin-top: 3px;
  font-size: 18px;
  letter-spacing: -.025em;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-actions {
  gap: 7px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-status-btn {
  min-height: 30px;
  padding: 6px 11px;
  font-size: 10px;
  box-shadow: none;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-progress {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 48px;
  height: 34px;
  padding: 0 9px;
  border-radius: 999px;
  background: #020617;
  color: #fff;
  box-shadow: 0 8px 18px rgba(2, 6, 23, .14);
}

body.current-orders-page .next-classic-orders-parity .next-current-order-progress svg {
  width: 12px;
  height: 12px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-progress--icon-only {
  width: 34px;
  min-width: 34px;
  padding: 0;
  gap: 0;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-progress strong {
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary > div {
  min-width: 0;
  min-height: 62px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 10px 11px;
  border: 1px solid #e8edf3;
  border-radius: 15px;
  background: #f8fafc;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary > div > span:first-child {
  color: #94a3b8;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary strong {
  min-width: 0;
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary__status .co-status-btn {
  align-self: flex-start;
  min-height: 26px;
  padding: 5px 9px;
  font-size: 9px;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-delete-confirm {
  z-index: 1400;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-delete-confirm .co-confirm-icon {
  background: #fef2f2;
  border-color: #fecaca;
  color: #dc2626;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-delete-confirm__danger {
  background: #dc2626;
  color: #fff;
  border-color: #dc2626;
}

body.current-orders-page .next-classic-orders-parity .next-current-order-delete-confirm__danger:hover {
  background: #b91c1c;
}

@media (max-width: 768px) {
  body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-wrap {
    margin-top: 8px;
    padding: 8px;
    border-radius: 20px;
  }

  body.current-orders-page .next-classic-orders-parity .orders-toolbar {
    gap: 7px;
  }

  body.current-orders-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs {
    gap: 4px;
    padding: 3px;
  }

  body.current-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
    min-width: 80px;
    min-height: 44px;
    gap: 7px;
    padding: 6px 8px;
    border-radius: 12px;
  }

  body.current-orders-page .next-classic-orders-parity .order-status-tab__icon {
    flex-basis: 27px;
    width: 27px;
    height: 27px;
    border-radius: 9px;
  }

  body.current-orders-page .next-classic-orders-parity .order-status-tab__label {
    font-size: 10px;
  }

  body.current-orders-page .next-classic-orders-parity .orders-toolbar__divider {
    display: block;
    height: 38px;
  }

  body.current-orders-page .next-classic-orders-parity .orders-type-filter__button {
    min-height: 42px;
    max-width: 130px;
    padding: 0 11px;
    border-radius: 13px;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-summary {
    overflow-x: auto;
    padding-bottom: 1px;
    scrollbar-width: none;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-summary::-webkit-scrollbar {
    display: none;
  }

  body.current-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
    min-width: 72px;
  }

  body.current-orders-page .next-classic-orders-parity .order-status-tab__copy {
    gap: 1px;
  }

  body.current-orders-page .next-classic-orders-parity .order-status-tab__label {
    max-width: 44px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.current-orders-page .next-classic-orders-parity .orders-toolbar__divider {
    display: none;
  }

  body.current-orders-page .next-classic-orders-parity .orders-type-filter__button {
    width: 42px;
    min-width: 42px;
    max-width: 42px;
    height: 42px;
    padding: 0;
    justify-content: center;
  }

  body.current-orders-page .next-classic-orders-parity .orders-type-filter__button-label {
    display: none;
  }

  body.current-orders-page .next-classic-orders-parity .orders-type-filter__button-dot {
    position: absolute;
    top: 7px;
    right: 7px;
    width: 6px;
    height: 6px;
    box-shadow: 0 0 0 2px #fff;
  }

  body.current-orders-page .next-classic-orders-parity .orders-type-filter__panel {
    position: fixed;
    top: auto;
    right: 10px;
    bottom: 14px;
    left: 10px;
    width: auto;
    max-height: min(72dvh, 520px);
    overflow-y: auto;
    border-radius: 22px;
    padding: 12px;
    box-shadow: 0 24px 70px rgba(2, 6, 23, .25);
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-card {
    border-radius: 17px;
    padding: 10px 11px;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-thumb {
    width: 42px;
    height: 42px;
    border-radius: 12px;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-title {
    font-size: 14px;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-type {
    max-width: 118px;
    height: 18px;
    font-size: 8px;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-est-value {
    font-size: 16px;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-card .co-status-btn {
    min-height: 28px;
    max-width: 118px;
    padding: 5px 9px;
    font-size: 9px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-progress {
    min-width: 42px;
    height: 30px;
    padding: 0 7px;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-progress--icon-only {
    width: 30px;
    min-width: 30px;
    padding: 0;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-progress strong {
    font-size: 8px;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary {
    gap: 6px;
    margin-top: 9px;
  }

  body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary > div {
    min-height: 54px;
    padding: 8px 9px;
    border-radius: 13px;
  }
}

/* Stage 2B — Orders Review polish ------------------------------------------
 * Keep the Classic supervisor workflow and API contracts while matching the
 * newer Current Orders visual language and phone-first interaction model.
 */
body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-wrap {
  display: grid;
  gap: 8px;
  margin: 10px 0 14px;
  padding: 10px;
  border: 1px solid rgba(226, 232, 240, .96);
  border-radius: 24px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 16px 34px rgba(15, 23, 42, .07);
}

body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-summary {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 1px 4px 0;
  color: #64748b;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.2;
}

body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-summary span,
body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-summary strong,
body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-summary em {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  white-space: nowrap;
}

body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-summary span {
  color: #475569;
  background: #f8fafc;
  border: 1px solid #e8edf3;
}
body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-summary strong {
  color: #0f172a;
  background: #eef2ff;
  border: 1px solid #e0e7ff;
  font-weight: 850;
}
body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-summary em {
  color: #9a3412;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  font-style: normal;
  font-weight: 850;
}

body.orders-review-page .next-classic-orders-parity .orders-toolbar {
  gap: 9px;
  margin: 0;
  padding: 0;
}
body.orders-review-page .next-classic-orders-parity .orders-toolbar__scroll { border-radius: 18px; }
body.orders-review-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs {
  gap: 5px;
  min-width: max-content;
  padding: 4px;
  border: 1px solid #edf1f5;
  border-radius: 18px;
  background: #f8fafc;
}
body.orders-review-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs::before { display: none; }
body.orders-review-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 95px;
  min-height: 46px;
  padding: 6px 10px;
  border-radius: 14px;
  border: 1px solid transparent;
  color: #64748b;
}
body.orders-review-page .next-classic-orders-parity .orders-toolbar .tab-portfolio.active,
body.orders-review-page .next-classic-orders-parity .orders-toolbar .tab-portfolio.is-active {
  border-color: #111827;
  background: #050816;
  color: #fff;
  box-shadow: 0 9px 20px rgba(2, 6, 23, .16);
}
body.orders-review-page .next-classic-orders-parity .order-status-tab__icon {
  display: grid;
  place-items: center;
  flex: 0 0 29px;
  width: 29px;
  height: 29px;
  border-radius: 10px;
  background: rgba(148, 163, 184, .11);
}
body.orders-review-page .next-classic-orders-parity .order-status-tab__icon svg { width: 15px; height: 15px; }
body.orders-review-page .next-classic-orders-parity .order-status-tab__copy {
  display: grid;
  gap: 2px;
  min-width: 0;
  text-align: left;
}
body.orders-review-page .next-classic-orders-parity .order-status-tab__label {
  max-width: 88px;
  overflow: hidden;
  color: inherit;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.orders-review-page .next-classic-orders-parity .order-status-tab__count {
  color: #94a3b8;
  font-size: 8px;
  font-weight: 850;
  line-height: 1;
}
body.orders-review-page .next-classic-orders-parity .orders-toolbar .tab-portfolio.active .order-status-tab__count,
body.orders-review-page .next-classic-orders-parity .orders-toolbar .tab-portfolio.is-active .order-status-tab__count { color: #cbd5e1; }
body.orders-review-page .next-classic-orders-parity .orders-toolbar__divider {
  display: block;
  width: 1px;
  height: 40px;
  margin: 0 1px;
  background: #e7ebf0;
}
body.orders-review-page .next-classic-orders-parity .orders-type-filter__button {
  min-height: 46px;
  max-width: 180px;
  padding: 0 14px;
  border: 1px solid #e7ebf0;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 6px 16px rgba(15, 23, 42, .045);
}
body.orders-review-page .next-classic-orders-parity .orders-type-filter__button-label {
  overflow: hidden;
  max-width: 116px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.orders-review-page .next-classic-orders-parity .orders-type-filter__panel {
  width: min(340px, calc(100vw - 28px));
  border: 1px solid #e4e9ef;
  border-radius: 20px;
  padding: 10px;
  box-shadow: 0 22px 60px rgba(15, 23, 42, .18);
}
body.orders-review-page .next-classic-orders-parity .orders-type-filter__option {
  min-height: 58px;
  border-radius: 14px;
}
body.orders-review-page .next-classic-orders-parity .orders-type-filter__option-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 11px;
  background: var(--otf-icon-bg, #f8fafc);
  color: var(--otf-icon-fg, #334155);
  border: 1px solid var(--otf-icon-border, #e2e8f0);
}
body.orders-review-page .next-classic-orders-parity .orders-type-filter__option-title { font-size: 10px; }
body.orders-review-page .next-classic-orders-parity .orders-type-filter__option-sub { font-size: 8px; }

body.orders-review-page .next-classic-orders-parity #sv-orders.card {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
body.orders-review-page .next-classic-orders-parity .co-cards { gap: 10px; }
body.orders-review-page .next-classic-orders-parity .next-review-order-card {
  position: relative;
  overflow: hidden;
  border-color: #e7ebf1;
  border-radius: 20px;
  padding: 12px 13px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .055);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(180deg, rgba(249, 115, 22, .78), rgba(249, 115, 22, .16));
  opacity: .55;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-card:hover {
  transform: translateY(-1px);
  border-color: #dce2ea;
  box-shadow: 0 15px 30px rgba(15, 23, 42, .08);
}
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-top { gap: 11px; }
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-thumb {
  width: 48px;
  height: 48px;
  border-radius: 14px;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-thumb svg { width: 22px; height: 22px; }
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-title {
  font-size: 16px;
  letter-spacing: -.015em;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  margin-top: 4px;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-meta .co-sub {
  margin: 0;
  font-size: 10.5px;
  white-space: nowrap;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-type {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 180px;
  height: 20px;
  padding: 0 7px;
  border: 1px solid #edf1f5;
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  font-size: 9px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-createdby {
  margin-top: 5px;
  color: #334155;
  font-size: 10px;
  font-weight: 850;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-qty {
  padding: 4px 7px;
  margin-left: 4px;
  border: 1px solid #edf1f5;
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  font-size: 10px;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-divider {
  margin: 9px 0;
  background: #eef2f6;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-est-label { font-size: 10px; }
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-est-value {
  margin-top: 3px;
  font-size: 18px;
  letter-spacing: -.025em;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-actions { gap: 7px; }
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-status-btn {
  min-height: 30px;
  padding: 6px 11px;
  font-size: 10px;
  box-shadow: none;
}
body.orders-review-page .next-classic-orders-parity .next-review-creator-btn {
  display: grid !important;
  place-items: center !important;
  grid-template-columns: 1fr !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #020617 !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(2, 6, 23, .14);
}
body.orders-review-page .next-classic-orders-parity .next-review-creator-btn svg {
  display: block;
  width: 15px;
  height: 15px;
  margin: 0 !important;
  transform: none !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-summary > div {
  min-width: 0;
  min-height: 62px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 10px 11px;
  border: 1px solid #e8edf3;
  border-radius: 15px;
  background: #f8fafc;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-summary > div > span:first-child {
  color: #94a3b8;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-summary strong {
  min-width: 0;
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
  overflow-wrap: anywhere;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-summary__status .co-status-btn,
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-summary__status .sv-mixed-approval-pill {
  align-self: flex-start;
  min-height: 26px;
  padding: 5px 9px;
  font-size: 9px;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-context {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 8px;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-type,
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-creator {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 850;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-type {
  border: 1px solid var(--review-type-border, #e2e8f0);
  background: var(--review-type-bg, #f8fafc);
  color: var(--review-type-fg, #334155);
}
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-creator {
  border: 1px solid #e8edf3;
  background: #f8fafc;
  color: #475569;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-type svg,
body.orders-review-page .next-classic-orders-parity .next-review-order-modal-creator svg { width: 12px; height: 12px; }

body.orders-review-page .next-classic-orders-parity .next-review-bulk-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  background: linear-gradient(135deg, #fbfdff, #f8fafc);
}
body.orders-review-page .next-classic-orders-parity .next-review-bulk-actions > div:first-child span,
body.orders-review-page .next-classic-orders-parity .next-review-bulk-actions > div:first-child strong { display: block; }
body.orders-review-page .next-classic-orders-parity .next-review-bulk-actions > div:first-child span {
  color: #0f172a;
  font-size: 10px;
  font-weight: 900;
}
body.orders-review-page .next-classic-orders-parity .next-review-bulk-actions > div:first-child strong {
  margin-top: 3px;
  color: #94a3b8;
  font-size: 8px;
  font-weight: 700;
}
body.orders-review-page .next-classic-orders-parity .next-review-order-item {
  border-color: #edf1f5;
  border-radius: 15px;
  background: #fff;
}
body.orders-review-page .next-classic-orders-parity .next-review-item-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
  width: 100%;
}
body.orders-review-page .next-classic-orders-parity .next-review-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 31px;
  padding: 0 9px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  color: #475569;
  font: inherit;
  font-size: 9px;
  font-weight: 850;
  cursor: pointer;
}
body.orders-review-page .next-classic-orders-parity .next-review-action-btn svg { width: 12px; height: 12px; }
body.orders-review-page .next-classic-orders-parity .next-review-action-btn--edit { background: #f8fafc; color: #334155; }
body.orders-review-page .next-classic-orders-parity .next-review-action-btn--reject { border-color: #fecaca; background: #fff5f5; color: #b91c1c; }
body.orders-review-page .next-classic-orders-parity .next-review-action-btn--approve { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
body.orders-review-page .next-classic-orders-parity .next-review-action-btn:disabled { opacity: .55; cursor: wait; }

body.orders-review-page .next-classic-orders-parity .next-review-editor-dialog { width: min(760px, calc(100vw - 28px)); }
body.orders-review-page .next-classic-orders-parity .next-review-edit-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 1.25fr);
  gap: 12px;
  align-items: center;
  border: 1px solid #e8edf3;
  border-radius: 15px;
  padding: 11px;
  background: #fff;
}
body.orders-review-page .next-classic-orders-parity .next-review-status-picker {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  padding: 4px;
  border: 1px solid #e8edf3;
  border-radius: 13px;
  background: #f8fafc;
}
body.orders-review-page .next-classic-orders-parity .next-review-status-choice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 34px;
  padding: 0 7px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: #64748b;
  font: inherit;
  font-size: 8.5px;
  font-weight: 850;
  cursor: pointer;
}
body.orders-review-page .next-classic-orders-parity .next-review-status-choice svg { width: 12px; height: 12px; }
body.orders-review-page .next-classic-orders-parity .next-review-status-choice--pending.is-active { border-color: #fde68a; background: #fffbeb; color: #92400e; }
body.orders-review-page .next-classic-orders-parity .next-review-status-choice--approved.is-active { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
body.orders-review-page .next-classic-orders-parity .next-review-status-choice--rejected.is-active { border-color: #fecaca; background: #fff5f5; color: #b91c1c; }
body.orders-review-page .next-classic-orders-parity .next-review-status-choice:disabled { opacity: .55; cursor: wait; }

body.orders-review-page .next-review-creator-popover {
  z-index: 2200;
  width: min(330px, calc(100vw - 24px));
}
body.orders-review-page .next-review-creator-popover .creator-profile-window { max-height: min(520px, calc(100dvh - 28px)); overflow: auto; }
body.orders-review-page .next-review-creator-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 768px) {
  body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-wrap {
    margin-top: 8px;
    padding: 8px;
    border-radius: 20px;
  }
  body.orders-review-page .next-classic-orders-parity .orders-toolbar { gap: 7px; }
  body.orders-review-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs { gap: 4px; padding: 3px; }
  body.orders-review-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
    min-width: 80px;
    min-height: 44px;
    gap: 7px;
    padding: 6px 8px;
    border-radius: 12px;
  }
  body.orders-review-page .next-classic-orders-parity .order-status-tab__icon {
    flex-basis: 27px;
    width: 27px;
    height: 27px;
    border-radius: 9px;
  }
  body.orders-review-page .next-classic-orders-parity .order-status-tab__label { font-size: 10px; }
  body.orders-review-page .next-classic-orders-parity .orders-toolbar__divider { height: 38px; }
  body.orders-review-page .next-classic-orders-parity .orders-type-filter__button {
    min-height: 42px;
    max-width: 130px;
    padding: 0 11px;
    border-radius: 13px;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-order-modal-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.orders-review-page .next-classic-orders-parity .next-review-bulk-actions { align-items: stretch; flex-direction: column; }
  body.orders-review-page .next-classic-orders-parity .next-review-bulk-actions .next-classic-review-actions { width: 100%; }
  body.orders-review-page .next-classic-orders-parity .next-review-edit-item { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-summary {
    overflow-x: auto;
    padding-bottom: 1px;
    scrollbar-width: none;
  }
  body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-summary::-webkit-scrollbar { display: none; }
  body.orders-review-page .next-classic-orders-parity .orders-toolbar .tab-portfolio { min-width: 72px; }
  body.orders-review-page .next-classic-orders-parity .order-status-tab__copy { gap: 1px; }
  body.orders-review-page .next-classic-orders-parity .order-status-tab__label {
    max-width: 44px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  body.orders-review-page .next-classic-orders-parity .orders-toolbar__divider { display: none; }
  body.orders-review-page .next-classic-orders-parity .orders-type-filter__button {
    position: relative;
    width: 42px;
    min-width: 42px;
    max-width: 42px;
    height: 42px;
    padding: 0;
    justify-content: center;
  }
  body.orders-review-page .next-classic-orders-parity .orders-type-filter__button-label { display: none; }
  body.orders-review-page .next-classic-orders-parity .orders-type-filter__button-dot {
    position: absolute;
    top: 7px;
    right: 7px;
    width: 6px;
    height: 6px;
    box-shadow: 0 0 0 2px #fff;
  }
  body.orders-review-page .next-classic-orders-parity .orders-type-filter__panel {
    position: fixed;
    top: auto;
    right: 10px;
    bottom: 14px;
    left: 10px;
    width: auto;
    max-height: min(72dvh, 520px);
    overflow-y: auto;
    border-radius: 22px;
    padding: 12px;
    box-shadow: 0 24px 70px rgba(2, 6, 23, .25);
  }
  body.orders-review-page .next-classic-orders-parity .next-review-order-card {
    border-radius: 17px;
    padding: 10px 11px;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-thumb {
    width: 42px;
    height: 42px;
    border-radius: 12px;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-title { font-size: 14px; }
  body.orders-review-page .next-classic-orders-parity .next-review-order-type {
    max-width: 112px;
    height: 18px;
    font-size: 8px;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-est-value { font-size: 16px; }
  body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-status-btn {
    min-height: 28px;
    max-width: 112px;
    padding: 5px 9px;
    font-size: 9px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-creator-btn {
    width: 31px !important;
    min-width: 31px !important;
    height: 31px !important;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-order-modal-summary { gap: 6px; margin-top: 9px; }
  body.orders-review-page .next-classic-orders-parity .next-review-order-modal-summary > div {
    min-height: 54px;
    padding: 8px 9px;
    border-radius: 13px;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-item-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-action-btn {
    min-width: 0;
    min-height: 34px;
    padding: 0 5px;
    font-size: 8px;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-status-picker {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  body.orders-review-page .next-classic-orders-parity .next-review-status-choice { justify-content: flex-start; min-height: 36px; padding: 0 10px; }
  body.orders-review-page .next-review-creator-popover {
    left: 10px !important;
    right: 10px !important;
    width: auto;
    max-width: none;
  }
}

/* Stage 2B — Orders toolbar background + review width parity ---------------- */
/*
 * Keep the floating Classic tab/filter controls, but remove the extra white
 * wrapper surface around them. The white orders-list surface is intentionally
 * left intact.
 */
body.current-orders-page .next-classic-orders-parity .next-current-orders-toolbar-wrap,
body.orders-review-page .next-classic-orders-parity .next-orders-review-toolbar-wrap {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Orders Review keeps the existing white orders background. Only its
   horizontal inner padding is removed so each order card gets the same
   full-width footprint as Current Orders. */
body.orders-review-page .next-classic-orders-parity #sv-orders.card {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Stage 2B — Current Orders / Orders Review card parity cleanup -------------
 * Orders Review uses the same full-width card footprint as Current Orders.
 * The list surface remains transparent; only the actual order cards are white.
 */
body.orders-review-page .next-classic-orders-parity #sv-orders.orders-review-list-surface {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.orders-review-page .next-classic-orders-parity #sv-list {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* Keep Review cards on the exact same outer footprint as Current Orders. */
body.orders-review-page .next-classic-orders-parity #sv-list > .next-review-order-card {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

/* Remove the decorative orange left accent from both order-card variants. */
body.current-orders-page .next-classic-orders-parity .next-current-order-card::before,
body.orders-review-page .next-classic-orders-parity .next-review-order-card::before {
  content: none !important;
  display: none !important;
}

/* Stage 2C — Operations Orders Next.js visual parity ------------------------
 * Keep the existing Operations Orders workflow/API logic, while matching the
 * compact card, toolbar and modal language used by Current Orders / Review.
 */
body.operations-orders-page .next-classic-orders-parity .next-operations-orders-toolbar-wrap {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.operations-orders-page .next-classic-orders-parity .orders-toolbar {
  gap: 9px;
  margin: 0;
  padding: 0;
}

body.operations-orders-page .next-classic-orders-parity .orders-toolbar__scroll {
  border-radius: 18px;
}

body.operations-orders-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs {
  gap: 5px;
  min-width: max-content;
  padding: 4px;
  border-radius: 18px;
  background: #f8fafc;
  border: 1px solid #edf1f5;
}

body.operations-orders-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs::before {
  border-radius: 14px;
  background: linear-gradient(180deg, #101827 0%, #020617 100%);
  box-shadow: 0 10px 22px rgba(2, 6, 23, .18);
}

body.operations-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
  flex: 0 0 auto;
  width: auto;
  min-width: 88px;
  min-height: 48px;
  flex-direction: row;
  justify-content: flex-start;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 14px;
  text-align: left;
}

body.operations-orders-page .next-classic-orders-parity .order-status-tab__icon {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  box-shadow: none;
}

body.operations-orders-page .next-classic-orders-parity .order-status-tab__icon svg {
  width: 15px;
  height: 15px;
}

body.operations-orders-page .next-classic-orders-parity .order-status-tab__copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}

body.operations-orders-page .next-classic-orders-parity .order-status-tab__label {
  display: block !important;
  max-width: none;
  color: inherit;
  font-size: 11px;
  line-height: 1.05;
  white-space: nowrap;
}

body.operations-orders-page .next-classic-orders-parity .orders-toolbar__divider {
  height: 42px;
  background: #e2e8f0;
}

body.operations-orders-page .next-classic-orders-parity .orders-type-filter__button {
  min-height: 46px;
  max-width: 190px;
  padding: 0 14px;
  border-radius: 15px;
  background: #fff;
  box-shadow: none;
}

body.operations-orders-page .next-classic-orders-parity .orders-type-filter__button-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.operations-orders-page .next-classic-orders-parity .orders-type-filter__panel {
  top: calc(100% + 9px);
  width: min(330px, calc(100vw - 28px));
  border-radius: 20px;
  padding: 10px;
  z-index: 120;
}

body.operations-orders-page .next-classic-orders-parity .orders-type-filter__option {
  min-height: 58px;
  padding: 9px 10px;
  border-radius: 15px;
}

body.operations-orders-page .next-classic-orders-parity .orders-type-filter__option-icon {
  flex-basis: 36px;
  width: 36px;
  height: 36px;
  border-radius: 12px;
}

body.operations-orders-page .next-classic-orders-parity .operations-orders-list-surface,
body.operations-orders-page .next-classic-orders-parity #requested-list {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.operations-orders-page .next-classic-orders-parity #requested-list {
  gap: 10px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card {
  position: relative;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
  border-color: #e7ebf1;
  border-radius: 20px;
  padding: 12px 13px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .055);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card::before {
  content: none !important;
  display: none !important;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card:hover {
  transform: translateY(-1px);
  border-color: #dce2ea;
  box-shadow: 0 15px 30px rgba(15, 23, 42, .08);
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-top {
  gap: 11px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-thumb {
  width: 48px;
  height: 48px;
  border-radius: 14px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-thumb svg {
  width: 22px;
  height: 22px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-title {
  font-size: 16px;
  letter-spacing: -.015em;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  margin-top: 4px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-meta .co-sub {
  margin: 0;
  font-size: 10.5px;
  white-space: nowrap;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-qty {
  padding: 4px 7px;
  margin-left: 4px;
  border: 1px solid #edf1f5;
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  font-size: 10px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-divider {
  margin: 9px 0;
  background: #eef2f6;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-est-label {
  font-size: 8px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-est-value {
  margin-top: 3px;
  font-size: 18px;
  letter-spacing: -.025em;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-actions {
  gap: 7px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-createdby-summary {
  min-width: 0;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-createdby-name {
  max-width: min(320px, 42vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  /* Creator name: increased by 30% from the previous 8px value. */
  font-size: 10.4px !important;
  line-height: 1.2;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-summary-actions {
  align-items: center;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-summary-actions > .co-status-btn,
body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-summary-actions > .sv-mixed-approval-pill {
  flex: 0 0 auto;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-total {
  min-width: 132px;
  text-align: right;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-total .co-est-value {
  white-space: nowrap;
}


body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-status-btn {
  min-height: 30px;
  padding: 6px 11px;
  font-size: 10px;
  box-shadow: none;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-creator-btn {
  display: grid !important;
  place-items: center !important;
  grid-template-columns: 1fr !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #020617 !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(2, 6, 23, .14);
  cursor: pointer;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-creator-btn svg {
  display: block;
  width: 15px;
  height: 15px;
  margin: 0 !important;
  transform: none !important;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary > div {
  min-width: 0;
  min-height: 62px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 10px 11px;
  border: 1px solid #e8edf3;
  border-radius: 15px;
  background: #f8fafc;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary > div > span:first-child {
  color: #94a3b8;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary strong {
  min-width: 0;
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary__total strong {
  font-size: 13px;
  white-space: nowrap;
  overflow-wrap: normal;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary__status .co-status-btn,
body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary__status .sv-mixed-approval-pill {
  align-self: flex-start;
  min-height: 26px;
  padding: 5px 9px;
  font-size: 9px;
}

body.operations-orders-page .next-operations-creator-popover {
  z-index: 2200;
  width: min(330px, calc(100vw - 24px));
}

body.operations-orders-page .next-operations-creator-popover .creator-profile-window {
  max-height: min(520px, calc(100dvh - 28px));
  overflow: auto;
}

body.operations-orders-page .next-operations-creator-fields {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 768px) {
  body.operations-orders-page .next-classic-orders-parity .orders-toolbar {
    gap: 7px;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs {
    gap: 4px;
    padding: 3px;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
    min-width: 80px;
    min-height: 44px;
    gap: 7px;
    padding: 6px 8px;
    border-radius: 12px;
  }

  body.operations-orders-page .next-classic-orders-parity .order-status-tab__icon {
    flex-basis: 27px;
    width: 27px;
    height: 27px;
    border-radius: 9px;
  }

  body.operations-orders-page .next-classic-orders-parity .order-status-tab__label {
    font-size: 10px;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar__divider {
    height: 38px;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter__button {
    min-height: 42px;
    max-width: 130px;
    padding: 0 11px;
    border-radius: 13px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  body.operations-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
    min-width: 72px;
  }

  body.operations-orders-page .next-classic-orders-parity .order-status-tab__label {
    max-width: 48px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar__divider {
    display: none;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter__button {
    position: relative;
    width: 42px;
    min-width: 42px;
    max-width: 42px;
    height: 42px;
    padding: 0;
    justify-content: center;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter__button-label {
    display: none;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter__button-dot {
    position: absolute;
    top: 7px;
    right: 7px;
    width: 6px;
    height: 6px;
    box-shadow: 0 0 0 2px #fff;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter__panel {
    position: fixed;
    top: auto;
    right: 10px;
    bottom: 14px;
    left: 10px;
    width: auto;
    max-height: min(72dvh, 520px);
    overflow-y: auto;
    border-radius: 22px;
    padding: 12px;
    box-shadow: 0 24px 70px rgba(2, 6, 23, .25);
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card {
    border-radius: 17px;
    padding: 10px 11px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-thumb {
    width: 42px;
    height: 42px;
    border-radius: 12px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-title {
    font-size: 14px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-est-value {
    font-size: 16px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-status-btn {
    min-height: 28px;
    max-width: 112px;
    padding: 5px 9px;
    font-size: 9px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-creator-btn {
    width: 31px !important;
    min-width: 31px !important;
    height: 31px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary {
    gap: 6px;
    margin-top: 9px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary > div {
    min-height: 54px;
    padding: 8px 9px;
    border-radius: 13px;
  }

  body.operations-orders-page .next-operations-creator-popover {
    left: 10px !important;
    right: 10px !important;
    width: auto;
    max-width: none;
  }
}

/* Operations Orders — Classic action/receipt refinements --------------------
 * Keep the existing workflow logic, but pin the React controls to the compact
 * Classic proportions on touch devices as well as desktop.
 */
body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu {
  position: relative;
  flex: 0 0 auto;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu .ops-download-trigger {
  min-width: 148px;
  min-height: 44px;
  gap: 8px;
  padding: 0 10px 0 13px;
  border-radius: 14px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu .ops-download-trigger > svg:first-child {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu .ops-download-trigger__arrow {
  width: 23px !important;
  height: 23px !important;
  flex: 0 0 23px;
  margin-left: auto;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu .download-menu__panel {
  top: calc(100% + 8px);
  right: 0;
  width: 218px;
  min-width: 218px;
  padding: 6px;
  border-radius: 15px;
  overflow: hidden;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu .download-menu__item {
  min-height: 44px;
  padding: 9px 10px;
  border-radius: 11px;
  font-size: 12px;
  line-height: 1.2;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu .download-menu__item svg {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px;
  flex: 0 0 18px;
  stroke-width: 2.1;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu .download-menu__sep {
  margin: 4px 7px;
}

/* Receive Components: purpose-built responsive sub-modal. The previous React
   version reused the wide Operations edit dialog, which made the form clip
   against the mobile viewport/sidebar. */
body.operations-orders-page .next-operations-receive-modal {
  padding: 18px;
  overflow: auto;
  overscroll-behavior: contain;
}

body.operations-orders-page .next-operations-receive-dialog {
  width: min(620px, calc(100vw - 36px));
  max-width: 620px;
  max-height: min(88dvh, 760px);
  padding: 0;
  overflow: hidden;
  border-radius: 26px;
  border: 1px solid rgba(15, 23, 42, .09);
  background: #fff;
  box-shadow: 0 32px 90px rgba(2, 6, 23, .30);
  display: flex;
  flex-direction: column;
}

body.operations-orders-page .next-operations-receive-dialog .co-submodal-close {
  top: 15px;
  right: 15px;
  width: 38px;
  height: 38px;
  z-index: 3;
}

body.operations-orders-page .next-operations-receive-header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 20px 64px 16px 20px;
  border-bottom: 1px solid #edf1f5;
  background: linear-gradient(180deg, #fff 0%, #fbfcfe 100%);
}

body.operations-orders-page .next-operations-receive-header .req-edit-icon {
  width: 42px;
  min-width: 42px;
  height: 42px;
  border-radius: 14px;
}

body.operations-orders-page .next-operations-receive-header .req-edit-icon svg {
  width: 19px;
  height: 19px;
}

body.operations-orders-page .next-operations-receive-header .co-submodal-title {
  padding-right: 0;
  font-size: 19px;
  line-height: 1.15;
}

body.operations-orders-page .next-operations-receive-header .co-submodal-sub {
  max-width: 440px;
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.45;
}

body.operations-orders-page .next-operations-receive-body {
  min-height: 0;
  margin-top: 0;
  padding: 16px 20px;
  overflow-y: auto;
  overflow-x: hidden;
}

body.operations-orders-page .next-operations-receive-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

body.operations-orders-page .next-operations-receive-field {
  min-width: 0;
  display: grid;
  gap: 6px;
}

body.operations-orders-page .next-operations-receive-field .co-submodal-label {
  margin: 0;
  color: #111827;
  font-size: 11px;
  font-weight: 900;
}

body.operations-orders-page .next-operations-receive-field .co-submodal-label em {
  margin-left: 4px;
  color: #94a3b8;
  font-style: normal;
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}

body.operations-orders-page .next-operations-receive-field .co-submodal-input {
  width: 100%;
  min-height: 44px;
  height: 44px;
  border-radius: 14px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 750;
}

body.operations-orders-page .next-operations-receive-search {
  position: relative;
  display: block;
  margin-top: 12px;
}

body.operations-orders-page .next-operations-receive-search .co-submodal-input {
  width: 100%;
  min-height: 42px;
  height: 42px;
  padding: 0 12px;
  border-radius: 14px;
  font-size: 12px;
  font-weight: 750;
}

body.operations-orders-page .next-operations-receive-search .co-submodal-input::-webkit-search-cancel-button {
  cursor: pointer;
}

body.operations-orders-page .next-operations-receive-quantities {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid #edf1f5;
}

body.operations-orders-page .next-operations-receive-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 9px;
}

body.operations-orders-page .next-operations-receive-section-head > div:first-child {
  display: grid;
  gap: 2px;
}

body.operations-orders-page .next-operations-receive-head-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

body.operations-orders-page .next-operations-receive-check {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}

body.operations-orders-page .next-operations-receive-check input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

body.operations-orders-page .next-operations-receive-check-box {
  width: 24px;
  min-width: 24px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border: 1.5px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: transparent;
  box-shadow: 0 3px 10px rgba(15, 23, 42, .05);
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}

body.operations-orders-page .next-operations-receive-check-box > span {
  transform: scale(.65);
  font-size: 13px;
  line-height: 1;
  font-weight: 950;
  transition: transform .16s ease;
}

body.operations-orders-page .next-operations-receive-check:hover .next-operations-receive-check-box {
  border-color: #f59e0b;
  box-shadow: 0 4px 14px rgba(245, 158, 11, .12);
}

body.operations-orders-page .next-operations-receive-check.is-checked .next-operations-receive-check-box {
  border-color: #f59e0b;
  background: linear-gradient(145deg, #fff7d6 0%, #ffedd5 100%);
  color: #c2410c;
  box-shadow: 0 5px 15px rgba(234, 88, 12, .14);
}

body.operations-orders-page .next-operations-receive-check.is-checked .next-operations-receive-check-box > span {
  transform: scale(1);
}

body.operations-orders-page .next-operations-receive-check.is-disabled {
  cursor: not-allowed;
  opacity: .45;
}

body.operations-orders-page .next-operations-receive-check--all {
  min-height: 34px;
  padding: 4px 10px 4px 7px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  color: #475569;
  box-shadow: 0 3px 12px rgba(15, 23, 42, .04);
}

body.operations-orders-page .next-operations-receive-check--all.is-checked {
  border-color: #fed7aa;
  background: #fffaf2;
  color: #9a3412;
}

body.operations-orders-page .next-operations-receive-check--all .next-operations-receive-check-box {
  width: 22px;
  min-width: 22px;
  height: 22px;
  border-radius: 7px;
}

body.operations-orders-page .next-operations-receive-check-label {
  font-size: 9px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .01em;
  white-space: nowrap;
}

body.operations-orders-page .next-operations-receive-kicker {
  color: #94a3b8;
  font-size: 8px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.operations-orders-page .next-operations-receive-section-head strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 950;
}

body.operations-orders-page .next-operations-receive-count {
  min-width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  padding: 0 8px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 10px;
  font-weight: 900;
}

body.operations-orders-page .next-operations-receive-list {
  display: grid;
  gap: 8px;
}

body.operations-orders-page .next-operations-receive-empty {
  padding: 22px 14px;
  border: 1px dashed #dbe3ec;
  border-radius: 16px;
  background: #fbfcfe;
  color: #64748b;
  text-align: center;
  font-size: 11px;
  font-weight: 800;
}

body.operations-orders-page .next-operations-receive-row {
  min-width: 0;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) minmax(210px, 236px);
  align-items: center;
  gap: 10px;
  padding: 10px 10px 10px 11px;
  border: 1px solid #e8edf3;
  border-radius: 16px;
  background: #fbfcfe;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

body.operations-orders-page .next-operations-receive-row.is-selected {
  border-color: #fed7aa;
  background: linear-gradient(90deg, #fffaf4 0%, #fbfcfe 48%);
  box-shadow: 0 5px 16px rgba(234, 88, 12, .055);
}

body.operations-orders-page .next-operations-receive-check--row {
  align-self: center;
}

body.operations-orders-page .next-operations-receive-info {
  min-width: 0;
  display: grid;
  gap: 4px;
}

body.operations-orders-page .next-operations-receive-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #111827;
  font-size: 12px;
  font-weight: 900;
}

body.operations-orders-page .next-operations-receive-sub {
  color: #64748b;
  font-size: 9.5px;
  font-weight: 750;
  white-space: normal;
}

body.operations-orders-page .next-operations-receive-sub b {
  padding: 0 3px;
  color: #cbd5e1;
}

body.operations-orders-page .next-operations-receive-input-wrap {
  min-width: 0;
  display: grid;
  gap: 4px;
}

body.operations-orders-page .next-operations-receive-qty-controls {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: 8px;
}

body.operations-orders-page .next-operations-receive-input-wrap > span {
  color: #94a3b8;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
  text-align: center;
}

body.operations-orders-page .next-operations-receive-input {
  width: 100%;
  min-height: 38px !important;
  height: 38px !important;
  padding: 0 7px !important;
  border-radius: 12px !important;
  text-align: center;
  font-size: 13px !important;
  font-weight: 900 !important;
}

body.operations-orders-page .next-operations-receive-input-wrap--readonly .next-operations-receive-input {
  cursor: default;
  border-color: #e2e8f0 !important;
  background: #f1f5f9 !important;
  color: #475569 !important;
  box-shadow: none !important;
}

body.operations-orders-page .next-operations-receive-actions {
  flex: 0 0 auto;
  margin: 0;
  padding: 12px 20px 16px;
  border-top: 1px solid #edf1f5;
  background: #fff;
}

body.operations-orders-page .next-operations-receive-actions .ro-action-btn {
  min-height: 42px;
  border-radius: 13px;
}

/* Keep the Classic quantity-diff language explicit on all three converted
   order pages, even if later global styles are reorganized. */
body.current-orders-page .next-classic-orders-parity .sv-qty-diff,
body.orders-review-page .next-classic-orders-parity .sv-qty-diff,
body.operations-orders-page .next-classic-orders-parity .sv-qty-diff {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}

body.current-orders-page .next-classic-orders-parity .sv-qty-old,
body.orders-review-page .next-classic-orders-parity .sv-qty-old,
body.operations-orders-page .next-classic-orders-parity .sv-qty-old {
  color: #9ca3af;
  text-decoration: line-through;
  text-decoration-thickness: 1.5px;
}

body.current-orders-page .next-classic-orders-parity .sv-qty-new,
body.orders-review-page .next-classic-orders-parity .sv-qty-new,
body.operations-orders-page .next-classic-orders-parity .sv-qty-new {
  color: #000;
  font-weight: 900;
}

@media (max-width: 560px) {
  body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu .ops-download-trigger {
    min-width: 126px;
    min-height: 40px;
    padding: 0 8px 0 10px;
    border-radius: 13px;
    font-size: 11px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-download-menu .download-menu__panel {
    width: 196px;
    min-width: 196px;
  }

  body.operations-orders-page .next-operations-receive-modal {
    align-items: center;
    padding: 10px;
  }

  body.operations-orders-page .next-operations-receive-dialog {
    width: calc(100vw - 20px);
    max-width: none;
    max-height: min(90dvh, 720px);
    border-radius: 22px;
  }

  body.operations-orders-page .next-operations-receive-header {
    gap: 10px;
    padding: 16px 54px 13px 14px;
  }

  body.operations-orders-page .next-operations-receive-header .req-edit-icon {
    width: 36px;
    min-width: 36px;
    height: 36px;
    border-radius: 12px;
  }

  body.operations-orders-page .next-operations-receive-header .co-submodal-title {
    font-size: 17px;
  }

  body.operations-orders-page .next-operations-receive-header .co-submodal-sub {
    font-size: 10.5px;
  }

  body.operations-orders-page .next-operations-receive-body {
    padding: 13px 14px;
  }

  body.operations-orders-page .next-operations-receive-fields {
    grid-template-columns: 1fr;
    gap: 9px;
  }

  body.operations-orders-page .next-operations-receive-search {
    margin-top: 10px;
  }

  body.operations-orders-page .next-operations-receive-search .co-submodal-input {
    min-height: 40px;
    height: 40px;
    font-size: 11px;
  }

  body.operations-orders-page .next-operations-receive-row {
    grid-template-columns: 25px minmax(0, 1fr) minmax(176px, 196px);
    gap: 7px;
    padding: 9px;
    border-radius: 14px;
  }

  body.operations-orders-page .next-operations-receive-check--row .next-operations-receive-check-box {
    width: 22px;
    min-width: 22px;
    height: 22px;
    border-radius: 7px;
  }

  body.operations-orders-page .next-operations-receive-check--all {
    min-height: 32px;
    padding-right: 8px;
  }

  body.operations-orders-page .next-operations-receive-check-label {
    font-size: 8.5px;
  }

  body.operations-orders-page .next-operations-receive-qty-controls {
    gap: 6px;
  }

  body.operations-orders-page .next-operations-receive-name {
    font-size: 11px;
  }

  body.operations-orders-page .next-operations-receive-sub {
    font-size: 8.5px;
  }

  body.operations-orders-page .next-operations-receive-input {
    min-height: 36px !important;
    height: 36px !important;
    font-size: 12px !important;
  }

  body.operations-orders-page .next-operations-receive-actions {
    padding: 10px 14px 13px;
  }
}

/* Stage 2C — Maintenance Orders Classic workflow parity ---------------------
 * React keeps the Classic Maintenance Orders workflow and actions while the
 * controls remain touch-friendly inside the Next.js shell.
 */
body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-orders-toolbar-wrap {
  width: 100%;
  margin: 0 0 14px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar {
  gap: 9px;
  margin: 0;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar__scroll {
  min-width: 0;
  border-radius: 18px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar .portfolio-tabs {
  gap: 5px;
  min-width: max-content;
  padding: 4px;
  border-radius: 18px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar .tab-portfolio {
  flex: 0 0 auto;
  width: auto;
  min-width: 92px;
  min-height: 48px;
  flex-direction: row;
  justify-content: flex-start;
  gap: 8px;
  padding: 7px 10px;
  border: 0;
  border-radius: 14px;
  font-family: inherit;
}

body.page-maintenance-orders .next-classic-maintenance-parity .order-status-tab__icon {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  border-radius: 10px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .order-status-tab__icon svg {
  width: 15px;
  height: 15px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .order-status-tab__label {
  display: block !important;
  max-width: none;
  color: inherit;
  font-size: 11px;
  line-height: 1.05;
  white-space: nowrap;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar__divider {
  height: 42px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-type-filter__button {
  min-height: 46px;
  padding: 0 14px;
  border-radius: 15px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-type-filter__panel {
  top: calc(100% + 9px);
  width: min(330px, calc(100vw - 28px));
  border-radius: 20px;
  padding: 10px;
  z-index: 180;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-type-filter__option {
  min-height: 58px;
  padding: 9px 10px;
  border-radius: 15px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-orders-list-surface {
  width: 100%;
  margin: 0;
}

body.page-maintenance-orders .next-classic-maintenance-parity #requested-list {
  width: 100%;
  margin: 0;
  gap: 10px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  border-color: #e7ebf1;
  border-radius: 20px;
  padding: 12px 13px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .055);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card:hover {
  transform: translateY(-1px);
  border-color: #dce2ea;
  box-shadow: 0 15px 30px rgba(15, 23, 42, .08);
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-thumb {
  width: 48px;
  height: 48px;
  border-radius: 14px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-thumb svg {
  width: 22px;
  height: 22px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-title {
  font-size: 16px;
  letter-spacing: -.015em;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-qty {
  padding: 4px 7px;
  border: 1px solid #edf1f5;
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  font-size: 10px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-divider {
  margin: 9px 0;
  background: #eef2f6;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-est-label {
  font-size: 10px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-est-value {
  margin-top: 3px;
  font-size: 18px;
  letter-spacing: -.025em;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-status-btn {
  min-height: 30px;
  padding: 6px 11px;
  font-size: 10px;
  box-shadow: none;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-creator-btn {
  display: grid !important;
  place-items: center !important;
  grid-template-columns: 1fr !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #020617 !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(2, 6, 23, .14);
  cursor: pointer;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-creator-btn svg {
  display: block;
  width: 15px;
  height: 15px;
  margin: 0 !important;
  transform: none !important;
}

body.page-maintenance-orders .next-maintenance-creator-popover {
  z-index: 2200;
  width: min(330px, calc(100vw - 24px));
}

body.page-maintenance-orders .next-maintenance-creator-popover .creator-profile-window {
  max-height: min(520px, calc(100dvh - 28px));
  overflow: auto;
}

body.page-maintenance-orders .next-maintenance-creator-fields {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-details-dialog {
  width: min(680px, calc(100vw - 24px));
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-track-pill {
  grid-template-columns: auto 1fr auto 1fr auto 1fr auto;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-done-meta {
  margin-bottom: 12px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-actions {
  margin-bottom: 12px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-items {
  margin-top: 0;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-item {
  align-items: center;
  gap: 16px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-item .co-item-left,
body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-item .co-item-right {
  min-width: 0;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-item .co-item-right {
  flex: 1 1 46%;
  text-align: right;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-item .co-item-issue-desc {
  margin: 0;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-log-overlay,
body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-receipt-overlay {
  z-index: 2400;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-log-dialog {
  width: min(760px, calc(100vw - 28px));
  max-width: 760px;
  max-height: min(90dvh, 820px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-log-dialog .req-maintenance-log-body {
  min-height: 0;
  overflow: auto;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-log-card {
  overflow: visible;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select {
  position: relative;
  width: 100%;
  min-width: 0;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__trigger {
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 12px;
  border: 1px solid #dfe5ec;
  border-radius: 12px;
  background: #fff;
  color: #0f172a;
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__trigger > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__trigger svg {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  color: #64748b;
  transition: transform .16s ease;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select.is-open .next-maintenance-modern-select__trigger {
  border-color: #94a3b8;
  box-shadow: 0 0 0 3px rgba(148, 163, 184, .15);
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select.is-open .next-maintenance-modern-select__trigger svg {
  transform: rotate(180deg);
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__menu {
  position: absolute;
  z-index: 80;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  min-width: 100%;
  max-height: 290px;
  overflow: hidden;
  padding: 7px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 20px 45px rgba(15, 23, 42, .16);
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__search {
  padding: 2px 2px 7px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__search input {
  width: 100%;
  min-height: 38px;
  padding: 0 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  outline: 0;
  font: inherit;
  font-size: 12px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__options {
  max-height: 228px;
  overflow: auto;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__option {
  width: 100%;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #334155;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__option:hover,
body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__option.is-selected {
  background: #f1f5f9;
  color: #0f172a;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__option svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__empty {
  padding: 12px 10px;
  color: #94a3b8;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-spare-row .next-maintenance-modern-select__menu {
  z-index: 95;
}

body.page-maintenance-orders .next-classic-maintenance-parity .req-maintenance-spare-add__icon {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(15, 23, 42, .08);
  font-size: 14px;
  line-height: 1;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-receipt-dialog {
  width: min(560px, calc(100vw - 24px));
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-receipt-numbers .co-submodal-inputs {
  display: grid;
  gap: 7px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-upload-field {
  width: 100%;
  font-family: inherit;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-upload-field .co-upload-field__meta {
  max-width: 340px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.page-maintenance-orders .next-maintenance-receipt-photo {
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #fff;
  color: #334155;
  text-decoration: none;
}

body.page-maintenance-orders .next-maintenance-receipt-photo img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 10px;
  background: #f1f5f9;
}

body.page-maintenance-orders .next-maintenance-receipt-photo span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 750;
}

@media (max-width: 768px) {
  body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar {
    gap: 7px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar .portfolio-tabs {
    gap: 4px;
    padding: 3px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar .tab-portfolio {
    min-width: 82px;
    min-height: 44px;
    gap: 7px;
    padding: 6px 8px;
    border-radius: 12px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .order-status-tab__icon {
    flex-basis: 27px;
    width: 27px;
    height: 27px;
    border-radius: 9px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .order-status-tab__label {
    font-size: 10px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar__divider {
    height: 38px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .orders-type-filter__button {
    min-height: 42px;
    padding: 0 11px;
    border-radius: 13px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-item {
    align-items: flex-start;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-item .co-item-right {
    text-align: left;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-log-dialog {
    width: min(100% - 16px, 760px);
    max-height: 94dvh;
  }
}

@media (max-width: 560px) {
  body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar .tab-portfolio {
    min-width: 70px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .order-status-tab__label {
    max-width: 48px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar__divider {
    display: none;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .orders-type-filter__button {
    position: relative;
    width: 42px;
    min-width: 42px;
    max-width: 42px;
    height: 42px;
    padding: 0;
    justify-content: center;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .orders-type-filter__button-label {
    display: none;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .orders-type-filter__panel {
    position: fixed;
    top: auto;
    right: 10px;
    bottom: 14px;
    left: 10px;
    width: auto;
    max-height: min(72dvh, 520px);
    overflow-y: auto;
    border-radius: 22px;
    padding: 12px;
    box-shadow: 0 24px 70px rgba(2, 6, 23, .25);
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card {
    border-radius: 17px;
    padding: 10px 11px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-thumb {
    width: 42px;
    height: 42px;
    border-radius: 12px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-title {
    font-size: 14px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-est-value {
    font-size: 16px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-status-btn {
    min-height: 28px;
    max-width: 105px;
    padding: 5px 9px;
    font-size: 9px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-creator-btn {
    width: 31px !important;
    min-width: 31px !important;
    height: 31px !important;
  }

  body.page-maintenance-orders .next-maintenance-creator-popover {
    left: 10px !important;
    right: 10px !important;
    width: auto;
  }

  body.page-maintenance-orders .next-maintenance-creator-fields {
    grid-template-columns: 1fr;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-details-dialog {
    width: min(100% - 12px, 680px);
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-actions .ro-action-btn {
    width: 100%;
    justify-content: center;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modal-item {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-modern-select__menu {
    max-height: 250px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-receipt-dialog {
    width: min(100% - 16px, 560px);
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-upload-field .co-upload-field__meta {
    max-width: 205px;
  }
}

/* Maintenance Orders — receipt number rows (classic parity) */
.next-maintenance-receipt-inputs {
  display: grid;
  gap: 8px;
}
.next-maintenance-receipt-input-row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
}
.next-maintenance-receipt-input-row .co-submodal-input {
  flex: 1 1 auto;
  min-width: 0;
}
.next-maintenance-receipt-input-remove {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  color: #b42318;
  font: 700 20px/1 Arial, sans-serif;
  cursor: pointer;
}
.next-maintenance-receipt-input-remove:disabled {
  opacity: .5;
  cursor: not-allowed;
}

/* Stage 2D — Maintenance / Operations maintenance parity refresh ------------
 * Maintenance keeps the Classic workflow, but uses the same floating toolbar,
 * full-width cards and compact detail language as Current / Operations Orders.
 */
body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-orders-toolbar-wrap {
  width: 100% !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar {
  gap: 9px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar__scroll {
  min-width: 0;
  border-radius: 18px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar .portfolio-tabs {
  gap: 5px;
  min-width: max-content;
  padding: 4px;
  border: 1px solid #edf1f5;
  border-radius: 18px;
  background: #f8fafc;
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-toolbar .portfolio-tabs::before {
  border-radius: 14px;
  background: linear-gradient(180deg, #101827 0%, #020617 100%);
  box-shadow: 0 10px 22px rgba(2, 6, 23, .18);
}

body.page-maintenance-orders .next-classic-maintenance-parity .orders-type-filter__button {
  min-height: 46px;
  max-width: 190px;
  padding: 0 14px;
  border-radius: 15px;
  background: #fff;
  box-shadow: none;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-orders-list-surface,
body.page-maintenance-orders .next-classic-maintenance-parity #requested-list {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.page-maintenance-orders .next-classic-maintenance-parity #requested-list {
  gap: 10px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card {
  width: 100% !important;
  margin: 0 !important;
  padding: 12px 13px !important;
  border: 1px solid #e7ebf1 !important;
  border-radius: 20px !important;
  background: #fff !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .055) !important;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card::before {
  content: none !important;
  display: none !important;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-top {
  gap: 11px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-main {
  align-self: center;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-card .co-sub {
  margin-top: 4px;
  font-size: 10.5px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-card-note,
body.operations-orders-page .next-classic-orders-parity .next-operations-maintenance-card-note {
  min-height: 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-card-note .co-est-label,
body.operations-orders-page .next-classic-orders-parity .next-operations-maintenance-card-note .co-est-label {
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .015em;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-modal-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-modal-summary > div {
  min-width: 0;
  min-height: 62px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 10px 11px;
  border: 1px solid #e8edf3;
  border-radius: 15px;
  background: #f8fafc;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-modal-summary > div > span:first-child {
  color: #94a3b8;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-modal-summary strong {
  min-width: 0;
  overflow: hidden;
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-modal-summary__status strong {
  color: #166534;
}

/* Shared modern Log Maintenance modal — used from Operations and Maintenance. */
.next-maintenance-log-overlay {
  z-index: 2600 !important;
  padding: 18px !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

.next-maintenance-log-dialog {
  width: min(860px, calc(100vw - 28px)) !important;
  max-width: 860px !important;
  max-height: min(88dvh, 840px) !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(226, 232, 240, .95) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 28px 80px rgba(2, 6, 23, .28) !important;
}

.next-maintenance-log-dialog .next-maintenance-log-header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 13px;
  margin: 0 !important;
  padding: 18px 62px 16px 20px !important;
  border-bottom: 1px solid #eef2f6;
  background: linear-gradient(180deg, #fff 0%, #fbfdff 100%);
}

.next-maintenance-log-dialog .next-maintenance-log-header .req-edit-icon {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  margin: 0;
  border-radius: 14px;
  background: #fff7ed;
  color: #c2410c;
  box-shadow: inset 0 0 0 1px #fed7aa;
}

.next-maintenance-log-dialog .next-maintenance-log-header .req-edit-icon svg {
  width: 19px;
  height: 19px;
}

.next-maintenance-log-dialog .co-submodal-title {
  color: #0f172a;
  font-size: 20px;
  letter-spacing: -.025em;
}

.next-maintenance-log-dialog .co-submodal-sub {
  margin-top: 4px;
  color: #64748b;
  font-size: 11px;
}

.next-maintenance-log-dialog .req-maintenance-log-body {
  flex: 1 1 auto;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 14px 18px 18px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: #f8fafc;
}

.next-maintenance-log-dialog .req-maintenance-log-items {
  display: grid;
  gap: 12px;
}

.next-maintenance-log-dialog .next-maintenance-log-card {
  margin: 0;
  padding: 16px !important;
  overflow: visible !important;
  border: 1px solid #e6ebf1 !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .045) !important;
}

.next-maintenance-log-dialog .req-maintenance-log-card__head {
  margin-bottom: 16px;
  padding: 13px 14px;
  border: 1px solid #ffedd5;
  border-radius: 14px;
  background: linear-gradient(135deg, #fffaf5 0%, #ffffff 72%);
}

.next-maintenance-log-dialog .req-maintenance-log-card__label {
  color: #c2410c;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.next-maintenance-log-dialog .req-maintenance-log-card__title {
  margin-top: 4px;
  color: #0f172a;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -.015em;
}

.next-maintenance-log-dialog .req-maintenance-log-card__issue {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(251, 146, 60, .16);
  color: #64748b;
  font-size: 11px;
  line-height: 1.45;
}

.next-maintenance-log-dialog .req-maintenance-log-card__issue span {
  flex: 0 0 auto;
  color: #9a3412;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.next-maintenance-log-dialog .req-maintenance-log-card__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 12px;
}

.next-maintenance-log-dialog .req-maintenance-log-card__spares {
  grid-column: 1 / -1;
}

.next-maintenance-log-dialog .next-maintenance-serial-field .co-submodal-input {
  font-weight: 800;
  letter-spacing: .02em;
}

.next-maintenance-log-dialog .co-submodal-label {
  margin-bottom: 6px;
  color: #334155;
  font-size: 10px;
  font-weight: 850;
}

.next-maintenance-log-dialog .co-submodal-textarea,
.next-maintenance-log-dialog .co-submodal-input,
.next-maintenance-log-dialog .next-maintenance-modern-select__trigger {
  border-color: #e2e8f0;
  border-radius: 12px;
  background: #fbfdff;
  box-shadow: none;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.next-maintenance-log-dialog .co-submodal-input {
  width: 100%;
  min-height: 43px;
  padding: 0 12px;
  box-sizing: border-box;
}

.next-maintenance-log-dialog .co-submodal-textarea:focus,
.next-maintenance-log-dialog .co-submodal-input:focus,
.next-maintenance-log-dialog .next-maintenance-modern-select.is-open .next-maintenance-modern-select__trigger {
  border-color: #fdba74;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, .09);
}

.next-maintenance-log-dialog .co-submodal-textarea {
  min-height: 105px;
  resize: vertical;
}

.next-maintenance-log-dialog .req-maintenance-log-card__spares {
  margin-top: 2px;
  padding: 13px;
  border: 1px solid #e8edf3;
  border-radius: 15px;
  background: #f8fafc;
}

.next-maintenance-log-dialog .req-maintenance-spare-head {
  margin-bottom: 8px;
}

.next-maintenance-log-dialog .req-maintenance-spare-list {
  display: grid;
  gap: 8px;
}

.next-maintenance-log-dialog .req-maintenance-spare-row {
  grid-template-columns: minmax(0, 1fr) 96px 42px;
  gap: 8px;
  padding: 9px;
  border-color: #e7ebf1;
  border-radius: 14px;
  background: #f8fafc;
}

.next-maintenance-log-dialog .req-maintenance-spare-row > * {
  min-width: 0;
  box-sizing: border-box;
}

.next-maintenance-log-dialog .req-maintenance-spare-row__remove {
  position: static !important;
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
  height: 43px !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: end !important;
  justify-self: end;
  display: grid !important;
  place-items: center;
  border-radius: 12px !important;
  box-sizing: border-box;
  transform: none !important;
}

.next-maintenance-log-dialog .req-maintenance-spare-row__remove span {
  width: auto !important;
  height: auto !important;
  display: block !important;
  line-height: 1 !important;
  transform: translateY(-1px);
}

.next-maintenance-log-dialog .req-maintenance-spare-add--full {
  min-height: 42px;
  margin-top: 8px;
  border-radius: 13px;
  box-shadow: none;
}

.next-maintenance-log-dialog > .co-submodal-actions {
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 13px 18px 16px !important;
  border-top: 1px solid #eef2f6;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 -10px 26px rgba(15, 23, 42, .035);
}

/* Modern custom selects inside the shared maintenance logger. */
.next-maintenance-log-dialog .next-maintenance-modern-select {
  position: relative;
  width: 100%;
  min-width: 0;
}

.next-maintenance-log-dialog .next-maintenance-modern-select__trigger {
  width: 100%;
  min-height: 43px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 12px;
  color: #334155;
  font: inherit;
  font-size: 11px;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}

.next-maintenance-log-dialog .next-maintenance-modern-select__trigger > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.next-maintenance-log-dialog .next-maintenance-modern-select__trigger svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}

.next-maintenance-log-dialog .next-maintenance-modern-select__menu {
  position: absolute;
  z-index: 5000;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 270px;
  padding: 7px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 20px 48px rgba(15, 23, 42, .18);
}

.next-maintenance-log-dialog .next-maintenance-modern-select__search {
  padding: 2px 2px 7px;
}

.next-maintenance-log-dialog .next-maintenance-modern-select__search input {
  width: 100%;
  min-height: 38px;
  padding: 0 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  outline: 0;
  font: inherit;
  font-size: 11px;
}

.next-maintenance-log-dialog .next-maintenance-modern-select__options {
  max-height: 210px;
  overflow: auto;
}

.next-maintenance-log-dialog .next-maintenance-modern-select__option {
  width: 100%;
  min-height: 39px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #334155;
  font: inherit;
  font-size: 11px;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}

.next-maintenance-log-dialog .next-maintenance-modern-select__option:hover,
.next-maintenance-log-dialog .next-maintenance-modern-select__option.is-selected {
  background: #f1f5f9;
  color: #0f172a;
}

.next-maintenance-log-dialog .next-maintenance-modern-select__empty {
  padding: 12px 8px;
  color: #94a3b8;
  font-size: 11px;
  text-align: center;
}

/* Operations Orders — Classic maintenance actions that were missing in Next. */
body.operations-orders-page .next-operations-tech-visit-overlay,
body.operations-orders-page .next-maintenance-receipt-overlay {
  z-index: 2600 !important;
}

body.operations-orders-page .next-operations-tech-visit-dialog {
  width: min(680px, calc(100vw - 28px));
  max-height: min(88dvh, 760px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 22px;
}

body.operations-orders-page .next-operations-tech-visit-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

body.operations-orders-page .next-operations-tech-visit-body {
  min-height: 0;
  overflow: auto;
}

body.operations-orders-page .next-operations-tech-visit-list {
  display: grid;
  gap: 10px;
}

body.operations-orders-page .next-operations-tech-visit-card {
  padding: 13px;
  border: 1px solid #e7ebf1;
  border-radius: 16px;
  background: #f8fafc;
}

body.operations-orders-page .next-operations-tech-visit-card__head {
  display: grid;
  gap: 3px;
  margin-bottom: 10px;
}

body.operations-orders-page .next-operations-tech-visit-card__head span {
  color: #f97316;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}

body.operations-orders-page .next-operations-tech-visit-card__head strong {
  color: #0f172a;
  font-size: 14px;
}

body.operations-orders-page .next-maintenance-receipt-dialog {
  width: min(560px, calc(100vw - 24px));
  max-height: min(88dvh, 720px);
  overflow: auto;
  border-radius: 22px;
}

body.operations-orders-page .next-maintenance-receipt-numbers .co-submodal-inputs {
  display: grid;
  gap: 7px;
}

body.operations-orders-page .next-maintenance-upload-field {
  width: 100%;
}

@media (max-width: 680px) {
  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-modal-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  body.page-maintenance-orders .next-classic-maintenance-parity .next-maintenance-order-modal-summary > div {
    min-height: 54px;
    padding: 8px 9px;
    border-radius: 12px;
  }

  .next-maintenance-log-overlay {
    padding: 9px !important;
  }

  .next-maintenance-log-dialog {
    width: calc(100vw - 18px) !important;
    max-height: 92dvh !important;
    border-radius: 20px !important;
  }

  .next-maintenance-log-dialog .next-maintenance-log-header {
    padding: 15px 48px 13px 14px !important;
  }

  .next-maintenance-log-dialog .next-maintenance-log-header .req-edit-icon {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
    border-radius: 12px;
  }

  .next-maintenance-log-dialog .co-submodal-title {
    font-size: 17px;
  }

  .next-maintenance-log-dialog .req-maintenance-log-body {
    padding: 10px !important;
  }

  .next-maintenance-log-dialog .next-maintenance-log-card {
    padding: 12px !important;
    border-radius: 15px !important;
  }

  .next-maintenance-log-dialog .req-maintenance-log-card__fields {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .next-maintenance-log-dialog .req-maintenance-log-card__spares {
    grid-column: auto;
  }

  .next-maintenance-log-dialog .req-maintenance-spare-row {
    grid-template-columns: minmax(0, 1fr) 76px 36px;
    gap: 7px;
    padding: 8px;
  }

  .next-maintenance-log-dialog .req-maintenance-spare-row__remove {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 43px !important;
  }

  .next-maintenance-log-dialog .req-maintenance-log-card__issue {
    display: grid;
    gap: 3px;
  }

  .next-maintenance-log-dialog > .co-submodal-actions {
    padding: 10px 12px 12px !important;
  }

  .next-maintenance-log-dialog > .co-submodal-actions .ro-action-btn {
    flex: 1 1 0;
    justify-content: center;
  }

  body.operations-orders-page .next-operations-tech-visit-dialog,
  body.operations-orders-page .next-maintenance-receipt-dialog {
    width: calc(100vw - 18px);
    max-height: 92dvh;
  }
}

/* ===== Orders · component grouping by Products/Kits tags ===== */
.next-classic-orders-parity .order-group-sort-actions{
  position:relative;
  z-index:55;
  overflow:visible;
}
.next-classic-orders-parity .order-sort-menu-wrap{
  position:relative;
  display:inline-flex;
  overflow:visible;
}
.next-classic-orders-parity .order-sort-trigger{
  min-width:108px;
  gap:8px;
  white-space:nowrap;
}
.next-classic-orders-parity .order-sort-trigger svg{
  width:16px;
  height:16px;
}
.next-classic-orders-parity .order-sort-trigger svg:last-child{
  width:14px;
  height:14px;
  opacity:.8;
}
.next-classic-orders-parity .order-sort-menu{
  position:absolute;
  z-index:190;
  top:calc(100% + 8px);
  right:0;
  width:min(340px,calc(100vw - 34px));
  padding:8px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:18px;
  background:#fff;
  color:#111827;
  box-shadow:0 24px 70px rgba(15,23,42,.25);
}
.next-classic-orders-parity .order-sort-menu > button{
  width:100%;
  border:0;
  border-radius:13px;
  background:transparent;
  color:#111827;
  display:grid;
  grid-template-columns:28px 1fr;
  align-items:center;
  gap:8px;
  padding:11px 10px;
  text-align:left;
  cursor:pointer;
}
.next-classic-orders-parity .order-sort-menu > button:hover,
.next-classic-orders-parity .order-sort-menu > button.is-active{
  background:#f5f7fa;
}
.next-classic-orders-parity .order-sort-menu__check{
  width:24px;
  height:24px;
  border:1px solid #d7dde6;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  color:#0f172a;
  font-weight:950;
}
.next-classic-orders-parity .order-sort-menu > button > span:last-child{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:0;
}
.next-classic-orders-parity .order-sort-menu strong{
  color:#111827;
  font-size:.82rem;
  font-weight:950;
}
.next-classic-orders-parity .order-sort-menu small{
  color:#7c8798;
  font-size:.69rem;
  line-height:1.35;
  font-weight:650;
}
.next-classic-orders-parity .order-component-groups{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.next-classic-orders-parity .order-component-group{
  display:flex;
  flex-direction:column;
  gap:9px;
}
.next-classic-orders-parity .order-component-group__items{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.next-classic-orders-parity .order-component-group__head{
  --order-group-bg:#fff7ed;
  --order-group-fg:#9a3412;
  --order-group-border:#fed7aa;
  min-height:50px;
  padding:9px 13px;
  border:1px solid var(--order-group-border);
  border-radius:14px;
  background:var(--order-group-bg);
  color:var(--order-group-fg);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  box-shadow:0 7px 18px rgba(15,23,42,.04);
}
.next-classic-orders-parity .order-component-group__head--tone-1{--order-group-bg:#eff6ff;--order-group-fg:#1d4ed8;--order-group-border:#bfdbfe}
.next-classic-orders-parity .order-component-group__head--tone-2{--order-group-bg:#ecfdf5;--order-group-fg:#047857;--order-group-border:#a7f3d0}
.next-classic-orders-parity .order-component-group__head--tone-3{--order-group-bg:#f5f3ff;--order-group-fg:#6d28d9;--order-group-border:#ddd6fe}
.next-classic-orders-parity .order-component-group__head--tone-4{--order-group-bg:#fdf2f8;--order-group-fg:#be185d;--order-group-border:#fbcfe8}
.next-classic-orders-parity .order-component-group__head--tone-5{--order-group-bg:#fefce8;--order-group-fg:#854d0e;--order-group-border:#fde68a}
.next-classic-orders-parity .order-component-group__head > div{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.next-classic-orders-parity .order-component-group__head span{
  color:currentColor;
  opacity:.66;
  font-size:.59rem;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.next-classic-orders-parity .order-component-group__head strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.9rem;
  font-weight:950;
}
.next-classic-orders-parity .order-component-group__head small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:currentColor;
  opacity:.72;
  font-size:.64rem;
  font-weight:750;
}
.next-classic-orders-parity .order-component-group__head em{
  flex:0 0 auto;
  padding:6px 9px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:999px;
  background:rgba(255,255,255,.65);
  color:currentColor;
  font-size:.65rem;
  font-style:normal;
  font-weight:900;
}

@media(max-width:760px){
  .next-classic-orders-parity .order-sort-menu{
    position:fixed;
    z-index:280;
    left:16px;
    right:16px;
    top:auto;
    bottom:18px;
    width:auto;
    max-height:70vh;
    overflow:auto;
    border-radius:20px;
  }
  .next-classic-orders-parity .order-component-group__head{
    min-height:44px;
    padding:8px 10px;
    border-radius:12px;
  }
  .next-classic-orders-parity .order-component-groups{
    gap:14px;
  }
}

/* ===== Order download modal (Current / Review / Operations) ===== */
.order-download-overlay{position:fixed;inset:0;z-index:12050;display:grid;place-items:center;padding:18px;background:rgba(15,23,42,.46);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.order-download-dialog{position:relative;width:min(560px,calc(100vw - 28px));max-height:min(88vh,760px);overflow:auto;border:1px solid rgba(15,23,42,.08);border-radius:24px;background:#fff;box-shadow:0 28px 75px rgba(15,23,42,.25);padding:22px}
.order-download-close{position:absolute;top:15px;right:15px;width:36px;height:36px;min-width:36px;max-width:36px;aspect-ratio:1/1;box-sizing:border-box;padding:0;border:1px solid #e7eaf0;border-radius:50%;background:#f8fafc;color:#111827;display:flex;align-items:center;justify-content:center;line-height:0;cursor:pointer;z-index:2}.order-download-close:hover{background:#eef2f6}.order-download-close:disabled{opacity:.55;cursor:not-allowed}.order-download-close svg{display:block;width:17px;height:17px;margin:0}
.order-download-header{display:flex;align-items:center;gap:12px;padding-right:44px}.order-download-header__icon{width:46px;height:46px;flex:0 0 46px;display:grid;place-items:center;border:1px solid #fed7aa;border-radius:14px;background:#fff7ed;color:#c45b1c}.order-download-header__icon svg{width:22px;height:22px}.order-download-header h2,.order-download-header h3{margin:0;color:#111827;font-size:21px;line-height:1.15;font-weight:900;letter-spacing:-.025em}.order-download-header h3{font-size:18px}.order-download-header p{margin:5px 0 0;color:#7a8493;font-size:11px;line-height:1.45;font-weight:650}
.order-download-section{margin-top:18px;border:1px solid #e7ebf0;border-radius:16px;background:#fbfcfd;padding:13px}.order-download-section__label{display:block;margin-bottom:9px;color:#475467;font-size:9px;font-weight:950;text-transform:uppercase;letter-spacing:.08em}
.order-download-columns__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.order-download-column-option{min-height:42px;display:flex;align-items:center;gap:8px;padding:9px 11px;border:1px solid #e6eaf0;border-radius:11px;background:#fff;color:#344054;font-size:11px;font-weight:800;cursor:pointer}.order-download-column-option:hover{border-color:#d3d9e2;background:#fcfcfd}.order-download-column-option input{width:15px;height:15px;margin:0;accent-color:#111827}.order-download-repeat-option.is-selected{border-color:#cbd5e1;background:#f8fafc;box-shadow:0 0 0 2px rgba(15,23,42,.04)}.order-download-repeat-option>span{min-width:0;display:grid;gap:2px}.order-download-repeat-option strong{font-size:10px;line-height:1.25}.order-download-repeat-option small{color:#98a2b3;font-size:8px;line-height:1.35;font-weight:650}
.order-download-instructions{overflow:visible}.order-download-instructions__heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.order-download-instructions__heading .order-download-section__label{margin-bottom:0}.order-download-instructions__heading small{max-width:310px;color:#98a2b3;font-size:9px;line-height:1.4;text-align:right}
.order-instruction-select{position:relative;margin-top:10px}.order-instruction-select__trigger{width:100%;min-height:54px;display:grid;grid-template-columns:minmax(0,1fr) 20px;align-items:center;gap:10px;padding:10px 12px;border:1px solid #dde3eb;border-radius:13px;background:#fff;color:#344054;text-align:left;cursor:pointer}.order-instruction-select__trigger:hover,.order-instruction-select__trigger.has-value{border-color:#c6ced9}.order-instruction-select__trigger>svg{width:17px;height:17px;color:#667085;justify-self:end}.order-instruction-select__copy{min-width:0;display:grid;gap:2px}.order-instruction-select__copy small{font-size:8px;color:#98a2b3;font-weight:850;text-transform:uppercase;letter-spacing:.06em}.order-instruction-select__copy strong{font-size:11px;color:#202939;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.order-instruction-select__menu{position:absolute;z-index:15;left:0;right:0;top:calc(100% + 6px);max-height:270px;overflow:auto;padding:6px;border:1px solid #e0e5ec;border-radius:14px;background:#fff;box-shadow:0 18px 42px rgba(15,23,42,.16)}.order-instruction-select__option,.order-instruction-select__add{width:100%;display:grid;grid-template-columns:minmax(0,1fr) 20px;align-items:center;gap:8px;padding:10px;border:0;border-radius:10px;background:transparent;text-align:left;color:#344054;cursor:pointer}.order-instruction-select__option:hover,.order-instruction-select__option.is-selected,.order-instruction-select__add:hover{background:#f6f8fa}.order-instruction-select__option>span,.order-instruction-select__add>span:last-child{min-width:0;display:grid;gap:2px}.order-instruction-select__option strong,.order-instruction-select__add strong{font-size:10px}.order-instruction-select__option small,.order-instruction-select__add small{font-size:8px;color:#98a2b3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.order-instruction-select__option>svg{width:15px;height:15px;color:#16a34a}.order-instruction-select__divider{height:1px;margin:5px 4px;background:#edf0f4}.order-instruction-select__add{grid-template-columns:30px minmax(0,1fr)}.order-instruction-select__add-icon{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#fff7ed;color:#c45b1c;font-size:18px;font-weight:800}
.order-download-instruction-preview{margin-top:9px;padding:10px 11px;border:1px solid #fde0bf;border-radius:11px;background:#fffaf4}.order-download-instruction-preview__head{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:30px}.order-download-instruction-preview strong{display:block;min-width:0;color:#9a3412;font-size:10px;line-height:1.35}.order-download-instruction-preview p{margin:5px 0 0;color:#5f6875;font-size:9px;line-height:1.45;white-space:pre-wrap;max-height:78px;overflow:auto;unicode-bidi:plaintext}.order-download-instruction-edit{flex:0 0 30px;width:30px;height:30px;display:inline-grid;place-items:center;padding:0;border:1px solid #f2cda7;border-radius:10px;background:#fff;color:#b45309;cursor:pointer;box-shadow:0 4px 10px rgba(180,83,9,.06);line-height:1}.order-download-instruction-edit:hover{background:#fff7ed;border-color:#edb878}.order-download-instruction-edit svg{display:block;width:14px;height:14px;margin:0}
.order-download-error{margin-top:12px;padding:10px 12px;border:1px solid #fecaca;border-radius:11px;background:#fff1f2;color:#b42318;font-size:10px;font-weight:800}
.order-download-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:18px}.order-download-btn{min-height:44px;border-radius:12px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:10px;font-weight:900;cursor:pointer}.order-download-btn svg{width:16px;height:16px}.order-download-btn--dark{border:1px solid #101828;background:#101828;color:#fff}.order-download-btn--dark:hover{background:#1f2937}.order-download-btn--light{border:1px solid #dde3eb;background:#fff;color:#344054}.order-download-btn:disabled{opacity:.55;cursor:not-allowed}
.order-instruction-editor-overlay{position:fixed;inset:0;z-index:12070;display:grid;place-items:center;padding:18px;background:rgba(15,23,42,.34);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.order-instruction-editor{position:relative;width:min(470px,calc(100vw - 30px));max-height:min(92vh,780px);overflow:auto;border:1px solid #e2e6ec;border-radius:22px;background:#fff;padding:20px;box-shadow:0 26px 65px rgba(15,23,42,.23)}.order-instruction-editor__fields{display:grid;gap:12px;margin-top:17px}.order-instruction-editor__fields label{display:grid;gap:6px}.order-instruction-editor__fields label>span{color:#475467;font-size:9px;font-weight:900}.order-instruction-editor__fields input,.order-instruction-editor__fields textarea{width:100%;border:1px solid #d9e0e8;border-radius:12px;background:#fff;padding:11px 12px;color:#101828;font:inherit;font-size:11px;outline:none;resize:vertical}.order-instruction-editor__fields textarea[dir="rtl"]{text-align:right}.order-instruction-editor__fields input:focus,.order-instruction-editor__fields textarea:focus{border-color:#f2b987;box-shadow:0 0 0 3px rgba(234,138,64,.12)}.order-instruction-editor__actions{grid-template-columns:auto minmax(150px,1fr);justify-content:end}.order-instruction-editor__actions .order-download-btn--light{min-width:92px}
@media(max-width:640px){.order-download-overlay,.order-instruction-editor-overlay{padding:10px}.order-download-dialog{width:min(100%,520px);max-height:90vh;border-radius:20px;padding:17px}.order-download-header{padding-right:38px}.order-download-header__icon{width:40px;height:40px;flex-basis:40px;border-radius:12px}.order-download-header h2{font-size:18px}.order-download-columns__grid{grid-template-columns:1fr 1fr;gap:6px}.order-download-column-option{min-height:38px;padding:8px;font-size:9px}.order-download-instructions__heading{display:block}.order-download-instructions__heading small{display:block;max-width:none;margin-top:4px;text-align:left}.order-download-actions{grid-template-columns:1fr}.order-instruction-editor{padding:17px;border-radius:19px}.order-instruction-editor__actions{grid-template-columns:1fr 1fr}}


/* Current / Operations Orders — keep receipt photos beside Received by in the same meta-card style. */
body:is(.operations-orders-page,.current-orders-page) .next-operations-meta-pair {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
}
body:is(.operations-orders-page,.current-orders-page) .next-operations-meta-pair > .co-meta-row:only-child {
  grid-column: 1 / -1;
}
body:is(.operations-orders-page,.current-orders-page) .next-operations-receipt-meta strong {
  min-width: 0;
}
body:is(.operations-orders-page,.current-orders-page) .next-operations-receipt-meta__links {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 5px 9px;
}
body:is(.operations-orders-page,.current-orders-page) .next-operations-receipt-meta__link {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  max-width: 100%;
  color: #111827;
  text-decoration: none;
  font-weight: 900;
}
body:is(.operations-orders-page,.current-orders-page) .next-operations-receipt-meta__link svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}
body:is(.operations-orders-page,.current-orders-page) .next-operations-receipt-meta__link span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: inherit;
}
@media (max-width: 720px) {
  body:is(.operations-orders-page,.current-orders-page) .next-operations-meta-pair {
    grid-template-columns: 1fr;
  }
}

/* Operations Orders — compact detail modal so the whole order fits without horizontal scrolling. */
body.operations-orders-page .next-classic-orders-parity .co-modal-dialog {
  width: min(650px, calc(100vw - 28px));
  max-width: 650px;
  max-height: calc(100dvh - 24px);
  padding: 14px 14px 13px;
  overflow-x: hidden;
  overflow-y: auto;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-dialog,
body.operations-orders-page .next-classic-orders-parity .co-modal-dialog * {
  box-sizing: border-box;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-header,
body.operations-orders-page .next-classic-orders-parity .co-modal-body,
body.operations-orders-page .next-classic-orders-parity .co-modal-meta,
body.operations-orders-page .next-classic-orders-parity .co-modal-items,
body.operations-orders-page .next-classic-orders-parity .order-component-groups,
body.operations-orders-page .next-classic-orders-parity .order-component-group,
body.operations-orders-page .next-classic-orders-parity .order-component-group__items,
body.operations-orders-page .next-classic-orders-parity .co-item,
body.operations-orders-page .next-classic-orders-parity .co-item-left,
body.operations-orders-page .next-classic-orders-parity .co-item-right {
  min-width: 0;
  max-width: 100%;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-status {
  font-size: 31px;
  line-height: 1.05;
  padding-right: 44px;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-close,
body.operations-orders-page .next-classic-orders-parity .co-modal-more-btn {
  width: 34px;
  height: 34px;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-close {
  top: 12px;
  right: 12px;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-more {
  top: 12px;
  left: 12px;
}
body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary {
  gap: 6px;
  margin-top: 9px;
}
body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary > div {
  min-height: 50px;
  gap: 3px;
  padding: 7px 8px;
  border-radius: 12px;
}
body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary > div > span:first-child {
  font-size: 7.5px;
}
body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary strong {
  font-size: 10px;
}
body.operations-orders-page .next-classic-orders-parity .co-track-pill {
  margin-top: 10px;
  padding: 10px 12px;
  gap: 7px;
}
body.operations-orders-page .next-classic-orders-parity .co-track-step {
  width: 42px;
  height: 42px;
}
body.operations-orders-page .next-classic-orders-parity .co-track-step svg {
  width: 18px;
  height: 18px;
}
body.operations-orders-page .next-classic-orders-parity .co-track-conn {
  height: 9px;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-body {
  margin-top: 10px;
  gap: 10px;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-meta {
  gap: 7px 9px;
}
body.operations-orders-page .next-classic-orders-parity .co-meta-row {
  gap: 8px;
  padding: 8px 10px;
  border-radius: 12px;
  font-size: 10px;
}
body.operations-orders-page .next-classic-orders-parity .co-meta-row--reason {
  min-height: 50px;
  margin-top: 7px;
  padding: 9px 12px;
  border-radius: 16px;
}
body.operations-orders-page .next-classic-orders-parity .co-meta-row--reason strong {
  padding: 9px 12px;
  font-size: 12px;
}
body:is(.operations-orders-page,.current-orders-page) .next-classic-orders-parity .next-operations-meta-pair {
  gap: 7px 9px;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-actions.ro-actions {
  gap: 7px;
  margin-top: 4px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-actions .ro-action-btn,
body.operations-orders-page .next-classic-orders-parity .order-sort-trigger {
  width: auto;
  min-width: 0;
  min-height: 34px;
  padding: 7px 10px;
  gap: 6px;
  border-radius: 10px;
  font-size: 9px;
  white-space: nowrap;
}
body.operations-orders-page .next-classic-orders-parity .co-modal-actions .ro-action-btn svg,
body.operations-orders-page .next-classic-orders-parity .order-sort-trigger svg {
  width: 14px;
  height: 14px;
}
body.operations-orders-page .next-classic-orders-parity .order-component-groups {
  gap: 8px;
}
body.operations-orders-page .next-classic-orders-parity .order-component-group {
  gap: 6px;
}
body.operations-orders-page .next-classic-orders-parity .order-component-group__head {
  min-height: 42px;
  padding: 7px 9px;
  border-radius: 12px;
}
body.operations-orders-page .next-classic-orders-parity .order-component-group__head span {
  font-size: 7px;
}
body.operations-orders-page .next-classic-orders-parity .order-component-group__head strong {
  font-size: 10px;
}
body.operations-orders-page .next-classic-orders-parity .order-component-group__head small,
body.operations-orders-page .next-classic-orders-parity .order-component-group__head em {
  font-size: 7.5px;
}
body.operations-orders-page .next-classic-orders-parity .order-component-group__items {
  gap: 6px;
}
body.operations-orders-page .next-classic-orders-parity .co-item {
  gap: 8px;
  padding: 8px 10px;
  border-radius: 12px;
}
body.operations-orders-page .next-classic-orders-parity .co-item-name {
  font-size: 10px;
  line-height: 1.25;
}
body.operations-orders-page .next-classic-orders-parity .co-item-title .co-item-name {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}
body.operations-orders-page .next-classic-orders-parity .co-item-link {
  width: 23px;
  height: 23px;
}
body.operations-orders-page .next-classic-orders-parity .co-item-link svg {
  width: 12px;
  height: 12px;
}
body.operations-orders-page .next-classic-orders-parity .co-item-sub,
body.operations-orders-page .next-classic-orders-parity .co-item-issue-desc {
  margin-top: 2px;
  max-width: 100%;
  font-size: 8.5px;
  line-height: 1.3;
  text-align: left;
}
body.operations-orders-page .next-classic-orders-parity .co-item-right {
  max-width: 145px;
  font-size: 9px;
}
body.operations-orders-page .next-classic-orders-parity .co-item-total {
  font-size: 9px;
}
body.operations-orders-page .next-classic-orders-parity .co-item-status {
  margin-top: 4px;
  padding: 3px 7px;
  font-size: 8px;
}
body.operations-orders-page .next-classic-orders-parity .req-ops-reject {
  min-height: 28px;
  padding: 4px 7px;
  font-size: 8px;
}

@media (max-width: 700px) {
  body.operations-orders-page .next-classic-orders-parity .co-modal-dialog {
    width: calc(100vw - 18px);
    max-width: none;
    padding: 12px 10px;
  }
  body.operations-orders-page .next-classic-orders-parity .next-operations-order-modal-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.operations-orders-page .next-classic-orders-parity .co-modal-actions.ro-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  /* Keep search on its own row. Action buttons then pair beneath it:
     Download | Sort, and in Edit mode Cancel | Save changes. */
  body.operations-orders-page .next-classic-orders-parity .order-modal-search-actions > .order-component-search {
    grid-column: 1 / -1;
    justify-self: start;
  }
  body.operations-orders-page .next-classic-orders-parity .co-modal-actions .ro-action-btn,
  body.operations-orders-page .next-classic-orders-parity .order-sort-menu-wrap,
  body.operations-orders-page .next-classic-orders-parity .order-sort-trigger {
    width: 100%;
  }
  body.operations-orders-page .next-classic-orders-parity .co-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
  }
  body.operations-orders-page .next-classic-orders-parity .co-item-right {
    width: auto;
    max-width: 120px;
    text-align: right;
    display: block;
  }
}

/* Current Orders — match the compact Operations Orders card/modal footprint.
 * This block applies only to the new Next.js Current Orders page. */
body.current-orders-page .next-classic-orders-parity .next-current-order-card {
  width: 100%;
  box-sizing: border-box;
  background: #fff;
}

body.current-orders-page .next-classic-orders-parity .co-modal-dialog {
  width: min(650px, calc(100vw - 28px));
  max-width: 650px;
  max-height: calc(100dvh - 24px);
  padding: 14px 14px 13px;
  overflow-x: hidden;
  overflow-y: auto;
}
body.current-orders-page .next-classic-orders-parity .co-modal-dialog,
body.current-orders-page .next-classic-orders-parity .co-modal-dialog * {
  box-sizing: border-box;
}
body.current-orders-page .next-classic-orders-parity .co-modal-header,
body.current-orders-page .next-classic-orders-parity .co-modal-body,
body.current-orders-page .next-classic-orders-parity .co-modal-meta,
body.current-orders-page .next-classic-orders-parity .co-modal-items,
body.current-orders-page .next-classic-orders-parity .order-component-groups,
body.current-orders-page .next-classic-orders-parity .order-component-group,
body.current-orders-page .next-classic-orders-parity .order-component-group__items,
body.current-orders-page .next-classic-orders-parity .co-item,
body.current-orders-page .next-classic-orders-parity .co-item-left,
body.current-orders-page .next-classic-orders-parity .co-item-right {
  min-width: 0;
  max-width: 100%;
}
body.current-orders-page .next-classic-orders-parity .co-modal-status {
  font-size: 31px;
  line-height: 1.05;
  padding-right: 44px;
}
body.current-orders-page .next-classic-orders-parity .co-modal-close,
body.current-orders-page .next-classic-orders-parity .co-modal-more-btn {
  width: 34px;
  height: 34px;
}
body.current-orders-page .next-classic-orders-parity .co-modal-close {
  top: 12px;
  right: 12px;
}
body.current-orders-page .next-classic-orders-parity .co-modal-more {
  top: 12px;
  left: 12px;
}
body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary {
  gap: 6px;
  margin-top: 9px;
}
body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary > div {
  min-height: 50px;
  gap: 3px;
  padding: 7px 8px;
  border-radius: 12px;
}
body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary > div > span:first-child {
  font-size: 7.5px;
}
body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary strong {
  font-size: 10px;
}
body.current-orders-page .next-classic-orders-parity .co-track-pill {
  margin-top: 10px;
  padding: 10px 12px;
  gap: 7px;
}
body.current-orders-page .next-classic-orders-parity .co-track-step {
  width: 42px;
  height: 42px;
}
body.current-orders-page .next-classic-orders-parity .co-track-step svg {
  width: 18px;
  height: 18px;
}
body.current-orders-page .next-classic-orders-parity .co-track-conn {
  height: 9px;
}
body.current-orders-page .next-classic-orders-parity .co-modal-body {
  margin-top: 10px;
  gap: 10px;
}
body.current-orders-page .next-classic-orders-parity .co-modal-meta {
  gap: 7px 9px;
}
body.current-orders-page .next-classic-orders-parity .co-meta-row {
  gap: 8px;
  padding: 8px 10px;
  border-radius: 12px;
  font-size: 10px;
}
body.current-orders-page .next-classic-orders-parity .co-meta-row--reason {
  min-height: 50px;
  margin-top: 7px;
  padding: 9px 12px;
  border-radius: 16px;
}
body.current-orders-page .next-classic-orders-parity .co-meta-row--reason strong {
  padding: 9px 12px;
  font-size: 12px;
}
body.current-orders-page .next-classic-orders-parity .co-modal-actions.ro-actions {
  gap: 7px;
  margin-top: 4px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
body.current-orders-page .next-classic-orders-parity .co-modal-actions .ro-action-btn,
body.current-orders-page .next-classic-orders-parity .order-sort-trigger {
  width: auto;
  min-width: 0;
  min-height: 34px;
  padding: 7px 10px;
  gap: 6px;
  border-radius: 10px;
  font-size: 9px;
  white-space: nowrap;
}
body.current-orders-page .next-classic-orders-parity .co-modal-actions .ro-action-btn svg,
body.current-orders-page .next-classic-orders-parity .order-sort-trigger svg {
  width: 14px;
  height: 14px;
}
body.current-orders-page .next-classic-orders-parity .order-component-groups {
  gap: 8px;
}
body.current-orders-page .next-classic-orders-parity .order-component-group {
  gap: 6px;
}
body.current-orders-page .next-classic-orders-parity .order-component-group__head {
  min-height: 42px;
  padding: 7px 9px;
  border-radius: 12px;
}
body.current-orders-page .next-classic-orders-parity .order-component-group__head span {
  font-size: 7px;
}
body.current-orders-page .next-classic-orders-parity .order-component-group__head strong {
  font-size: 10px;
}
body.current-orders-page .next-classic-orders-parity .order-component-group__head small,
body.current-orders-page .next-classic-orders-parity .order-component-group__head em {
  font-size: 7.5px;
}
body.current-orders-page .next-classic-orders-parity .order-component-group__items {
  gap: 6px;
}
body.current-orders-page .next-classic-orders-parity .co-item {
  gap: 8px;
  padding: 8px 10px;
  border-radius: 12px;
}
body.current-orders-page .next-classic-orders-parity .co-item-name {
  font-size: 10px;
  line-height: 1.25;
}
body.current-orders-page .next-classic-orders-parity .co-item-title .co-item-name {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}
body.current-orders-page .next-classic-orders-parity .co-item-link {
  width: 23px;
  height: 23px;
}
body.current-orders-page .next-classic-orders-parity .co-item-link svg {
  width: 12px;
  height: 12px;
}
body.current-orders-page .next-classic-orders-parity .co-item-sub,
body.current-orders-page .next-classic-orders-parity .co-item-issue-desc {
  margin-top: 2px;
  max-width: 100%;
  font-size: 8.5px;
  line-height: 1.3;
  text-align: left;
}
body.current-orders-page .next-classic-orders-parity .co-item-right {
  max-width: 145px;
  font-size: 9px;
}
body.current-orders-page .next-classic-orders-parity .co-item-total {
  font-size: 9px;
}
body.current-orders-page .next-classic-orders-parity .co-item-status {
  margin-top: 4px;
  padding: 3px 7px;
  font-size: 8px;
}

@media (max-width: 700px) {
  body.current-orders-page .next-classic-orders-parity .co-modal-dialog {
    width: calc(100vw - 18px);
    max-width: none;
    padding: 12px 10px;
  }
  body.current-orders-page .next-classic-orders-parity .next-current-order-modal-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.current-orders-page .next-classic-orders-parity .co-modal-actions.ro-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  /* Keep search on its own row, then Download + Sort side by side. */
  body.current-orders-page .next-classic-orders-parity .order-modal-search-actions > .order-component-search {
    grid-column: 1 / -1;
    justify-self: start;
  }
  body.current-orders-page .next-classic-orders-parity .co-modal-actions .ro-action-btn,
  body.current-orders-page .next-classic-orders-parity .order-sort-menu-wrap,
  body.current-orders-page .next-classic-orders-parity .order-sort-trigger {
    width: 100%;
  }
  body.current-orders-page .next-classic-orders-parity .co-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
  }
  body.current-orders-page .next-classic-orders-parity .co-item-right {
    width: auto;
    max-width: 120px;
    text-align: right;
    display: block;
  }
}

/* Operations Orders — card footer status/creator treatment ------------------
 * Keep the status in the left summary slot and make the creator trigger a
 * compact attached name label + circular icon on the right.
 */
body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-bottom {
  align-items: center;
  flex-wrap: nowrap;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-status {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-summary-actions {
  flex: 0 0 auto;
  margin-left: auto;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0 !important;
  width: auto !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #020617 !important;
  color: #fff !important;
  overflow: hidden;
  box-shadow: 0 8px 18px rgba(2, 6, 23, .14);
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-label {
  display: block;
  max-width: 150px;
  padding: 0 8px 0 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff;
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-icon {
  width: 34px;
  min-width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-left: 1px solid rgba(255,255,255,.14);
  border-radius: 50%;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-icon svg {
  display: block;
  width: 15px;
  height: 15px;
  margin: 0 !important;
  transform: none !important;
}

@media (max-width: 720px) {
  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-btn {
    min-width: 31px !important;
    height: 31px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-label {
    max-width: 118px;
    margin-right: -10px;
    padding-left: 8px;
    padding-right: 17px;
    font-size: 8.5px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-icon {
    width: 31px;
    min-width: 31px;
    height: 31px;
  }
}


/* Operations Orders — compact card header status + attached creator label ----
 * Requested layout: remove component count/footer, place status in the former
 * count position, and stack the creator label directly beneath it. The round
 * creator icon gets a visible white ring while preserving the anchored popup.
 */
body.operations-orders-page .next-classic-orders-parity .next-operations-order-card {
  padding-top: 10px;
  padding-bottom: 10px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-top {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  min-height: 66px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-main {
  min-width: 0;
  align-self: center;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-qty,
body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-divider,
body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-bottom {
  display: none !important;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions {
  min-width: 112px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 5px;
  margin-left: auto;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-status {
  flex: 0 0 auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-width: 0;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions .co-status-btn,
body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions .sv-mixed-approval-pill {
  flex: 0 0 auto;
  margin: 0;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0 !important;
  width: auto !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #fff !important;
  overflow: visible !important;
  box-shadow: none !important;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-label {
  display: flex;
  align-items: center;
  height: 30px;
  max-width: 150px;
  margin-right: -11px;
  padding: 0 20px 0 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-radius: 999px 4px 4px 999px;
  background: #020617;
  color: #fff;
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 7px 16px rgba(2, 6, 23, .12);
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-icon {
  position: relative;
  z-index: 1;
  width: 34px;
  min-width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  background: #020617;
  color: #fff;
  box-shadow: 0 7px 16px rgba(2, 6, 23, .16);
}

body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-icon svg {
  display: block;
  width: 15px;
  height: 15px;
  margin: 0 !important;
  transform: none !important;
}

@media (max-width: 720px) {
  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card {
    padding-top: 8px;
    padding-bottom: 8px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-top {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    min-height: 58px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions {
    min-width: 96px;
    gap: 4px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-btn {
    min-width: 31px !important;
    height: 31px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-label {
    height: 27px;
    max-width: 108px;
    padding-left: 8px;
    padding-right: 7px;
    font-size: 8.5px;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-icon {
    width: 31px;
    min-width: 31px;
    height: 31px;
    border-width: 2px !important;
  }
}

/* Operations Orders — inline admin component editor (new system only) */
body.operations-orders-page .next-classic-orders-parity .next-operations-edit-mode-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 7;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #fed7aa;
  border-radius: 999px;
  background: #fff7ed;
  color: #c2410c;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 8px 18px rgba(194, 65, 12, .10);
}

body.operations-orders-page .next-classic-orders-parity .next-operations-edit-mode-badge svg {
  width: 15px;
  height: 15px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-edit-mode-note {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid #fed7aa;
  border-radius: 12px;
  background: #fffaf4;
  color: #9a3412;
  font-size: 11px;
  font-weight: 700;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-edit-mode-note svg {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
}

@keyframes next-operations-edit-card-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 1px rgba(251, 146, 60, .15), 0 7px 18px rgba(124, 45, 18, .07);
  }
  50% {
    transform: scale(1.012);
    box-shadow: 0 0 0 4px rgba(249, 115, 22, .16), 0 12px 28px rgba(124, 45, 18, .13);
  }
}

body.operations-orders-page .next-classic-orders-parity .co-item.next-operations-editable-item {
  position: relative;
  cursor: pointer;
  border-color: #fb923c !important;
  background: linear-gradient(180deg, #fff 0%, #fff8f1 100%) !important;
  box-shadow: 0 0 0 1px rgba(251, 146, 60, .15), 0 7px 18px rgba(124, 45, 18, .07);
  animation: next-operations-edit-card-pulse 1.85s ease-in-out infinite;
  transform-origin: center;
  will-change: transform, box-shadow;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}

body.operations-orders-page .next-classic-orders-parity .co-item.next-operations-editable-item:nth-of-type(2n) {
  animation-delay: -.45s;
}

body.operations-orders-page .next-classic-orders-parity .co-item.next-operations-editable-item:nth-of-type(3n) {
  animation-delay: -.9s;
}

body.operations-orders-page .next-classic-orders-parity .co-item.next-operations-editable-item:hover,
body.operations-orders-page .next-classic-orders-parity .co-item.next-operations-editable-item:focus-visible {
  animation-play-state: paused;
  transform: scale(1.012);
  border-color: #ea580c !important;
  box-shadow: 0 0 0 4px rgba(249, 115, 22, .18), 0 12px 28px rgba(124, 45, 18, .13);
  outline: none;
}

@media (prefers-reduced-motion: reduce) {
  body.operations-orders-page .next-classic-orders-parity .co-item.next-operations-editable-item {
    animation: none;
  }
}

body.operations-orders-page .next-classic-orders-parity .next-operations-edit-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  margin-top: 12px;
  padding: 12px 0 2px;
  border-top: 1px solid #e5e7eb;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn {
  display: flex;
  width: 100%;
  min-height: 68px;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1.5px dashed #fb923c;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255, 247, 237, .96), rgba(255, 255, 255, .98));
  color: #9a3412;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(124, 45, 18, .06);
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn:hover,
body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn:focus-visible {
  transform: translateY(-1px);
  border-color: #ea580c;
  background: #fff7ed;
  box-shadow: 0 12px 28px rgba(124, 45, 18, .11);
  outline: none;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn:disabled {
  opacity: .55;
  cursor: not-allowed;
  transform: none;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn__icon {
  display: inline-grid;
  width: 38px;
  min-width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 12px;
  background: #ea580c;
  color: #fff;
  font-size: 25px;
  font-weight: 500;
  line-height: 1;
  box-shadow: 0 7px 16px rgba(234, 88, 12, .22);
}

body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn__copy strong {
  font-size: 13px;
  font-weight: 900;
  color: #111827;
}

body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn__copy small {
  font-size: 10px;
  font-weight: 650;
  color: #9a3412;
}

html[data-theme="dark"] body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn {
  border-color: rgba(251, 146, 60, .62);
  background: linear-gradient(180deg, rgba(67, 32, 13, .64), rgba(17, 24, 39, .94));
  color: #fdba74;
}

html[data-theme="dark"] body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn__copy strong {
  color: #f8fafc;
}

html[data-theme="dark"] body.operations-orders-page .next-classic-orders-parity .next-operations-add-component-btn__copy small {
  color: #fdba74;
}

/* Operations Orders — modern inline component editor */
body.operations-orders-page .next-operations-component-edit-overlay {
  z-index: 10080;
  padding: 14px;
  background: rgba(10, 15, 25, .58);
  backdrop-filter: blur(5px);
}

body.operations-orders-page .next-operations-component-edit-dialog {
  display: flex;
  flex-direction: column;
  width: min(650px, calc(100vw - 28px));
  max-height: min(790px, calc(100vh - 28px));
  padding: 18px 18px 0;
  border: 1px solid rgba(226, 232, 240, .96);
  border-radius: 24px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 30px 90px rgba(15, 23, 42, .28);
}

body.operations-orders-page .next-operations-component-edit-header {
  flex: 0 0 auto;
  padding-right: 50px;
}

body.operations-orders-page .next-operations-component-edit-header .co-submodal-title {
  letter-spacing: -.02em;
}

body.operations-orders-page .next-operations-component-edit-body {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  flex-direction: column;
  gap: 12px;
  margin-top: 14px;
  padding: 2px 4px 16px 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

body.operations-orders-page .next-operations-component-edit-body::-webkit-scrollbar {
  width: 6px;
}

body.operations-orders-page .next-operations-component-edit-body::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #d6dbe3;
}

body.operations-orders-page .next-operations-edit-grid,
body.operations-orders-page .next-operations-edit-qty-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

body.operations-orders-page .next-operations-edit-grid--primary {
  position: relative;
  z-index: 8;
  grid-template-columns: minmax(0, 1.55fr) minmax(180px, .8fr);
  align-items: start;
}

body.operations-orders-page .next-operations-edit-section {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid #e8ecf2;
  border-radius: 17px;
  background: linear-gradient(180deg, #fbfcfe 0%, #f8fafc 100%);
}

body.operations-orders-page .next-operations-edit-section__title {
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .11em;
  text-transform: uppercase;
}

body.operations-orders-page .next-operations-edit-field {
  min-width: 0;
  margin: 0;
}

body.operations-orders-page .next-operations-edit-field--wide {
  width: 100%;
}

body.operations-orders-page .next-operations-custom-id-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 10px;
}

body.operations-orders-page .next-operations-custom-id-display .co-submodal-input {
  background: #f8fafc;
}

body.operations-orders-page .next-operations-customize-id-btn {
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid #fed7aa;
  border-radius: 14px;
  background: #fff7ed;
  color: #c2410c;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

body.operations-orders-page .next-operations-customize-id-btn:hover,
body.operations-orders-page .next-operations-customize-id-btn.is-active {
  border-color: #fb923c;
  background: #ffedd5;
}

body.operations-orders-page .next-operations-customize-id-btn:disabled {
  cursor: not-allowed;
  opacity: .55;
}

body.operations-orders-page .next-operations-customize-id-btn svg {
  width: 16px;
  height: 16px;
}

body.operations-orders-page .next-operations-custom-id-input {
  grid-column: 1 / -1;
  padding: 10px;
  border: 1px solid #fed7aa;
  border-radius: 15px;
  background: #fffaf5;
}

body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-label {
  margin-bottom: 7px;
  color: #334155;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .01em;
}

body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-input,
body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #f8fafc;
  color: #0f172a;
  font-size: 13px;
  font-weight: 750;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-input {
  min-height: 44px;
  padding: 10px 12px;
}

body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-input:focus,
body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-textarea:focus {
  outline: none;
  border-color: #fb923c;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, .12);
}

body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-input:disabled,
body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-textarea:disabled {
  cursor: not-allowed;
  background: #f1f5f9;
  color: #94a3b8;
}

body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-textarea {
  min-height: 92px;
  padding: 11px 12px;
  resize: vertical;
  line-height: 1.45;
}

body.operations-orders-page .next-operations-edit-hint {
  display: block;
  margin-top: 5px;
  color: #94a3b8;
  font-size: 9px;
  font-weight: 650;
  line-height: 1.25;
}

/* Modern select / searchable component picker. This replaces the browser's native dark select UI. */
body.operations-orders-page .next-operations-modern-select {
  position: relative;
  min-width: 0;
}

body.operations-orders-page .next-operations-modern-select.is-open {
  z-index: 30;
}

body.operations-orders-page .next-operations-modern-select__trigger {
  width: 100%;
  min-height: 44px;
  padding: 9px 11px 9px 13px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #f8fafc;
  color: #0f172a;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  text-align: left;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

body.operations-orders-page .next-operations-modern-select__trigger:hover,
body.operations-orders-page .next-operations-modern-select.is-open .next-operations-modern-select__trigger {
  border-color: #fb923c;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, .10);
}

body.operations-orders-page .next-operations-modern-select__trigger:disabled {
  cursor: not-allowed;
  background: #f1f5f9;
  color: #94a3b8;
}

body.operations-orders-page .next-operations-modern-select__trigger > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.operations-orders-page .next-operations-modern-select__trigger .is-placeholder {
  color: #94a3b8;
  font-weight: 700;
}

body.operations-orders-page .next-operations-modern-select__trigger svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  color: #64748b;
  transition: transform .16s ease;
}

body.operations-orders-page .next-operations-modern-select.is-open .next-operations-modern-select__trigger svg {
  transform: rotate(180deg);
}

body.operations-orders-page .next-operations-modern-select__menu {
  position: absolute;
  top: calc(100% + 7px);
  left: 0;
  right: 0;
  z-index: 60;
  overflow: hidden;
  border: 1px solid #dbe2ea;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 20px 55px rgba(15, 23, 42, .18);
}

body.operations-orders-page .next-operations-modern-select__search-wrap {
  padding: 9px;
  border-bottom: 1px solid #edf0f4;
  background: #fbfcfe;
}

body.operations-orders-page .next-operations-modern-select__search {
  width: 100%;
  min-height: 40px;
  box-sizing: border-box;
  padding: 9px 11px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  outline: none;
  background: #fff;
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
}

body.operations-orders-page .next-operations-modern-select__search:focus {
  border-color: #fb923c;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, .11);
}

body.operations-orders-page .next-operations-modern-select__search::-webkit-search-cancel-button {
  opacity: .55;
}

body.operations-orders-page .next-operations-modern-select__options {
  max-height: min(310px, 42vh);
  overflow-y: auto;
  padding: 5px;
  overscroll-behavior: contain;
}

body.operations-orders-page .next-operations-modern-select__option {
  width: 100%;
  min-height: 45px;
  padding: 8px 9px 8px 10px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #0f172a;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  text-align: left;
}

body.operations-orders-page .next-operations-modern-select__option:hover {
  background: #f8fafc;
}

body.operations-orders-page .next-operations-modern-select__option.is-selected {
  background: #fff7ed;
  color: #9a3412;
}

body.operations-orders-page .next-operations-modern-select__option-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

body.operations-orders-page .next-operations-modern-select__option-copy strong {
  overflow: hidden;
  text-overflow: ellipsis;
  color: inherit;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
}

body.operations-orders-page .next-operations-modern-select__option-copy small {
  color: #94a3b8;
  font-size: 9px;
  font-weight: 750;
}

body.operations-orders-page .next-operations-modern-select__option > svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}

body.operations-orders-page .next-operations-modern-select__empty {
  padding: 18px 12px;
  color: #94a3b8;
  text-align: center;
  font-size: 11px;
  font-weight: 750;
}

body.operations-orders-page .next-operations-component-edit-error {
  min-height: 0;
  margin: 0;
  padding: 9px 11px;
  border: 1px solid #fecaca;
  border-radius: 12px;
  background: #fff1f2;
  color: #b91c1c;
}

body.operations-orders-page .next-operations-component-edit-actions {
  position: relative;
  z-index: 70;
  flex: 0 0 auto;
  margin: 0 -18px;
  padding: 12px 18px 14px;
  border-top: 1px solid #e5e7eb;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 -12px 28px rgba(15, 23, 42, .06);
}

body.operations-orders-page .next-operations-component-edit-actions .ro-action-btn {
  min-height: 42px;
  border-radius: 13px;
  padding: 0 16px;
}

@media (max-width: 720px) {
  body.operations-orders-page .next-classic-orders-parity .next-operations-edit-mode-badge {
    top: 12px;
    left: 12px;
    min-height: 26px;
    padding: 0 7px;
    gap: 4px;
    font-size: 9px;
    line-height: 1;
    white-space: nowrap;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-edit-mode-badge svg {
    width: 12px;
    height: 12px;
  }

  body.operations-orders-page .next-operations-edit-grid,
  body.operations-orders-page .next-operations-edit-grid--primary,
  body.operations-orders-page .next-operations-edit-qty-grid {
    grid-template-columns: 1fr 1fr;
  }

  body.operations-orders-page .next-operations-edit-grid--primary .next-operations-modern-select:first-child {
    grid-column: 1 / -1;
  }

  body.operations-orders-page .next-operations-edit-field--wide:first-child {
    grid-column: 1 / -1;
  }

  body.operations-orders-page .next-operations-component-edit-dialog {
    width: min(500px, calc(100vw - 28px));
    /* Reserve the bottom-dock area so the footer actions never sit behind it. */
    max-height: min(690px, calc(100dvh - 160px));
    padding: 12px 12px 0;
    border-radius: 18px;
  }

  body.operations-orders-page .next-operations-component-edit-header {
    padding-right: 42px;
  }

  body.operations-orders-page .next-operations-component-edit-header .req-edit-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 14px;
  }

  body.operations-orders-page .next-operations-component-edit-header .co-submodal-title {
    font-size: 20px;
    line-height: 1.05;
  }

  body.operations-orders-page .next-operations-component-edit-body {
    gap: 8px;
    margin-top: 9px;
    padding: 1px 3px 10px 0;
  }

  body.operations-orders-page .next-operations-edit-grid,
  body.operations-orders-page .next-operations-edit-qty-grid {
    gap: 8px;
  }

  body.operations-orders-page .next-operations-edit-section {
    gap: 7px;
    padding: 10px;
    border-radius: 15px;
  }

  body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-label {
    margin-bottom: 5px;
    font-size: 10px;
  }

  body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-input,
  body.operations-orders-page .next-operations-modern-select__trigger {
    min-height: 39px;
  }

  body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-input {
    padding: 8px 10px;
    border-radius: 12px;
    font-size: 12px;
  }

  body.operations-orders-page .next-operations-component-edit-dialog .co-submodal-textarea {
    min-height: 68px;
    padding: 9px 10px;
    border-radius: 12px;
    font-size: 12px;
  }

  body.operations-orders-page .next-operations-edit-hint {
    margin-top: 3px;
    font-size: 8px;
  }

  body.operations-orders-page .next-operations-custom-id-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  body.operations-orders-page .next-operations-customize-id-btn {
    min-height: 39px;
    padding: 0 10px;
    border-radius: 12px;
    font-size: 10px;
  }

  body.operations-orders-page .next-operations-custom-id-input {
    padding: 8px;
    border-radius: 13px;
  }

  body.operations-orders-page .next-operations-component-edit-actions {
    margin: 0 -12px;
    padding: 9px 12px 10px;
  }

  body.operations-orders-page .next-operations-component-edit-actions .ro-action-btn {
    flex: 1 1 0;
    justify-content: center;
  }

  body.operations-orders-page .next-operations-modern-select__options {
    max-height: min(280px, 38vh);
  }
}

/* ===== Orders · expandable component search inside order modals ===== */
.next-classic-orders-parity .order-modal-search-actions{
  width:100%;
  align-items:center;
}
.next-classic-orders-parity .order-component-search{
  --order-search-size:34px;
  position:relative;
  display:flex;
  align-items:center;
  width:var(--order-search-size);
  height:var(--order-search-size);
  min-width:var(--order-search-size);
  margin-right:auto;
  overflow:hidden;
  border:1px solid rgba(15,23,42,.10);
  border-radius:999px;
  background:#fff;
  box-shadow:0 6px 18px rgba(15,23,42,.08);
  transition:
    width .34s cubic-bezier(.22,1,.36,1),
    border-color .24s ease,
    box-shadow .24s ease,
    background-color .24s ease;
}
.next-classic-orders-parity .order-component-search.is-expanded{
  width:min(235px,48vw);
  border-color:rgba(15,23,42,.18);
  box-shadow:0 10px 26px rgba(15,23,42,.13);
}
.next-classic-orders-parity .order-component-search__toggle,
.next-classic-orders-parity .order-component-search__close{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 var(--order-search-size);
  width:var(--order-search-size);
  height:var(--order-search-size);
  padding:0;
  border:0;
  border-radius:999px;
  cursor:pointer;
  transition:transform .2s ease,background-color .2s ease,color .2s ease,opacity .2s ease;
}
.next-classic-orders-parity .order-component-search__toggle{
  position:relative;
  z-index:2;
  background:#091022;
  color:#fff;
}
.next-classic-orders-parity .order-component-search__toggle:hover{
  transform:scale(1.04);
  background:#111b31;
}
.next-classic-orders-parity .order-component-search__toggle:active{
  transform:scale(.96);
}
.next-classic-orders-parity .order-component-search__toggle svg,
.next-classic-orders-parity .order-component-search__close svg{
  width:15px;
  height:15px;
}
.next-classic-orders-parity .order-component-search__input{
  width:0;
  min-width:0;
  flex:1 1 auto;
  height:100%;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#101828;
  font:inherit;
  font-size:10px;
  font-weight:700;
  opacity:0;
  transform:translateX(-7px);
  pointer-events:none;
  transition:opacity .2s ease .08s,transform .28s cubic-bezier(.22,1,.36,1) .04s;
}
.next-classic-orders-parity .order-component-search.is-expanded .order-component-search__input{
  width:auto;
  padding:0 8px 0 10px;
  opacity:1;
  transform:translateX(0);
  pointer-events:auto;
}
.next-classic-orders-parity .order-component-search__input::placeholder{
  color:#98a2b3;
  font-weight:600;
}
.next-classic-orders-parity .order-component-search__input::-webkit-search-cancel-button{
  -webkit-appearance:none;
  appearance:none;
}
.next-classic-orders-parity .order-component-search__close{
  flex-basis:28px;
  width:28px;
  min-width:28px;
  height:28px;
  margin-right:3px;
  color:#667085;
  background:#f2f4f7;
  opacity:0;
  transform:scale(.75) translateX(8px);
  pointer-events:none;
}
.next-classic-orders-parity .order-component-search.is-expanded .order-component-search__close{
  opacity:1;
  transform:scale(1) translateX(0);
  pointer-events:auto;
}
.next-classic-orders-parity .order-component-search__close:hover{
  color:#101828;
  background:#e4e7ec;
}
.next-classic-orders-parity .order-component-search button:disabled{
  cursor:not-allowed;
  opacity:.55;
}
.next-classic-orders-parity .order-component-search-empty{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:76px;
  padding:18px;
  border:1px dashed rgba(15,23,42,.14);
  border-radius:14px;
  background:rgba(248,250,252,.8);
  color:#667085;
  font-size:11px;
  font-weight:700;
  text-align:center;
}
@media (max-width:720px){
  .next-classic-orders-parity .order-component-search.is-expanded{
    width:min(205px,52vw);
  }
}
@media (prefers-reduced-motion:reduce){
  .next-classic-orders-parity .order-component-search,
  .next-classic-orders-parity .order-component-search__toggle,
  .next-classic-orders-parity .order-component-search__close,
  .next-classic-orders-parity .order-component-search__input{
    transition:none !important;
  }
}


/* Operations Orders · cleaner modern component search */
body.operations-orders-page .next-classic-orders-parity .order-component-search{
  --order-search-size:38px;
  height:var(--order-search-size);
  min-width:var(--order-search-size);
  border:1px solid #e4e7ec;
  border-radius:13px;
  background:#f8fafc;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 6px 18px rgba(16,24,40,.06);
}
body.operations-orders-page .next-classic-orders-parity .order-component-search.is-expanded{
  width:min(270px,48vw);
  border-color:#d9dee7;
  background:#fff;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 10px 24px rgba(16,24,40,.08);
}
body.operations-orders-page .next-classic-orders-parity .order-component-search__toggle{
  flex:0 0 38px;
  width:38px;
  height:38px;
  border-radius:12px;
  background:#101828;
  color:#fff;
  box-shadow:none;
}
body.operations-orders-page .next-classic-orders-parity .order-component-search.is-expanded .order-component-search__toggle{
  flex-basis:32px;
  width:32px;
  height:32px;
  margin-left:3px;
  border-radius:10px;
}
body.operations-orders-page .next-classic-orders-parity .order-component-search__toggle:hover{
  background:#1d2939;
}
body.operations-orders-page .next-classic-orders-parity .order-component-search__toggle svg{
  width:16px;
  height:16px;
}
body.operations-orders-page .next-classic-orders-parity .order-component-search__input,
body.operations-orders-page .next-classic-orders-parity .order-component-search__input:focus,
body.operations-orders-page .next-classic-orders-parity .order-component-search__input:focus-visible{
  border:0 !important;
  border-left:0 !important;
  border-right:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  -webkit-appearance:none;
  appearance:none;
}
body.operations-orders-page .next-classic-orders-parity .order-component-search.is-expanded .order-component-search__input{
  padding:0 10px 0 9px;
  color:#1d2939;
  font-size:10.5px;
  font-weight:650;
  caret-color:#101828;
}
body.operations-orders-page .next-classic-orders-parity .order-component-search__input::placeholder{
  color:#98a2b3;
  font-weight:600;
}
body.operations-orders-page .next-classic-orders-parity .order-component-search__input::-webkit-search-decoration,
body.operations-orders-page .next-classic-orders-parity .order-component-search__input::-webkit-search-cancel-button,
body.operations-orders-page .next-classic-orders-parity .order-component-search__input::-webkit-search-results-button,
body.operations-orders-page .next-classic-orders-parity .order-component-search__input::-webkit-search-results-decoration{
  -webkit-appearance:none;
  appearance:none;
}
body.operations-orders-page .next-classic-orders-parity .order-component-search__close{
  flex:0 0 30px;
  width:30px;
  min-width:30px;
  height:30px;
  margin-right:4px;
  border-radius:9px;
  background:#f2f4f7;
  color:#667085;
  box-shadow:none;
}
body.operations-orders-page .next-classic-orders-parity .order-component-search__close:hover{
  background:#eaecf0;
  color:#1d2939;
}
@media (max-width:720px){
  body.operations-orders-page .next-classic-orders-parity .order-component-search.is-expanded{
    width:min(250px,52vw);
  }
}

/* ===== Classic shell · modern expandable global search ===== */
.classic-app-shell .main-header .searchbar.system-header-search{
  --system-search-size:44px;
  position:relative;
  display:flex !important;
  align-items:center;
  flex:0 0 var(--system-search-size) !important;
  width:var(--system-search-size) !important;
  max-width:none !important;
  min-width:var(--system-search-size);
  height:var(--system-search-size);
  margin:0 !important;
  padding:0 !important;
  gap:0 !important;
  overflow:hidden;
  order:0 !important;
  border:1px solid #e4e7ec !important;
  border-radius:999px !important;
  background:#f8fafc !important;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 6px 18px rgba(16,24,40,.06) !important;
  transition:
    width .34s cubic-bezier(.22,1,.36,1),
    flex-basis .34s cubic-bezier(.22,1,.36,1),
    border-color .24s ease,
    box-shadow .24s ease,
    background-color .24s ease;
}
.classic-app-shell .main-header .searchbar.system-header-search.is-expanded{
  flex-basis:min(390px,36vw) !important;
  width:min(390px,36vw) !important;
  border-color:#d9dee7 !important;
  background:#fff !important;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 10px 24px rgba(16,24,40,.08) !important;
}
.classic-app-shell .main-header .system-header-search__toggle,
.classic-app-shell .main-header .system-header-search__close{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  cursor:pointer;
  transition:transform .2s ease,background-color .2s ease,color .2s ease,opacity .2s ease;
}
.classic-app-shell .main-header .system-header-search__toggle{
  position:relative;
  z-index:2;
  flex:0 0 var(--system-search-size);
  width:var(--system-search-size);
  height:var(--system-search-size);
  border-radius:999px;
  background:#101828;
  color:#fff;
}
.classic-app-shell .main-header .system-header-search.is-expanded .system-header-search__toggle{
  flex-basis:34px;
  width:34px;
  height:34px;
  margin-left:3px;
  border-radius:999px;
}
.classic-app-shell .main-header .system-header-search__toggle:hover{
  background:#1d2939;
  transform:scale(1.03);
}
.classic-app-shell .main-header .system-header-search__toggle:active{
  transform:scale(.97);
}
.classic-app-shell .main-header .system-header-search__toggle svg,
.classic-app-shell .main-header .system-header-search__close svg{
  width:17px;
  height:17px;
  color:currentColor;
}
.classic-app-shell .main-header .searchbar.system-header-search .system-header-search__input,
.classic-app-shell .main-header .searchbar.system-header-search .system-header-search__input:focus,
.classic-app-shell .main-header .searchbar.system-header-search .system-header-search__input:focus-visible{
  flex:1 1 auto;
  width:0;
  min-width:0;
  height:100%;
  padding:0 !important;
  border:0 !important;
  border-left:0 !important;
  border-right:0 !important;
  outline:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#1d2939;
  font:inherit;
  font-size:13px;
  font-weight:650;
  opacity:0;
  transform:translateX(-7px);
  pointer-events:none;
  -webkit-appearance:none;
  appearance:none;
  transition:opacity .2s ease .08s,transform .28s cubic-bezier(.22,1,.36,1) .04s;
}
.classic-app-shell .main-header .searchbar.system-header-search.is-expanded .system-header-search__input{
  width:auto;
  padding:0 10px 0 9px !important;
  opacity:1;
  transform:translateX(0);
  pointer-events:auto;
  caret-color:#101828;
}
.classic-app-shell .main-header .system-header-search__input::placeholder{
  color:#98a2b3 !important;
  font-weight:600 !important;
}
.classic-app-shell .main-header .system-header-search__input::-webkit-search-decoration,
.classic-app-shell .main-header .system-header-search__input::-webkit-search-cancel-button,
.classic-app-shell .main-header .system-header-search__input::-webkit-search-results-button,
.classic-app-shell .main-header .system-header-search__input::-webkit-search-results-decoration{
  -webkit-appearance:none;
  appearance:none;
}
.classic-app-shell .main-header .system-header-search__close{
  flex:0 0 30px;
  width:30px;
  min-width:30px;
  height:30px;
  margin-right:4px;
  border-radius:9px;
  background:#f2f4f7;
  color:#667085;
  opacity:0;
  transform:scale(.75) translateX(8px);
  pointer-events:none;
}
.classic-app-shell .main-header .system-header-search.is-expanded .system-header-search__close{
  opacity:1;
  transform:scale(1) translateX(0);
  pointer-events:auto;
}
.classic-app-shell .main-header .system-header-search__close:hover{
  background:#eaecf0;
  color:#1d2939;
}
@media (max-width:720px){
  .classic-app-shell .main-header .searchbar.system-header-search.is-expanded{
    flex-basis:min(300px,44vw) !important;
    width:min(300px,44vw) !important;
  }
}
@media (prefers-reduced-motion:reduce){
  .classic-app-shell .main-header .searchbar.system-header-search,
  .classic-app-shell .main-header .system-header-search__toggle,
  .classic-app-shell .main-header .system-header-search__close,
  .classic-app-shell .main-header .system-header-search__input{
    transition:none !important;
  }
}

/* Operations Orders — align card status + creator label sizing --------------
 * Keep both stacked pills visually balanced: same visible height and type
 * scale, while allowing the status width to fit its text naturally.
 */
body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions .co-status-btn,
body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions .sv-mixed-approval-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: 30px;
  min-height: 30px;
  padding: 0 11px;
  border-radius: 999px;
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  box-shadow: none;
}

@media (max-width: 720px) {
  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions .co-status-btn,
  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions .sv-mixed-approval-pill {
    height: 27px;
    min-height: 27px;
    padding: 0 9px;
    font-size: 8.5px;
  }
}

/* ========================================================================
   Mobile responsive pass 1 — Next.js shell + Home + Operations Orders
   2026-09-09
   - Compact mobile topbar and keep expanded global search inside viewport.
   - Reduce the floating bottom dock footprint without changing desktop.
   - Make Operations Orders toolbar/cards fit narrow screens cleanly.
   - Compact the Home overview cards and analysis controls on phones.
   ===================================================================== */
@media (max-width: 768px) {
  :root {
    --mobile-home-block-w: 72px;
    --mobile-home-gap: 10px;
    --mobile-home-bridge-w: 8px;
    --mobile-pages-right-gap: 0px;
    --mobile-pages-block-radius: 24px;
  }

  /* ---------- Global mobile shell / topbar ---------- */
  body.next-classic-shell-active .classic-app-shell .main-header {
    padding: calc(env(safe-area-inset-top, 0px) + 9px) 12px 7px !important;
    overflow: visible !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-header .header-row1 {
    min-width: 0 !important;
    gap: 8px !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-header .header-row1 .left {
    min-width: 0 !important;
    gap: 8px !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-header .dash-title {
    min-height: 40px !important;
    max-width: min(50vw, 230px) !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    font-size: clamp(16px, 4.5vw, 18px) !important;
    line-height: 1 !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-header .header-row1 .right,
  body.next-classic-shell-active .classic-app-shell .main-header .topbar-right {
    min-width: 0 !important;
    gap: 8px !important;
  }

  .classic-app-shell .main-header .searchbar.system-header-search {
    --system-search-size: 40px;
  }

  .classic-app-shell .main-header .notif-bell-btn,
  .classic-app-shell .main-header .header-user,
  .classic-app-shell .main-header a.account-mini {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    flex-basis: 40px !important;
  }

  .classic-app-shell .main-header .header-user__avatar,
  .classic-app-shell .main-header a.account-mini .ico-circle {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
  }

  /* When search opens, let the topbar re-balance instead of clipping it. */
  body.next-classic-shell-active .classic-app-shell .main-header .header-row1:has(.system-header-search.is-expanded) .left {
    flex: 0 1 124px !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-header .header-row1:has(.system-header-search.is-expanded) .dash-title {
    max-width: 124px !important;
    padding-inline: 11px !important;
  }

  .classic-app-shell .main-header .searchbar.system-header-search.is-expanded {
    flex: 1 1 220px !important;
    width: auto !important;
    min-width: 156px !important;
    max-width: none !important;
  }

  .classic-app-shell .main-header .system-header-search.is-expanded .system-header-search__toggle {
    flex-basis: 32px !important;
    width: 32px !important;
    height: 32px !important;
  }

  .classic-app-shell .main-header .system-header-search__close {
    flex-basis: 28px !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    margin-right: 3px !important;
    border-radius: 999px !important;
  }

  body.next-classic-shell-active .classic-app-shell .next-classic-page-content {
    width: 100% !important;
    max-width: 100% !important;
    padding: 10px 12px 0 !important;
    box-sizing: border-box !important;
  }

  /* ---------- Bottom navigation dock ---------- */
  body.next-classic-shell-active .classic-app-shell > .sidebar,
  body.next-classic-shell-active.sidebar-collapsed .classic-app-shell > .sidebar,
  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host {
    left: 10px !important;
    right: 10px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
    min-height: 68px !important;
    height: 68px !important;
    max-height: 68px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .sidebar-nav {
    grid-template-columns: var(--mobile-home-block-w) minmax(0, 1fr) !important;
    column-gap: var(--mobile-home-gap) !important;
    min-height: 68px !important;
    height: 68px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip {
    height: var(--orders-toolbar-control-height) !important;
    min-height: var(--orders-toolbar-control-height) !important;
    border-radius: 24px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list {
    min-height: 68px !important;
    height: 68px !important;
    gap: 6px !important;
    padding: 4px 8px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 14px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link svg {
    width: 19px !important;
    height: 19px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.active,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link.active {
    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;
    min-height: 50px !important;
    border-radius: 18px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link {
    width: var(--mobile-home-block-w) !important;
    min-width: var(--mobile-home-block-w) !important;
    height: 58px !important;
    border-radius: 22px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link svg,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link.active svg {
    width: 20px !important;
    height: 20px !important;
    padding: 10px !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-content {
    padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* ---------- Operations Orders mobile toolbar ---------- */
  body.operations-orders-page .next-classic-orders-parity .next-operations-orders-toolbar-wrap {
    margin-bottom: 9px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 52px !important;
    align-items: stretch !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar__scroll {
    min-width: 0 !important;
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar__scroll::-webkit-scrollbar {
    display: none !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar .portfolio-tabs {
    min-width: max-content !important;
    min-height: 52px !important;
    padding: 4px !important;
    gap: 3px !important;
    border-radius: 16px !important;
    background: rgba(255,255,255,.96) !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio {
    width: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 5px !important;
    gap: 6px !important;
    justify-content: center !important;
    border-radius: 12px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar .tab-portfolio.active {
    width: auto !important;
    min-width: 88px !important;
    padding-inline: 9px !important;
    justify-content: flex-start !important;
  }

  body.operations-orders-page .next-classic-orders-parity .order-status-tab__icon {
    flex-basis: 28px !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 9px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .order-status-tab__copy {
    display: none !important;
  }

  body.operations-orders-page .next-classic-orders-parity .tab-portfolio.active .order-status-tab__copy {
    display: grid !important;
  }

  body.operations-orders-page .next-classic-orders-parity .order-status-tab__label {
    font-size: 10px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-toolbar__divider {
    display: none !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter {
    width: 52px !important;
    min-width: 52px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter__button {
    width: 52px !important;
    min-width: 52px !important;
    height: var(--orders-toolbar-control-height) !important;
    min-height: var(--orders-toolbar-control-height) !important;
    padding: 0 !important;
    justify-content: center !important;
    border-radius: 16px !important;
    background: #fff !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter__button-label {
    display: none !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter__button-icon {
    margin: 0 !important;
  }

  body.operations-orders-page .next-classic-orders-parity .orders-type-filter__panel {
    position: fixed !important;
    top: auto !important;
    right: 12px !important;
    bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important;
    left: 12px !important;
    width: auto !important;
    max-height: min(420px, 64vh) !important;
    overflow-y: auto !important;
  }

  /* ---------- Operations Orders cards ---------- */
  body.operations-orders-page .next-classic-orders-parity #requested-list {
    gap: 8px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card {
    padding: 9px 10px !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 20px rgba(15,23,42,.055) !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-top {
    grid-template-columns: 46px minmax(0, 1fr) auto !important;
    gap: 9px !important;
    min-height: 62px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-thumb {
    width: 46px !important;
    height: 46px !important;
    border-radius: 14px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-thumb svg {
    width: 21px !important;
    height: 21px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .co-title {
    font-size: 16px !important;
    line-height: 1.08 !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-meta {
    margin-top: 5px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-meta .co-sub {
    font-size: 10px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions {
    min-width: 92px !important;
    max-width: 138px !important;
    gap: 4px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-label {
    height: 27px !important;
    max-width: 112px !important;
    margin-right: -10px !important;
    padding: 0 18px 0 9px !important;
    font-size: 8.5px !important;
    border-radius: 999px 4px 4px 999px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-icon {
    width: 31px !important;
    min-width: 31px !important;
    height: 31px !important;
  }

  /* ---------- Home overview mobile cleanup ---------- */
  body.page-home .next-classic-page-content {
    padding-top: 10px !important;
  }

  body.page-home .home-card--hero {
    padding: 14px 12px !important;
    border-radius: 22px !important;
  }

  body.page-home .home-section-head {
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 12px !important;
  }

  body.page-home .home-section-title {
    font-size: 22px !important;
    line-height: 1.1 !important;
  }

  body.page-home .home-section-title svg {
    width: 20px !important;
    height: 20px !important;
  }

  body.page-home .home-global-analysis__trigger {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    justify-content: center !important;
    gap: 0 !important;
    border-radius: 14px !important;
  }

  body.page-home .home-global-analysis__trigger strong,
  body.page-home .home-global-analysis__trigger > svg:last-child {
    display: none !important;
  }

  body.page-home .home-global-analysis__icon {
    width: 28px !important;
    height: 28px !important;
  }

  body.page-home .home-kpis {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  body.page-home .home-orders-performance,
  body.page-home .home-summary-performance {
    min-height: 0 !important;
    padding: 12px !important;
    border-radius: 18px !important;
  }

  body.page-home .home-orders-performance__head,
  body.page-home .home-summary-performance__head {
    min-height: 40px !important;
    height: auto !important;
    margin: 0 0 8px !important;
    align-items: center !important;
  }

  body.page-home .home-orders-performance .stat__label,
  body.page-home .home-summary-performance .stat__label {
    font-size: 14px !important;
  }

  body.page-home .home-orders-performance .home-orders-analysis__trigger,
  body.page-home .home-summary-performance .home-orders-analysis__trigger {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    padding: 6px !important;
    grid-template-columns: 28px !important;
    border-radius: 13px !important;
  }

  body.page-home .home-orders-performance .home-orders-analysis__icon,
  body.page-home .home-summary-performance .home-orders-analysis__icon {
    width: 28px !important;
    height: 28px !important;
  }

  body.page-home .home-orders-performance__body,
  body.page-home .home-summary-performance__body {
    grid-template-columns: 96px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 0 !important;
    margin-top: 0 !important;
  }

  body.page-home .home-orders-ring,
  body.page-home .home-summary-ring {
    width: 92px !important;
    min-width: 92px !important;
    height: 92px !important;
    min-height: 92px !important;
    max-width: 92px !important;
    max-height: 92px !important;
    margin: 0 auto !important;
  }

  body.page-home .home-orders-ring svg,
  body.page-home .home-summary-ring svg {
    width: 92px !important;
    height: 92px !important;
  }

  body.page-home .home-orders-performance__legend,
  body.page-home .home-summary-performance__legend {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    min-height: 0 !important;
  }

  body.page-home .home-orders-status,
  body.page-home .home-summary-status {
    min-height: 46px !important;
    height: auto !important;
    padding: 7px 8px !important;
    gap: 7px !important;
    border-radius: 12px !important;
  }

  body.page-home .home-orders-status__bar,
  body.page-home .home-summary-status__bar {
    width: 4px !important;
    min-width: 4px !important;
    min-height: 30px !important;
    height: 30px !important;
  }

  body.page-home .home-orders-status strong,
  body.page-home .home-summary-status strong {
    font-size: 13px !important;
  }

  body.page-home .home-orders-status span:not(.home-orders-status__bar),
  body.page-home .home-summary-status span:not(.home-summary-status__bar) {
    font-size: 8px !important;
  }

  body.page-home .home-orders-status small,
  body.page-home .home-summary-status small {
    margin-top: 3px !important;
    font-size: 7px !important;
  }
}

@media (max-width: 520px) {
  /* Very narrow phones: search becomes the main header control while open. */
  body.next-classic-shell-active .classic-app-shell .main-header .header-row1:has(.system-header-search.is-expanded) .left {
    display: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-header .header-row1:has(.system-header-search.is-expanded) .right,
  body.next-classic-shell-active .classic-app-shell .main-header .header-row1:has(.system-header-search.is-expanded) .topbar-right {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  .classic-app-shell .main-header .searchbar.system-header-search.is-expanded {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-card-head-actions {
    min-width: 88px !important;
    max-width: 122px !important;
  }

  body.operations-orders-page .next-classic-orders-parity .next-operations-order-card .next-operations-creator-label {
    max-width: 96px !important;
  }

  body.page-home .home-orders-performance__body,
  body.page-home .home-summary-performance__body {
    grid-template-columns: 88px minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  body.page-home .home-orders-ring,
  body.page-home .home-summary-ring,
  body.page-home .home-orders-ring svg,
  body.page-home .home-summary-ring svg {
    width: 86px !important;
    min-width: 86px !important;
    height: 86px !important;
    min-height: 86px !important;
    max-width: 86px !important;
    max-height: 86px !important;
  }
}

/* ========================================================================
   Mobile bottom sidebar / page dock — responsive pass 2
   2026-09-09
   Keep desktop untouched.  On phones the page navigation is a compact,
   predictable two-part dock: Home + horizontally scrollable page icons.
   This intentionally overrides the older desktop boundary spacing and the
   oversized first/active mobile item rules that were stretching the dock.
   ===================================================================== */
@media (max-width: 768px) {
  :root {
    --mobile-home-block-w: 56px;
    --mobile-home-gap: 8px;
    --mobile-home-bridge-w: 0px;
    --mobile-pages-right-gap: 0px;
    --mobile-pages-block-radius: 20px;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar,
  body.next-classic-shell-active.sidebar-collapsed .classic-app-shell > .sidebar,
  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
    width: auto !important;
    min-width: 0 !important;
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    z-index: 1600 !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar .sidebar-header,
  body.next-classic-shell-active .classic-app-shell > .sidebar .sidebar-footer {
    display: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .sidebar-nav {
    display: grid !important;
    grid-template-columns: var(--mobile-home-block-w) minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: var(--mobile-home-gap) !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip {
    box-sizing: border-box !important;
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 20px !important;
    background: #0b0c10 !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .22) !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail {
    width: var(--mobile-home-block-w) !important;
    min-width: var(--mobile-home-block-w) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail::after {
    content: none !important;
    display: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip {
    min-width: 0 !important;
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    scroll-snap-type: x proximity !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: max-content !important;
    min-width: 100% !important;
    height: 58px !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 4px 6px !important;
    gap: 4px !important;
    list-style: none !important;
  }

  /* Desktop separators must not reserve vertical space inside a horizontal dock. */
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li.sidebar-workspace-boundary,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li.sidebar-users-boundary,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:has(> a.nav-link[href="/user-access"]) {
    position: relative !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    scroll-snap-align: center !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li::before,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li::after {
    content: none !important;
    display: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .nav-label {
    display: none !important;
  }

  /* All page buttons use one compact footprint.  Explicit first-child rules
     neutralize the legacy "first page behaves like Home" mobile styling. */
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    border: 1px solid transparent !important;
    border-radius: 13px !important;
    background: transparent !important;
    color: rgba(255,255,255,.72) !important;
    box-shadow: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link svg,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link svg {
    box-sizing: border-box !important;
    width: 18px !important;
    height: 18px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: currentColor !important;
    stroke: currentColor !important;
    box-shadow: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link:hover,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link:hover {
    background: rgba(255,255,255,.08) !important;
    color: #fff !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.active,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link.active {
    flex-basis: 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    border: 1.5px solid #0b0c10 !important;
    border-radius: 15px !important;
    background: #fff !important;
    color: #0b0c10 !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.20) !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.active svg,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link.active svg {
    width: 19px !important;
    height: 19px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #0b0c10 !important;
    stroke: currentColor !important;
    box-shadow: none !important;
  }

  /* Home stays separate, but no longer consumes a quarter of a phone screen. */
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail > li {
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link.active {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 17px !important;
    background: transparent !important;
    color: rgba(255,255,255,.94) !important;
    box-shadow: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link svg,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link.active svg {
    box-sizing: content-box !important;
    width: 18px !important;
    height: 18px !important;
    padding: 8px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.09) !important;
    color: currentColor !important;
    stroke: currentColor !important;
    box-shadow: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link.active svg {
    background: #fff !important;
    color: #0b0c10 !important;
    stroke: currentColor !important;
    box-shadow: 0 8px 18px rgba(255,255,255,.12) !important;
  }

  /* Reserve only the space the repaired dock actually occupies. */
  body.next-classic-shell-active .classic-app-shell .main-content {
    padding-bottom: calc(74px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (max-width: 390px) {
  :root {
    --mobile-home-block-w: 52px;
    --mobile-home-gap: 6px;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar,
  body.next-classic-shell-active.sidebar-collapsed .classic-app-shell > .sidebar,
  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host {
    left: 9px !important;
    right: 9px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list {
    gap: 3px !important;
    padding-inline: 5px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link {
    flex-basis: 36px !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.active,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link.active {
    flex-basis: 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link.active {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
  }
}

/* ========================================================================
   Mobile bottom sidebar — restore Classic dock geometry
   2026-09-09
   The Next shell does not always get the Classic JS "structured dock" DOM
   wrapper, so the mobile dock must also match the original Classic layout in
   its plain .sidebar-nav/.nav-list form.  Keep the exact Classic proportions:
   80px dock, separate 88px Home rail, 18px gap and the small black bridge.
   ===================================================================== */
@media (max-width: 768px) {
  :root {
    --mobile-dock-bg: #0B0C10;
    --mobile-dock-shadow: 0 18px 40px rgba(15,23,42,0.18);
    --mobile-home-block-w: 88px;
    --mobile-home-gap: 18px;
    --mobile-home-bridge-w: 10px;
    --mobile-pages-right-gap: 8px;
    --mobile-pages-block-radius: 30px;
    --mobile-main-bottom-space: calc(126px + env(safe-area-inset-bottom, 0px));
    --mobile-main-scroll-space: calc(144px + env(safe-area-inset-bottom, 0px));
  }

  /* Restore the original Classic 80px dock box. */
  body.next-classic-shell-active .classic-app-shell > .sidebar,
  body.next-classic-shell-active.sidebar-collapsed .classic-app-shell > .sidebar,
  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host {
    position: fixed !important;
    top: auto !important;
    left: 12px !important;
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 18px) !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 80px !important;
    height: 80px !important;
    max-height: 80px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    overflow: visible !important;
    z-index: 1600 !important;
    isolation: isolate !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar .sidebar-header,
  body.next-classic-shell-active .classic-app-shell > .sidebar .sidebar-footer {
    display: none !important;
  }

  /* Plain Classic DOM (used by the Next shell before/without common-ui.js). */
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 80px !important;
    height: 80px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    white-space: nowrap !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }

  /* Main pages block exactly like Classic. */
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host)::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: var(--mobile-pages-right-gap) !important;
    bottom: 0 !important;
    left: calc(var(--mobile-home-block-w) + var(--mobile-home-gap)) !important;
    background: var(--mobile-dock-bg) !important;
    border-radius: var(--mobile-pages-block-radius) !important;
    box-shadow: var(--mobile-dock-shadow) !important;
    z-index: 0 !important;
    pointer-events: none !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav::before {
    content: none !important;
    display: none !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: max-content !important;
    min-width: 100% !important;
    min-height: 80px !important;
    height: 80px !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 4px 14px 4px 0 !important;
    list-style: none !important;
  }

  /* Remove desktop workspace separators/margins from the horizontal dock. */
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li {
    position: relative !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1 !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li::before,
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li::after {
    content: none !important;
    display: none !important;
  }

  /* Separate Home block. */
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child {
    position: sticky !important;
    left: 0 !important;
    z-index: 3 !important;
    margin: 0 var(--mobile-home-gap) 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    background: var(--mobile-dock-bg) !important;
    border-radius: var(--mobile-pages-block-radius) !important;
    box-shadow: var(--mobile-dock-shadow) !important;
    z-index: -1 !important;
    pointer-events: none !important;
  }

  /* Classic small black separator/bridge between Home and the pages block. */
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 50% !important;
    left: calc(100% + 4px) !important;
    width: var(--mobile-home-bridge-w) !important;
    height: 24px !important;
    transform: translateY(-50%) !important;
    border-radius: 999px !important;
    background: var(--mobile-dock-bg) !important;
    box-shadow: 0 8px 14px rgba(15,23,42,0.10) !important;
    z-index: -1 !important;
    pointer-events: none !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child + li {
    /* Match the structured dock first-icon inset exactly:
       pages rail begins after Home + 18px, then the first page icon sits 14px
       inside it. The flex gap already contributes 10px, so only 4px is needed. */
    margin-left: 4px !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .nav-label {
    display: none !important;
  }

  /* Page buttons: same size as Classic and always vertically contained. */
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav .nav-link {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    border-radius: 16px !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav .nav-link svg {
    box-sizing: border-box !important;
    width: 20px !important;
    height: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav .nav-link.active {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    background: #FFFFFF !important;
    color: #0B0C10 !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 26px rgba(255,255,255,0.14), 0 12px 24px rgba(0,0,0,0.18) !important;
  }

  /* Home retains the larger separate Classic rail, aligned to the same 80px dock. */
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child .nav-link,
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child .nav-link.active {
    width: var(--mobile-home-block-w) !important;
    min-width: var(--mobile-home-block-w) !important;
    height: 68px !important;
    min-height: 68px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 28px !important;
    background: transparent !important;
    color: rgba(255,255,255,0.94) !important;
    box-shadow: none !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child .nav-link svg,
  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child .nav-link.active svg {
    box-sizing: content-box !important;
    width: 22px !important;
    height: 22px !important;
    padding: 12px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,0.09) !important;
    color: currentColor !important;
    box-shadow: none !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child .nav-link.active svg {
    background: #FFFFFF !important;
    color: #0B0C10 !important;
    box-shadow: 0 12px 24px rgba(255,255,255,0.16) !important;
  }

  /* If Classic JS does build the structured mobile dock, restore the exact
     same geometry there too so both DOM forms render identically. */
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host::before {
    content: none !important;
    display: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .sidebar-nav {
    display: grid !important;
    grid-template-columns: var(--mobile-home-block-w) minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: var(--mobile-home-gap) !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 80px !important;
    height: 80px !important;
    padding: 0 var(--mobile-pages-right-gap) 0 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip {
    box-sizing: border-box !important;
    min-height: 80px !important;
    height: 80px !important;
    max-height: 80px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: var(--mobile-pages-block-radius) !important;
    background: var(--mobile-dock-bg) !important;
    box-shadow: var(--mobile-dock-shadow) !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail {
    position: relative !important;
    z-index: 3 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: var(--mobile-home-block-w) !important;
    min-width: var(--mobile-home-block-w) !important;
    padding: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 50% !important;
    left: calc(100% + 4px) !important;
    width: var(--mobile-home-bridge-w) !important;
    height: 24px !important;
    transform: translateY(-50%) !important;
    border-radius: 999px !important;
    background: var(--mobile-dock-bg) !important;
    box-shadow: 0 8px 14px rgba(15,23,42,0.10) !important;
    pointer-events: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip {
    min-width: 0 !important;
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list {
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: max-content !important;
    min-width: 100% !important;
    min-height: 80px !important;
    height: 80px !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 4px 14px !important;
    list-style: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li {
    position: relative !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li::before,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li::after {
    content: none !important;
    display: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 16px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link svg,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link svg {
    box-sizing: border-box !important;
    width: 20px !important;
    height: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.active,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li:first-child .nav-link.active {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    background: #FFFFFF !important;
    color: #0B0C10 !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 26px rgba(255,255,255,0.14), 0 12px 24px rgba(0,0,0,0.18) !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail > li {
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link.active {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: var(--mobile-home-block-w) !important;
    min-width: var(--mobile-home-block-w) !important;
    height: 68px !important;
    min-height: 68px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 28px !important;
    background: transparent !important;
    color: rgba(255,255,255,0.94) !important;
    box-shadow: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link svg,
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link.active svg {
    box-sizing: content-box !important;
    width: 22px !important;
    height: 22px !important;
    padding: 12px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,0.09) !important;
    color: currentColor !important;
    box-shadow: none !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail .nav-link.active svg {
    background: #FFFFFF !important;
    color: #0B0C10 !important;
    box-shadow: 0 12px 24px rgba(255,255,255,0.16) !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-content {
    padding-bottom: var(--mobile-main-bottom-space) !important;
  }
}

/* ========================================================================
   Shell stability pass — mobile dock scroll, safe page end and loading chrome
   2026-09-09
   ===================================================================== */

/* Keep the real header/sidebar visible with the same geometry while Home and
   order pages are waiting for their server bootstrap data. */
.next-stable-loading-sidebar .next-stable-loading-nav {
  cursor: default !important;
  pointer-events: none !important;
}

.classic-app-shell .main-header .next-stable-loading-header-button {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 44px !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid #e4e7ec !important;
  border-radius: 999px !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 6px 18px rgba(16,24,40,.06) !important;
  pointer-events: none !important;
}

.classic-app-shell .main-header .next-stable-loading-header-button.system-header-search__toggle {
  background: #101828 !important;
  color: #fff !important;
}

.classic-app-shell .main-header .next-stable-loading-header-button.notif-bell-btn {
  background: #fff !important;
  color: #101828 !important;
}

.classic-app-shell .main-header .next-stable-loading-header-button svg {
  width: 18px !important;
  height: 18px !important;
}

.classic-app-shell .main-header .next-stable-loading-user {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 44px !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  pointer-events: none !important;
}

.classic-app-shell .main-header .next-stable-loading-user .header-user__avatar {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.classic-app-shell .main-header .next-stable-loading-user__fallback {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  border: 2px solid rgba(249,115,22,.85) !important;
  border-radius: inherit !important;
  background: #fff !important;
  color: #101828 !important;
}

.classic-app-shell .main-header .next-stable-loading-user__fallback svg {
  width: 20px !important;
  height: 20px !important;
}

@media (max-width: 768px) {
  :root {
    --next-mobile-dock-safe-space: calc(116px + env(safe-area-inset-bottom, 0px));
  }

  /* The page itself is the vertical scroller. Reserve real space inside that
     scroller so the final card/row can always move completely above the dock. */
  body.next-classic-shell-active .classic-app-shell .main-content {
    padding-bottom: 0 !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-content > main,
  body.next-classic-shell-active .classic-app-shell .main-content > main.container,
  body.next-classic-shell-active .classic-app-shell .main-content > main.container-full-width,
  body.next-classic-shell-active .classic-app-shell .main-content > main.page-body,
  body.next-classic-shell-active .classic-app-shell .main-content > main.tasks-v2-main {
    box-sizing: border-box !important;
    padding-bottom: var(--next-mobile-dock-safe-space) !important;
    scroll-padding-bottom: var(--next-mobile-dock-safe-space) !important;
  }

  body.next-classic-shell-active .classic-app-shell .main-content > main > :last-child {
    scroll-margin-bottom: 16px !important;
  }

  /* Once the client shell mounts, Home and the page list are deliberately two
     independent rails. Only the pages rail scrolls horizontally. */
  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip {
    overflow-x: scroll !important;
    overflow-y: hidden !important;
    touch-action: pan-x !important;
    overscroll-behavior-x: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    cursor: grab;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip:active {
    cursor: grabbing;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-pages-list {
    width: max-content !important;
    min-width: max-content !important;
    padding-right: 18px !important;
  }

  body.next-classic-shell-active .classic-app-shell .sidebar.mobile-dock-structured-host .mobile-dock-home-rail {
    list-style: none !important;
  }

  .classic-app-shell .main-header .next-stable-loading-header-button,
  .classic-app-shell .main-header .next-stable-loading-user {
    flex-basis: 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
  }
}

/* ========================================================================
   Mobile loading-transition bottom dock — first-paint stability
   2026-09-10
   The route loading shell is server-rendered before BodyClassSync hydrates.
   Keep its bottom navigation in the exact same geometry as the live dock so
   page icons never jump below/outside the black rail during navigation.
   Scoped ONLY to .next-stable-loading-sidebar; normal page sidebar is untouched.
   ===================================================================== */
@media (max-width: 768px) {
  .classic-app-shell > .sidebar.next-stable-loading-sidebar,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host {
    --loading-mobile-dock-bg: #0B0C10;
    --loading-mobile-home-w: 88px;
    --loading-mobile-gap: 18px;
    --loading-mobile-bridge-w: 10px;
    --loading-mobile-radius: 30px;
    box-sizing: border-box !important;
    position: fixed !important;
    top: auto !important;
    left: 12px !important;
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 18px) !important;
    width: auto !important;
    min-width: 0 !important;
    height: 80px !important;
    min-height: 80px !important;
    max-height: 80px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    opacity: 1 !important;
    overflow: visible !important;
    z-index: 1600 !important;
    isolation: isolate !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar .sidebar-header,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar .sidebar-footer {
    display: none !important;
  }

  /* ---------- Plain loading DOM (before the mobile structure effect) ---------- */
  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host)::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: 8px !important;
    bottom: 0 !important;
    left: calc(var(--loading-mobile-home-w) + var(--loading-mobile-gap)) !important;
    border-radius: var(--loading-mobile-radius) !important;
    background: var(--loading-mobile-dock-bg) !important;
    box-shadow: 0 18px 40px rgba(15,23,42,.18) !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav {
    box-sizing: border-box !important;
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 80px !important;
    min-height: 80px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    white-space: nowrap !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    z-index: 1 !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list {
    box-sizing: border-box !important;
    position: relative !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: max-content !important;
    min-width: 100% !important;
    height: 80px !important;
    min-height: 80px !important;
    gap: 10px !important;
    padding: 4px 14px 4px 0 !important;
    margin: 0 !important;
    list-style: none !important;
    z-index: 1 !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li {
    box-sizing: border-box !important;
    position: relative !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li::before,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li::after {
    content: none !important;
    display: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:first-child {
    box-sizing: border-box !important;
    position: sticky !important;
    left: 0 !important;
    z-index: 3 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 var(--loading-mobile-home-w) !important;
    width: var(--loading-mobile-home-w) !important;
    min-width: var(--loading-mobile-home-w) !important;
    height: 80px !important;
    min-height: 80px !important;
    max-height: 80px !important;
    margin-right: var(--loading-mobile-gap) !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:first-child::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    border-radius: var(--loading-mobile-radius) !important;
    background: var(--loading-mobile-dock-bg) !important;
    box-shadow: 0 18px 40px rgba(15,23,42,.18) !important;
    z-index: -1 !important;
    pointer-events: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:first-child::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 50% !important;
    left: calc(100% + 4px) !important;
    width: var(--loading-mobile-bridge-w) !important;
    height: 24px !important;
    transform: translateY(-50%) !important;
    border-radius: 999px !important;
    background: var(--loading-mobile-dock-bg) !important;
    z-index: -1 !important;
    pointer-events: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:first-child + li {
    /* Keep server-rendered loading geometry identical to the hydrated dock. */
    margin-left: 4px !important;
  }

  /* ---------- Structured loading DOM (after hydration) ---------- */
  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host::before {
    content: none !important;
    display: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host > .sidebar-nav {
    box-sizing: border-box !important;
    position: relative !important;
    display: grid !important;
    grid-template-columns: var(--loading-mobile-home-w) minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: var(--loading-mobile-gap) !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 80px !important;
    min-height: 80px !important;
    padding: 0 8px 0 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-home-rail,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-pages-clip {
    box-sizing: border-box !important;
    height: 80px !important;
    min-height: 80px !important;
    max-height: 80px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: var(--loading-mobile-radius) !important;
    background: var(--loading-mobile-dock-bg) !important;
    box-shadow: 0 18px 40px rgba(15,23,42,.18) !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-home-rail {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: var(--loading-mobile-home-w) !important;
    min-width: var(--loading-mobile-home-w) !important;
    list-style: none !important;
    z-index: 3 !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-home-rail::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 50% !important;
    left: calc(100% + 4px) !important;
    width: var(--loading-mobile-bridge-w) !important;
    height: 24px !important;
    transform: translateY(-50%) !important;
    border-radius: 999px !important;
    background: var(--loading-mobile-dock-bg) !important;
    pointer-events: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-pages-clip {
    min-width: 0 !important;
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    z-index: 1 !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-pages-clip::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-pages-list {
    box-sizing: border-box !important;
    position: relative !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: max-content !important;
    min-width: 100% !important;
    height: 80px !important;
    min-height: 80px !important;
    gap: 10px !important;
    padding: 4px 14px !important;
    margin: 0 !important;
    list-style: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-home-rail > li {
    box-sizing: border-box !important;
    position: relative !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li::before,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar.mobile-dock-structured-host .mobile-dock-pages-list > li::after {
    content: none !important;
    display: none !important;
  }

  /* ---------- Shared icon geometry: always vertically contained ---------- */
  .classic-app-shell > .sidebar.next-stable-loading-sidebar .nav-label {
    display: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar .mobile-dock-pages-list .next-stable-loading-nav,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:not(:first-child) .next-stable-loading-nav {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: transparent !important;
    color: rgba(255,255,255,.72) !important;
    box-shadow: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar .mobile-dock-pages-list .next-stable-loading-nav.active,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:not(:first-child) .next-stable-loading-nav.active {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    border: 1.5px solid #0B0C10 !important;
    border-radius: 16px !important;
    background: #FFFFFF !important;
    color: #0B0C10 !important;
    box-shadow: 0 12px 24px rgba(0,0,0,.18) !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar .mobile-dock-pages-list .next-stable-loading-nav svg,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:not(:first-child) .next-stable-loading-nav svg {
    box-sizing: border-box !important;
    width: 20px !important;
    height: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    color: currentColor !important;
    stroke: currentColor !important;
    box-shadow: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar .mobile-dock-home-rail .next-stable-loading-nav,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:first-child .next-stable-loading-nav {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: var(--loading-mobile-home-w) !important;
    min-width: var(--loading-mobile-home-w) !important;
    height: 68px !important;
    min-height: 68px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 28px !important;
    background: transparent !important;
    color: rgba(255,255,255,.94) !important;
    box-shadow: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar .mobile-dock-home-rail .next-stable-loading-nav svg,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:first-child .next-stable-loading-nav svg {
    box-sizing: content-box !important;
    width: 22px !important;
    height: 22px !important;
    padding: 12px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.09) !important;
    color: currentColor !important;
    stroke: currentColor !important;
    box-shadow: none !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar .mobile-dock-home-rail .next-stable-loading-nav.active svg,
  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.mobile-dock-structured-host) > .sidebar-nav > .nav-list > li:first-child .next-stable-loading-nav.active svg {
    background: #FFFFFF !important;
    color: #0B0C10 !important;
    box-shadow: 0 12px 24px rgba(255,255,255,.16) !important;
  }
}

/* =========================================================
   Next shell · compact user profile menu
   Keep the same visual language while reducing the menu footprint so the
   avatar dropdown feels proportional to the compact header/mobile UI.
   ========================================================= */
.user-menu-panel--portal{
  width: 286px !important;
  max-width: calc(100vw - 24px) !important;
}

.user-menu-panel--portal .user-menu-shell{
  border-radius: 22px !important;
  padding: 10px !important;
}

.user-menu-panel--portal .user-menu-user{
  gap: 10px !important;
  padding: 7px 8px 9px !important;
  border-radius: 16px !important;
}

.user-menu-panel--portal .user-menu-user__avatar{
  width: 42px !important;
  height: 42px !important;
  box-shadow: 0 0 0 3px rgba(234,88,12,0.12) !important;
}

.user-menu-panel--portal .user-menu-user__name{
  font-size: 13px !important;
}

.user-menu-panel--portal .user-menu-user__role{
  margin-top: 2px !important;
  font-size: 11px !important;
}

.user-menu-panel--portal .user-menu-item{
  gap: 10px !important;
  padding: 8px 10px !important;
  border-radius: 13px !important;
  font-size: 13px !important;
}

.user-menu-panel--portal .user-menu-item .umi-ico{
  width: 21px !important;
  height: 21px !important;
}

.user-menu-panel--portal .user-menu-item .umi-ico svg,
.user-menu-panel--portal .user-menu-item .umi-ico i{
  width: 16px !important;
  height: 16px !important;
}

.user-menu-panel--portal .user-menu-sep{
  margin: 7px 7px !important;
}

.user-menu-panel--portal .user-menu-sep.user-menu-sep--tight{
  margin: 6px 7px 7px !important;
}

.user-menu-panel--portal .user-menu-item.user-menu-item--refresh{
  margin-top: 7px !important;
}

@media (max-width: 768px){
  .user-menu-panel--portal{
    width: 276px !important;
    max-width: calc(100vw - 24px) !important;
  }

  .user-menu-panel--portal .user-menu-shell{
    border-radius: 20px !important;
    padding: 9px !important;
  }

  .user-menu-panel--portal .user-menu-user__avatar{
    width: 40px !important;
    height: 40px !important;
  }

  .user-menu-panel--portal .user-menu-item{
    min-height: 0 !important;
    padding: 7px 9px !important;
    font-size: 12.5px !important;
  }
}

/* ========================================================================
   Desktop sidebar viewport continuity during App Router loading
   2026-09-10
   Preserve the exact vertical sidebar viewport while a route loading shell is
   server-rendered. The live shell stores its scrollTop in a same-site cookie;
   the loading shell applies that offset on its first frame, then the hydrated
   viewport keeper restores the native scroll position before the next paint.
   ===================================================================== */
@media (min-width: 769px) {
  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.sidebar-viewport-restored) > .sidebar-nav {
    overflow-y: hidden !important;
  }

  .classic-app-shell > .sidebar.next-stable-loading-sidebar:not(.sidebar-viewport-restored) > .sidebar-nav > .nav-list {
    transform: translate3d(0, calc(-1 * var(--next-loading-sidebar-scroll-top, 0px)), 0) !important;
    transform-origin: top left !important;
    will-change: transform;
  }
}

/* -------------------------------------------------------------------------
 * Task Management secondary navigation rail
 *
 * Replaces the old white popover with a true second sidebar that slides out
 * from behind the primary Classic rail. Desktop opens to the right; mobile
 * opens upward from behind the bottom dock, matching the same black/white
 * visual language as the main navigation.
 * ---------------------------------------------------------------------- */
.task-management-secondary-sidebar {
  position: fixed;
  z-index: 69;
  box-sizing: border-box;
  width: 206px;
  min-height: 164px;
  padding: 11px 12px 11px 28px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 0 24px 24px 0;
  background: #0B0C10;
  box-shadow: 16px 18px 38px rgba(15,23,42,.22);
  opacity: 0;
  pointer-events: none;
  transform: translateX(calc(-100% + 30px));
  transform-origin: left center;
  transition:
    transform .34s cubic-bezier(.22,1,.36,1),
    opacity .18s ease;
  will-change: transform, opacity;
}

.task-management-secondary-sidebar.is-positioning {
  transition: none !important;
}

.task-management-secondary-sidebar.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(0);
}

.task-management-secondary-sidebar__rail {
  display: grid;
  gap: 7px;
}

.task-management-secondary-sidebar__link {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 4px 12px 4px 7px;
  border: 1px solid transparent;
  border-radius: 15px;
  color: rgba(255,255,255,.72);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: -.01em;
  text-decoration: none;
  transition:
    background .18s ease,
    color .18s ease,
    transform .18s ease,
    box-shadow .18s ease;
}

.task-management-secondary-sidebar__link svg {
  width: 18px;
  height: 18px;
  padding: 9px;
  border-radius: 13px;
  color: rgba(255,255,255,.74);
  background: rgba(255,255,255,.055);
  stroke-width: 2;
}

.task-management-secondary-sidebar__link:hover {
  color: #fff;
  background: rgba(255,255,255,.075);
  transform: translateX(2px);
}

.task-management-secondary-sidebar__link.is-active {
  color: #0B0C10;
  background: #fff;
  border-color: rgba(255,255,255,.92);
  box-shadow: 0 12px 24px rgba(0,0,0,.20);
}

.task-management-secondary-sidebar__link.is-active svg {
  color: #0B0C10;
  background: #F2F4F7;
}

/* Keep the task parent visually engaged while its second rail is open. */
.classic-app-shell a.nav-link[href="/next/task-management"][aria-expanded="true"],
.classic-app-shell a.nav-link[href="/next/events"][aria-expanded="true"],
.classic-app-shell a.nav-link[href="/next/orders/new"][aria-expanded="true"] {
  background: #fff !important;
  color: #0B0C10 !important;
  box-shadow: 0 12px 26px rgba(255,255,255,.12), 0 12px 24px rgba(0,0,0,.16) !important;
}

@media (max-width: 768px) {
  .task-management-secondary-sidebar {
    z-index: 69;
    left: 50% !important;
    top: auto !important;
    bottom: 78px;
    width: min(430px, calc(100vw - 54px));
    min-height: 70px;
    padding: 9px 10px 20px;
    border-radius: 24px 24px 12px 12px;
    box-shadow: 0 -16px 34px rgba(15,23,42,.18);
    transform: translate(-50%, calc(100% - 22px));
    transform-origin: center bottom;
  }

  .task-management-secondary-sidebar.is-open {
    transform: translate(-50%, 0);
  }

  .task-management-secondary-sidebar__rail {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .task-management-secondary-sidebar__link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    min-width: 0;
    min-height: 54px;
    padding: 6px 4px;
    border-radius: 16px;
    font-size: 9px;
    line-height: 1.15;
    text-align: center;
  }

  .task-management-secondary-sidebar__link span {
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .task-management-secondary-sidebar__link svg {
    width: 18px;
    height: 18px;
    padding: 7px;
    border-radius: 12px;
  }

  .task-management-secondary-sidebar__link:hover {
    transform: none;
  }
}

/* ========================================================================
   Task Management secondary sidebar polish
   2026-09-11
   - Keep desktop secondary-page icons clearly visible on the dark rail.
   - On mobile, the secondary rail belongs only to the right/pages dock block;
     the separate Home block remains completely outside it.
   ===================================================================== */

/* Explicit strokes avoid older/global svg rules washing the flyout icons out. */
.task-management-secondary-sidebar__link:not(.is-active) svg {
  color: #F8FAFC !important;
  stroke: #F8FAFC !important;
  background: rgba(255, 255, 255, 0.12) !important;
}

.task-management-secondary-sidebar__link:not(.is-active) svg :is(path, line, polyline, polygon, circle, rect) {
  stroke: #F8FAFC !important;
}

.task-management-secondary-sidebar__link.is-active svg {
  color: #0B0C10 !important;
  stroke: #0B0C10 !important;
  background: #F2F4F7 !important;
}

.task-management-secondary-sidebar__link.is-active svg :is(path, line, polyline, polygon, circle, rect) {
  stroke: #0B0C10 !important;
}

@media (max-width: 768px) {
  /*
   * Match the exact horizontal footprint of the primary pages block:
   *   shell left + Home block + Classic gap  -> panel left
   *   shell right + pages right inset        -> panel right
   * This deliberately excludes the separate Home rail.
   */
  .task-management-secondary-sidebar {
    left: calc(12px + var(--mobile-home-block-w, 88px) + var(--mobile-home-gap, 18px)) !important;
    right: calc(12px + var(--mobile-pages-right-gap, 8px)) !important;
    width: auto !important;
    top: auto !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 18px) !important;
    min-height: 148px !important;
    height: 148px !important;
    padding: 10px 10px 84px !important;
    border-radius: 24px 24px var(--mobile-pages-block-radius, 30px) var(--mobile-pages-block-radius, 30px) !important;
    box-shadow: 0 -16px 34px rgba(15,23,42,.18) !important;
    transform: translateY(calc(100% - 80px)) !important;
    transform-origin: center bottom !important;
  }

  .task-management-secondary-sidebar.is-open {
    transform: translateY(0) !important;
  }

  .task-management-secondary-sidebar__rail {
    width: 100% !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .task-management-secondary-sidebar__link {
    min-height: 54px !important;
    height: 54px !important;
  }
}

/* ========================================================================
   Task Management secondary sidebar icon visibility — mobile/desktop
   2026-09-11
   The global border-box rule was shrinking the SVG drawing area because the
   flyout icon itself also has padding. Keep the SVG glyph at its intended
   size, then force clear inactive/active contrast.
   ===================================================================== */
.task-management-secondary-sidebar__link svg {
  box-sizing: content-box !important;
  display: block !important;
  flex: 0 0 auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
}

.task-management-secondary-sidebar__link:not(.is-active) svg {
  color: #FFFFFF !important;
  stroke: #FFFFFF !important;
}

.task-management-secondary-sidebar__link:not(.is-active) svg :is(path, line, polyline, polygon, circle, rect) {
  stroke: #FFFFFF !important;
  vector-effect: non-scaling-stroke;
}

.task-management-secondary-sidebar__link.is-active svg {
  color: #0B0C10 !important;
  stroke: #0B0C10 !important;
}

.task-management-secondary-sidebar__link.is-active svg :is(path, line, polyline, polygon, circle, rect) {
  stroke: #0B0C10 !important;
  vector-effect: non-scaling-stroke;
}

@media (max-width: 768px) {
  .task-management-secondary-sidebar__link svg {
    width: 17px !important;
    height: 17px !important;
    padding: 6px !important;
  }
}

/* ========================================================================
   Main sidebar active-page travel animation
   2026-09-11
   Keep one physical white selection surface and slide/morph it to the page the
   user chooses, instead of letting one .active background disappear while a
   new one appears after navigation.  The indicator is positioned from the
   rendered sidebar geometry, so it follows both desktop vertical navigation
   and the mobile horizontal dock without changing page layout.
   ===================================================================== */
.classic-app-shell > .sidebar {
  --sidebar-active-indicator-duration: 230ms;
}

.classic-app-shell > .sidebar > .sidebar-active-indicator {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
  display: block;
  width: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
  background: #fff;
  border: 1.5px solid #0b0c10;
  box-sizing: border-box;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  will-change: transform, width, height, border-radius;
  transition:
    transform var(--sidebar-active-indicator-duration) cubic-bezier(.22,.78,.24,1),
    width var(--sidebar-active-indicator-duration) cubic-bezier(.22,.78,.24,1),
    height var(--sidebar-active-indicator-duration) cubic-bezier(.22,.78,.24,1),
    border-radius var(--sidebar-active-indicator-duration) cubic-bezier(.22,.78,.24,1),
    opacity 120ms ease;
}

.classic-app-shell > .sidebar > .sidebar-active-indicator.is-instant {
  transition: none !important;
}

/* The travelling indicator owns the white surface.  Keep link content above it
   and remove only the duplicated background/shadow from the active anchor. */
body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .sidebar-nav .nav-link {
  position: relative;
  z-index: 7;
}

body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .sidebar-nav .nav-link.active,
body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .sidebar-nav .nav-link.is-indicator-target {
  background: transparent !important;
  box-shadow: none !important;
  border-color: transparent !important;
}

body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .sidebar-nav .nav-link.is-indicator-target {
  color: #0b0c10 !important;
}

body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-animating .sidebar-nav .nav-link.active:not(.is-indicator-target) {
  color: rgba(255,255,255,.72) !important;
}

/* On mobile Home's active white surface belongs to the padded SVG circle. The
   JS indicator measures that circle exactly, so suppress the old duplicate. */
@media (max-width: 768px) {
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .mobile-dock-home-rail .nav-link.active svg,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:first-child .nav-link.active svg {
    background: transparent !important;
    box-shadow: none !important;
  }

  .classic-app-shell > .sidebar > .sidebar-active-indicator {
    box-shadow: 0 10px 22px rgba(0,0,0,.20);
  }
}

@media (prefers-reduced-motion: reduce) {
  .classic-app-shell > .sidebar > .sidebar-active-indicator {
    transition: none !important;
  }
}


/* ========================================================================
   Mobile sidebar active icon contrast after travelling-indicator animation
   2026-09-11
   The moving white selection tile is a sibling of the links, so explicitly
   keep the destination/active icon dark while that white tile is underneath.
   ===================================================================== */
@media (max-width: 768px) {
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .mobile-dock-pages-list .nav-link.active,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .mobile-dock-pages-list .nav-link.is-indicator-target,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:not(:first-child) .nav-link.active,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:not(:first-child) .nav-link.is-indicator-target {
    color: #0b0c10 !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .mobile-dock-pages-list .nav-link.active svg,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .mobile-dock-pages-list .nav-link.is-indicator-target svg,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:not(:first-child) .nav-link.active svg,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:not(:first-child) .nav-link.is-indicator-target svg {
    color: #0b0c10 !important;
    stroke: #0b0c10 !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .mobile-dock-pages-list .nav-link.active svg :is(path, line, polyline, polygon, circle, rect),
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready .mobile-dock-pages-list .nav-link.is-indicator-target svg :is(path, line, polyline, polygon, circle, rect),
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:not(:first-child) .nav-link.active svg :is(path, line, polyline, polygon, circle, rect),
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready:not(.mobile-dock-structured-host) .sidebar-nav > .nav-list > li:not(:first-child) .nav-link.is-indicator-target svg :is(path, line, polyline, polygon, circle, rect) {
    stroke: #0b0c10 !important;
  }
}

/* ========================================================================
   Mobile active-indicator stacking fix
   2026-09-11
   The mobile pages list/home rail created their own low z-index stacking
   contexts. The travelling white indicator (z-index: 5) therefore painted on
   top of the SVG after the real page finished loading, making the active icon
   look white/missing. Flatten those intermediate stacking contexts and keep
   the actual nav content above the moving indicator.
   ===================================================================== */
@media (max-width: 768px) {
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-home-rail,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list {
    z-index: auto !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-home-rail > li,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list > li,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-home-rail .nav-link,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list .nav-link {
    position: relative !important;
    z-index: 7 !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-home-rail .nav-link svg,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list .nav-link svg {
    position: relative !important;
    z-index: 8 !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.active,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.is-indicator-target {
    color: #0b0c10 !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.active svg,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.is-indicator-target svg,
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.active svg :is(path, line, polyline, polygon, circle, rect),
  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-ready.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.is-indicator-target svg :is(path, line, polyline, polygon, circle, rect) {
    color: #0b0c10 !important;
    stroke: #0b0c10 !important;
  }
}

/* ========================================================================
   Persistent system cover during App Router navigation — 2026-09-11
   ------------------------------------------------------------------------
   The live AppShell previously kept --ops-system-cover-image only on the
   route-owned .main-content element.  Next.js replaces that node with each
   loading.jsx fallback, so the cover disappeared and the generic white canvas
   was painted while data loaded.  ClassicChromeAccessSync now keeps the cover
   value on <html>; these rules make both live and loading shells consume the
   same persistent cover layer.  Result: the cover stays visually fixed while
   only page content/skeletons change.
   ===================================================================== */
html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content {
  position: relative !important;
  isolation: isolate !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  border-radius: var(--ui-radius-main, 36px) !important;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.16) 100%),
    var(--ops-system-cover-image) !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: 0.96 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content::after {
  display: none !important;
  content: none !important;
}

html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > header,
html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > main,
html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > .ops-shell-host-main {
  position: relative !important;
  z-index: 1 !important;
}

/* Route loading fallbacks must never repaint the generic white system canvas
   over a cover that is already active on the persistent root. */
html.ops-has-persistent-cover .classic-app-shell[class*="next-classic-"][class*="-loading"] > .main-content,
html.ops-has-persistent-cover .classic-app-shell.next-classic-stable-loading > .main-content {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* ========================================================================
   Server-seeded persistent cover — 2026-09-11
   ------------------------------------------------------------------------
   The cover class/value now arrive on <html> from RootLayout via a same-site
   cookie, before any route loading fallback or client hydration can paint.
   Keep every Classic loading canvas transparent and let the root-seeded cover
   pseudo-layer on .main-content remain visible for the whole navigation.
   ===================================================================== */
html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell[class*="next-classic-"][class*="-loading"] > .main-content,
html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell.next-classic-stable-loading > .main-content,
html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell.next-classic-home-loading > .main-content {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell[class*="next-classic-"][class*="-loading"] > .main-content::before,
html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell.next-classic-stable-loading > .main-content::before,
html.ops-has-persistent-cover body:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell.next-classic-home-loading > .main-content::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: var(--ui-radius-main, 36px) !important;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.16) 100%),
    var(--ops-system-cover-image) !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: .96 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}


/* ========================================================================
   Persistent header profile photo during App Router navigation — 2026-09-11
   Mirrors the persistent cover strategy: RootLayout seeds the last resolved
   profile photo on <html>, while loading headers reuse that exact image behind
   their avatar content. The browser therefore never needs to show a generic
   user glyph between pages while the next route is streaming/hydrating.
   ===================================================================== */
html.ops-has-persistent-profile .classic-app-shell .main-header .next-stable-loading-user .header-user__avatar {
  background-image: var(--ops-profile-image) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

.classic-app-shell .main-header .next-stable-loading-user .next-stable-loading-user__avatar {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  border-radius: inherit !important;
}

.classic-app-shell .main-header .next-stable-loading-user .next-stable-loading-user__avatar .header-user__img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: inherit !important;
}

/* ========================================================================
   Mobile sidebar sliding stability fix — 2026-09-12
   Keep the travelling active tile inside the same clipped rail as the icons.
   This prevents the tile/icon from painting outside the rounded sidebar while
   horizontally sliding and keeps a real SVG visible inside the moving tile.
   ===================================================================== */
@media (max-width: 768px) {
  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip,
  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host .mobile-dock-home-rail {
    position: relative !important;
    isolation: isolate !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip {
    clip-path: inset(0 round var(--mobile-pages-block-radius)) !important;
    -webkit-clip-path: inset(0 round var(--mobile-pages-block-radius)) !important;
    contain: paint !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host .mobile-dock-pages-list {
    scroll-padding-inline: 14px !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host .mobile-dock-pages-clip > .sidebar-active-indicator,
  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host .mobile-dock-home-rail > .sidebar-active-indicator {
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host .sidebar-active-indicator__icon {
    position: relative !important;
    z-index: 1 !important;
    flex: 0 0 auto !important;
    width: 20px !important;
    height: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #0b0c10 !important;
    stroke: #0b0c10 !important;
    fill: none !important;
    pointer-events: none !important;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.mobile-dock-structured-host .sidebar-active-indicator__icon :is(path, line, polyline, polygon, circle, rect) {
    stroke: #0b0c10 !important;
    vector-effect: non-scaling-stroke;
  }

  body.next-classic-shell-active .classic-app-shell > .sidebar.sidebar-active-indicator-animating.mobile-dock-structured-host .mobile-dock-pages-list .nav-link.is-indicator-target svg {
    opacity: 0 !important;
  }
}

/* ========================================================================
   Orders Review — match Operations Orders cards + keep details viewport-safe
   2026-09-20
   ===================================================================== */
body.orders-review-page .next-classic-orders-parity .next-review-order-card {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-top {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 11px !important;
  min-height: 66px !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-main {
  min-width: 0 !important;
  align-self: center !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-qty,
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-divider,
body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-bottom {
  display: none !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-card-head-actions {
  min-width: 112px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 5px;
  margin-left: auto;
}

body.orders-review-page .next-classic-orders-parity .next-review-card-status {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
}

body.orders-review-page .next-classic-orders-parity .next-review-card-head-actions .co-status-btn,
body.orders-review-page .next-classic-orders-parity .next-review-card-head-actions .sv-mixed-approval-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: 30px;
  min-height: 30px;
  margin: 0;
  padding: 0 11px;
  border-radius: 999px;
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  box-shadow: none;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-creator-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0 !important;
  width: auto !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #fff !important;
  overflow: visible !important;
  box-shadow: none !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-creator-label {
  display: flex;
  align-items: center;
  height: 30px;
  max-width: 150px;
  margin-right: -11px;
  padding: 0 20px 0 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-radius: 999px 4px 4px 999px;
  background: #020617;
  color: #fff;
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 7px 16px rgba(2, 6, 23, .12);
}

body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-creator-icon {
  position: relative;
  z-index: 1;
  width: 34px;
  min-width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  background: #020617;
  color: #fff;
  box-shadow: 0 7px 16px rgba(2, 6, 23, .16);
}

body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-creator-icon svg {
  display: block;
  width: 15px;
  height: 15px;
  margin: 0 !important;
  transform: none !important;
}

/* The review dialog used to let the component action row define the modal's
   horizontal size. Keep every layer shrinkable and let long names wrap instead. */
body.orders-review-page .next-classic-orders-parity .next-review-order-modal {
  box-sizing: border-box !important;
  width: min(900px, calc(100vw - 36px)) !important;
  max-width: 900px !important;
  max-height: min(88dvh, 900px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal :is(
  .co-modal-header,
  .next-review-order-modal-summary,
  .co-track-pill,
  .co-modal-body,
  .co-modal-meta,
  .co-modal-actions,
  .co-modal-items,
  .order-component-groups,
  .order-component-group,
  .order-component-group__items,
  .next-review-order-item,
  .co-item-left,
  .co-item-right,
  .co-item-title
) {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal .order-modal-search-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal .next-review-order-item {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(250px, auto) !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal .co-item-left {
  width: 100% !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal .co-item-title .co-item-name {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal .co-item-right {
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: auto auto !important;
  align-items: center !important;
  justify-content: end !important;
  gap: 6px 8px !important;
  text-align: right !important;
  flex-shrink: 1 !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal .next-review-item-actions {
  grid-column: 1 / -1;
  width: auto !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal .next-review-action-btn {
  min-width: 0 !important;
  white-space: nowrap !important;
}

body.orders-review-page .next-classic-orders-parity .next-review-order-modal .next-classic-qty-editor {
  grid-column: 1 / -1;
  max-width: 100% !important;
}

@media (max-width: 900px) {
  body.orders-review-page .next-classic-orders-parity .next-review-order-modal {
    width: min(720px, calc(100vw - 28px)) !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-modal .next-review-order-item {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-modal .co-item-right {
    width: 100% !important;
    grid-template-columns: auto auto minmax(0, 1fr) !important;
    justify-content: start !important;
    text-align: left !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-modal .next-review-item-actions {
    grid-column: 1 / -1;
    width: 100% !important;
  }
}

@media (max-width: 768px) {
  body.orders-review-page .next-classic-orders-parity .next-review-order-card {
    padding: 9px 10px !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .055) !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-top {
    grid-template-columns: 46px minmax(0, 1fr) auto !important;
    gap: 9px !important;
    min-height: 62px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-thumb {
    width: 46px !important;
    height: 46px !important;
    border-radius: 14px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-thumb svg {
    width: 21px !important;
    height: 21px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-card .co-title {
    font-size: 16px !important;
    line-height: 1.08 !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-card-head-actions {
    min-width: 92px !important;
    max-width: 138px !important;
    gap: 4px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-card-head-actions .co-status-btn,
  body.orders-review-page .next-classic-orders-parity .next-review-card-head-actions .sv-mixed-approval-pill {
    height: 27px !important;
    min-height: 27px !important;
    padding: 0 9px !important;
    font-size: 8.5px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-creator-btn {
    min-width: 31px !important;
    height: 31px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-creator-label {
    height: 27px !important;
    max-width: 112px !important;
    margin-right: -10px !important;
    padding: 0 18px 0 9px !important;
    font-size: 8.5px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-creator-icon {
    width: 31px !important;
    min-width: 31px !important;
    height: 31px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-modal {
    width: min(560px, calc(100vw - 32px)) !important;
    max-width: 560px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-modal .co-item-right {
    display: grid !important;
    grid-template-columns: auto auto !important;
    align-items: center !important;
    justify-content: start !important;
    gap: 6px 8px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-modal .next-review-item-actions {
    grid-column: 1 / -1;
    width: 100% !important;
  }
}

@media (max-width: 520px) {
  body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-card-head-actions {
    min-width: 88px !important;
    max-width: 122px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-card .next-review-creator-label {
    max-width: 96px !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-modal .next-review-item-actions {
    grid-template-columns: 1fr !important;
  }

  body.orders-review-page .next-classic-orders-parity .next-review-order-modal .next-review-action-btn {
    width: 100% !important;
  }
}

/* ========================================================================
   Events secondary sidebar — compact mobile page switcher
   2026-10-02
   Keep all four Events pages visible in one row on phones. The accessible
   labels remain on each link, while the visible captions are hidden so the
   dock behaves as an icon-only page switcher.
   ===================================================================== */
@media (max-width: 768px) {
  .events-secondary-sidebar .events-secondary-sidebar__rail {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  .events-secondary-sidebar .events-secondary-sidebar__link {
    min-width: 0 !important;
    min-height: 54px !important;
    height: 54px !important;
    padding: 5px 2px !important;
    gap: 0 !important;
  }

  .events-secondary-sidebar .events-secondary-sidebar__link span {
    display: none !important;
  }

  .events-secondary-sidebar .events-secondary-sidebar__link svg {
    width: 20px !important;
    height: 20px !important;
    padding: 8px !important;
    margin: 0 auto !important;
  }
}

/* ========================================================================
   Global page viewport polish — 2026-10-03
   - Keep every page scrollable while hiding the grey browser scrollbar.
   - On phones, let the page canvas/content sit slightly wider than the
     floating bottom navigation dock without creating horizontal overflow.
   ===================================================================== */
body.next-classic-shell-active .classic-app-shell .main-content > main {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

body.next-classic-shell-active .classic-app-shell .main-content > main::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* The sidebar can still be wheel/touch scrolled; only its visual track is hidden. */
body.next-classic-shell-active .classic-app-shell > .sidebar .sidebar-nav {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

body.next-classic-shell-active .classic-app-shell > .sidebar .sidebar-nav::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

@media (max-width: 768px) {
  body.next-classic-shell-active .classic-app-shell .main-content > main {
    width: auto !important;
    max-width: none !important;
    margin-left: 4px !important;
    margin-right: 4px !important;
    box-sizing: border-box !important;
  }

  body.next-classic-shell-active .classic-app-shell .next-classic-page-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    box-sizing: border-box !important;
  }
}


/* ========================================================================
   Coverless workspace + wider page canvas — 2026-10-04
   Cover photos are no longer part of the ERP shell. Keep the workspace clean
   and give real page content more horizontal room on every authenticated page.
   ======================================================================== */
body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content{
  background: #f5f6f8 !important;
  background-color: #f5f6f8 !important;
  background-image: none !important;
}

body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content::before,
body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content::after{
  display: none !important;
  content: none !important;
  background: none !important;
  background-image: none !important;
}

body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > main{
  margin-left: 8px !important;
  margin-right: 8px !important;
  margin-bottom: 8px !important;
  border-radius: 24px !important;
  background-color: #ffffff !important;
}

html[data-theme="dark"] body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content{
  background: #000000 !important;
  background-color: #000000 !important;
}

html[data-theme="dark"] body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > main{
  background-color: #07090d !important;
}

@media (max-width: 768px){
  body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > main,
  body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > main.container,
  body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > main.container-full-width,
  body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > main.page-body,
  body.next-classic-shell-active:not(.login-page):not(.pwa-offline):not(.pwa-start) .classic-app-shell > .main-content > main.tasks-v2-main{
    width: auto !important;
    max-width: none !important;
    margin-left: 3px !important;
    margin-right: 3px !important;
    margin-bottom: 4px !important;
    border-radius: 20px !important;
  }

  body.next-classic-shell-active .classic-app-shell .next-classic-page-content{
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 3px !important;
    padding-right: 3px !important;
    box-sizing: border-box !important;
  }
}

/* ========================================================================
   Current Orders — remove the large page-height white canvas (2026-10-07)
   The previous cleanup removed only #current-orders.card, while the shared
   authenticated shell still painted <main> white. Keep the real toolbar/order
   cards, but let the Current Orders page itself use the workspace background.
   ======================================================================== */
body.next-classic-shell-active.current-orders-page .classic-app-shell > .main-content > main.next-classic-page-content,
body.next-classic-shell-active.current-orders-page .classic-app-shell > .main-content > main.container-full-width {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-theme="dark"] body.next-classic-shell-active.current-orders-page .classic-app-shell > .main-content > main.next-classic-page-content,
html[data-theme="dark"] body.next-classic-shell-active.current-orders-page .classic-app-shell > .main-content > main.container-full-width {
  background: transparent !important;
  background-color: transparent !important;
}


/* ========================================================================
   Operations edit component delete button
   ======================================================================== */
body.operations-orders-page .next-operations-component-edit-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}
body.operations-orders-page .next-operations-component-edit-actions .next-operations-component-delete-btn{
  margin-right:auto;
  border:1px solid #fecaca;
  background:#fff1f2;
  color:#dc2626;
  box-shadow:none;
}
body.operations-orders-page .next-operations-component-edit-actions .next-operations-component-delete-btn:hover{
  border-color:#fca5a5;
  background:#fee2e2;
  color:#b91c1c;
}
body.operations-orders-page .next-operations-component-edit-actions .next-operations-component-delete-btn svg{
  width:17px;
  height:17px;
  flex:0 0 17px;
}
@media (max-width:720px){
  body.operations-orders-page .next-operations-component-edit-actions{
    display:grid;
    grid-template-columns:1fr 1fr 1.2fr;
    gap:8px;
  }
  body.operations-orders-page .next-operations-component-edit-actions .next-operations-component-delete-btn{
    margin-right:0;
  }
  body.operations-orders-page .next-operations-component-edit-actions .ro-action-btn{
    width:100%;
    min-width:0;
    padding-inline:10px;
  }
}
html[data-theme="dark"] body.operations-orders-page .next-operations-component-edit-actions .next-operations-component-delete-btn{
  border-color:rgba(248,113,113,.38);
  background:rgba(127,29,29,.24);
  color:#fca5a5;
}


/* ===== Order download · multi-order combined export ===== */
.order-download-combined-orders{overflow:visible}
.order-combined-select{position:relative;margin-top:10px}
.order-combined-select__trigger{
  width:100%;min-height:56px;display:grid;grid-template-columns:38px minmax(0,1fr) 20px;align-items:center;gap:10px;
  padding:9px 11px;border:1px solid #dde3eb;border-radius:14px;background:#fff;color:#344054;text-align:left;cursor:pointer;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease
}
.order-combined-select__trigger:hover,.order-combined-select__trigger.has-value{border-color:#c7d0dc;box-shadow:0 7px 18px rgba(15,23,42,.05)}
.order-combined-select__trigger.has-value{background:#fbfcff}
.order-combined-select__trigger-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#f1f5f9;color:#111827}
.order-combined-select__trigger-icon svg{width:17px;height:17px}
.order-combined-select__trigger>svg{width:16px;height:16px;color:#667085;justify-self:end}
.order-combined-select__copy{min-width:0;display:grid;gap:2px}
.order-combined-select__copy small{font-size:8px;color:#98a2b3;font-weight:900;text-transform:uppercase;letter-spacing:.07em}
.order-combined-select__copy strong{font-size:11px;color:#202939;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.order-combined-select__menu{
  position:absolute;z-index:28;left:0;right:0;top:calc(100% + 7px);overflow:hidden;
  border:1px solid #dce2e9;border-radius:15px;background:#fff;box-shadow:0 20px 50px rgba(15,23,42,.18)
}
.order-combined-select__search{display:flex;align-items:center;gap:8px;padding:9px;border-bottom:1px solid #edf0f4;background:#fbfcfe}
.order-combined-select__search svg{width:15px;height:15px;color:#98a2b3;flex:0 0 auto}
.order-combined-select__search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#101828;font:inherit;font-size:10px;font-weight:700}
.order-combined-select__search input::placeholder{color:#98a2b3}
.order-combined-select__options{max-height:255px;overflow:auto;padding:6px}
.order-combined-select__option{
  min-height:48px;display:grid;grid-template-columns:18px minmax(0,1fr) 18px;align-items:center;gap:9px;
  padding:8px 9px;border-radius:11px;color:#344054;cursor:pointer
}
.order-combined-select__option:hover,.order-combined-select__option.is-selected{background:#f7f9fb}
.order-combined-select__option.is-current{background:#fff7ed}
.order-combined-select__option input{width:15px;height:15px;margin:0;accent-color:#111827}
.order-combined-select__option input:disabled{opacity:1}
.order-combined-select__option-copy{min-width:0;display:grid;gap:2px}
.order-combined-select__option-copy strong{font-size:10px;color:#202939}
.order-combined-select__option-copy small{font-size:8px;color:#98a2b3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.order-combined-select__option>svg{width:15px;height:15px;color:#16a34a}
.order-combined-select__empty{padding:18px 12px;color:#98a2b3;text-align:center;font-size:10px;font-weight:750}
.order-combined-select__note,.order-download-repeat-auto{
  margin-top:9px;display:flex;align-items:flex-start;gap:8px;padding:9px 10px;border:1px solid #dbeafe;border-radius:11px;background:#f8fbff;color:#475467
}
.order-combined-select__note svg,.order-download-repeat-auto>svg{width:15px;height:15px;flex:0 0 15px;color:#2563eb;margin-top:1px}
.order-combined-select__note span{font-size:9px;line-height:1.45;font-weight:700}
.order-download-repeat-auto>span{display:grid;gap:2px}
.order-download-repeat-auto strong{font-size:10px;color:#344054}
.order-download-repeat-auto small{font-size:8px;line-height:1.4;color:#98a2b3}
@media(max-width:640px){
  .order-combined-select__menu{position:fixed;z-index:12110;left:12px;right:12px;top:auto;bottom:16px;max-height:58vh;border-radius:20px}
  .order-combined-select__options{max-height:calc(58vh - 56px)}
}

/* All order detail modals (including maintenance): rounded-SQUARE Search.
   Excludes the global header search and other non-order search fields. */
.next-classic-orders-parity .order-detail-toolkit .order-component-search {
  border-radius: 12px !important;
}
.next-classic-orders-parity .order-detail-toolkit .order-component-search__toggle {
  border-radius: 11px !important;
}
/* Sort popup lives in document.body so it cannot be clipped by modal scrolling.
   Restore normal popup layout on mobile: don't anchor it to bottom:18px. */
.order-sort-portal-scope {
  position: fixed;
  z-index: 16000;
  box-sizing: border-box;
  overflow: visible;
}
.order-sort-portal-scope .order-sort-menu {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  margin: 0;
  box-sizing: border-box;
  overscroll-behavior: contain;
}