/* Aggregated from the existing React source as a migration styling reference. */

/* ===== App.css ===== */
.App {
  text-align: center;
}

.App-logo {
  height: 40vmin;
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  .App-logo {
    animation: App-logo-spin infinite 20s linear;
  }
}

.App-header {
  background-color: #282c34;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: calc(10px + 2vmin);
  color: white;
}

.App-link {
  color: #61dafb;
}

@keyframes App-logo-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}


/* ===== components/agreements/AgreementStageBuilder.css ===== */
.agreement-stage-builder{border:1px solid rgba(148,163,184,.22);border-radius:24px;padding:20px;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(241,245,249,.72));box-shadow:0 18px 45px rgba(15,23,42,.08),inset 0 1px 0 #fff;backdrop-filter:blur(18px)}
.agreement-stage-builder__header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:18px}.agreement-stage-builder__header h3{margin:3px 0 5px;color:#0f172a;font-size:18px}.agreement-stage-builder__header p{margin:0;color:#64748b;font-size:13px}.agreement-stage-builder__eyebrow{font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:#2563eb}.agreement-stage-builder__count{white-space:nowrap;padding:7px 11px;border-radius:999px;background:rgba(37,99,235,.09);color:#1d4ed8;font-size:12px;font-weight:750}
.agreement-stage-builder__catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:9px;margin-bottom:18px}.agreement-stage-chip{display:flex;align-items:center;gap:9px;min-height:44px;padding:8px 11px;border:1px solid rgba(148,163,184,.22);border-radius:14px;background:rgba(255,255,255,.75);color:#334155;font-weight:650;text-align:left;cursor:pointer;transition:.18s ease}.agreement-stage-chip:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(15,23,42,.08)}.agreement-stage-chip.is-active{border-color:rgba(37,99,235,.35);box-shadow:0 8px 22px rgba(37,99,235,.12);color:#0f172a}.agreement-stage-chip__icon{display:grid;place-items:center;width:28px;height:28px;border-radius:10px;background:rgba(37,99,235,.11);color:#2563eb}.agreement-stage-chip--1 .agreement-stage-chip__icon{background:rgba(16,185,129,.12);color:#059669}.agreement-stage-chip--2 .agreement-stage-chip__icon{background:rgba(249,115,22,.13);color:#ea580c}.agreement-stage-chip--3 .agreement-stage-chip__icon{background:rgba(168,85,247,.12);color:#9333ea}.agreement-stage-chip--4 .agreement-stage-chip__icon{background:rgba(236,72,153,.12);color:#db2777}.agreement-stage-chip--5 .agreement-stage-chip__icon{background:rgba(6,182,212,.12);color:#0891b2}.agreement-stage-chip--6 .agreement-stage-chip__icon{background:rgba(245,158,11,.13);color:#d97706}
.agreement-stage-builder__sequence{display:grid;gap:8px}.agreement-stage-row{display:grid;grid-template-columns:34px 36px minmax(140px,1fr) auto auto;align-items:center;gap:10px;padding:9px 10px;border:1px solid rgba(148,163,184,.18);border-radius:15px;background:rgba(255,255,255,.82)}.agreement-stage-row__order{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#0f172a;color:#fff;font-size:12px;font-weight:800}.agreement-stage-row__icon{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:rgba(37,99,235,.1);color:#2563eb}.agreement-stage-row__title{display:flex;flex-direction:column}.agreement-stage-row__title strong{font-size:13px;color:#0f172a}.agreement-stage-row__title small{font-size:11px;color:#94a3b8}.agreement-stage-row__required{display:flex;align-items:center;gap:6px;font-size:12px;color:#475569}.agreement-stage-row__actions{display:flex;gap:5px}.agreement-stage-row__actions button{width:29px;height:29px;border:0;border-radius:9px;background:#eef2f7;color:#334155;cursor:pointer}.agreement-stage-row__actions button:last-child{color:#dc2626;background:#fef2f2}.agreement-stage-builder__empty{padding:24px;border:1px dashed #cbd5e1;border-radius:15px;text-align:center;color:#64748b}.agreement-stage-builder__errors{margin-top:12px;padding:11px 13px;border-radius:12px;background:#fff7ed;color:#c2410c;font-size:12px}.agreement-stage-builder.is-compact{padding:14px}.agreement-stage-builder.is-compact .agreement-stage-builder__catalog{grid-template-columns:repeat(auto-fit,minmax(125px,1fr))}@media(max-width:720px){.agreement-stage-row{grid-template-columns:30px 34px 1fr auto}.agreement-stage-row__required{grid-column:3}.agreement-stage-row__actions{grid-column:4;grid-row:1/3}.agreement-stage-builder__header{flex-direction:column}.agreement-stage-builder__catalog{grid-template-columns:1fr 1fr}}

/* ===== components/layout/TopModuleDropdownNavigation.css ===== */
/* Shared Cold Storage / HD Orchards module navigation. */
.ref-nav-ribbon{position:relative;z-index:55;overflow:visible;flex:0 0 auto;margin:0 8px;border:1px solid rgba(226,232,240,.78);border-top:0;border-radius:0 0 15px 15px;background:#fff;box-shadow:0 11px 28px rgba(15,23,42,.07);font-family:var(--erp-font-family,Inter,system-ui,sans-serif)}
.ref-nav-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px;padding:9px 10px 10px;min-width:0}.ref-nav-cell{position:relative;min-width:0}
.ref-nav-trigger{width:100%;height:78px;min-width:0;padding:8px 6px;border:1px solid rgba(var(--erp-primary-rgb),.15);border-radius:15px;background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.095),rgba(var(--erp-secondary-rgb),.045));color:#172036;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:10px;font-weight:900;white-space:nowrap;overflow:hidden;cursor:pointer;box-shadow:0 8px 18px rgba(15,23,42,.055);transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease,background .14s ease}
.ref-nav-trigger:hover{transform:translateY(-2px);border-color:rgba(var(--erp-primary-rgb),.27);box-shadow:0 12px 24px rgba(15,23,42,.09);background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.145),rgba(var(--erp-secondary-rgb),.07))}.ref-nav-trigger.is-active{border-color:rgba(var(--erp-primary-rgb),.34);background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.20),rgba(var(--erp-secondary-rgb),.105));color:var(--ref-nav-primary)}
.ref-nav-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.15),rgba(var(--erp-secondary-rgb),.075));color:var(--ref-nav-primary);font-size:21px;line-height:1}.ref-nav-icon svg{width:21px;height:21px}.ref-nav-label{max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ref-nav-dropdown{position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);width:min(320px,calc(100vw - 24px));max-height:min(62vh,540px);overflow:auto;padding:7px;border:1px solid rgba(148,163,184,.20);border-radius:14px;background:#fff;box-shadow:0 20px 52px rgba(15,23,42,.18);overscroll-behavior:contain;z-index:95}.ref-nav-cell:nth-last-child(-n+3) .ref-nav-dropdown{left:auto;right:8px;transform:none}
.ref-nav-submenu-list{display:grid;gap:3px}.ref-nav-submenu-row{width:100%;min-height:44px;padding:7px;border:0;border-radius:10px;background:transparent;color:#172036;display:grid;grid-template-columns:30px minmax(0,1fr) 14px;gap:8px;align-items:center;text-align:left;font:inherit;cursor:pointer}.ref-nav-submenu-row:hover,.ref-nav-submenu-row.is-active{background:rgba(var(--erp-primary-rgb),.06);color:var(--ref-nav-primary)}.ref-nav-submenu-row.overview{background:linear-gradient(135deg,rgba(var(--erp-primary-rgb),.065),rgba(var(--erp-secondary-rgb),.035));margin-bottom:2px}.ref-nav-submenu-icon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:rgba(var(--erp-primary-rgb),.07);font-size:14px}.ref-nav-submenu-icon svg{width:16px;height:16px}.ref-nav-submenu-copy{min-width:0}.ref-nav-submenu-copy b{display:block;font-size:9.7px;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ref-nav-submenu-copy small{display:block;margin-top:2px;font-size:7.6px;color:#7c879d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Professional full-grid More Modules dialog shared by Cold Storage, HD and Mixed. */
.ref-more-overlay{position:fixed;inset:0;z-index:2147482500;display:grid;place-items:center;padding:18px;background:rgba(15,23,42,.56);overflow:auto;overscroll-behavior:contain;font-family:var(--erp-font-family,Inter,system-ui,sans-serif)}
.ref-more-dialog{width:min(1340px,calc(100vw - 32px));height:min(820px,calc(100dvh - 32px));min-height:430px;display:grid;grid-template-rows:auto auto auto minmax(0,1fr);overflow:hidden;border:1px solid rgba(255,255,255,.94);border-radius:24px;background:linear-gradient(145deg,#fff,#f8fafc);box-shadow:0 38px 110px rgba(15,23,42,.38),0 0 0 1px color-mix(in srgb,var(--ref-nav-primary) 8%,transparent);color:#0f172a}
.ref-more-header{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) auto 42px;align-items:center;gap:13px;padding:17px 20px 15px;border-bottom:1px solid color-mix(in srgb,var(--ref-nav-primary) 10%,#e2e8f0);background:linear-gradient(135deg,color-mix(in srgb,var(--ref-nav-primary) 7%,#fff),color-mix(in srgb,var(--ref-nav-secondary) 5%,#fff),#fff)}
.ref-more-header::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:5px;border-radius:0 999px 999px 0;background:linear-gradient(180deg,var(--ref-nav-primary),var(--ref-nav-secondary))}
.ref-more-heading-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(145deg,var(--ref-nav-primary),var(--ref-nav-secondary));color:#fff;font-size:25px;line-height:1;box-shadow:0 12px 26px color-mix(in srgb,var(--ref-nav-primary) 24%,transparent)}
.ref-more-heading-copy{min-width:0}.ref-more-kicker{display:block;color:var(--ref-nav-primary);font-size:8px;font-weight:1000;letter-spacing:.13em}.ref-more-header h2{margin:3px 0 0;color:#0f172a;font-size:21px;font-weight:1000;letter-spacing:-.025em}.ref-more-header p{margin:4px 0 0;color:#64748b;font-size:10px;font-weight:700;line-height:1.45}
.ref-more-count{display:grid;place-items:center;min-width:64px;padding:7px 10px;border:1px solid color-mix(in srgb,var(--ref-nav-primary) 13%,#e2e8f0);border-radius:13px;background:#fff}.ref-more-count b{display:block;color:#0f172a;font-size:17px;font-weight:1000;line-height:1}.ref-more-count span{display:block;margin-top:3px;color:#64748b;font-size:7.5px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.ref-more-close{width:40px;height:40px;display:grid;place-items:center;border:1px solid #dbe4ee;border-radius:13px;background:#fff;color:#475569;font:inherit;font-size:24px;line-height:1;cursor:pointer;box-shadow:0 7px 18px rgba(15,23,42,.06);transition:transform .14s ease,border-color .14s ease,color .14s ease}.ref-more-close:hover{transform:translateY(-1px);border-color:#fca5a5;color:#dc2626}
.ref-more-search-row{padding:12px 16px 8px}.ref-more-search{display:grid;grid-template-columns:25px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:44px;padding:0 12px;border:1px solid color-mix(in srgb,var(--ref-nav-primary) 15%,#dbe4ee);border-radius:14px;background:#fff;box-shadow:0 7px 18px rgba(15,23,42,.04)}.ref-more-search>span{color:var(--ref-nav-primary);font-size:18px}.ref-more-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#0f172a;font:inherit;font-size:11px;font-weight:760}.ref-more-search input::placeholder{color:#94a3b8}.ref-more-search button{min-height:29px;padding:5px 9px;border:1px solid color-mix(in srgb,var(--ref-nav-primary) 13%,#e2e8f0);border-radius:9px;background:color-mix(in srgb,var(--ref-nav-primary) 5%,#fff);color:var(--ref-nav-primary);font:inherit;font-size:8px;font-weight:950;cursor:pointer}
.ref-more-category-strip{display:flex;align-items:center;gap:7px;overflow-x:auto;padding:3px 16px 11px;border-bottom:1px solid rgba(148,163,184,.14);scrollbar-width:thin}.ref-more-category-strip>button{flex:0 0 auto;min-height:37px;display:grid;grid-template-columns:25px auto auto;align-items:center;gap:7px;padding:5px 9px 5px 6px;border:1px solid #e2e8f0;border-radius:12px;background:#fff;color:#475569;font:inherit;font-size:8.7px;font-weight:900;cursor:pointer;white-space:nowrap;transition:transform .14s ease,border-color .14s ease,background .14s ease,color .14s ease}.ref-more-category-strip>button:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--ref-nav-primary) 24%,#dbe4ee);color:var(--ref-nav-primary)}.ref-more-category-strip>button.is-active{border-color:color-mix(in srgb,var(--ref-nav-primary) 32%,#dbe4ee);background:linear-gradient(145deg,color-mix(in srgb,var(--ref-nav-primary) 11%,#fff),color-mix(in srgb,var(--ref-nav-secondary) 6%,#fff));color:var(--ref-nav-primary);box-shadow:0 8px 17px color-mix(in srgb,var(--ref-nav-primary) 10%,transparent)}.ref-more-category-strip b{min-width:20px;padding:3px 5px;border-radius:999px;background:#f1f5f9;color:#64748b;font-size:7px;text-align:center}.ref-more-category-strip>button.is-active b{background:#fff;color:var(--ref-nav-primary)}
.ref-more-category-icon{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:linear-gradient(145deg,color-mix(in srgb,var(--ref-nav-primary) 10%,#fff),color-mix(in srgb,var(--ref-nav-secondary) 5%,#fff));color:var(--ref-nav-primary);font-size:13px}.ref-more-category-icon svg{width:15px;height:15px}
.ref-more-grid-wrap{min-height:0;overflow:auto;padding:14px 16px 18px;overscroll-behavior:contain;background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--ref-nav-secondary) 5%,transparent),transparent 34%),radial-gradient(circle at 0 100%,color-mix(in srgb,var(--ref-nav-primary) 5%,transparent),transparent 32%)}
.ref-more-module-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(132px,auto);gap:12px;align-content:start}
.ref-more-module-card{position:relative;isolation:isolate;min-width:0;min-height:132px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:14px 10px 12px;overflow:hidden;border:1px solid color-mix(in srgb,var(--ref-nav-primary) 12%,#dbe4ee);border-radius:17px;background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--ref-nav-primary) 2.5%,#fff));color:#334155;text-align:center;font:inherit;cursor:pointer;box-shadow:0 9px 22px rgba(15,23,42,.055);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease}
.ref-more-module-card::before{content:"";position:absolute;z-index:-1;right:-28px;top:-31px;width:92px;height:92px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--ref-nav-primary) 10%,transparent),transparent 68%);pointer-events:none}.ref-more-module-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--ref-nav-primary) 32%,#cbd5e1);background:linear-gradient(145deg,color-mix(in srgb,var(--ref-nav-primary) 5%,#fff),#fff);box-shadow:0 16px 32px rgba(15,23,42,.11)}.ref-more-module-card.is-active{border-color:var(--ref-nav-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--ref-nav-primary) 9%,transparent),0 15px 30px rgba(15,23,42,.10)}.ref-more-module-card.overview{background:linear-gradient(145deg,color-mix(in srgb,var(--ref-nav-primary) 7%,#fff),color-mix(in srgb,var(--ref-nav-secondary) 4%,#fff))}
.ref-more-module-icon{width:52px;height:52px;flex:0 0 52px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(145deg,color-mix(in srgb,var(--ref-nav-primary) 16%,#fff),color-mix(in srgb,var(--ref-nav-secondary) 8%,#fff));color:var(--ref-nav-primary);font-size:25px;line-height:1;box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 8px 18px color-mix(in srgb,var(--ref-nav-primary) 10%,transparent)}.ref-more-module-icon svg{width:25px;height:25px;color:currentColor!important}.ref-more-module-copy{display:block;width:100%;min-width:0}.ref-more-module-copy b{display:-webkit-box;min-height:28px;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;color:#0f172a;font-size:10.2px;font-weight:1000;line-height:1.35}.ref-more-module-copy small{display:block;max-width:100%;margin-top:3px;overflow:hidden;color:#7c879d;font-size:7.6px;font-weight:780;text-overflow:ellipsis;white-space:nowrap}.ref-more-open-badge,.ref-more-overview-badge{display:inline-flex;align-items:center;justify-content:center;min-height:21px;padding:3px 8px;border-radius:999px;background:#f1f5f9;color:#64748b;font-size:6.8px;font-weight:1000;letter-spacing:.055em;text-transform:uppercase}.ref-more-overview-badge{background:color-mix(in srgb,var(--ref-nav-primary) 9%,#fff);color:var(--ref-nav-primary)}
.ref-more-empty{min-height:300px;display:grid;place-items:center;align-content:center;gap:7px;text-align:center;color:#64748b}.ref-more-empty>span{width:50px;height:50px;display:grid;place-items:center;border-radius:16px;background:color-mix(in srgb,var(--ref-nav-primary) 8%,#fff);color:var(--ref-nav-primary);font-size:25px}.ref-more-empty strong{color:#0f172a;font-size:14px}.ref-more-empty p{margin:0;font-size:9px}.ref-more-empty button{margin-top:4px;min-height:34px;padding:7px 11px;border:0;border-radius:10px;background:linear-gradient(135deg,var(--ref-nav-primary),var(--ref-nav-secondary));color:#fff;font:inherit;font-size:8px;font-weight:950;cursor:pointer}

@media(max-width:1500px){.ref-more-module-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1180px){.ref-nav-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.ref-nav-trigger{height:69px}.ref-nav-icon{width:31px;height:31px;font-size:18px}.ref-more-module-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.ref-more-dialog{width:min(1080px,calc(100vw - 24px))}}
@media(max-width:860px){.ref-more-module-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ref-more-header{grid-template-columns:44px minmax(0,1fr) 38px}.ref-more-heading-icon{width:44px;height:44px}.ref-more-count{display:none}}
@media(max-width:760px){.ref-nav-ribbon{margin:0 7px}.ref-nav-grid{grid-template-columns:repeat(4,minmax(0,1fr));padding:6px}.ref-nav-trigger{height:64px;font-size:8.7px}.ref-nav-icon{width:29px;height:29px;font-size:17px}.ref-more-overlay{padding:6px}.ref-more-dialog{width:100%;height:calc(100dvh - 12px);border-radius:17px}.ref-more-header{padding:13px 14px 12px}.ref-more-header p{display:none}.ref-more-search-row{padding:9px 10px 6px}.ref-more-category-strip{padding:2px 10px 8px}.ref-more-grid-wrap{padding:10px}.ref-more-module-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;grid-auto-rows:minmax(124px,auto)}.ref-more-module-card{min-height:124px;padding:12px 8px}.ref-more-module-icon{width:46px;height:46px;flex-basis:46px}.ref-more-module-icon svg{width:22px;height:22px}}
@media(max-width:460px){.ref-nav-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:5px}.ref-nav-trigger{height:59px;font-size:8px;border-radius:10px}.ref-nav-icon{width:27px;height:27px;font-size:16px}.ref-nav-dropdown{left:4px!important;right:auto!important;transform:none!important;width:calc(100vw - 20px)}.ref-more-header{grid-template-columns:40px minmax(0,1fr) 36px;gap:9px}.ref-more-heading-icon{width:40px;height:40px;border-radius:12px;font-size:21px}.ref-more-header h2{font-size:18px}.ref-more-close{width:36px;height:36px}.ref-more-module-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.ref-more-module-card{min-height:116px;border-radius:14px}.ref-more-module-copy b{font-size:9px}.ref-more-module-copy small{font-size:7px}.ref-more-module-icon{width:42px;height:42px;flex-basis:42px;font-size:21px}.ref-more-category-strip>button{grid-template-columns:22px auto auto}.ref-more-category-icon{width:22px;height:22px}}
@media(max-width:350px){.ref-more-module-grid{grid-template-columns:1fr}}


/* ===== finalFixes/productionRuntimeFixes.css ===== */
/*
 * Compatibility helpers only.
 * All route, menu, modal and scrolling fixes are now implemented directly in
 * React components. There is deliberately no body scroll lock or DOM-scanning
 * selector here.
 */
.final-media-thumbnail {
  width: 46px;
  height: 46px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(148,163,184,.28);
  box-shadow: 0 5px 16px rgba(15,23,42,.10);
}


/* ===== hdOrchids/styles/hdOrchids.css ===== */
.hd-standalone-shell,.hd-mixed-workspace,.hd-modern-workspace{--hd-primary:var(--erp-primary,#075c36);--hd-secondary:var(--erp-secondary,#2e9f44);--hd-accent:var(--erp-accent,#f39a21);--hd-surface:var(--erp-surface,#fff);--hd-page:var(--erp-page,#f6f8f7);--hd-text:var(--erp-ink,#17211c);--hd-muted:#64748b;--hd-line:rgba(15,23,42,.085);--hd-shadow:0 18px 44px rgba(15,23,42,.08);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--hd-text)}
.hd-standalone-shell{display:flex;min-height:100vh;background:radial-gradient(circle at 4% 0%,color-mix(in srgb,var(--hd-secondary) 10%,transparent),transparent 28%),var(--hd-page);--hd-primary:#075c36;--hd-secondary:#2e9f44;--hd-accent:#f39a21}
.hd-sidebar{width:258px;flex:0 0 258px;height:100vh;position:sticky;top:0;overflow:auto;padding:17px 12px;background:linear-gradient(180deg,color-mix(in srgb,var(--hd-primary) 96%,#061b12),var(--hd-primary));color:#fff;box-shadow:16px 0 36px rgba(7,92,54,.15);z-index:20}
.hd-brand{display:flex;align-items:center;gap:11px;padding:9px 10px 16px;border-bottom:1px solid rgba(255,255,255,.12)}
.hd-brand-mark{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.08));border:1px solid rgba(255,255,255,.18);box-shadow:0 12px 28px rgba(0,0,0,.12);overflow:hidden}.hd-brand-mark img{width:100%;height:100%;object-fit:contain;padding:5px}
.hd-brand strong{display:block;font-size:14px;font-weight:950}.hd-brand small{display:block;margin-top:2px;font-size:7.5px;letter-spacing:.12em;font-weight:900;opacity:.7}
.hd-sidebar nav{display:grid;gap:4px;margin-top:13px}.hd-sidebar nav a{display:flex;align-items:center;gap:10px;min-height:42px;padding:8px 10px;border-radius:12px;color:rgba(255,255,255,.78);text-decoration:none;font-size:10px;font-weight:850;transition:.18s ease}.hd-sidebar nav a span{width:29px;height:29px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}.hd-sidebar nav a:hover{background:rgba(255,255,255,.09);color:#fff;transform:translateX(2px)}.hd-sidebar nav a.active{background:linear-gradient(135deg,rgba(255,255,255,.20),rgba(255,255,255,.10));color:#fff;box-shadow:inset 3px 0 0 var(--hd-accent),0 8px 20px rgba(0,0,0,.08)}
.hd-sidebar-foot{margin-top:16px;padding:11px;border-radius:13px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.09)}.hd-sidebar-foot span,.hd-sidebar-foot strong{display:block}.hd-sidebar-foot span{font-size:7.5px;opacity:.65;text-transform:uppercase;font-weight:900;letter-spacing:.08em}.hd-sidebar-foot strong{margin-top:3px;font-size:9px}
.hd-shell-main{min-width:0;flex:1}.hd-topbar{height:70px;position:sticky;top:0;z-index:15;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 20px;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(7,92,54,.09);box-shadow:0 7px 24px rgba(15,23,42,.045)}.hd-topbar>div:first-of-type strong,.hd-topbar>div:first-of-type span{display:block}.hd-topbar>div:first-of-type strong{font-size:12.5px;color:var(--hd-primary)}.hd-topbar>div:first-of-type span{font-size:8px;color:#64748b;margin-top:2px}.hd-topbar-actions{display:flex;align-items:center;gap:7px}.hd-topbar-actions button{border:1px solid #e2e8f0;background:#fff;color:#475569;border-radius:10px;min-height:34px;padding:0 9px;display:flex;align-items:center;gap:6px;cursor:pointer;font-weight:850;font-size:9px}.hd-profile-button span{width:23px;height:23px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,var(--hd-primary),var(--hd-secondary));color:#fff}.hd-logout{color:#b91c1c!important}.hd-mobile-menu{display:none;border:0;background:transparent;font-size:20px}.hd-shell-content{padding:18px;min-width:0}
.hd-mixed-workspace{--hd-primary:var(--erp-primary,#4f46e5);--hd-secondary:var(--erp-secondary,#0891b2);--hd-accent:var(--erp-accent,#d97706);min-width:0}
.business-workspace-switcher{width:100%;max-width:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;gap:7px;padding:6px;border-radius:17px;background:rgba(255,255,255,.84);border:1px solid color-mix(in srgb,var(--erp-primary,#4f46e5) 13%,transparent);box-shadow:0 10px 30px rgba(15,23,42,.07);margin:0;backdrop-filter:blur(14px)}.business-workspace-switcher.compact{width:100%;margin:0;position:relative;z-index:3}.business-workspace-switcher button{width:100%;min-height:42px;border:0;background:transparent;border-radius:12px;padding:9px 14px;font-size:10px;font-weight:950;color:#64748b;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease}.business-workspace-switcher button:hover{transform:translateY(-1px);background:color-mix(in srgb,var(--erp-primary,#4f46e5) 6%,#fff)}.business-workspace-switcher button.active,.business-workspace-switcher button.active.orchard{background:linear-gradient(135deg,var(--erp-primary,#4f46e5),var(--erp-secondary,#0891b2));color:#fff;box-shadow:0 9px 22px color-mix(in srgb,var(--erp-primary,#4f46e5) 22%,transparent)}.workspace-dot{width:10px;height:10px;border-radius:3px;background:currentColor;opacity:.88;box-shadow:0 0 0 3px rgba(255,255,255,.16)}
.hd-module-page,.hd-dashboard{max-width:1580px;margin:0 auto;min-width:0}.hd-page-hero,.hd-dashboard-hero{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;padding:18px 19px;border-radius:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--hd-primary) 94%,#061b12),var(--hd-primary) 48%,var(--hd-secondary));color:#fff;box-shadow:0 20px 48px color-mix(in srgb,var(--hd-primary) 22%,transparent)}.hd-page-hero:after,.hd-dashboard-hero:after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;right:-55px;top:-95px;background:rgba(255,255,255,.08)}.hd-page-icon{width:49px;height:49px;flex:0 0 49px;border-radius:15px;display:grid;place-items:center;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);position:relative;z-index:1}.hd-page-copy{min-width:0;flex:1;position:relative;z-index:1}.hd-page-copy h1,.hd-dashboard-hero h1{margin:3px 0 0;font-size:clamp(19px,2.5vw,28px);font-weight:1000;letter-spacing:-.03em}.hd-page-copy p,.hd-dashboard-hero p{margin:5px 0 0;font-size:9.5px;line-height:1.5;opacity:.8;max-width:760px}.hd-eyebrow{display:block;font-size:7.5px;font-weight:1000;letter-spacing:.14em;opacity:.7}.hd-page-actions,.hd-dashboard-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end;position:relative;z-index:1}.hd-btn{min-height:36px;border-radius:11px;padding:0 12px;border:0;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:9px;font-weight:950;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease}.hd-btn:hover{transform:translateY(-1px)}.hd-btn.primary{background:linear-gradient(135deg,var(--hd-primary),var(--hd-secondary));color:#fff;box-shadow:0 10px 22px color-mix(in srgb,var(--hd-primary) 22%,transparent)}.hd-page-hero .hd-btn.primary,.hd-dashboard-hero .hd-btn.primary{background:#fff;color:var(--hd-primary)}.hd-btn.secondary{background:#fff;color:#475569;border:1px solid #dbe3ee}.hd-btn.danger{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;box-shadow:0 9px 20px rgba(185,28,28,.18)}.hd-page-hero .hd-btn.secondary,.hd-dashboard-hero .hd-btn.secondary{background:rgba(255,255,255,.11);color:#fff;border-color:rgba(255,255,255,.2)}.hd-btn.mini{min-height:29px;padding:0 8px;font-size:8px;background:#fff;border:1px solid #dbe3ee;color:#475569}
.hd-panel{background:rgba(255,255,255,.94);border:1px solid rgba(15,23,42,.075);border-radius:18px;box-shadow:0 13px 34px rgba(15,23,42,.055)}.hd-toolbar{display:flex;gap:9px;align-items:center;margin:12px 0;padding:10px}.hd-search{display:flex;align-items:center;gap:7px;flex:1;min-width:210px;padding:0 10px;min-height:38px;border:1px solid #e2e8f0;border-radius:11px;background:#fff;color:#94a3b8}.hd-search input{border:0;outline:0;width:100%;font-size:9.5px;font-weight:750;background:transparent;color:#0f172a}.hd-toolbar select{min-height:38px;border:1px solid #e2e8f0;border-radius:11px;background:#fff;padding:0 10px;color:#475569;font-size:9px;font-weight:850}.hd-result-count{margin-left:auto;padding:5px 9px;border-radius:10px;background:color-mix(in srgb,var(--hd-primary) 7%,#fff);color:var(--hd-primary);display:flex;align-items:baseline;gap:5px}.hd-result-count strong{font-size:13px}.hd-result-count span{font-size:7.5px;font-weight:900;text-transform:uppercase}.hd-alert{margin:10px 0;padding:10px 12px;border-radius:12px;font-size:9px;font-weight:850}.hd-alert.error{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}.hd-alert.success{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0}
.hd-table-card{min-width:0;background:rgba(255,255,255,.96);border:1px solid rgba(15,23,42,.075);border-radius:18px;box-shadow:0 16px 38px rgba(15,23,42,.06);overflow:hidden}.hd-table-scroll{width:100%;max-width:100%;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.hd-table-scroll::-webkit-scrollbar{height:8px}.hd-table-scroll::-webkit-scrollbar-thumb{background:rgba(100,116,139,.28);border-radius:999px}.hd-data-table{width:100%;min-width:980px;border-collapse:separate;border-spacing:0;font-size:11.2px}.hd-data-table thead th{position:sticky;top:0;z-index:3;text-align:left;padding:11px 10px;background:linear-gradient(135deg,color-mix(in srgb,var(--hd-primary) 96%,#111827),var(--hd-secondary));color:#fff;font-size:9.2px;font-weight:1000;letter-spacing:.065em;text-transform:uppercase;white-space:nowrap;border-bottom:0}.hd-data-table tbody td{padding:10px;border-bottom:1px solid rgba(15,23,42,.065);vertical-align:middle;color:#334155;font-weight:700;transition:background .16s ease,transform .16s ease,box-shadow .16s ease}.hd-data-table tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--hd-primary) 2.7%,#fff)}.hd-data-table tbody tr:hover td{background:color-mix(in srgb,var(--hd-secondary) 8%,#fff);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}.hd-data-table tbody tr{animation:hdRowIn .28s ease both}.hd-data-table tbody tr:nth-child(2){animation-delay:.025s}.hd-data-table tbody tr:nth-child(3){animation-delay:.05s}.hd-data-table tbody tr:nth-child(4){animation-delay:.075s}.hd-data-table tbody tr:nth-child(5){animation-delay:.1s}.hd-data-table tbody tr:nth-child(6){animation-delay:.125s}@keyframes hdRowIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}.hd-data-table strong{color:#0f172a;font-weight:950}.hd-cell-sub{display:block;margin-top:2px;font-size:9px;color:#94a3b8}.hd-row-no{width:48px;text-align:center!important}.hd-row-no span{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:8px;background:color-mix(in srgb,var(--hd-primary) 7%,#fff);color:var(--hd-primary);font-size:9.5px;font-weight:1000}.hd-number-cell{text-align:right;font-variant-numeric:tabular-nums}.hd-actions-column{position:sticky;right:0;z-index:2;background:#fff!important;box-shadow:-8px 0 14px rgba(15,23,42,.035);min-width:122px}.hd-data-table thead .hd-actions-column{z-index:4;background:linear-gradient(135deg,var(--hd-primary),var(--hd-secondary))!important}.hd-row-actions{display:flex;align-items:center;gap:5px}.hd-icon-button{width:30px;height:30px;border-radius:9px;border:1px solid #e2e8f0;background:#fff;display:grid;place-items:center;cursor:pointer;transition:.15s ease}.hd-icon-button:hover{transform:translateY(-1px);box-shadow:0 7px 14px rgba(15,23,42,.09)}.hd-icon-button.view{color:#2563eb;background:#eff6ff;border-color:#bfdbfe}.hd-icon-button.edit{color:#047857;background:#ecfdf5;border-color:#a7f3d0}.hd-icon-button.delete{color:#b91c1c;background:#fef2f2;border-color:#fecaca}.hd-status-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;font-size:9.2px;font-weight:1000;text-transform:capitalize;white-space:nowrap}.hd-status-pill.success{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0}.hd-status-pill.warning{background:#fffbeb;color:#b45309;border:1px solid #fde68a}.hd-status-pill.danger{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}.hd-status-pill.neutral{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0}.hd-empty-cell{padding:38px!important;text-align:center!important}.hd-empty-state{display:grid;place-items:center;gap:5px;color:#94a3b8}.hd-empty-state strong{font-size:13px}.hd-empty-state span{font-size:10px}.hd-skeleton-row span{display:block;height:23px;border-radius:8px;background:linear-gradient(90deg,#f1f5f9,#e2e8f0,#f1f5f9);background-size:200% 100%;animation:hdSkeleton 1.1s linear infinite}@keyframes hdSkeleton{to{background-position:-200% 0}}
.hd-modal-overlay{position:fixed;inset:0;z-index:100000;display:grid;place-items:center;padding:16px;background:rgba(15,23,42,.32);backdrop-filter:blur(9px)}.hd-modal{width:min(980px,96vw);max-height:92vh;overflow:hidden;background:#fff;border-radius:22px;border:1px solid rgba(255,255,255,.82);box-shadow:0 32px 92px rgba(15,23,42,.3);animation:hdModalIn .18s ease both}@keyframes hdModalIn{from{opacity:0;transform:translateY(9px) scale(.985)}to{opacity:1;transform:none}}.hd-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 18px;background:linear-gradient(135deg,color-mix(in srgb,var(--hd-primary) 7%,#fff),color-mix(in srgb,var(--hd-secondary) 7%,#fff));border-bottom:2px solid var(--hd-primary)}.hd-modal-head h2{margin:2px 0 0;color:#0f172a;font-size:17px;font-weight:1000}.hd-modal-head p{margin:3px 0 0;font-size:8.5px;color:#64748b}.hd-modal-close{width:33px;height:33px;border-radius:10px;border:1px solid #dbe3ee;background:#fff;color:#475569;display:grid;place-items:center;cursor:pointer}.hd-detail-modal,.hd-form-modal{overflow:auto}.hd-detail-identity{margin:14px 16px 0;padding:12px;border-radius:15px;display:flex;align-items:center;gap:10px;background:linear-gradient(145deg,color-mix(in srgb,var(--hd-primary) 7%,#fff),#fff);border:1px solid color-mix(in srgb,var(--hd-primary) 12%,#e2e8f0)}.hd-detail-identity .hd-page-icon{background:linear-gradient(135deg,var(--hd-primary),var(--hd-secondary));color:#fff}.hd-detail-identity strong,.hd-detail-identity span{display:block}.hd-detail-identity strong{font-size:12px}.hd-detail-identity span{margin-top:2px;font-size:8px;color:#64748b}.hd-detail-grid,.hd-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:14px 16px}.hd-detail-item{min-width:0;padding:10px;border:1px solid #e8edf3;border-radius:12px;background:linear-gradient(145deg,#fff,#f8fafc)}.hd-detail-item.wide,.hd-field.wide,.hd-switch-row.wide{grid-column:1/-1}.hd-detail-item span{display:block;font-size:9px;font-weight:1000;color:#94a3b8;text-transform:uppercase;letter-spacing:.045em}.hd-detail-item strong{display:block;margin-top:3px;color:#334155;font-size:11.5px;line-height:1.45;overflow-wrap:anywhere;white-space:pre-wrap}.hd-detail-meta{display:flex;gap:8px;flex-wrap:wrap;padding:0 16px 12px}.hd-detail-meta span{padding:5px 7px;border-radius:8px;background:#f8fafc;border:1px solid #e2e8f0;font-size:9px;color:#64748b;font-weight:850}.hd-modal-actions{display:flex;justify-content:flex-end;gap:7px;padding:12px 16px;border-top:1px solid #e2e8f0;background:#fff}.hd-field{display:grid;gap:5px}.hd-field>span{font-size:9.5px;font-weight:950;color:#475569}.hd-field input,.hd-field select,.hd-field textarea{width:100%;min-height:38px;border-radius:10px;border:1px solid #dbe3ee;background:#fff;padding:8px 10px;color:#0f172a;font:750 11px Inter,system-ui;outline:0;transition:.14s}.hd-field textarea{resize:vertical;min-height:82px}.hd-field input:focus,.hd-field select:focus,.hd-field textarea:focus{border-color:var(--hd-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--hd-primary) 10%,transparent)}
.hd-stat-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;margin-top:11px}.hd-stat-grid.finance{grid-template-columns:repeat(3,minmax(0,1fr))}.hd-stat-card{border:1px solid rgba(15,23,42,.075);background:rgba(255,255,255,.96);border-radius:16px;padding:12px;display:flex;gap:10px;align-items:center;text-align:left;box-shadow:0 10px 28px rgba(15,23,42,.05);min-width:0}.hd-stat-card>span:last-child{min-width:0}.hd-stat-card small,.hd-stat-card strong,.hd-stat-card em{display:block}.hd-stat-card small{font-size:7.7px;color:#64748b;font-weight:900;text-transform:uppercase}.hd-stat-card strong{font-size:16px;color:#0f172a;margin-top:2px;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hd-stat-card em{font-style:normal;margin-top:2px;font-size:7.4px;color:#94a3b8}.hd-stat-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,color-mix(in srgb,var(--hd-primary) 11%,#fff),color-mix(in srgb,var(--hd-secondary) 13%,#fff));color:var(--hd-primary);flex:0 0 38px}.hd-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,.55fr);gap:10px;margin-top:11px}.hd-recent-panel,.hd-quick-panel{padding:12px;min-width:0}.hd-panel-title{display:flex;justify-content:space-between;align-items:center;gap:9px;margin-bottom:9px}.hd-panel-title h2{margin:2px 0 0;font-size:13px;font-weight:1000;color:#0f172a}.hd-link-btn{border:0;background:transparent;color:var(--hd-primary);font-size:8.5px;font-weight:950;cursor:pointer}.hd-quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.hd-quick-grid button{border:1px solid #e2e8f0;background:linear-gradient(145deg,#fff,#f8fafc);border-radius:13px;padding:11px 8px;display:grid;place-items:center;gap:5px;color:#334155;cursor:pointer;transition:.16s}.hd-quick-grid button:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(15,23,42,.07);border-color:color-mix(in srgb,var(--hd-primary) 20%,#e2e8f0)}.hd-quick-grid button span{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--hd-primary) 8%,#fff);color:var(--hd-primary)}.hd-quick-grid button strong{font-size:8px}
.hd-report-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:9px;margin-top:12px}.hd-report-card{border:1px solid rgba(15,23,42,.075);background:linear-gradient(145deg,#fff,#f8fafc);border-radius:16px;padding:12px;display:flex;align-items:center;gap:10px;text-align:left;cursor:pointer;transition:.16s;box-shadow:0 10px 28px rgba(15,23,42,.045)}.hd-report-card:hover{transform:translateY(-2px);box-shadow:0 15px 34px rgba(15,23,42,.08);border-color:color-mix(in srgb,var(--hd-primary) 18%,#e2e8f0)}.hd-report-icon{width:39px;height:39px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--hd-primary),var(--hd-secondary));color:#fff}.hd-report-card span:nth-child(2){flex:1;min-width:0}.hd-report-card strong,.hd-report-card small{display:block}.hd-report-card strong{font-size:9.5px;color:#0f172a}.hd-report-card small{font-size:7.4px;color:#94a3b8;margin-top:2px}.hd-report-card>b{color:var(--hd-primary)}
.hd-sync-card{margin:11px 0;padding:12px 14px;display:flex;justify-content:space-between;gap:12px;align-items:center}.hd-sync-card div strong,.hd-sync-card div span{display:block}.hd-sync-card div strong{font-size:10px;color:#0f172a}.hd-sync-card div span{font-size:8px;color:#64748b;margin-top:2px}.hd-source-tabs{display:flex;gap:5px;padding:5px;margin:10px 0;border:1px solid #e2e8f0;border-radius:13px;background:#fff;width:max-content;max-width:100%}.hd-source-tabs button{border:0;background:transparent;border-radius:9px;padding:7px 10px;font-size:8.3px;font-weight:900;color:#64748b;cursor:pointer}.hd-source-tabs button.active{background:linear-gradient(135deg,var(--hd-primary),var(--hd-secondary));color:#fff}.hd-settings-form{margin-top:11px;padding:13px}.hd-switch-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc}.hd-switch-row span strong,.hd-switch-row span small{display:block}.hd-switch-row span strong{font-size:9px}.hd-switch-row span small{font-size:7.5px;color:#64748b;margin-top:2px}.hd-switch-row input{width:19px;height:19px;accent-color:var(--hd-primary)}.hd-workspace-loader{min-height:55vh;display:grid;place-items:center;font-weight:900;color:#64748b}
@media(max-width:1250px){.hd-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hd-dashboard-grid{grid-template-columns:1fr}.hd-quick-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.hd-sidebar{position:fixed;left:-275px;transition:left .2s ease}.hd-sidebar.open{left:0}.hd-mobile-menu{display:block}.hd-shell-content{padding:12px}.hd-topbar{padding:0 12px}.hd-topbar-actions .hd-profile-button b{display:none}.hd-page-hero,.hd-dashboard-hero{align-items:flex-start;flex-wrap:wrap}.hd-page-actions,.hd-dashboard-actions{width:100%;justify-content:flex-start}.hd-detail-grid,.hd-form-grid{grid-template-columns:1fr}.hd-detail-item.wide,.hd-field.wide,.hd-switch-row.wide{grid-column:auto}.hd-stat-grid,.hd-stat-grid.finance{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.hd-shell-content{padding:8px}.hd-topbar>div:first-of-type span,.hd-topbar-actions .hd-logout{display:none}.hd-page-hero,.hd-dashboard-hero{padding:15px;border-radius:18px}.hd-page-icon{width:43px;height:43px;flex-basis:43px}.hd-toolbar{align-items:stretch;flex-direction:column}.hd-result-count{margin-left:0;width:max-content}.hd-stat-grid,.hd-stat-grid.finance{grid-template-columns:1fr}.hd-quick-grid{grid-template-columns:repeat(2,1fr)}.business-workspace-switcher{width:100%;display:grid;grid-template-columns:1fr 1fr}.business-workspace-switcher button{justify-content:center}.hd-report-grid{grid-template-columns:1fr}.hd-modal-overlay{padding:8px}.hd-modal{width:100%;max-height:96vh}.hd-data-table{min-width:900px}}
@media print{.hd-btn,.hd-row-actions,.hd-toolbar,.hd-page-actions,.business-workspace-switcher{display:none!important}.hd-data-table tbody tr{animation:none!important}.hd-table-card,.hd-panel{box-shadow:none!important}.hd-table-scroll{overflow:visible!important}.hd-data-table{min-width:0!important;font-size:7px!important}}

/* BOTH-mode invariant: HD Orchids consumes MainLayout and the same ERP theme variables as Cold Storage. */
.hd-modern-workspace{width:100%;max-width:100%;min-width:0;background:transparent}
.hd-reference-field{position:relative;min-width:0}.hd-reference-input-wrap{display:flex;align-items:center;gap:7px;min-height:39px;padding:0 10px;border:1px solid #dbe3ee;border-radius:11px;background:#fff;color:var(--hd-primary)}.hd-reference-input-wrap:focus-within{border-color:color-mix(in srgb,var(--hd-primary) 48%,#dbe3ee);box-shadow:0 0 0 3px color-mix(in srgb,var(--hd-primary) 9%,transparent)}.hd-reference-input-wrap input{width:100%;min-width:0;border:0!important;outline:0!important;box-shadow:none!important;padding:0!important;background:transparent!important}.hd-reference-menu{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:140;max-height:285px;overflow:auto;padding:5px;border-radius:13px;background:rgba(255,255,255,.99);border:1px solid rgba(148,163,184,.22);box-shadow:0 20px 48px rgba(15,23,42,.16);backdrop-filter:blur(15px)}.hd-reference-option{width:100%;display:flex;align-items:center;gap:9px;padding:8px;border:0;border-radius:10px;background:transparent;color:#334155;text-align:left;cursor:pointer}.hd-reference-option:hover{background:color-mix(in srgb,var(--hd-primary) 7%,#fff)}.hd-reference-avatar{width:31px;height:31px;flex:0 0 31px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,var(--hd-primary),var(--hd-secondary));color:#fff;font-size:10px;font-weight:1000}.hd-reference-copy{min-width:0;flex:1}.hd-reference-copy strong,.hd-reference-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hd-reference-copy strong{font-size:9.5px;font-weight:950;color:#0f172a}.hd-reference-copy small{margin-top:2px;font-size:8px;color:#64748b}.hd-reference-use{font-size:7.5px;font-weight:950;color:var(--hd-primary);text-transform:uppercase}.hd-reference-empty{padding:15px 10px;text-align:center;color:#64748b;font-size:8.5px;font-weight:800;line-height:1.5}.hd-auto-number{display:flex;align-items:center;min-height:39px;padding:0 10px;border:1px dashed color-mix(in srgb,var(--hd-primary) 32%,#dbe3ee);border-radius:11px;background:color-mix(in srgb,var(--hd-primary) 4%,#fff);color:#64748b;font-size:9px;font-weight:850}.hd-auto-number strong{color:var(--hd-primary)}

/* ========================================================================== */
/* COLD STORAGE VISUAL PARITY — HD ORCHIDS                                    */
/* ========================================================================== */
/*
 * HD Orchids intentionally consumes the same MainLayout theme tokens as Cold
 * Storage. These rules only normalize HD-specific widgets so they no longer
 * introduce a second visual language. No Cold Storage selector or service is
 * changed here.
 */
.hd-modern-workspace,
.hd-mixed-workspace {
  --hd-primary: var(--erp-primary, #4f46e5);
  --hd-secondary: var(--erp-secondary, #0891b2);
  --hd-accent: var(--erp-accent, #d97706);
  --hd-text: var(--erp-text, #0f172a);
  --hd-muted: var(--erp-text-muted, #64748b);
  --hd-control-bg: rgba(255,255,255,.90);
  --hd-card-bg: linear-gradient(150deg, rgba(255,255,255,.96), rgba(var(--erp-primary-rgb),.025));
  --hd-card-border: rgba(var(--erp-primary-rgb),.11);
  --hd-card-shadow: 0 16px 38px rgba(15,23,42,.08), 0 4px 12px rgba(var(--erp-primary-rgb),.035);
  --hd-focus-ring: 0 0 0 3px rgba(var(--erp-primary-rgb),.08), 0 9px 20px rgba(15,23,42,.045);
}

/* Colored SVG treatment mirrors the colorful Cold Storage module icons. */
.ml-app-shell .hd-icon { color: var(--hd-icon-tone, var(--erp-primary)); transition: color .16s ease, transform .16s ease, filter .16s ease; }
.ml-app-shell .hd-icon[data-hd-icon="dashboard"] { --hd-icon-tone:#0284c7; }
.ml-app-shell .hd-icon[data-hd-icon="snowflake"] { --hd-icon-tone:#0891b2; }
.ml-app-shell .hd-icon[data-hd-icon="users"],
.ml-app-shell .hd-icon[data-hd-icon="employees"] { --hd-icon-tone:#059669; }
.ml-app-shell .hd-icon[data-hd-icon="leaf"],
.ml-app-shell .hd-icon[data-hd-icon="sprout"] { --hd-icon-tone:#16a34a; }
.ml-app-shell .hd-icon[data-hd-icon="grid"] { --hd-icon-tone:#6366f1; }
.ml-app-shell .hd-icon[data-hd-icon="package"] { --hd-icon-tone:#ea580c; }
.ml-app-shell .hd-icon[data-hd-icon="cart"] { --hd-icon-tone:#2563eb; }
.ml-app-shell .hd-icon[data-hd-icon="receipt"] { --hd-icon-tone:#d97706; }
.ml-app-shell .hd-icon[data-hd-icon="warehouse"] { --hd-icon-tone:#7c3aed; }
.ml-app-shell .hd-icon[data-hd-icon="stethoscope"] { --hd-icon-tone:#0f9f7f; }
.ml-app-shell .hd-icon[data-hd-icon="doctor"] { --hd-icon-tone:#9333ea; }
.ml-app-shell .hd-icon[data-hd-icon="clipboard"] { --hd-icon-tone:#c2410c; }
.ml-app-shell .hd-icon[data-hd-icon="droplet"] { --hd-icon-tone:#0284c7; }
.ml-app-shell .hd-icon[data-hd-icon="flask"],
.ml-app-shell .hd-icon[data-hd-icon="test"] { --hd-icon-tone:#7c3aed; }
.ml-app-shell .hd-icon[data-hd-icon="truck"] { --hd-icon-tone:#dc6b19; }
.ml-app-shell .hd-icon[data-hd-icon="purchase"] { --hd-icon-tone:#4f46e5; }
.ml-app-shell .hd-icon[data-hd-icon="finance"] { --hd-icon-tone:#ca8a04; }
.ml-app-shell .hd-icon[data-hd-icon="report"] { --hd-icon-tone:#0369a1; }
.ml-app-shell .hd-icon[data-hd-icon="settings"] { --hd-icon-tone:#64748b; }
.ml-app-shell .hd-icon[data-hd-icon="eye"] { --hd-icon-tone:#2563eb; }
.ml-app-shell .hd-icon[data-hd-icon="edit"] { --hd-icon-tone:#059669; }
.ml-app-shell .hd-icon[data-hd-icon="trash"] { --hd-icon-tone:#dc2626; }
.ml-app-shell .hd-icon[data-hd-icon="plus"] { --hd-icon-tone:var(--erp-primary); }
.ml-app-shell .hd-icon[data-hd-icon="search"] { --hd-icon-tone:#0284c7; }
.ml-app-shell .hd-icon[data-hd-icon="export"] { --hd-icon-tone:#0f766e; }
.ml-app-shell .hd-icon[data-hd-icon="close"] { --hd-icon-tone:#64748b; }

/* White icon on the same gradient pods used by Cold Storage visual cards. */
.hd-page-icon .hd-icon,
.hd-report-icon .hd-icon,
.hd-detail-identity .hd-page-icon .hd-icon,
.hd-btn.primary .hd-icon,
.hd-btn.danger .hd-icon,
.company-stat-icon-shell .hd-icon,
.company-module-card [style*="linear-gradient"] > .hd-icon,
.company-action-card [style*="linear-gradient"] > .hd-icon {
  color:#fff !important;
}
.hd-page-hero .hd-btn.primary .hd-icon,
.hd-dashboard-hero .hd-btn.primary .hd-icon { color:var(--erp-primary) !important; }
.hd-page-hero .hd-btn.secondary .hd-icon,
.hd-dashboard-hero .hd-btn.secondary .hd-icon { color:#fff !important; }

/* Modern top ribbon: preserve the colorful icon itself inside the light pod. */
.ref-app-icon .hd-icon,
.ref-app-submenu-icon .hd-icon,
.ref-app-more-head .ico .hd-icon { width:1em; height:1em; filter:drop-shadow(0 3px 7px rgba(15,23,42,.10)); }
.ref-app-trigger:hover .hd-icon { transform:scale(1.06); }

/* Same glass/card system as Cold Storage. */
.hd-panel,
.hd-table-card,
.hd-stat-card,
.hd-report-card,
.hd-settings-form,
.hd-sync-card,
.hd-recent-panel,
.hd-quick-panel,
.hd-detail-item,
.hd-reference-menu {
  border:1px solid var(--hd-card-border) !important;
  background:var(--hd-card-bg) !important;
  border-radius:var(--theme-radius,18px) !important;
  box-shadow:var(--hd-card-shadow) !important;
  backdrop-filter:blur(18px) saturate(145%);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
}
.ml-app-shell.theme-modern_dashboard .hd-panel,
.ml-app-shell.theme-modern_dashboard .hd-table-card,
.ml-app-shell.theme-modern_dashboard .hd-stat-card,
.ml-app-shell.theme-modern_dashboard .hd-report-card,
.ml-app-shell.theme-modern_dashboard .hd-settings-form,
.ml-app-shell.theme-modern_dashboard .hd-sync-card {
  border-color:rgba(255,255,255,.96) !important;
  background-image:
    radial-gradient(circle at 96% 8%,rgba(var(--erp-primary-rgb),.105) 0 42px,rgba(var(--erp-secondary-rgb),.05) 43px,transparent 82px),
    radial-gradient(circle at 5% 110%,rgba(var(--erp-accent-rgb),.07) 0 50px,transparent 86px) !important;
  background-color:rgba(255,255,255,.94) !important;
  background-repeat:no-repeat !important;
}
.ml-app-shell[data-custom-theme="true"] .hd-panel,
.ml-app-shell[data-custom-theme="true"] .hd-table-card,
.ml-app-shell[data-custom-theme="true"] .hd-stat-card,
.ml-app-shell[data-custom-theme="true"] .hd-report-card,
.ml-app-shell[data-custom-theme="true"] .hd-settings-form,
.ml-app-shell[data-custom-theme="true"] .hd-sync-card,
.ml-app-shell[data-custom-theme="true"] .hd-modal {
  background:var(--theme-card-bg) !important;
  border:var(--theme-border) !important;
  border-radius:var(--theme-radius) !important;
  box-shadow:var(--theme-shadow) !important;
}

/* Form controls intentionally mirror MainLayout's ERP-wide normalizer. */
.hd-modern-workspace .hd-field input,
.hd-modern-workspace .hd-field select,
.hd-modern-workspace .hd-field textarea,
.hd-modern-workspace .hd-toolbar select,
.hd-modern-workspace .hd-search,
.hd-modern-workspace .hd-reference-input-wrap {
  min-height:40px !important;
  border:1px solid rgba(var(--erp-primary-rgb),.17) !important;
  border-radius:12px !important;
  background:var(--hd-control-bg) !important;
  color:var(--erp-text,#0f172a) !important;
  box-shadow:0 4px 14px rgba(15,23,42,.035) !important;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}
.hd-modern-workspace .hd-field input:hover,
.hd-modern-workspace .hd-field select:hover,
.hd-modern-workspace .hd-field textarea:hover,
.hd-modern-workspace .hd-toolbar select:hover,
.hd-modern-workspace .hd-search:hover,
.hd-modern-workspace .hd-reference-input-wrap:hover {
  border-color:rgba(var(--erp-primary-rgb),.31) !important;
}
.hd-modern-workspace .hd-field input:focus,
.hd-modern-workspace .hd-field select:focus,
.hd-modern-workspace .hd-field textarea:focus,
.hd-modern-workspace .hd-toolbar select:focus,
.hd-modern-workspace .hd-search:focus-within,
.hd-modern-workspace .hd-reference-input-wrap:focus-within {
  border-color:var(--erp-primary) !important;
  box-shadow:var(--hd-focus-ring) !important;
  outline:none !important;
}
.hd-modern-workspace .hd-field > span {
  color:#475569 !important;
  font-size:9px !important;
  font-weight:950 !important;
  text-transform:uppercase;
  letter-spacing:.045em;
}
.hd-modern-workspace .hd-field textarea { min-height:96px !important; resize:vertical; }
.hd-modern-workspace .hd-reference-input-wrap input { border:0 !important; box-shadow:none !important; background:transparent !important; min-height:34px !important; }
.hd-modern-workspace .hd-auto-number {
  min-height:40px !important;
  border-radius:12px !important;
  border:1px dashed rgba(var(--erp-primary-rgb),.30) !important;
  background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.055),rgba(255,255,255,.88)) !important;
  color:#64748b !important;
}

/* Modal/dialog parity with Cold Storage glass dialogs. */
.hd-modal-overlay {
  background:rgba(15,23,42,.28) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
  padding:20px !important;
}
.hd-modal {
  width:min(980px,96vw) !important;
  max-height:min(92vh,900px) !important;
  border-radius:24px !important;
  border:1px solid rgba(255,255,255,.94) !important;
  background:linear-gradient(150deg,rgba(255,255,255,.985),rgba(var(--erp-primary-rgb),.025)) !important;
  box-shadow:0 28px 82px rgba(15,23,42,.24),0 8px 22px rgba(var(--erp-primary-rgb),.07) !important;
  backdrop-filter:blur(24px) saturate(160%) !important;
  -webkit-backdrop-filter:blur(24px) saturate(160%) !important;
}
.hd-modal-head {
  padding:18px 20px !important;
  background:
    radial-gradient(circle at 92% -15%,rgba(var(--erp-secondary-rgb),.12),transparent 38%),
    linear-gradient(135deg,rgba(var(--erp-primary-rgb),.075),rgba(var(--erp-secondary-rgb),.04),rgba(255,255,255,.94)) !important;
  border-bottom:1px solid rgba(var(--erp-primary-rgb),.11) !important;
}
.hd-modal-head::before {
  content:"";
  width:5px;
  align-self:stretch;
  flex:0 0 5px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--erp-primary),var(--erp-secondary));
  box-shadow:0 5px 14px rgba(var(--erp-primary-rgb),.18);
}
.hd-modal-head > div:first-of-type { flex:1; min-width:0; }
.hd-modal-head h2 { color:#0f172a !important; font-size:17px !important; letter-spacing:-.02em; }
.hd-modal-head p { color:#64748b !important; font-size:9px !important; line-height:1.5; }
.hd-modal-close {
  flex:0 0 36px;
  width:36px !important;
  height:36px !important;
  border-radius:12px !important;
  border:1px solid rgba(var(--erp-primary-rgb),.12) !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 7px 18px rgba(15,23,42,.06) !important;
}
.hd-modal-close:hover { transform:translateY(-1px); box-shadow:0 10px 22px rgba(15,23,42,.10) !important; }
.hd-detail-identity {
  border-radius:16px !important;
  border:1px solid rgba(var(--erp-primary-rgb),.12) !important;
  background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.065),rgba(255,255,255,.90)) !important;
  box-shadow:0 10px 24px rgba(15,23,42,.045);
}
.hd-detail-item {
  border-radius:13px !important;
  border:1px solid rgba(var(--erp-primary-rgb),.075) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(var(--erp-primary-rgb),.018)) !important;
  box-shadow:none !important;
}
.hd-detail-item:nth-child(even) { background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(var(--erp-secondary-rgb),.022)) !important; }
.hd-detail-item span { color:#94a3b8 !important; }
.hd-detail-item strong { color:#334155 !important; }
.hd-detail-meta span {
  border-color:rgba(var(--erp-primary-rgb),.09) !important;
  background:rgba(var(--erp-primary-rgb),.035) !important;
  color:#64748b !important;
}
.hd-modal-actions {
  background:rgba(255,255,255,.86) !important;
  border-top:1px solid rgba(var(--erp-primary-rgb),.09) !important;
  padding:13px 18px !important;
  position:sticky;
  bottom:0;
  z-index:4;
  backdrop-filter:blur(14px);
}

/* Buttons match the Cold Storage rounded/gradient action language. */
.hd-btn {
  min-height:38px !important;
  border-radius:12px !important;
  padding:0 13px !important;
  font-size:9.5px !important;
  font-weight:950 !important;
  box-shadow:0 7px 18px rgba(15,23,42,.055);
}
.hd-btn.primary {
  background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary)) !important;
  border:1px solid rgba(255,255,255,.45) !important;
  box-shadow:0 10px 24px rgba(var(--erp-primary-rgb),.18) !important;
}
.hd-btn.secondary,
.hd-btn.mini {
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(var(--erp-primary-rgb),.13) !important;
  color:#475569 !important;
}
.hd-btn.secondary .hd-icon,
.hd-btn.mini .hd-icon { color:var(--erp-primary) !important; }
.hd-page-hero .hd-btn.secondary .hd-icon,
.hd-dashboard-hero .hd-btn.secondary .hd-icon { color:#fff !important; }
.hd-btn:hover:not(:disabled) { transform:translateY(-2px) !important; filter:saturate(1.05); }
.hd-btn:disabled { opacity:.55; cursor:not-allowed; transform:none !important; }

/* Cold Storage-style table: light themed header and floating striped rows. */
.hd-table-card { padding:8px !important; overflow:hidden !important; }
.hd-table-scroll { border-radius:14px; }
.hd-data-table {
  border-collapse:separate !important;
  border-spacing:0 7px !important;
  background:transparent !important;
  font-variant-numeric:tabular-nums;
}
.hd-data-table thead th {
  position:sticky !important;
  top:0 !important;
  z-index:5 !important;
  padding:10px 11px !important;
  border:0 !important;
  background:linear-gradient(135deg,rgba(var(--erp-primary-rgb),.085),rgba(var(--erp-secondary-rgb),.055)) !important;
  color:#475569 !important;
  font-size:9px !important;
  font-weight:950 !important;
  letter-spacing:.055em !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
}
.hd-data-table thead th:first-child { border-radius:12px 0 0 12px !important; }
.hd-data-table thead th:last-child { border-radius:0 12px 12px 0 !important; }
.hd-data-table tbody tr {
  filter:drop-shadow(0 7px 12px rgba(15,23,42,.035));
  transition:transform .18s ease,filter .18s ease !important;
}
.hd-data-table tbody tr:hover {
  transform:translateY(-1px) !important;
  filter:drop-shadow(0 11px 18px rgba(var(--erp-primary-rgb),.075));
}
.hd-data-table tbody td {
  padding:10px 11px !important;
  border-top:1px solid rgba(var(--erp-primary-rgb),.075) !important;
  border-bottom:1px solid rgba(var(--erp-primary-rgb),.075) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(var(--erp-primary-rgb),.018)) !important;
  color:#334155 !important;
  font-size:11px !important;
  vertical-align:middle !important;
}
.hd-data-table tbody td:first-child {
  border-left:1px solid rgba(var(--erp-primary-rgb),.075) !important;
  border-radius:13px 0 0 13px !important;
  color:#0f172a !important;
  font-weight:900 !important;
}
.hd-data-table tbody td:last-child {
  border-right:1px solid rgba(var(--erp-primary-rgb),.075) !important;
  border-radius:0 13px 13px 0 !important;
}
.hd-data-table tbody tr:nth-child(even) td { background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(var(--erp-secondary-rgb),.022)) !important; }
.hd-data-table .hd-empty-cell { border-radius:14px !important; }

/* Colorful action icon pods rather than black line icons. */
.hd-row-actions { gap:6px !important; }
.hd-icon-button {
  width:32px !important;
  height:32px !important;
  border-radius:10px !important;
  border:1px solid rgba(255,255,255,.72) !important;
  color:#fff !important;
  box-shadow:0 7px 16px rgba(15,23,42,.09) !important;
}
.hd-icon-button .hd-icon { color:#fff !important; }
.hd-icon-button.view { background:linear-gradient(135deg,#3b82f6,#2563eb) !important; }
.hd-icon-button.edit { background:linear-gradient(135deg,#10b981,#059669) !important; }
.hd-icon-button.delete { background:linear-gradient(135deg,#ef4444,#dc2626) !important; }
.hd-icon-button:hover:not(:disabled) { transform:translateY(-2px) scale(1.03) !important; }

/* Status pills stay colorful and use the same compact dashboard density. */
.hd-status-pill { padding:5px 8px !important; border-radius:999px !important; font-size:8.5px !important; font-weight:950 !important; letter-spacing:.01em; }
.hd-status-pill.success { background:#ecfdf5 !important; color:#047857 !important; border-color:#a7f3d0 !important; }
.hd-status-pill.warning { background:#fffbeb !important; color:#b45309 !important; border-color:#fde68a !important; }
.hd-status-pill.danger { background:#fef2f2 !important; color:#b91c1c !important; border-color:#fecaca !important; }
.hd-status-pill.neutral { background:#eff6ff !important; color:#1d4ed8 !important; border-color:#bfdbfe !important; }

/* Empty/access/loading states use the same branded icon-pod language. */
.hd-empty-state > .hd-icon,
.hd-access-denied > .hd-icon {
  width:46px !important;
  height:46px !important;
  padding:10px;
  box-sizing:border-box;
  border-radius:14px;
  background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary));
  color:#fff !important;
  border:1px solid rgba(255,255,255,.56);
  box-shadow:0 9px 22px rgba(var(--erp-primary-rgb),.20);
}
.hd-workspace-loader {
  position:relative;
  min-height:55vh;
  padding-top:74px;
  color:#64748b !important;
  background-image:var(--erp-company-logo);
  background-position:center calc(50% - 25px);
  background-size:48px 48px;
  background-repeat:no-repeat;
}

/* Toolbar and reference selector are identical in density to Cold Storage. */
.hd-toolbar { padding:10px 11px !important; gap:8px !important; }
.hd-search { color:#64748b !important; }
.hd-search > .hd-icon { color:var(--erp-primary) !important; }
.hd-result-count {
  border:1px solid rgba(var(--erp-primary-rgb),.10) !important;
  background:linear-gradient(135deg,rgba(var(--erp-primary-rgb),.07),rgba(var(--erp-secondary-rgb),.035)) !important;
  color:var(--erp-primary) !important;
}
.hd-reference-menu { padding:7px !important; border-radius:14px !important; }
.hd-reference-option {
  min-height:46px;
  border:1px solid transparent !important;
  border-radius:11px !important;
}
.hd-reference-option:hover {
  background:linear-gradient(135deg,rgba(var(--erp-primary-rgb),.06),rgba(var(--erp-secondary-rgb),.03)) !important;
  border-color:rgba(var(--erp-primary-rgb),.08) !important;
}
.hd-reference-avatar {
  background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary)) !important;
  box-shadow:0 7px 16px rgba(var(--erp-primary-rgb),.15);
}
.hd-reference-use { color:var(--erp-primary) !important; }

/* Dashboard/support cards: colorful icon pods consistently. */
.hd-stat-icon,
.hd-report-icon,
.hd-quick-grid button span {
  background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary)) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.58);
  box-shadow:0 8px 18px rgba(var(--erp-primary-rgb),.18);
}
.hd-stat-icon .hd-icon,
.hd-report-icon .hd-icon,
.hd-quick-grid button span .hd-icon { color:#fff !important; }
.hd-stat-card:nth-child(3n+2) .hd-stat-icon,
.hd-report-card:nth-child(3n+2) .hd-report-icon,
.hd-quick-grid button:nth-child(3n+2) span { background:linear-gradient(135deg,var(--erp-secondary),var(--erp-primary)) !important; }
.hd-stat-card:nth-child(3n) .hd-stat-icon,
.hd-report-card:nth-child(3n) .hd-report-icon,
.hd-quick-grid button:nth-child(3n) span { background:linear-gradient(135deg,var(--erp-accent),var(--erp-primary)) !important; }

/* Source tabs and switch rows follow the same shared theme. */
.hd-source-tabs {
  padding:6px !important;
  border-radius:14px !important;
  border:1px solid rgba(var(--erp-primary-rgb),.11) !important;
  background:rgba(255,255,255,.88) !important;
  box-shadow:0 8px 20px rgba(15,23,42,.045);
}
.hd-source-tabs button { min-height:34px; border-radius:10px !important; }
.hd-source-tabs button.active { background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary)) !important; color:#fff !important; box-shadow:0 7px 16px rgba(var(--erp-primary-rgb),.16); }
.hd-switch-row {
  border:1px solid rgba(var(--erp-primary-rgb),.09) !important;
  border-radius:13px !important;
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(var(--erp-primary-rgb),.025)) !important;
}
.hd-switch-row input { accent-color:var(--erp-primary) !important; }

/* Full-width workspace selector, with exactly one shared theme in Mixed mode. */
.business-workspace-switcher {
  border:1px solid rgba(var(--erp-primary-rgb),.12) !important;
  background:rgba(255,255,255,.90) !important;
  border-radius:17px !important;
  box-shadow:0 10px 30px rgba(15,23,42,.07) !important;
}
.business-workspace-switcher button.active,
.business-workspace-switcher button.active.orchard {
  background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary)) !important;
  box-shadow:0 9px 22px rgba(var(--erp-primary-rgb),.20) !important;
}

/* Classic Portal preset receives the same primitives at its preset radius. */
.ml-app-shell.theme-legacy_original .hd-panel,
.ml-app-shell.theme-legacy_original .hd-table-card,
.ml-app-shell.theme-legacy_original .hd-stat-card,
.ml-app-shell.theme-legacy_original .hd-report-card,
.ml-app-shell.theme-legacy_original .hd-modal,
.ml-app-shell.theme-legacy_original .hd-field input,
.ml-app-shell.theme-legacy_original .hd-field select,
.ml-app-shell.theme-legacy_original .hd-field textarea {
  border-radius:var(--theme-radius,16px) !important;
}

@media(max-width:720px){
  .hd-modal-overlay{padding:8px !important;align-items:flex-start !important;overflow:auto !important}
  .hd-modal{width:100% !important;max-height:calc(100dvh - 16px) !important;border-radius:18px !important}
  .hd-modal-head{padding:14px !important}
  .hd-detail-grid,.hd-form-grid{padding:12px !important;gap:8px !important}
  .hd-table-card{padding:5px !important}
}

/* HD Orchids dynamic field + evidence + QR/barcode extensions. These consume the
   same --erp-* / --hd-* tokens as the Cold Storage shell, so Mixed and standalone
   themes keep identical modal/form/table geometry. */
.ml-app-shell .hd-icon[data-hd-icon="bug"]{--hd-icon-tone:#dc2626}
.ml-app-shell .hd-icon[data-hd-icon="plant"]{--hd-icon-tone:#16a34a}
.ml-app-shell .hd-icon[data-hd-icon="alert"]{--hd-icon-tone:#ea580c}
.ml-app-shell .hd-icon[data-hd-icon="map"]{--hd-icon-tone:#0284c7}
.ml-app-shell .hd-icon[data-hd-icon="camera"]{--hd-icon-tone:#7c3aed}
.ml-app-shell .hd-icon[data-hd-icon="qr"]{--hd-icon-tone:#0f766e}
.ml-app-shell .hd-icon[data-hd-icon="barcode"]{--hd-icon-tone:#334155}
.ml-app-shell .hd-icon[data-hd-icon="calendar"]{--hd-icon-tone:#2563eb}
.ml-app-shell .hd-icon[data-hd-icon="folder"]{--hd-icon-tone:#d97706}
.ml-app-shell .hd-icon[data-hd-icon="support"]{--hd-icon-tone:#9333ea}

.hd-dynamic-select{display:grid;gap:6px;min-width:0}.hd-dynamic-select-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:stretch}.hd-inline-add{min-width:62px;border:1px solid color-mix(in srgb,var(--erp-primary) 22%,#dbe4ee);border-radius:10px;background:color-mix(in srgb,var(--erp-primary) 6%,#fff);color:var(--erp-primary);font-size:10px;font-weight:1000;display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;transition:.16s ease}.hd-inline-add:hover{transform:translateY(-1px);box-shadow:0 7px 16px rgba(15,23,42,.09);background:color-mix(in srgb,var(--erp-primary) 10%,#fff)}.hd-inline-add-panel{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px;padding:8px;border:1px solid color-mix(in srgb,var(--erp-primary) 15%,#e2e8f0);border-radius:11px;background:color-mix(in srgb,var(--erp-primary) 3%,#fff);animation:hdRowIn .18s ease}.hd-field-error{display:block;color:#b91c1c;font-size:9.5px;font-weight:800;line-height:1.35}

.hd-check-control{min-height:38px;display:flex!important;align-items:center;gap:9px!important;border:1px solid rgba(148,163,184,.35);border-radius:10px;padding:8px 10px;background:rgba(255,255,255,.82)}.hd-check-control input{width:16px!important;height:16px!important;accent-color:var(--erp-primary);box-shadow:none!important}.hd-check-control span{margin:0!important;font-size:10.5px!important;text-transform:none!important;letter-spacing:0!important;color:#334155!important}

.hd-gps-field{display:grid;gap:7px}.hd-gps-capture{justify-self:start}.hd-gps-chip{display:grid;gap:2px;padding:9px 11px;border-radius:11px;border:1px solid color-mix(in srgb,var(--erp-primary) 18%,#dbe4ee);background:linear-gradient(135deg,color-mix(in srgb,var(--erp-primary) 5%,#fff),color-mix(in srgb,var(--erp-secondary,var(--erp-primary)) 4%,#fff))}.hd-gps-chip strong{font-size:11px;color:#0f172a}.hd-gps-chip span,.hd-gps-empty{font-size:9.5px;color:#64748b;font-weight:700}.hd-gps-empty{padding:8px 10px;border:1px dashed #cbd5e1;border-radius:10px}.hd-gps-empty.required{color:#b45309;border-color:#fcd34d;background:#fffbeb}

.hd-media-field{display:grid;gap:9px}.hd-media-toolbar{display:flex;flex-wrap:wrap;gap:7px;align-items:center}.hd-gps-toggle{display:flex!important;align-items:center!important;gap:6px!important;margin:0!important;padding:6px 9px;border:1px solid #e2e8f0;border-radius:999px;background:#fff}.hd-gps-toggle input{width:14px!important;height:14px!important;accent-color:var(--erp-primary);box-shadow:none!important}.hd-gps-toggle span{font-size:9.4px!important;margin:0!important;text-transform:none!important;letter-spacing:0!important;color:#475569!important}.hd-media-progress{padding:8px 10px;border-radius:9px;background:color-mix(in srgb,var(--erp-primary) 7%,#fff);color:var(--erp-primary);font-size:9.6px;font-weight:900}.hd-photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:9px}.hd-photo-card{position:relative;min-width:0;border:1px solid rgba(148,163,184,.28);border-radius:13px;overflow:hidden;background:#fff;box-shadow:0 9px 20px rgba(15,23,42,.06);text-decoration:none}.hd-photo-card img{display:block;width:100%;height:116px;object-fit:cover;background:#f1f5f9}.hd-photo-meta{display:grid;gap:3px;padding:8px}.hd-photo-meta strong{font-size:9.6px;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hd-photo-meta span{display:flex;align-items:center;gap:3px;font-size:8.4px;color:#64748b;line-height:1.25}.hd-photo-remove{position:absolute;right:6px;top:6px;width:28px;height:28px;border:0;border-radius:9px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 14px rgba(220,38,38,.25)}.hd-photo-remove .hd-icon{color:#fff!important}.hd-photo-empty{min-height:74px;border:1px dashed #cbd5e1;border-radius:12px;display:grid;place-items:center;align-content:center;gap:4px;color:#94a3b8;font-size:9.5px}.hd-detail-photo-section{margin-top:14px;padding-top:13px;border-top:1px solid rgba(148,163,184,.22)}.hd-detail-photo-section h3{display:flex;align-items:center;gap:7px;margin:0 0 9px;font-size:11px;color:#0f172a}.hd-photo-view:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(15,23,42,.11);transition:.16s ease}

.hd-code-tag-panel{margin:12px 0;padding:12px;border:1px solid color-mix(in srgb,var(--erp-primary) 16%,#dbe4ee);border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--erp-primary) 4%,#fff),rgba(255,255,255,.96));box-shadow:0 10px 25px rgba(15,23,42,.05)}.hd-code-tag-head{display:flex;align-items:center;gap:9px}.hd-code-tag-head>span{width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,var(--erp-primary) 10%,#fff);display:grid;place-items:center}.hd-code-tag-head strong{display:block;font-size:11px;color:#0f172a}.hd-code-tag-head small{display:block;margin-top:1px;font-size:8.8px;color:#64748b}.hd-code-tag-body{display:grid;grid-template-columns:180px minmax(220px,1fr);gap:12px;align-items:center;margin-top:10px}.hd-qr-box{display:grid;place-items:center;gap:4px;padding:8px;background:#fff;border:1px solid #e2e8f0;border-radius:11px}.hd-qr-box img{width:128px;height:128px}.hd-qr-box span{font:800 9px ui-monospace,SFMono-Regular,Menlo,monospace;color:#334155}.hd-barcode-box{padding:8px;background:#fff;border:1px solid #e2e8f0;border-radius:11px;overflow:hidden}.hd-code-tag-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}

@media(max-width:760px){.hd-inline-add-panel{grid-template-columns:1fr}.hd-code-tag-body{grid-template-columns:1fr}.hd-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hd-media-toolbar{align-items:stretch}.hd-media-toolbar .hd-btn{flex:1;min-width:130px}}
@media(max-width:430px){.hd-photo-grid{grid-template-columns:1fr}}
.hd-master-manager{margin-top:14px;padding:14px}.hd-section-title>div{display:flex;align-items:center;gap:10px}.hd-section-title h2{margin:0;font-size:14px;color:#0f172a}.hd-section-title p{margin:2px 0 0;font-size:9.6px;color:#64748b}.hd-master-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:12px;margin-top:12px}.hd-master-list{display:grid;align-content:start;gap:5px;max-height:540px;overflow:auto;padding-right:3px}.hd-master-list button{border:1px solid #e2e8f0;background:#fff;border-radius:10px;padding:8px 9px;text-align:left;font-size:9.7px;font-weight:850;color:#475569;cursor:pointer;transition:.15s}.hd-master-list button:hover,.hd-master-list button.active{border-color:color-mix(in srgb,var(--erp-primary) 34%,#cbd5e1);background:color-mix(in srgb,var(--erp-primary) 7%,#fff);color:var(--erp-primary);transform:translateX(2px)}.hd-master-content{min-width:0;border:1px solid rgba(148,163,184,.25);border-radius:13px;padding:11px;background:rgba(255,255,255,.86)}.hd-master-head{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:9px}.hd-master-head strong{display:block;font-size:11px;color:#0f172a}.hd-master-head small{display:block;margin-top:2px;font-size:8.5px;color:#64748b}.hd-master-add{display:flex;gap:6px;align-items:center;min-width:min(100%,360px)}.hd-master-add input{min-width:0;flex:1}.hd-master-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:410px;overflow:auto}.hd-master-option{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:8px 9px;border:1px solid #e2e8f0;border-radius:10px;background:#fff}.hd-master-option.inactive{opacity:.55;background:#f8fafc}.hd-master-option strong{display:block;font-size:9.7px;color:#1e293b}.hd-master-option small{display:block;margin-top:1px;font-size:8px;color:#94a3b8}.hd-master-option .hd-icon-button{width:27px;height:27px;min-width:27px}@media(max-width:820px){.hd-master-layout{grid-template-columns:1fr}.hd-master-list{grid-template-columns:repeat(2,minmax(0,1fr));max-height:210px}.hd-master-options{grid-template-columns:1fr}.hd-master-head{align-items:stretch;flex-direction:column}.hd-master-add{width:100%}}

/* ========================================================================== */
/* 2026-08 FORM/PAGE PARITY FIX — use the Cold Storage visual language        */
/* ========================================================================== */
.hd-modern-workspace .hd-module-page{
  position:relative;
  padding:2px 0 18px;
  background:transparent !important;
}
.hd-modern-workspace .hd-page-hero{
  min-height:104px;
  padding:18px 20px !important;
  border-radius:22px !important;
  color:var(--erp-text,#0f172a) !important;
  border:1px solid rgba(255,255,255,.94) !important;
  background:
    radial-gradient(circle at 4% 0%,rgba(var(--erp-primary-rgb),.13),transparent 31%),
    radial-gradient(circle at 96% 0%,rgba(var(--erp-secondary-rgb),.11),transparent 28%),
    linear-gradient(145deg,rgba(255,255,255,.96),rgba(248,250,252,.90)) !important;
  box-shadow:0 17px 42px rgba(15,23,42,.075),0 0 0 1px rgba(var(--erp-primary-rgb),.025) !important;
  backdrop-filter:blur(20px) saturate(145%);
  -webkit-backdrop-filter:blur(20px) saturate(145%);
}
.hd-modern-workspace .hd-page-hero::before{
  content:"";position:absolute;left:0;top:18px;bottom:18px;width:5px;border-radius:0 999px 999px 0;
  background:linear-gradient(180deg,var(--erp-primary),var(--erp-secondary),var(--erp-accent));
}
.hd-modern-workspace .hd-page-hero::after{
  right:-42px;top:-70px;width:180px;height:180px;
  background:radial-gradient(circle,rgba(var(--erp-primary-rgb),.10),transparent 67%) !important;
}
.hd-modern-workspace .hd-page-hero .hd-page-icon{
  width:48px;height:48px;flex-basis:48px;border-radius:15px;
  background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary)) !important;
  border:1px solid rgba(255,255,255,.78) !important;
  box-shadow:0 12px 28px rgba(var(--erp-primary-rgb),.18) !important;
}
.hd-modern-workspace .hd-page-copy h1{color:var(--erp-text,#0f172a) !important;font-size:22px !important}
.hd-modern-workspace .hd-page-copy p{color:var(--erp-text-muted,#64748b) !important;opacity:1 !important;font-size:10px !important}
.hd-modern-workspace .hd-page-copy .hd-eyebrow{color:var(--erp-primary) !important;opacity:.78 !important}
.hd-modern-workspace .hd-page-hero .hd-btn.primary{
  color:#fff !important;background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary)) !important;
  border:1px solid rgba(255,255,255,.45) !important;
}
.hd-modern-workspace .hd-page-hero .hd-btn.primary .hd-icon{color:#fff !important}
.hd-modern-workspace .hd-page-hero .hd-btn.secondary{
  color:#475569 !important;background:rgba(255,255,255,.92) !important;border:1px solid rgba(var(--erp-primary-rgb),.13) !important;
}
.hd-modern-workspace .hd-page-hero .hd-btn.secondary .hd-icon{color:var(--erp-primary) !important}

/* Canonical Cold Storage modal layer. */
.hd-modal-overlay[data-erp-modal-overlay="true"]{
  background:
    radial-gradient(circle at 8% 8%,rgba(var(--erp-primary-rgb),.16),transparent 28%),
    radial-gradient(circle at 92% 10%,rgba(var(--erp-secondary-rgb),.14),transparent 27%),
    radial-gradient(circle at 50% 96%,rgba(var(--erp-accent-rgb),.13),transparent 31%),
    rgba(15,23,42,.28) !important;
  backdrop-filter:blur(7px) saturate(118%) !important;
  -webkit-backdrop-filter:blur(7px) saturate(118%) !important;
}
.hd-modal[data-erp-modal-panel="true"]{
  width:min(1080px,100%) !important;
  max-width:calc(100vw - 20px) !important;
  max-height:calc(100dvh - 20px) !important;
  border-radius:24px !important;
  border:1px solid rgba(255,255,255,.94) !important;
  background:
    radial-gradient(circle at 0 0,rgba(var(--erp-primary-rgb),.07),transparent 24%),
    radial-gradient(circle at 100% 0,rgba(var(--erp-secondary-rgb),.065),transparent 25%),
    radial-gradient(circle at 50% 100%,rgba(var(--erp-accent-rgb),.055),transparent 28%),
    rgba(255,255,255,.985) !important;
  box-shadow:0 30px 80px rgba(15,23,42,.20),0 0 0 1px rgba(var(--erp-primary-rgb),.05) !important;
}
.hd-modal[data-erp-modal-panel="true"]::before{
  content:"";position:sticky;top:0;display:block;height:4px;z-index:30;
  background:linear-gradient(90deg,var(--erp-primary),var(--erp-secondary),var(--erp-accent));
}
.hd-modal .hd-modal-head{
  position:sticky;top:4px;z-index:20;
  padding:15px 18px !important;
  background:rgba(255,255,255,.91) !important;
  border-bottom:1px solid rgba(var(--erp-primary-rgb),.09) !important;
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
}
.hd-modal .hd-modal-head::before{background:linear-gradient(180deg,var(--erp-primary),var(--erp-secondary),var(--erp-accent)) !important}
.hd-modal .hd-modal-head h2{font-size:18px !important;font-weight:950 !important;color:var(--erp-text,#0f172a) !important}
.hd-modal .hd-modal-head p{font-size:9.5px !important;color:var(--erp-text-muted,#64748b) !important;max-width:760px}

.hd-form-body{padding:14px 16px 4px;display:grid;gap:12px;overflow:visible}
.hd-form-context-card{
  display:flex;align-items:center;gap:10px;min-width:0;padding:11px 12px;border-radius:16px;
  background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.07),rgba(255,255,255,.92));
  border:1px solid rgba(var(--erp-primary-rgb),.12);box-shadow:0 10px 24px rgba(15,23,42,.045)
}
.hd-context-icon,.hd-section-icon{
  width:38px;height:38px;flex:0 0 38px;border-radius:12px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary));
  border:1px solid rgba(255,255,255,.6);box-shadow:0 9px 20px rgba(var(--erp-primary-rgb),.16)
}
.hd-context-icon .hd-icon,.hd-section-icon .hd-icon{color:#fff !important}
.hd-form-context-card>div:nth-child(2){min-width:0;flex:1}.hd-form-context-card strong{display:block;color:#0f172a;font-size:11.5px;font-weight:950}.hd-form-context-card span{display:block;margin-top:2px;color:#64748b;font-size:9px;font-weight:650;line-height:1.45}
.hd-context-links{display:flex!important;flex-wrap:wrap;gap:5px;justify-content:flex-end;max-width:42%}.hd-context-links span{margin:0!important;padding:5px 7px;border-radius:9px;background:#fff;color:var(--erp-primary)!important;border:1px solid rgba(var(--erp-primary-rgb),.12);font-size:8px!important;font-weight:900!important}

.hd-form-section{
  padding:12px;border-radius:18px;border:1px solid rgba(var(--erp-primary-rgb),.09);
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(var(--erp-primary-rgb),.018));
  box-shadow:0 10px 28px rgba(15,23,42,.045)
}
.hd-form-section-head{display:flex;align-items:center;gap:9px;padding:0 1px 10px;margin-bottom:2px;border-bottom:1px solid rgba(var(--erp-primary-rgb),.07)}
.hd-form-section-head .hd-section-icon{width:33px;height:33px;flex-basis:33px;border-radius:10px}
.hd-form-section-head h3{margin:0;color:#0f172a;font-size:12px;font-weight:950}.hd-form-section-head p{margin:2px 0 0;color:#64748b;font-size:8.6px;font-weight:650}
.hd-form-section .hd-form-grid{padding:10px 0 0 !important;gap:10px 11px !important}
.hd-field-label{display:flex!important;align-items:center;gap:4px;color:#475569!important;font-size:8.8px!important;font-weight:950!important;letter-spacing:.052em!important;text-transform:uppercase}
.hd-field-label b{color:#dc2626;font-size:10px}.hd-field-label em{margin-left:auto;padding:2px 5px;border-radius:6px;background:rgba(var(--erp-primary-rgb),.07);color:var(--erp-primary);font-style:normal;font-size:6.8px;letter-spacing:.08em}
.hd-field-hint{display:block;color:#94a3b8;font-size:8.2px;font-weight:650;line-height:1.42;margin-top:0}
.hd-modern-workspace .hd-field input,.hd-modern-workspace .hd-field select,.hd-modern-workspace .hd-field textarea{
  min-height:42px!important;border-radius:12px!important;border:1px solid rgba(var(--erp-primary-rgb),.14)!important;background:rgba(255,255,255,.96)!important;color:#0f172a!important;font-size:10.7px!important;font-weight:700!important;padding:9px 11px!important;box-shadow:0 4px 12px rgba(15,23,42,.025)!important
}
.hd-modern-workspace .hd-field textarea{min-height:92px!important;line-height:1.48}
.hd-modern-workspace .hd-field input::placeholder,.hd-modern-workspace .hd-field textarea::placeholder{color:#a1adbd;opacity:1}
.hd-modern-workspace .hd-field input:focus,.hd-modern-workspace .hd-field select:focus,.hd-modern-workspace .hd-field textarea:focus{border-color:var(--erp-primary)!important;box-shadow:0 0 0 3px rgba(var(--erp-primary-rgb),.075),0 8px 20px rgba(15,23,42,.04)!important}
.hd-auto-number{gap:7px!important;min-height:42px!important;background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.055),rgba(255,255,255,.96))!important}.hd-auto-number .hd-icon{color:var(--erp-primary)!important}
.hd-reference-input-wrap{min-height:42px!important;background:#fff!important;border-color:rgba(var(--erp-primary-rgb),.14)!important}
.hd-reference-menu{z-index:2147483200!important}
.hd-inline-add{min-width:68px!important;border-radius:12px!important;background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.07),#fff)!important}
.hd-dynamic-select-row select{min-height:42px!important}
.hd-modal-actions{padding:12px 16px!important;background:rgba(255,255,255,.93)!important;box-shadow:0 -8px 24px rgba(15,23,42,.035)}

/* Detail views use the same section/card density as Cold Storage. */
.hd-detail-grid{padding:12px 16px!important;gap:9px!important}.hd-detail-item{padding:11px!important}.hd-detail-item span{font-size:8px!important}.hd-detail-item strong{font-size:10.8px!important}

@media(max-width:760px){
  .hd-form-body{padding:10px 10px 2px}.hd-form-section{padding:10px}.hd-form-context-card{align-items:flex-start;flex-wrap:wrap}.hd-context-links{max-width:100%;width:100%;justify-content:flex-start}.hd-modal[data-erp-modal-panel="true"]{max-width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px)!important;border-radius:18px!important}.hd-modal .hd-modal-head{top:4px;padding:13px!important}
}
.hd-reference-selected{display:flex;align-items:center;gap:7px;margin-top:5px;padding:6px 8px;border-radius:10px;border:1px solid rgba(var(--erp-primary-rgb),.10);background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.045),rgba(255,255,255,.92))}.hd-reference-selected-icon{width:25px;height:25px;flex:0 0 25px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary));color:#fff}.hd-reference-selected-icon .hd-icon{color:#fff!important}.hd-reference-selected>span:last-child{min-width:0}.hd-reference-selected strong,.hd-reference-selected small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hd-reference-selected strong{font-size:9.2px;color:#0f172a;font-weight:950}.hd-reference-selected small{margin-top:1px;font-size:7.8px;color:#64748b;font-weight:700}
.hd-detail-sections{display:grid;gap:10px;padding:12px 16px}.hd-detail-section{border:1px solid rgba(var(--erp-primary-rgb),.085);border-radius:17px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(var(--erp-primary-rgb),.015));padding:11px;box-shadow:0 9px 24px rgba(15,23,42,.035)}.hd-detail-section .hd-detail-grid{padding:10px 0 0!important}.hd-detail-section .hd-form-section-head{margin:0}

/* Finance control center: use the same themed segmented/tabs language as Cold Storage. */
.hd-finance-tabs{
  display:flex;align-items:center;gap:8px;overflow-x:auto;padding:8px;
  margin:0 0 12px;border:1px solid var(--erp-border,rgba(148,163,184,.2));
  border-radius:calc(var(--erp-radius,18px) - 4px);background:var(--erp-surface,#fff);
  box-shadow:var(--erp-shadow-sm,0 8px 24px rgba(15,23,42,.06));scrollbar-width:thin;
}
.hd-finance-tabs button,.hd-segmented button{
  appearance:none;border:1px solid transparent;background:transparent;color:var(--erp-text-muted,#64748b);
  min-height:36px;padding:8px 13px;border-radius:11px;font:inherit;font-size:12px;font-weight:800;
  white-space:nowrap;cursor:pointer;transition:transform .18s ease,background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.hd-finance-tabs button:hover,.hd-segmented button:hover{transform:translateY(-1px);color:var(--erp-primary,#4f46e5);background:color-mix(in srgb,var(--erp-primary,#4f46e5) 7%,#fff);border-color:color-mix(in srgb,var(--erp-primary,#4f46e5) 16%,transparent)}
.hd-finance-tabs button.active,.hd-segmented button.active{
  color:#fff;background:linear-gradient(135deg,var(--erp-primary,#4f46e5),var(--erp-secondary,#0891b2));
  box-shadow:0 8px 18px color-mix(in srgb,var(--erp-primary,#4f46e5) 24%,transparent);
}
.hd-filter-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 10px;padding:8px;border:1px solid var(--erp-border,rgba(148,163,184,.2));border-radius:14px;background:var(--erp-surface,#fff)}
.hd-segmented{display:flex;align-items:center;gap:5px;overflow-x:auto;max-width:100%;padding:2px;scrollbar-width:thin}
.hd-finance-page .bank-recon-page{padding:0!important;max-width:none!important;background:transparent!important}
.hd-finance-page .hd-panel-title p{margin:4px 0 0;color:var(--erp-text-muted,#64748b);font-size:12px;line-height:1.55}
@media(max-width:760px){.hd-finance-tabs{gap:5px}.hd-finance-tabs button,.hd-segmented button{padding:7px 10px;font-size:11px}.hd-filter-bar{align-items:stretch}.hd-segmented{width:100%}}

/* QR / barcode traceability cells shared by Product, Inventory, Purchase and Sale tables. */
.hd-tracking-cell{width:100%;min-width:178px;display:grid;grid-template-columns:42px minmax(0,1fr) 24px;align-items:center;gap:8px;padding:6px 7px;border:1px solid color-mix(in srgb,var(--erp-primary) 13%,#dbe4ee);border-radius:12px;background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--erp-primary) 3%,#fff));color:#0f172a;text-align:left;cursor:pointer;box-shadow:0 6px 14px rgba(15,23,42,.035);transition:.16s ease}.hd-tracking-cell:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--erp-primary) 28%,#cbd5e1);box-shadow:0 10px 22px rgba(15,23,42,.08)}.hd-tracking-cell.empty{cursor:default;grid-template-columns:34px minmax(0,1fr);min-width:145px;background:#f8fafc;color:#64748b}.hd-tracking-empty-icon,.hd-tracking-visual{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#fff;border:1px solid #e2e8f0;overflow:hidden;color:var(--erp-primary)}.hd-tracking-empty-icon{width:32px;height:32px}.hd-tracking-visual img{width:36px;height:36px;object-fit:contain}.hd-tracking-copy{display:block;min-width:0}.hd-tracking-copy strong{display:block;font-size:9.5px!important;color:#0f172a!important}.hd-tracking-copy small{display:block;max-width:135px;margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 7.8px ui-monospace,SFMono-Regular,Menlo,monospace;color:#64748b}.hd-tracking-badges{display:flex;flex-wrap:wrap;gap:3px;margin-top:4px}.hd-tracking-badges em{padding:2px 5px;border-radius:999px;font-size:6.8px;font-style:normal;font-weight:950;white-space:nowrap}.hd-tracking-badges .available{background:#ecfdf5;color:#047857}.hd-tracking-badges .sold{background:#eff6ff;color:#1d4ed8}.hd-tracking-badges .returned{background:#fffbeb;color:#b45309}.hd-tracking-open{width:22px;height:22px;display:grid;place-items:center;border-radius:7px;background:color-mix(in srgb,var(--erp-primary) 8%,#fff);color:var(--erp-primary)}.hd-tracking-modal-overlay{z-index:120000!important}.hd-tracking-modal{width:min(1120px,96vw)!important;max-height:94vh!important}.hd-tracking-summary-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:10px 0 14px}.hd-tracking-summary-grid>div{padding:10px;border:1px solid #e2e8f0;border-radius:12px;background:linear-gradient(145deg,#fff,#f8fafc)}.hd-tracking-summary-grid span{display:block;color:#64748b;font-size:7.5px;font-weight:950;text-transform:uppercase;letter-spacing:.05em}.hd-tracking-summary-grid strong{display:block;margin-top:3px;color:#0f172a;font-size:12px;font-weight:950}.hd-tracking-code-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:10px;max-height:42vh;overflow:auto;padding:2px}.hd-tracking-code-card{min-width:0;display:grid;place-items:center;gap:6px;padding:10px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}.hd-tracking-code-card>img{width:118px;height:118px;object-fit:contain}.hd-tracking-code-card code{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8px;color:#334155}.hd-tracking-code-type{justify-self:start;padding:3px 6px;border-radius:999px;background:color-mix(in srgb,var(--erp-primary) 8%,#fff);color:var(--erp-primary);font-size:7px;font-weight:1000}.hd-tracking-barcode{width:100%;min-height:66px;display:flex;align-items:center;overflow:hidden;border-radius:9px;border:1px solid #f1f5f9;background:#fff}.hd-tracking-unit-table-wrap{margin-top:13px;max-height:260px;overflow:auto;border:1px solid #e2e8f0;border-radius:13px}.hd-tracking-unit-table{width:100%;min-width:760px;border-collapse:collapse;font-size:9px}.hd-tracking-unit-table th{position:sticky;top:0;padding:8px;background:#f8fafc;color:#475569;text-align:left;font-size:7.5px;text-transform:uppercase;letter-spacing:.05em}.hd-tracking-unit-table td{padding:8px;border-top:1px solid #f1f5f9;color:#334155}.hd-tracking-unit-table code{font-size:8px}.hd-code-status{display:inline-flex;padding:3px 6px;border-radius:999px;background:#f1f5f9;color:#475569;font-size:7px;font-weight:900}.hd-code-status.in-stock,.hd-code-status.available,.hd-code-status.returned-restocked{background:#ecfdf5;color:#047857}.hd-code-status.sold,.hd-code-status.issued,.hd-code-status.delivered{background:#eff6ff;color:#1d4ed8}.hd-code-status.damaged,.hd-code-status.scrapped,.hd-code-status.expired{background:#fef2f2;color:#b91c1c}.hd-code-status.returned,.hd-code-status.inspection,.hd-code-status.hold{background:#fffbeb;color:#b45309}
@media(max-width:900px){.hd-tracking-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.hd-tracking-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hd-tracking-modal{width:100%!important}.hd-tracking-code-grid{grid-template-columns:1fr}.hd-tracking-cell{min-width:162px}}

/* HD Orchards Product, Inventory and Sales QR / barcode table cells. */
.hd-code-table-cell{min-width:210px}.hd-code-cell{width:100%;min-width:190px;display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:9px;padding:7px;border:1px solid color-mix(in srgb,var(--erp-primary,#075c36) 14%,#dbe4ee);border-radius:13px;background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--erp-primary,#075c36) 3%,#fff));color:var(--erp-text,#0f172a);text-align:left;cursor:pointer;box-shadow:0 7px 18px rgba(15,23,42,.045);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.hd-code-cell:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--erp-primary,#075c36) 30%,#cbd5e1);box-shadow:0 11px 25px rgba(15,23,42,.085)}.hd-code-cell-visual{width:42px;height:42px;display:grid;place-items:center;overflow:hidden;border:1px solid #e2e8f0;border-radius:11px;background:#fff;color:var(--erp-primary,#075c36)}.hd-code-cell-visual img{width:39px;height:39px;object-fit:contain}.hd-code-cell-copy{display:block;min-width:0}.hd-code-cell-copy strong,.hd-code-cell-copy small,.hd-code-cell-copy em{display:block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hd-code-cell-copy strong{font:900 9.5px ui-monospace,SFMono-Regular,Menlo,monospace;color:#0f172a}.hd-code-cell-copy small{margin-top:2px;font-size:7.8px;font-weight:750;color:#64748b}.hd-code-cell-copy em{margin-top:3px;font-size:7.2px;font-style:normal;font-weight:950;color:var(--erp-primary,#075c36);text-transform:uppercase;letter-spacing:.04em}.hd-code-empty{display:inline-flex;align-items:center;min-height:30px;padding:5px 8px;border:1px dashed #cbd5e1;border-radius:9px;background:#f8fafc;color:#64748b;font-size:8.5px;font-weight:800}.hd-code-details-modal{width:min(1120px,96vw)!important;max-height:94vh!important}.hd-code-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;padding:0 16px 12px}.hd-code-summary-grid>div{padding:11px;border:1px solid #e2e8f0;border-radius:13px;background:linear-gradient(145deg,#fff,#f8fafc)}.hd-code-summary-grid span{display:block;font-size:7.5px;font-weight:950;letter-spacing:.055em;text-transform:uppercase;color:#64748b}.hd-code-summary-grid strong{display:block;margin-top:3px;font-size:16px;font-weight:950;color:#0f172a}.hd-code-details-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));gap:10px;max-height:54vh;overflow:auto;padding:2px 16px 14px}.hd-code-detail-card{min-width:0;display:grid;grid-template-columns:105px minmax(0,1fr);gap:10px;align-items:center;padding:10px;border:1px solid #e2e8f0;border-radius:15px;background:#fff;box-shadow:0 8px 20px rgba(15,23,42,.04)}.hd-code-visuals{min-width:0;display:grid;place-items:center;gap:5px}.hd-code-visuals>img{width:96px;height:96px;object-fit:contain;border:1px solid #f1f5f9;border-radius:9px;background:#fff}.hd-code-placeholder{width:96px;height:96px;display:grid;place-items:center;border:1px dashed #cbd5e1;border-radius:10px;background:#f8fafc;color:#94a3b8}.hd-code-barcode{width:100%;overflow:hidden;border:1px solid #f1f5f9;border-radius:8px;background:#fff}.hd-code-detail-copy{display:block;min-width:0}.hd-code-detail-copy strong,.hd-code-detail-copy span,.hd-code-detail-copy small{display:block;overflow:hidden;text-overflow:ellipsis}.hd-code-detail-copy strong{font:900 10px ui-monospace,SFMono-Regular,Menlo,monospace;color:#0f172a}.hd-code-detail-copy span{margin-top:4px;font-size:10px;font-weight:900;color:#334155}.hd-code-detail-copy small{margin-top:4px;font-size:8px;font-weight:700;line-height:1.45;color:#64748b}

/* Structured Retail / Wholesale product lines and exact serialized code selection. */
.hd-line-items-field{max-width:none!important}.hd-line-items-editor{display:grid;gap:10px;width:100%;padding:10px;border:1px solid color-mix(in srgb,var(--erp-primary,#075c36) 13%,#dbe4ee);border-radius:17px;background:linear-gradient(145deg,color-mix(in srgb,var(--erp-primary,#075c36) 2.5%,#fff),#fff);box-shadow:0 10px 25px rgba(15,23,42,.04)}.hd-line-items-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 2px 8px;border-bottom:1px solid #edf2f7}.hd-line-items-head strong,.hd-line-items-head span{display:block}.hd-line-items-head strong{font-size:11px;color:#0f172a}.hd-line-items-head span{margin-top:2px;font-size:8.5px;line-height:1.45;color:#64748b}.hd-line-items-loading{padding:9px 10px;border-radius:11px;background:#eff6ff;color:#1d4ed8;font-size:9px;font-weight:800}.hd-line-items-list{display:grid;gap:10px}.hd-line-item-card{display:grid;gap:9px;padding:11px;border:1px solid #e2e8f0;border-radius:15px;background:#fff;box-shadow:0 8px 18px rgba(15,23,42,.035)}.hd-line-item-title{display:grid;grid-template-columns:29px minmax(0,1fr) auto;align-items:center;gap:8px}.hd-line-item-title>span{width:29px;height:29px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(135deg,var(--erp-primary,#075c36),var(--erp-secondary,#2e9f44));color:#fff;font-size:9px;font-weight:950}.hd-line-item-title strong,.hd-line-item-title small{display:block}.hd-line-item-title strong{font-size:10px;color:#0f172a}.hd-line-item-title small{margin-top:1px;font-size:7.8px;color:#64748b}.hd-line-item-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.hd-line-item-grid label{display:grid;gap:4px;min-width:0}.hd-line-item-grid label.wide{grid-column:span 2}.hd-line-item-grid label>span{font-size:7.8px;font-weight:900;color:#475569}.hd-line-item-grid input,.hd-line-item-grid select{width:100%;min-width:0;min-height:39px;padding:8px 9px;border:1px solid #dbe4ee;border-radius:10px;background:#fff;color:#0f172a;font:inherit;font-size:9px;outline:none}.hd-line-item-grid input:focus,.hd-line-item-grid select:focus,.hd-line-code-entry input:focus{border-color:var(--erp-primary,#075c36);box-shadow:0 0 0 3px color-mix(in srgb,var(--erp-primary,#075c36) 8%,transparent)}.hd-line-stock-strip{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:7px 8px;border-radius:10px;background:#f8fafc;border:1px solid #eef2f7}.hd-line-stock-strip span{font-size:7.8px;color:#64748b}.hd-line-stock-strip b{color:#0f172a}.hd-line-stock-strip em{padding:3px 6px;border-radius:999px;background:#fef2f2;color:#b91c1c;font-size:7px;font-style:normal;font-weight:950}.hd-line-code-picker{display:grid;gap:8px;padding:9px;border:1px solid color-mix(in srgb,var(--erp-primary,#075c36) 12%,#e2e8f0);border-radius:13px;background:linear-gradient(145deg,color-mix(in srgb,var(--erp-primary,#075c36) 3%,#fff),#fff)}.hd-line-code-picker-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.hd-line-code-picker-head strong,.hd-line-code-picker-head span{display:block}.hd-line-code-picker-head strong{font-size:9px;color:#0f172a}.hd-line-code-picker-head span{margin-top:2px;font-size:7.8px;line-height:1.4;color:#64748b}.hd-line-code-picker-head>small{padding:3px 6px;border-radius:999px;background:#ecfdf5;color:#047857;font-size:7px;font-weight:950;white-space:nowrap}.hd-line-code-entry{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.hd-line-code-entry input{width:100%;min-width:0;min-height:39px;padding:8px 9px;border:1px solid #dbe4ee;border-radius:10px;background:#fff;font:inherit;font-size:9px;outline:none}.hd-selected-code-chips{display:flex;flex-wrap:wrap;gap:5px}.hd-selected-code-chips button{display:inline-flex;align-items:center;gap:4px;max-width:220px;padding:5px 7px;border:1px solid #dbeafe;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:7.5px;font-weight:850;cursor:pointer}.hd-selected-code-chips button b{font-size:10px}.hd-code-requirement{padding:7px 8px;border-radius:9px;background:#f8fafc;color:#64748b;font-size:8px;font-weight:800}.hd-code-requirement.required{background:#fff7ed;color:#c2410c}.hd-line-item-total{display:flex;align-items:center;justify-content:flex-end;gap:8px}.hd-line-item-total span{font-size:8px;color:#64748b}.hd-line-item-total strong{font-size:12px;color:#0f172a}.hd-line-items-totals{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;padding-top:2px}.hd-line-items-totals>span{padding:6px 8px;border:1px solid #e2e8f0;border-radius:9px;background:#fff;color:#64748b;font-size:7.7px}.hd-line-items-totals b{color:#0f172a}.hd-line-items-totals .grand{background:linear-gradient(135deg,var(--erp-primary,#075c36),var(--erp-secondary,#2e9f44));border-color:transparent;color:#fff}.hd-line-items-totals .grand b{color:#fff}

.hd-table-pagination{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-top:1px solid #eef2f7;background:#fff;color:#64748b;font-size:8.5px;font-weight:800}.hd-table-pagination>div{display:flex;align-items:center;gap:7px}.hd-table-pagination button{min-height:31px;padding:6px 9px;border:1px solid #dbe4ee;border-radius:9px;background:#fff;color:#334155;font:inherit;font-size:8px;font-weight:900;cursor:pointer}.hd-table-pagination button:disabled{opacity:.45;cursor:not-allowed}.hd-table-pagination b{color:#0f172a}

@media(max-width:900px){.hd-line-item-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hd-code-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.hd-code-table-cell{min-width:180px}.hd-code-cell{min-width:165px}.hd-code-cell-copy strong,.hd-code-cell-copy small,.hd-code-cell-copy em{max-width:115px}.hd-code-summary-grid{grid-template-columns:1fr 1fr;padding-inline:10px}.hd-code-details-list{grid-template-columns:1fr;padding-inline:10px}.hd-code-detail-card{grid-template-columns:90px minmax(0,1fr)}.hd-code-visuals>img,.hd-code-placeholder{width:82px;height:82px}.hd-line-items-head{align-items:stretch;flex-direction:column}.hd-line-items-head .hd-btn{align-self:flex-start}.hd-line-item-grid{grid-template-columns:1fr}.hd-line-item-grid label.wide{grid-column:auto}.hd-line-code-entry{grid-template-columns:1fr}.hd-line-code-entry .hd-btn{justify-content:center}.hd-line-items-totals{justify-content:stretch}.hd-line-items-totals>span{flex:1 1 calc(50% - 6px)}.hd-table-pagination{align-items:stretch;flex-direction:column}.hd-table-pagination>div{justify-content:space-between}}

/* Dedicated QR Product Control Center responsive layout. */
.hd-qr-control-page{min-width:0}.hd-qr-tabs{display:flex;align-items:center;gap:7px;overflow-x:auto;padding:7px;margin:0 0 12px;border:1px solid var(--erp-border,rgba(148,163,184,.2));border-radius:15px;background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.05);scrollbar-width:thin}.hd-qr-tabs button{flex:0 0 auto;min-height:34px;padding:7px 11px;border:1px solid transparent;border-radius:10px;background:transparent;color:#64748b;font:inherit;font-size:8.8px;font-weight:900;cursor:pointer}.hd-qr-tabs button.active{border-color:transparent;background:linear-gradient(135deg,var(--erp-primary,#075c36),var(--erp-secondary,#2e9f44));color:#fff;box-shadow:0 7px 16px color-mix(in srgb,var(--erp-primary,#075c36) 22%,transparent)}.hd-qr-panel-head{display:grid;grid-template-columns:minmax(240px,1fr) auto auto;align-items:center;gap:10px;margin-bottom:10px}.hd-qr-panel-head>div:nth-child(2){display:flex;align-items:baseline;gap:4px;color:#64748b;font-size:8px}.hd-qr-panel-head>div:nth-child(2) strong{font-size:15px;color:#0f172a}.hd-qr-panel-actions{display:flex;gap:6px;flex-wrap:wrap}.hd-qr-inventory-code{width:130px;display:grid;grid-template-columns:45px minmax(0,1fr);gap:5px;align-items:center}.hd-qr-inventory-code>img{width:43px;height:43px;object-fit:contain;border:1px solid #e2e8f0;border-radius:8px;background:#fff}.hd-qr-inventory-code>div{min-width:0;overflow:hidden}.hd-table-subtext{display:block;margin-top:2px;font-size:7px;color:#64748b}.hd-qr-form-panel{display:grid;gap:11px;max-width:1120px}.hd-qr-scan-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.hd-qr-responsive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.hd-qr-responsive-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.hd-qr-verified-code{display:grid;grid-template-columns:190px minmax(0,1fr);gap:16px;align-items:center;padding:14px;border:1px solid #bbf7d0;border-radius:16px;background:linear-gradient(145deg,#ecfdf5,#fff)}.hd-qr-verified-code>div:first-child{display:grid;place-items:center;gap:7px;min-width:0}.hd-qr-verified-code img{width:155px;height:155px;object-fit:contain;border:1px solid #d1fae5;border-radius:12px;background:#fff}.hd-qr-visible-barcode{width:100%;overflow:hidden;border:1px solid #d1fae5;border-radius:9px;background:#fff}.hd-qr-verified-code h2{margin:0 0 7px;font-size:16px;color:#166534}.hd-qr-verified-code strong,.hd-qr-verified-code span{display:block}.hd-qr-verified-code strong{font-size:12px;color:#0f172a}.hd-qr-verified-code span{margin-top:4px;font-size:9px;color:#475569}.hd-qr-report-stack{display:grid;gap:12px}.hd-qr-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.hd-qr-stat-grid>div{padding:13px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;box-shadow:0 8px 20px rgba(15,23,42,.04)}.hd-qr-stat-grid span,.hd-qr-stat-grid strong{display:block}.hd-qr-stat-grid span{font-size:7.5px;font-weight:950;letter-spacing:.05em;text-transform:uppercase;color:#64748b}.hd-qr-stat-grid strong{margin-top:3px;font-size:22px;color:#0f172a}.hd-report-code-list{display:flex;align-items:center;gap:4px;flex-wrap:wrap;max-width:360px}.hd-report-code-list code{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:3px 5px;border-radius:6px;background:#f1f5f9;color:#334155;font-size:7.5px}.hd-report-code-list span{padding:3px 5px;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:7px;font-weight:900}
@media(max-width:900px){.hd-qr-panel-head{grid-template-columns:1fr auto}.hd-qr-panel-actions{grid-column:1/-1}.hd-qr-responsive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hd-qr-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.hd-qr-panel-head{grid-template-columns:1fr}.hd-qr-panel-head>div:nth-child(2){justify-content:flex-start}.hd-qr-panel-actions{grid-column:auto}.hd-qr-panel-actions .hd-btn{flex:1}.hd-qr-scan-row{grid-template-columns:1fr}.hd-qr-responsive-grid,.hd-qr-responsive-grid.two{grid-template-columns:1fr}.hd-qr-verified-code{grid-template-columns:1fr}.hd-qr-stat-grid{grid-template-columns:1fr 1fr}.hd-qr-inventory-code{width:110px;grid-template-columns:42px minmax(0,1fr)}}


/* Linked QR Product Control records shown inside Retail / Wholesale tables. */
.hd-linked-readonly-row {
  background: linear-gradient(90deg, rgba(14, 165, 233, .045), rgba(255,255,255,0));
}
.hd-linked-readonly-row:hover {
  background: linear-gradient(90deg, rgba(14, 165, 233, .085), rgba(255,255,255,.82));
}
.hd-linked-source-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 6px;
  padding: 3px 7px;
  border: 1px solid rgba(2,132,199,.18);
  border-radius: 999px;
  background: rgba(224,242,254,.78);
  color: #0369a1;
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .02em;
  white-space: nowrap;
}

/* ========================================================================== */
/* FINAL COLD STORAGE PARITY + COMPACT HD FORMS                               */
/* ========================================================================== */
/*
 * Every HD page is rendered inside MainLayout, exactly like Cold Storage.
 * These final rules align HD-only page primitives with the established Cold
 * Storage dimensions while avoiding document-wide observers or layout scans.
 */
.ml-app-shell .hd-modern-workspace,
.ml-app-shell .hd-mixed-workspace {
  width: 100%;
  max-width: 1600px;
  min-width: 0;
  margin: 0 auto;
  box-sizing: border-box;
}

.ml-app-shell .hd-modern-workspace .hd-module-page,
.ml-app-shell .hd-modern-workspace .hd-dashboard,
.ml-app-shell .hd-modern-workspace .hd-finance-page,
.ml-app-shell .hd-modern-workspace .hd-reports-page,
.ml-app-shell .hd-modern-workspace .hd-settings-page,
.ml-app-shell .hd-modern-workspace .hd-qr-control-page {
  width: 100%;
  max-width: 1600px;
  min-width: 0;
  margin: 0 auto;
  box-sizing: border-box;
}

/* Match the Cold Storage internal-page hero proportions. */
.ml-app-shell .hd-modern-workspace .hd-page-hero,
.ml-app-shell .hd-modern-workspace .hd-dashboard-hero {
  min-height: 116px;
  padding: 24px 26px !important;
  margin: 0 0 18px !important;
  border-radius: 26px !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 92% -35%, rgba(255,255,255,.17), transparent 38%),
    linear-gradient(135deg, var(--erp-primary-deep, var(--erp-primary)) 0%, var(--erp-primary) 52%, var(--erp-secondary) 100%) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  box-shadow: 0 24px 58px rgba(var(--erp-primary-rgb),.25) !important;
  box-sizing: border-box;
}
.ml-app-shell .hd-modern-workspace .hd-page-hero::after,
.ml-app-shell .hd-modern-workspace .hd-dashboard-hero::after {
  width: 280px !important;
  height: 280px !important;
  right: -86px !important;
  top: -164px !important;
  background: rgba(255,255,255,.075) !important;
}
.ml-app-shell .hd-modern-workspace .hd-page-icon {
  width: 52px !important;
  height: 52px !important;
  flex-basis: 52px !important;
  border-radius: 16px !important;
  color: #fff !important;
  background: rgba(255,255,255,.14) !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  box-shadow: 0 10px 24px rgba(15,23,42,.13), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.ml-app-shell .hd-modern-workspace .hd-page-copy h1,
.ml-app-shell .hd-modern-workspace .hd-dashboard-hero h1 {
  margin-top: 7px !important;
  color: #fff !important;
  font-size: clamp(24px,2.45vw,30px) !important;
  font-weight: 900 !important;
  letter-spacing: -.025em !important;
}
.ml-app-shell .hd-modern-workspace .hd-page-copy p,
.ml-app-shell .hd-modern-workspace .hd-dashboard-hero p {
  max-width: 760px !important;
  margin-top: 7px !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
  opacity: 1 !important;
}
.ml-app-shell .hd-modern-workspace .hd-eyebrow {
  display: inline-flex !important;
  align-items: center;
  min-height: 26px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  color: #fff !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  letter-spacing: .11em !important;
  opacity: 1 !important;
}
.ml-app-shell .hd-modern-workspace .hd-page-hero .hd-btn.primary,
.ml-app-shell .hd-modern-workspace .hd-dashboard-hero .hd-btn.primary {
  min-height: 41px !important;
  padding-inline: 16px !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.97) !important;
  color: var(--erp-primary-deep, var(--erp-primary)) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.14) !important;
}
.ml-app-shell .hd-modern-workspace .hd-page-hero .hd-btn.secondary,
.ml-app-shell .hd-modern-workspace .hd-dashboard-hero .hd-btn.secondary {
  min-height: 41px !important;
  padding-inline: 15px !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.14) !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  color: #fff !important;
}

/* Same card/table geometry and density as Cold Storage pages. */
.ml-app-shell .hd-modern-workspace .hd-panel,
.ml-app-shell .hd-modern-workspace .hd-table-card,
.ml-app-shell .hd-modern-workspace .hd-report-card,
.ml-app-shell .hd-modern-workspace .hd-settings-form,
.ml-app-shell .hd-modern-workspace .hd-stat-card,
.ml-app-shell .hd-modern-workspace .hd-recent-panel,
.ml-app-shell .hd-modern-workspace .hd-quick-panel {
  border-radius: 22px !important;
  border: 1px solid rgba(255,255,255,.78) !important;
  background: linear-gradient(150deg,rgba(255,255,255,.96),rgba(255,255,255,.82)) !important;
  box-shadow: 0 18px 44px rgba(15,23,42,.09), inset 0 1px 0 rgba(255,255,255,.78) !important;
  backdrop-filter: blur(12px) saturate(135%);
  -webkit-backdrop-filter: blur(12px) saturate(135%);
}
.ml-app-shell .hd-modern-workspace .hd-toolbar {
  min-height: 58px;
  margin: 0 0 14px !important;
  padding: 10px 12px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.82) !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: 0 12px 30px rgba(15,23,42,.065) !important;
}
.ml-app-shell .hd-modern-workspace .hd-table-card {
  width: 100%;
  min-width: 0;
  overflow: hidden !important;
}
.ml-app-shell .hd-modern-workspace .hd-table-scroll {
  width: 100%;
  max-width: 100%;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-inline: contain;
}
.ml-app-shell .hd-modern-workspace .hd-data-table thead th {
  height: 44px;
  padding: 11px 12px !important;
  background: linear-gradient(135deg,var(--erp-primary-deep,var(--erp-primary)),var(--erp-primary) 56%,var(--erp-secondary)) !important;
}
.ml-app-shell .hd-modern-workspace .hd-data-table tbody td {
  padding: 11px 12px !important;
  font-size: 11px !important;
}

/* Compact, internally scrolling form modal. */
.ml-app-shell .hd-modern-workspace .hd-form-modal {
  display: grid !important;
  grid-template-rows: auto minmax(0,1fr) auto !important;
  width: min(1120px,calc(100vw - 28px)) !important;
  max-height: calc(100dvh - 28px) !important;
  overflow: hidden !important;
}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-modal-head {
  position: relative !important;
  top: auto !important;
}
.ml-app-shell .hd-modern-workspace .hd-form-body {
  min-height: 0;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain;
  padding: 14px 16px !important;
  gap: 10px !important;
}
.ml-app-shell .hd-modern-workspace .hd-modal-actions {
  position: relative !important;
  bottom: auto !important;
  z-index: 2;
  min-height: 62px;
  align-items: center;
  padding: 11px 16px !important;
  background: rgba(255,255,255,.98) !important;
  border-top: 1px solid rgba(var(--erp-primary-rgb),.10) !important;
  box-shadow: 0 -10px 28px rgba(15,23,42,.055) !important;
}
.ml-app-shell .hd-modern-workspace .hd-form-section {
  padding: 0 !important;
  overflow: hidden;
  border-radius: 17px !important;
  background: rgba(255,255,255,.94) !important;
  border: 1px solid rgba(var(--erp-primary-rgb),.10) !important;
  box-shadow: 0 9px 24px rgba(15,23,42,.045) !important;
}
.ml-app-shell .hd-modern-workspace .hd-form-section-toggle {
  width: 100%;
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 0;
  background: linear-gradient(145deg,rgba(var(--erp-primary-rgb),.045),rgba(255,255,255,.98));
  color: #0f172a;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.ml-app-shell .hd-modern-workspace .hd-form-section-toggle[aria-disabled="true"] {
  cursor: default;
}
.ml-app-shell .hd-modern-workspace .hd-form-section-toggle:hover {
  background: linear-gradient(145deg,rgba(var(--erp-primary-rgb),.075),rgba(255,255,255,.98));
}
.ml-app-shell .hd-modern-workspace .hd-form-section-toggle .hd-form-section-head {
  min-width: 0;
  flex: 1;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.ml-app-shell .hd-modern-workspace .hd-form-section-toggle .hd-form-section-head > span:last-child {
  min-width: 0;
}
.ml-app-shell .hd-modern-workspace .hd-form-section-state {
  flex: 0 0 auto;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(var(--erp-primary-rgb),.075);
  color: var(--erp-primary);
  font-size: 7.5px;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.ml-app-shell .hd-modern-workspace .hd-form-section.is-expanded .hd-form-section-state {
  background: linear-gradient(135deg,var(--erp-primary),var(--erp-secondary));
  color: #fff;
}
.ml-app-shell .hd-modern-workspace .hd-form-section .hd-form-grid {
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 9px 10px !important;
  padding: 12px !important;
  border-top: 1px solid rgba(var(--erp-primary-rgb),.07);
}
.ml-app-shell .hd-modern-workspace .hd-form-section-collapsed {
  padding: 8px 12px 10px;
  border-top: 1px solid rgba(var(--erp-primary-rgb),.055);
  color: #7c8799;
  font-size: 8.5px;
  font-weight: 700;
  line-height: 1.45;
}
.ml-app-shell .hd-modern-workspace .hd-field textarea {
  min-height: 66px !important;
  max-height: 180px;
}

/* Avoid GPU-heavy blur on very large, frequently updated table surfaces. */
.ml-app-shell .hd-modern-workspace .hd-table-card,
.ml-app-shell .hd-modern-workspace .hd-data-table,
.ml-app-shell .hd-modern-workspace .hd-detail-sections {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

@media (max-width: 1180px) {
  .ml-app-shell .hd-modern-workspace .hd-form-section .hd-form-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width: 760px) {
  .ml-app-shell .hd-modern-workspace .hd-page-hero,
  .ml-app-shell .hd-modern-workspace .hd-dashboard-hero {
    min-height: 0;
    padding: 18px !important;
    border-radius: 22px !important;
    align-items: flex-start !important;
    flex-wrap: wrap;
  }
  .ml-app-shell .hd-modern-workspace .hd-page-copy h1,
  .ml-app-shell .hd-modern-workspace .hd-dashboard-hero h1 {
    font-size: 24px !important;
  }
  .ml-app-shell .hd-modern-workspace .hd-page-actions,
  .ml-app-shell .hd-modern-workspace .hd-dashboard-actions {
    width: 100%;
    justify-content: stretch !important;
  }
  .ml-app-shell .hd-modern-workspace .hd-page-actions .hd-btn,
  .ml-app-shell .hd-modern-workspace .hd-dashboard-actions .hd-btn {
    flex: 1 1 140px;
  }
  .ml-app-shell .hd-modern-workspace .hd-form-section .hd-form-grid {
    grid-template-columns: 1fr !important;
  }
  .ml-app-shell .hd-modern-workspace .hd-form-modal {
    width: calc(100vw - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
  }
  .ml-app-shell .hd-modern-workspace .hd-form-section-toggle {
    align-items: flex-start;
  }
}

/* --------------------------------------------------------------------------
   Final modal symmetry and visibility fix
   - header, section title and fields have separate layout rows
   - form body owns scrolling
   - reference/dropdown menus are never clipped by section cards
   -------------------------------------------------------------------------- */
#root .hd-modern-workspace .hd-form-modal{
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  width:min(1160px,calc(100vw - 28px))!important;
  max-height:calc(100dvh - 28px)!important;
  overflow:hidden!important;
  isolation:isolate;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-modal-head{
  position:relative!important;
  top:auto!important;
  min-height:76px;
  padding:14px 16px!important;
  align-items:center!important;
  background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(var(--erp-primary-rgb),.035))!important;
  border-bottom:1px solid rgba(var(--erp-primary-rgb),.11)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#root .hd-modern-workspace .hd-modal-title-layout{
  min-width:0;
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  align-items:center;
  gap:11px;
}
#root .hd-modern-workspace .hd-modal-title-icon{
  width:46px;
  height:46px;
  border-radius:14px;
  display:grid;
  place-items:center;
  color:#fff;
  background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary));
  box-shadow:0 10px 22px rgba(var(--erp-primary-rgb),.18),inset 0 1px 0 rgba(255,255,255,.35);
}
#root .hd-modern-workspace .hd-modal-title-icon .hd-icon{color:#fff!important}
#root .hd-modern-workspace .hd-modal-title-layout>div{min-width:0}
#root .hd-modern-workspace .hd-modal-title-layout h2{margin:2px 0 0!important;line-height:1.15!important}
#root .hd-modern-workspace .hd-modal-title-layout p{margin:4px 0 0!important;line-height:1.42!important;white-space:normal!important}
#root .hd-modern-workspace .hd-form-body{
  min-height:0!important;
  display:grid!important;
  align-content:start!important;
  gap:11px!important;
  padding:13px 15px 16px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable;
  background:linear-gradient(180deg,rgba(248,250,252,.96),rgba(255,255,255,.99));
}
#root .hd-modern-workspace .hd-form-reference-strip{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-width:0;
  padding:9px 11px;
  border:1px solid rgba(var(--erp-primary-rgb),.11);
  border-radius:13px;
  background:#fff;
  box-shadow:0 6px 16px rgba(15,23,42,.035);
}
#root .hd-modern-workspace .hd-form-reference-strip>strong{
  color:#475569;
  font-size:8px;
  font-weight:950;
  letter-spacing:.07em;
  text-transform:uppercase;
}
#root .hd-modern-workspace .hd-form-reference-strip>div{min-width:0;display:flex;align-items:center;gap:5px;flex-wrap:wrap}
#root .hd-modern-workspace .hd-form-reference-strip span{
  max-width:230px;
  padding:4px 7px;
  border:1px solid rgba(var(--erp-primary-rgb),.12);
  border-radius:999px;
  background:rgba(var(--erp-primary-rgb),.045);
  color:var(--erp-primary);
  font-size:8px;
  font-weight:850;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-section{
  position:relative;
  z-index:1;
  min-width:0;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  border:1px solid rgba(var(--erp-primary-rgb),.105)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 8px 22px rgba(15,23,42,.04)!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-section:focus-within{
  z-index:20;
  border-color:rgba(var(--erp-primary-rgb),.22)!important;
  box-shadow:0 11px 26px rgba(15,23,42,.065)!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-section-toggle{
  position:relative;
  z-index:1;
  width:100%;
  min-height:62px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:10px 12px!important;
  border:0!important;
  border-radius:15px!important;
  background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.05),rgba(255,255,255,.99))!important;
  color:#0f172a!important;
  font:inherit!important;
  text-align:left!important;
  cursor:pointer!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-section.is-expanded .hd-form-section-toggle{
  border-radius:15px 15px 0 0!important;
  border-bottom:1px solid rgba(var(--erp-primary-rgb),.085)!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-section-toggle[aria-disabled="true"]{cursor:default!important}
#root .hd-modern-workspace .hd-form-modal .hd-form-section-toggle:hover{
  background:linear-gradient(145deg,rgba(var(--erp-primary-rgb),.075),rgba(255,255,255,.99))!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-section-head{
  min-width:0!important;
  flex:1 1 auto!important;
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  align-items:center!important;
  gap:9px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-section-head .hd-section-icon{
  width:38px!important;
  height:38px!important;
  flex-basis:38px!important;
  border-radius:11px!important;
}
#root .hd-modern-workspace .hd-form-section-copy{min-width:0!important;display:block!important}
#root .hd-modern-workspace .hd-form-section-copy h3{
  margin:0!important;
  color:#0f172a!important;
  font-size:11.5px!important;
  font-weight:950!important;
  line-height:1.22!important;
}
#root .hd-modern-workspace .hd-form-section-copy p{
  margin:3px 0 0!important;
  color:#64748b!important;
  font-size:8.2px!important;
  font-weight:650!important;
  line-height:1.38!important;
  white-space:normal!important;
}
#root .hd-modern-workspace .hd-form-section-state{
  flex:0 0 auto!important;
  min-width:58px;
  padding:5px 8px!important;
  border-radius:999px!important;
  text-align:center;
  background:#f1f5f9!important;
  color:#64748b!important;
  font-size:7px!important;
  font-weight:950!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
}
#root .hd-modern-workspace .hd-form-section-state.required{
  background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary))!important;
  color:#fff!important;
}
#root .hd-modern-workspace .hd-form-section-state.optional{
  border:1px solid rgba(var(--erp-primary-rgb),.08)!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-section .hd-form-grid{
  position:relative;
  z-index:2;
  min-width:0;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:start!important;
  gap:11px 12px!important;
  margin:0!important;
  padding:13px!important;
  overflow:visible!important;
  border:0!important;
  background:#fff!important;
  border-radius:0 0 15px 15px!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-field{
  position:relative;
  z-index:1;
  min-width:0!important;
  width:100%;
  display:grid!important;
  align-content:start!important;
  gap:5px!important;
  margin:0!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-field:focus-within{z-index:50}
#root .hd-modern-workspace .hd-form-modal .hd-field.wide{grid-column:1/-1!important}
#root .hd-modern-workspace .hd-form-modal .hd-field input,
#root .hd-modern-workspace .hd-form-modal .hd-field select,
#root .hd-modern-workspace .hd-form-modal .hd-field textarea{
  position:relative!important;
  z-index:1!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  min-width:0!important;
  min-height:41px!important;
  margin:0!important;
  border:1px solid #d8e1ea!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#0f172a!important;
  box-shadow:0 3px 10px rgba(15,23,42,.025)!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-field textarea{min-height:64px!important;max-height:170px!important}
#root .hd-modern-workspace .hd-form-modal .hd-reference-input-wrap,
#root .hd-modern-workspace .hd-form-modal .hd-dynamic-select-row,
#root .hd-modern-workspace .hd-form-modal .hd-inline-add,
#root .hd-modern-workspace .hd-form-modal .hd-check-control,
#root .hd-modern-workspace .hd-form-modal .hd-auto-number{
  position:relative!important;
  z-index:1!important;
  min-width:0!important;
  visibility:visible!important;
  opacity:1!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-reference-menu,
#root .hd-modern-workspace .hd-form-modal .hd-dynamic-select-menu{
  z-index:2147483200!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-form-section-collapsed{
  min-height:34px;
  padding:8px 12px 10px!important;
  border-top:1px solid rgba(var(--erp-primary-rgb),.055)!important;
  border-radius:0 0 15px 15px;
  background:#fff;
  color:#7c8799!important;
  font-size:8px!important;
  line-height:1.4!important;
}
#root .hd-modern-workspace .hd-form-modal .hd-modal-actions{
  position:relative!important;
  bottom:auto!important;
  z-index:3!important;
  min-height:62px!important;
  padding:10px 15px!important;
  background:#fff!important;
  border-top:1px solid rgba(var(--erp-primary-rgb),.10)!important;
  box-shadow:0 -8px 22px rgba(15,23,42,.045)!important;
}
@media(max-width:1180px){
  #root .hd-modern-workspace .hd-form-modal .hd-form-section .hd-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:760px){
  #root .hd-modern-workspace .hd-form-modal{width:calc(100vw - 12px)!important;max-height:calc(100dvh - 12px)!important}
  #root .hd-modern-workspace .hd-form-modal .hd-form-modal-head{min-height:68px;padding:11px 12px!important}
  #root .hd-modern-workspace .hd-modal-title-layout{grid-template-columns:40px minmax(0,1fr);gap:8px}
  #root .hd-modern-workspace .hd-modal-title-icon{width:40px;height:40px;border-radius:12px}
  #root .hd-modern-workspace .hd-form-body{padding:9px!important;gap:8px!important}
  #root .hd-modern-workspace .hd-form-modal .hd-form-section .hd-form-grid{grid-template-columns:1fr!important;padding:10px!important}
  #root .hd-modern-workspace .hd-form-modal .hd-form-section-toggle{align-items:flex-start!important;padding:9px 10px!important}
  #root .hd-modern-workspace .hd-form-reference-strip{grid-template-columns:1fr;gap:5px}
}

/* ========================================================================== */
/* 2026-08-25 FINAL HD FORM MODAL REPAIR                                      */
/* Stable section geometry: no clipped inputs, no title overlap, no hidden    */
/* field remnants. Cold Storage remains the shared visual reference.           */
/* ========================================================================== */
.ml-app-shell .hd-modern-workspace .hd-form-modal{
  width:min(1180px,calc(100vw - 30px))!important;
  max-height:calc(100dvh - 30px)!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  overflow:hidden!important;
  border-radius:22px!important;
  background:#f8fafc!important;
}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-modal-head{
  position:relative!important;
  top:auto!important;
  min-height:78px;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  padding:14px 16px!important;
  overflow:visible!important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--erp-primary) 7%,#fff),color-mix(in srgb,var(--erp-secondary) 4%,#fff),#fff)!important;
  border-bottom:1px solid color-mix(in srgb,var(--erp-primary) 11%,#e2e8f0)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-modal-head::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:14px!important;
  bottom:14px!important;
  width:5px!important;
  border-radius:0 999px 999px 0!important;
  background:linear-gradient(180deg,var(--erp-primary),var(--erp-secondary))!important;
}
.ml-app-shell .hd-modern-workspace .hd-form-modal-title{display:flex;align-items:center;gap:11px;min-width:0;flex:1}
.ml-app-shell .hd-modern-workspace .hd-form-title-icon{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,var(--erp-primary),var(--erp-secondary));color:#fff;box-shadow:0 10px 22px rgba(var(--erp-primary-rgb),.18)}
.ml-app-shell .hd-modern-workspace .hd-form-title-icon .hd-icon{color:#fff!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal-title>div{min-width:0}
.ml-app-shell .hd-modern-workspace .hd-form-modal-title .hd-eyebrow{display:block;color:var(--erp-primary)!important;font-size:7.5px!important;font-weight:1000!important;letter-spacing:.12em!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal-title h2{margin:2px 0 0!important;color:#0f172a!important;font-size:18px!important;font-weight:1000!important;line-height:1.18!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal-title p{margin:4px 0 0!important;max-width:780px;color:#64748b!important;font-size:9px!important;font-weight:700!important;line-height:1.42!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-modal-close{flex:0 0 38px;width:38px;height:38px;border-radius:12px;background:#fff!important;border:1px solid #dbe4ee!important;box-shadow:0 7px 17px rgba(15,23,42,.055)}

.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-body{
  min-height:0!important;
  display:grid!important;
  align-content:start!important;
  gap:10px!important;
  padding:12px 14px 14px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  background:linear-gradient(180deg,#f8fafc,#f4f7fa)!important;
}
.ml-app-shell .hd-modern-workspace .hd-form-reference-strip{display:flex;align-items:center;gap:9px;min-width:0;padding:8px 10px;border:1px solid color-mix(in srgb,var(--erp-primary) 10%,#e2e8f0);border-radius:13px;background:#fff;box-shadow:0 5px 14px rgba(15,23,42,.035)}
.ml-app-shell .hd-modern-workspace .hd-form-reference-strip>span{flex:0 0 auto;color:#64748b;font-size:7.5px;font-weight:1000;letter-spacing:.06em;text-transform:uppercase}
.ml-app-shell .hd-modern-workspace .hd-form-reference-strip>div{display:flex;align-items:center;gap:5px;min-width:0;overflow-x:auto;scrollbar-width:thin}
.ml-app-shell .hd-modern-workspace .hd-form-reference-strip b{flex:0 0 auto;padding:4px 7px;border-radius:999px;background:color-mix(in srgb,var(--erp-primary) 7%,#fff);border:1px solid color-mix(in srgb,var(--erp-primary) 12%,#e2e8f0);color:var(--erp-primary);font-size:7.7px;font-weight:950}

.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-section{
  position:relative!important;
  display:block!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  border:1px solid color-mix(in srgb,var(--erp-primary) 10%,#dbe4ee)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 7px 20px rgba(15,23,42,.045)!important;
}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-section-toggle{
  position:relative!important;
  z-index:2!important;
  width:100%!important;
  min-height:62px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin:0!important;
  padding:9px 11px!important;
  overflow:visible!important;
  border:0!important;
  border-radius:15px 15px 0 0!important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--erp-primary) 4.5%,#fff),#fff)!important;
  color:#0f172a!important;
  font:inherit!important;
  text-align:left!important;
  cursor:pointer!important;
}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-section.is-collapsed .hd-form-section-toggle{border-radius:15px!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-section-toggle[aria-disabled="true"]{cursor:default!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-section-toggle:hover{background:linear-gradient(145deg,color-mix(in srgb,var(--erp-primary) 7%,#fff),#fff)!important}
.ml-app-shell .hd-modern-workspace .hd-form-section-title{display:flex;align-items:center;gap:9px;min-width:0;flex:1}
.ml-app-shell .hd-modern-workspace .hd-form-section-title .hd-section-icon{width:36px!important;height:36px!important;flex:0 0 36px!important;border-radius:11px!important;box-shadow:0 7px 16px rgba(var(--erp-primary-rgb),.14)!important}
.ml-app-shell .hd-modern-workspace .hd-form-section-copy{display:block;min-width:0}
.ml-app-shell .hd-modern-workspace .hd-form-section-copy strong{display:block;overflow:hidden;color:#0f172a;font-size:10.8px;font-weight:1000;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
.ml-app-shell .hd-modern-workspace .hd-form-section-copy small{display:block;max-width:720px;margin-top:3px;overflow:hidden;color:#64748b;font-size:7.8px;font-weight:700;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}
.ml-app-shell .hd-modern-workspace .hd-form-section-meta{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.ml-app-shell .hd-modern-workspace .hd-form-section-state{display:inline-flex;align-items:center;justify-content:center;min-height:23px;padding:4px 7px;border-radius:999px;background:color-mix(in srgb,var(--erp-primary) 7%,#fff);color:var(--erp-primary);font-size:6.8px;font-weight:1000;letter-spacing:.055em;text-transform:uppercase;white-space:nowrap}
.ml-app-shell .hd-modern-workspace .hd-form-section.is-expanded .hd-form-section-state{background:color-mix(in srgb,var(--erp-primary) 9%,#fff)!important;color:var(--erp-primary)!important}
.ml-app-shell .hd-modern-workspace .hd-form-section-chevron{width:24px;height:24px;display:grid;place-items:center;border-radius:8px;background:#f1f5f9;color:#64748b;font-size:15px;font-weight:1000;line-height:1;transition:transform .16s ease,color .16s ease,background .16s ease}
.ml-app-shell .hd-modern-workspace .hd-form-section-chevron.is-open{transform:rotate(180deg);background:color-mix(in srgb,var(--erp-primary) 8%,#fff);color:var(--erp-primary)}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-section .hd-form-grid{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:start!important;
  gap:10px 11px!important;
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:11px!important;
  overflow:visible!important;
  border-top:1px solid color-mix(in srgb,var(--erp-primary) 7%,#e2e8f0)!important;
  border-radius:0 0 15px 15px!important;
  background:#fff!important;
}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field{position:relative!important;z-index:1!important;display:grid!important;align-content:start!important;gap:5px!important;min-width:0!important;width:100%!important;height:auto!important;overflow:visible!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field:focus-within{z-index:90!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field.wide{grid-column:1/-1!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field-label{position:relative!important;z-index:1!important;min-height:15px!important;margin:0!important;overflow:visible!important;color:#475569!important;font-size:7.8px!important;line-height:1.3!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field input,
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field select,
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field textarea{
  position:relative!important;
  z-index:1!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:40px!important;
  margin:0!important;
  padding:8px 10px!important;
  overflow:visible!important;
  border:1px solid #d8e1eb!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#0f172a!important;
  font-size:10px!important;
  font-weight:720!important;
  line-height:1.35!important;
  box-shadow:0 3px 9px rgba(15,23,42,.02)!important;
}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field textarea{min-height:64px!important;max-height:180px!important;resize:vertical!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field input::placeholder,
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field textarea::placeholder{color:#9aa7b7!important;opacity:1!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field input:focus,
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field select:focus,
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field textarea:focus{border-color:var(--erp-primary)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--erp-primary) 8%,transparent)!important;outline:0!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-reference-field,
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-dynamic-select{position:relative!important;z-index:2!important;min-width:0!important;overflow:visible!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-reference-field:focus-within,
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-dynamic-select:focus-within{z-index:120!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-reference-input-wrap{display:flex!important;visibility:visible!important;opacity:1!important;min-height:40px!important;overflow:visible!important;background:#fff!important;border:1px solid #d8e1eb!important;border-radius:11px!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-reference-menu{z-index:2147483200!important;visibility:visible!important;opacity:1!important;background:#fff!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-dynamic-select-row{min-width:0!important;overflow:visible!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-dynamic-select-row select{display:block!important;visibility:visible!important;opacity:1!important;min-height:40px!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-auto-number{display:flex!important;visibility:visible!important;opacity:1!important;min-height:40px!important;border-radius:11px!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field-hint{min-height:0!important;margin:0!important;font-size:7.4px!important;line-height:1.35!important}
.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-modal-actions{position:relative!important;z-index:5!important;min-height:60px!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;padding:10px 14px!important;background:#fff!important;border-top:1px solid color-mix(in srgb,var(--erp-primary) 9%,#e2e8f0)!important;box-shadow:0 -8px 22px rgba(15,23,42,.045)!important}

@media(max-width:1120px){.ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-section .hd-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:720px){
  .ml-app-shell .hd-modern-workspace .hd-form-modal{width:calc(100vw - 12px)!important;max-height:calc(100dvh - 12px)!important;border-radius:17px!important}
  .ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-modal-head{min-height:70px;padding:11px 12px!important}
  .ml-app-shell .hd-modern-workspace .hd-form-title-icon{width:39px;height:39px;flex-basis:39px;border-radius:12px}
  .ml-app-shell .hd-modern-workspace .hd-form-modal-title p{display:none}
  .ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-body{padding:8px!important;gap:8px!important}
  .ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-section-toggle{align-items:center!important;min-height:58px!important;padding:8px 9px!important}
  .ml-app-shell .hd-modern-workspace .hd-form-section-copy small{max-width:50vw}
  .ml-app-shell .hd-modern-workspace .hd-form-modal .hd-form-section .hd-form-grid{grid-template-columns:1fr!important;padding:9px!important;gap:9px!important}
  .ml-app-shell .hd-modern-workspace .hd-form-modal .hd-field.wide{grid-column:auto!important}
  .ml-app-shell .hd-modern-workspace .hd-form-reference-strip{align-items:flex-start;flex-direction:column}
  .ml-app-shell .hd-modern-workspace .hd-form-reference-strip>div{width:100%}
}
@media(max-width:430px){
  .ml-app-shell .hd-modern-workspace .hd-form-section-copy small{display:none}
  .ml-app-shell .hd-modern-workspace .hd-form-section-state{display:none}
  .ml-app-shell .hd-modern-workspace .hd-form-modal .hd-modal-actions .hd-btn{flex:1}
}

/* Full-page HD create/edit workspace. Kept after every legacy modal rule so
   standalone HD and Mixed mode cannot fall back to the old overlay layout. */
#root .hd-modern-workspace .hd-full-page-form,
#root .hd-full-page-form{
  position:relative!important;inset:auto!important;display:block!important;
  width:100%!important;max-width:none!important;min-height:calc(100dvh - 150px)!important;
  max-height:none!important;margin:0!important;overflow:visible!important;
  border:1px solid color-mix(in srgb,var(--erp-primary,var(--hd-primary)) 11%,#dce5ee)!important;
  border-radius:24px!important;
  background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--erp-primary,var(--hd-primary)) 2.5%,#fff))!important;
  box-shadow:0 22px 54px rgba(15,23,42,.09)!important;
}
#root .hd-modern-workspace .hd-full-page-form .hd-form-modal-head,
#root .hd-full-page-form .hd-form-modal-head{
  position:sticky!important;z-index:80!important;top:0!important;min-height:88px!important;
  padding:16px 18px!important;border-radius:24px 24px 0 0!important;
  border-bottom:1px solid color-mix(in srgb,var(--erp-primary,var(--hd-primary)) 12%,#e2e8f0)!important;
  background:linear-gradient(135deg,color-mix(in srgb,var(--erp-primary,var(--hd-primary)) 8%,#fff),color-mix(in srgb,var(--erp-secondary,var(--hd-secondary)) 7%,#fff),#fff)!important;
  box-shadow:0 10px 24px rgba(15,23,42,.055)!important;
}
#root .hd-modern-workspace .hd-full-page-form .hd-form-body,
#root .hd-full-page-form .hd-form-body{
  display:block!important;width:100%!important;max-height:none!important;
  padding:18px!important;overflow:visible!important;
}
#root .hd-modern-workspace .hd-full-page-form .hd-form-section-static,
#root .hd-full-page-form .hd-form-section-static{
  height:auto!important;max-height:none!important;margin:0 0 18px!important;overflow:visible!important;
  border:1px solid #e2e8f0!important;border-radius:20px!important;background:#fff!important;
  box-shadow:0 10px 26px rgba(15,23,42,.055)!important;
}
#root .hd-modern-workspace .hd-full-page-form .hd-form-section-heading,
#root .hd-full-page-form .hd-form-section-heading{
  cursor:default!important;min-height:66px!important;padding:12px 14px!important;
  border-radius:20px 20px 0 0!important;border-bottom:1px solid #edf1f5!important;
  background:linear-gradient(145deg,#fff,#f8fafc)!important;
}
#root .hd-modern-workspace .hd-full-page-form .hd-form-section .hd-form-grid,
#root .hd-full-page-form .hd-form-section .hd-form-grid{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;height:auto!important;max-height:none!important;padding:18px!important;overflow:visible!important;
}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 1) .hd-section-icon{background:#16a34a!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 2) .hd-section-icon{background:#2563eb!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 3) .hd-section-icon{background:#f59e0b!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 4) .hd-section-icon{background:#0891b2!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 5) .hd-section-icon{background:#7c3aed!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 6) .hd-section-icon{background:#db2777!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 7) .hd-section-icon{background:#4d7c0f!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 8) .hd-section-icon{background:#0369a1!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 9) .hd-section-icon{background:#ea580c!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 10) .hd-section-icon{background:#0f766e!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 11) .hd-section-icon{background:#9333ea!important;color:#fff!important}
#root .hd-full-page-form .hd-form-section:nth-child(12n + 12) .hd-section-icon{background:#1d4ed8!important;color:#fff!important}
#root .hd-modern-workspace .hd-full-page-form .hd-modal-actions,
#root .hd-full-page-form .hd-modal-actions{
  position:sticky!important;z-index:70!important;bottom:0!important;min-height:68px!important;
  padding:12px 18px!important;border-radius:0 0 24px 24px!important;
  background:rgba(255,255,255,.96)!important;backdrop-filter:blur(14px)!important;
  box-shadow:0 -10px 26px rgba(15,23,42,.06)!important;
}
@media(max-width:1120px){
  #root .hd-full-page-form .hd-form-section .hd-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:700px){
  #root .hd-full-page-form{min-height:calc(100dvh - 100px)!important;border-radius:18px!important}
  #root .hd-full-page-form .hd-form-modal-head{position:relative!important;align-items:flex-start!important;flex-direction:column!important;border-radius:18px 18px 0 0!important}
  #root .hd-full-page-form .hd-form-back{width:100%!important;justify-content:center!important}
  #root .hd-full-page-form .hd-form-body{padding:10px!important}
  #root .hd-full-page-form .hd-form-section .hd-form-grid{grid-template-columns:1fr!important;gap:16px!important;padding:12px!important}
  #root .hd-full-page-form .hd-field.wide{grid-column:auto!important}
}


/* ===== index.css ===== */
:root {
  color-scheme: light;
  text-rendering: optimizeLegibility;
}

html, body, #root {
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  margin: 0;
  overflow-x: hidden;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
}

img, picture, video, canvas, svg { max-width: 100%; }
input, select, textarea, button { font: inherit; }
input:not([type='checkbox']):not([type='radio']), select, textarea { max-width: 100%; }

/* Safe baseline for screens that do not render inside MainLayout (login, public portal, print preview). */
[data-responsive-page='true'], .responsive-page, .page-shell, .page-container {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

@media (max-width: 900px) {
  body { -webkit-text-size-adjust: 100%; }
}

@media (max-width: 700px) {
  input:not([type='checkbox']):not([type='radio']), select, textarea {
    width: 100%;
    min-width: 0;
  }
  button, [role='button'], a { touch-action: manipulation; }
}

@media print {
  html, body, #root { overflow: visible !important; }
}

/* ===== Runtime company theme system ===== */
html, body, #root { min-height: 100%; }
body { font-size: calc(14px * var(--erp-font-scale, 1)); background: var(--erp-page-bg, #f8fafc) !important; color: var(--erp-text, #0f172a); }
.ml-main-shell, .ml-main-children { background: transparent; }
.ml-main-children > :not(style) { font-family: var(--erp-font-family, Inter, system-ui, sans-serif); }
.ml-main-children [data-cms-polished="true"],
.ml-main-children .cms-card,
.ml-main-children .erp-card {
  border-radius: var(--erp-radius, 18px) !important;
  background: var(--erp-card-bg, rgba(255,255,255,.84)) !important;
  border: var(--erp-card-border, 1px solid rgba(148,163,184,.2)) !important;
  box-shadow: var(--erp-card-shadow, 0 14px 34px rgba(15,23,42,.10)) !important;
}
html[data-erp-theme="minimal"] .ml-main-children button { border-radius: 2px !important; box-shadow: none !important; }
html[data-erp-theme="contrast"] .ml-main-children button { border-radius: 0 !important; border-width: 2px !important; font-weight: 900 !important; }
html[data-erp-theme="financial"] .ml-main-children table { font-family: var(--erp-font-family) !important; font-size: 11px !important; }
html[data-erp-theme="financial"] .ml-main-children th { text-transform: uppercase; letter-spacing: .06em; }
html[data-erp-theme="amoled"] .ml-main-children,
html[data-erp-theme="amoled"] .ml-main-header { color: #f5f5f5 !important; }
html[data-erp-theme-mode="dark"] input,
html[data-erp-theme-mode="dark"] textarea,
html[data-erp-theme-mode="dark"] select { color-scheme: dark; }
html[data-erp-theme="clay"] .ml-main-children button:not([disabled]) { box-shadow: 5px 5px 12px rgba(163,177,198,.25), -4px -4px 10px rgba(255,255,255,.72); }
html[data-erp-theme="colorful"] .ml-main-children h1,
html[data-erp-theme="colorful"] .ml-main-children h2 { letter-spacing: -.03em; }
html[data-erp-theme="glass"] .ml-main-children [data-cms-polished="true"] { backdrop-filter: blur(26px) saturate(180%); }


/* ===== Company Dark Theme =====
   The application contains many legacy pages with inline white surfaces. These
   scoped !important overrides allow the tenant dark preset to remain coherent
   without changing business-page logic or hard-coding a second palette. */
html[data-erp-theme-mode="dark"] { color-scheme: dark; }
html[data-erp-theme-mode="dark"] body,
html[data-erp-theme-mode="dark"] #root,
html[data-erp-theme-mode="dark"] .ml-app-shell,
html[data-erp-theme-mode="dark"] .ml-main-shell,
html[data-erp-theme-mode="dark"] .ml-main-children {
  background: var(--erp-page-bg, #07111f) !important;
  color: var(--erp-text, #e5edf8) !important;
}
html[data-erp-theme-mode="dark"] .ml-main-children input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
html[data-erp-theme-mode="dark"] .ml-main-children select,
html[data-erp-theme-mode="dark"] .ml-main-children textarea,
html[data-erp-theme-mode="dark"] .company-settings-shell input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
html[data-erp-theme-mode="dark"] .company-settings-shell select,
html[data-erp-theme-mode="dark"] .company-settings-shell textarea {
  background: #0f1b2d !important;
  color: #e5edf8 !important;
  -webkit-text-fill-color: #e5edf8 !important;
  border-color: rgba(148,163,184,.24) !important;
}
html[data-erp-theme-mode="dark"] .ml-main-children input::placeholder,
html[data-erp-theme-mode="dark"] .ml-main-children textarea::placeholder { color: #71839c !important; }
html[data-erp-theme-mode="dark"] .ml-main-children table,
html[data-erp-theme-mode="dark"] .ml-main-children thead,
html[data-erp-theme-mode="dark"] .ml-main-children tbody,
html[data-erp-theme-mode="dark"] .ml-main-children tr,
html[data-erp-theme-mode="dark"] .ml-main-children td,
html[data-erp-theme-mode="dark"] .ml-main-children th { color: #e5edf8; border-color: rgba(148,163,184,.18) !important; }
html[data-erp-theme-mode="dark"] .ml-main-children th { background: #142238 !important; color: #b9c7d9 !important; }
html[data-erp-theme-mode="dark"] .ml-main-children td { background-color: rgba(15,27,45,.78); }
html[data-erp-theme-mode="dark"] .ml-main-children [style*="background: rgb(255, 255, 255)"],
html[data-erp-theme-mode="dark"] .ml-main-children [style*="background-color: rgb(255, 255, 255)"],
html[data-erp-theme-mode="dark"] .company-settings-shell [style*="background: rgb(255, 255, 255)"],
html[data-erp-theme-mode="dark"] .company-settings-shell [style*="background-color: rgb(255, 255, 255)"] {
  background: #0f1b2d !important;
  color: #e5edf8 !important;
}
html[data-erp-theme-mode="dark"] .ml-main-children [style*="color: rgb(15, 23, 42)"],
html[data-erp-theme-mode="dark"] .ml-main-children [style*="color: rgb(51, 65, 85)"],
html[data-erp-theme-mode="dark"] .ml-main-children [style*="color: rgb(71, 85, 105)"],
html[data-erp-theme-mode="dark"] .company-settings-shell [style*="color: rgb(15, 23, 42)"],
html[data-erp-theme-mode="dark"] .company-settings-shell [style*="color: rgb(51, 65, 85)"],
html[data-erp-theme-mode="dark"] .company-settings-shell [style*="color: rgb(71, 85, 105)"] { color: #d9e4f1 !important; }
html[data-erp-theme-mode="dark"] .settings-nav-panel,
html[data-erp-theme-mode="dark"] .settings-content-panel,
html[data-erp-theme-mode="dark"] .settings-content-toolbar,
html[data-erp-theme-mode="dark"] .settings-nav-button {
  background: rgba(15,27,45,.94) !important;
  color: #d9e4f1 !important;
  border-color: rgba(148,163,184,.18) !important;
}
html[data-erp-theme-mode="dark"] .settings-nav-button[data-active="true"] {
  background: linear-gradient(145deg, rgba(var(--erp-primary-rgb),.22), rgba(15,27,45,.98)) !important;
  color: #fff !important;
}
html[data-erp-theme-mode="dark"] .settings-tab-page,
html[data-erp-theme-mode="dark"] .settings-section-stack { color: #e5edf8; }


/* ===== styles/animations.css ===== */


/* ===== styles/basicErpReferenceThemeV12.css ===== */
/* ============================================================================
   BASIC ERP / DESKTOP OPERATIONS THEME V12
   ----------------------------------------------------------------------------
   Presentation-only theme. Every rule is scoped to Theme 3 so Classic Portal
   and Modern Dashboard retain their original visual design.
   ========================================================================== */

.ml-app-shell.theme-basic_erp,
html[data-erp-theme="basic_erp"] body {
  --erp12-primary: var(--erp-primary, #075aa8);
  --erp12-primary-deep: var(--erp-primary-deep, #063d75);
  --erp12-secondary: var(--erp-secondary, #0a87b5);
  --erp12-accent: var(--erp-accent, #f59e0b);
  --erp12-primary-rgb: var(--erp-primary-rgb, 7, 90, 168);
  --erp12-secondary-rgb: var(--erp-secondary-rgb, 10, 135, 181);
  --erp12-accent-rgb: var(--erp-accent-rgb, 245, 158, 11);
  --erp12-bg: #eef4fa;
  --erp12-surface: #ffffff;
  --erp12-surface-soft: #f7faff;
  --erp12-line: #d7e1ec;
  --erp12-line-strong: #b8c8da;
  --erp12-text: #16233a;
  --erp12-muted: #607087;
  --erp12-danger: #dc2626;
  --erp12-success: #0b9a49;
  --erp12-warning: #d97706;
  --erp12-radius: 7px;
  --erp12-control-h: 38px;
  --erp12-label-w: 112px;
  --erp12-font: var(--erp-font-family, Inter, "Segoe UI", Arial, sans-serif);
}

html[data-erp-theme="basic_erp"],
html[data-erp-theme="basic_erp"] body,
html[data-erp-theme="basic_erp"] #root {
  margin: 0 !important;
  min-height: 100% !important;
  background: var(--erp12-bg) !important;
}

.ml-app-shell.theme-basic_erp.erp12-shell {
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 92% 8%, rgba(var(--erp12-secondary-rgb), .08), transparent 28%),
    linear-gradient(180deg, #f6f9fd 0%, var(--erp12-bg) 100%) !important;
  color: var(--erp12-text) !important;
  font-family: var(--erp12-font) !important;
  font-size: 13px !important;
}

.ml-app-shell.theme-basic_erp.erp12-shell *,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] * {
  box-sizing: border-box;
  font-family: var(--erp12-font) !important;
}

/* --------------------------------------------------------------------------
   Top application bar
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-topbar {
  min-height: 70px;
  flex: 0 0 auto;
  display: flex;
  align-items: stretch;
  gap: 0;
  background: linear-gradient(105deg, var(--erp12-primary-deep), var(--erp12-primary) 58%, var(--erp12-secondary));
  border-bottom: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 4px 16px rgba(15, 43, 78, .20);
  color: #fff;
  position: relative;
  z-index: 450;
}

.ml-app-shell.theme-basic_erp .erp12-brand {
  width: 255px;
  min-width: 255px;
  min-height: 70px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 18px;
  background: rgba(255,255,255,.97);
  border-right: 1px solid rgba(255,255,255,.25);
  color: var(--erp12-primary-deep) !important;
  text-decoration: none !important;
  box-shadow: 2px 0 12px rgba(10, 37, 70, .12);
}

.ml-app-shell.theme-basic_erp .erp12-brand-logo {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: var(--erp12-primary);
  font-size: 28px;
  font-weight: 900;
  overflow: hidden;
}

.ml-app-shell.theme-basic_erp .erp12-brand-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ml-app-shell.theme-basic_erp .erp12-brand-copy {
  min-width: 0;
  display: block;
}

.ml-app-shell.theme-basic_erp .erp12-brand-copy strong {
  display: block;
  max-width: 172px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  line-height: 1.1;
  font-weight: 800;
  color: var(--erp12-primary-deep) !important;
}

.ml-app-shell.theme-basic_erp .erp12-brand-copy small {
  display: block;
  margin-top: 3px;
  max-width: 172px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 9.5px;
  font-weight: 600;
  color: #50637a !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  align-items: stretch;
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-width: none;
}
.ml-app-shell.theme-basic_erp .erp12-topnav::-webkit-scrollbar { display: none; }

.ml-app-shell.theme-basic_erp .erp12-nav-link,
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary {
  min-height: 70px;
  padding: 0 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  white-space: nowrap;
  border: 0 !important;
  border-left: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(255,255,255,.96) !important;
  text-decoration: none !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  cursor: pointer;
}

.ml-app-shell.theme-basic_erp .erp12-nav-link:hover,
.ml-app-shell.theme-basic_erp .erp12-nav-link.is-active,
.ml-app-shell.theme-basic_erp .erp12-nav-group:hover > summary,
.ml-app-shell.theme-basic_erp .erp12-nav-group.is-active > summary,
.ml-app-shell.theme-basic_erp .erp12-nav-group[open] > summary {
  background: rgba(255,255,255,.12) !important;
  box-shadow: inset 0 -3px 0 rgba(255,255,255,.96) !important;
}

.ml-app-shell.theme-basic_erp .erp12-nav-group {
  position: relative;
  flex: 0 0 auto;
}
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary { list-style: none; }
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary::-webkit-details-marker { display: none; }
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary span { font-size: 11px; opacity: .86; }

.ml-app-shell.theme-basic_erp .erp12-nav-dropdown {
  position: absolute;
  top: 64px;
  left: 4px;
  width: 260px;
  max-height: min(520px, calc(100vh - 130px));
  overflow: auto;
  padding: 7px;
  border: 1px solid var(--erp12-line-strong);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(17, 45, 78, .22);
  z-index: 1000;
}

.ml-app-shell.theme-basic_erp .erp12-nav-dropdown a {
  min-height: 36px;
  display: flex;
  align-items: center;
  padding: 7px 10px;
  border-radius: 5px;
  color: var(--erp12-text) !important;
  text-decoration: none !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}
.ml-app-shell.theme-basic_erp .erp12-nav-dropdown a:hover,
.ml-app-shell.theme-basic_erp .erp12-nav-dropdown a.is-active {
  background: rgba(var(--erp12-primary-rgb), .09) !important;
  color: var(--erp12-primary-deep) !important;
}

.ml-app-shell.theme-basic_erp .erp12-header-tools {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
}

.ml-app-shell.theme-basic_erp .erp12-global-search {
  width: clamp(210px, 20vw, 320px);
  position: relative;
}

.ml-app-shell.theme-basic_erp .erp12-global-search > input {
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 38px 0 12px !important;
  border: 1px solid rgba(255,255,255,.46) !important;
  border-radius: 7px !important;
  outline: none !important;
  background: rgba(255,255,255,.97) !important;
  color: #22324a !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.10) !important;
  font-size: 12px !important;
  font-weight: 550 !important;
}

.ml-app-shell.theme-basic_erp .erp12-global-search > span {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #40546e;
  font-size: 19px;
  pointer-events: none;
}

.ml-app-shell.theme-basic_erp .erp12-search-results {
  position: absolute;
  top: 45px;
  left: 0;
  right: 0;
  max-height: 390px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--erp12-line-strong);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(20, 47, 80, .22);
  z-index: 1200;
}

.ml-app-shell.theme-basic_erp .erp12-search-results button {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 9px;
  border: 0 !important;
  border-bottom: 1px solid #edf1f5 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: var(--erp12-text) !important;
  text-align: left;
  box-shadow: none !important;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-search-results button:hover { background: rgba(var(--erp12-primary-rgb), .07) !important; }
.ml-app-shell.theme-basic_erp .erp12-search-results button strong { font-size: 11.5px; }
.ml-app-shell.theme-basic_erp .erp12-search-results button small { font-size: 9px; color: var(--erp12-muted); }
.ml-app-shell.theme-basic_erp .erp12-search-empty { padding: 14px; font-size: 11px; color: var(--erp12-muted); }

.ml-app-shell.theme-basic_erp .erp12-header-tools .ml-icon-action {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  border-radius: 7px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-user-chip {
  max-width: 190px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
}
.ml-app-shell.theme-basic_erp .erp12-user-avatar {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.96);
  color: var(--erp12-primary-deep);
  border: 2px solid rgba(255,255,255,.52);
  font-size: 13px;
  font-weight: 850;
}
.ml-app-shell.theme-basic_erp .erp12-user-copy { min-width: 0; display: block; }
.ml-app-shell.theme-basic_erp .erp12-user-copy strong,
.ml-app-shell.theme-basic_erp .erp12-user-copy small {
  display: block;
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff !important;
}
.ml-app-shell.theme-basic_erp .erp12-user-copy strong { font-size: 11px; font-weight: 750; }
.ml-app-shell.theme-basic_erp .erp12-user-copy small { margin-top: 2px; font-size: 8.5px; opacity: .82; }

.ml-app-shell.theme-basic_erp .erp12-logout {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 11px !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  border-radius: 5px !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  box-shadow: none !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
}
.ml-app-shell.theme-basic_erp .erp12-logout:hover { background: rgba(255,255,255,.18) !important; }

/* --------------------------------------------------------------------------
   Utility / command ribbons
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-utilitybar {
  min-height: 47px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 18px;
  background: #fff;
  border-bottom: 1px solid var(--erp12-line);
  box-shadow: 0 2px 8px rgba(35, 62, 91, .05);
  position: relative;
  z-index: 300;
}
.ml-app-shell.theme-basic_erp .erp12-route-context {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #33465f;
  font-size: 11.5px;
}
.ml-app-shell.theme-basic_erp .erp12-route-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--erp12-primary);
  box-shadow: 0 0 0 4px rgba(var(--erp12-primary-rgb), .09);
}
.ml-app-shell.theme-basic_erp .erp12-utility-spacer { flex: 1 1 auto; }
.ml-app-shell.theme-basic_erp .erp12-fy-select {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: var(--erp12-muted);
}
.ml-app-shell.theme-basic_erp .erp12-fy-select select {
  width: auto !important;
  min-width: 150px !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 28px 0 9px !important;
  border: 1px solid var(--erp12-line-strong) !important;
  border-radius: 5px !important;
  background-color: #fff !important;
  color: var(--erp12-text) !important;
  box-shadow: none !important;
  font-size: 10.5px !important;
  font-weight: 650 !important;
}
.ml-app-shell.theme-basic_erp .erp12-session-date {
  white-space: nowrap;
  color: #42566f;
  font-size: 10.5px;
  font-weight: 700;
}

.ml-app-shell.theme-basic_erp .erp12-command-ribbon {
  min-height: 37px;
  flex: 0 0 auto;
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 1px;
  overflow-x: auto;
  padding: 0 12px;
  background: linear-gradient(90deg, rgba(var(--erp12-primary-rgb), .10), rgba(var(--erp12-secondary-rgb), .10));
  border-bottom: 1px solid rgba(var(--erp12-primary-rgb), .18);
  scrollbar-width: none;
}
.ml-app-shell.theme-basic_erp .erp12-command-ribbon::-webkit-scrollbar { display: none; }
.ml-app-shell.theme-basic_erp .erp12-command-ribbon a {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  border-bottom: 2px solid transparent;
  color: #42566f !important;
  text-decoration: none !important;
  white-space: nowrap;
  font-size: 10.5px;
  font-weight: 700;
}
.ml-app-shell.theme-basic_erp .erp12-command-ribbon a:hover,
.ml-app-shell.theme-basic_erp .erp12-command-ribbon a.is-active {
  background: rgba(255,255,255,.66);
  border-bottom-color: var(--erp12-primary);
  color: var(--erp12-primary-deep) !important;
}

/* --------------------------------------------------------------------------
   Main desktop work window
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-workspace {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
  align-items: stretch;
  padding: 10px 18px 8px;
  overflow: hidden;
}

.ml-app-shell.theme-basic_erp .erp12-work-window {
  width: min(100%, 1660px);
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #fff;
  border: 1px solid #8fa8c2;
  border-radius: 7px 7px 4px 4px;
  box-shadow: 0 10px 26px rgba(30, 62, 98, .13);
}

.ml-app-shell.theme-basic_erp .erp12-window-tabs {
  height: 38px;
  min-height: 38px;
  display: flex;
  align-items: flex-end;
  gap: 2px;
  padding: 5px 8px 0;
  background: linear-gradient(180deg, #f7faff 0%, #e5edf7 100%);
  border-bottom: 1px solid #b7c9dc;
}
.ml-app-shell.theme-basic_erp .erp12-window-tabs > a,
.ml-app-shell.theme-basic_erp .erp12-active-tab {
  height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  border: 1px solid #b7c9dc;
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
  background: #edf3f9;
  color: #42566f !important;
  text-decoration: none !important;
  white-space: nowrap;
  font-size: 10.5px;
  font-weight: 700;
}
.ml-app-shell.theme-basic_erp .erp12-window-tabs > a.is-active,
.ml-app-shell.theme-basic_erp .erp12-active-tab {
  background: #fff;
  color: var(--erp12-primary-deep) !important;
  box-shadow: inset 0 2px 0 var(--erp12-primary);
}
.ml-app-shell.theme-basic_erp .erp12-window-spacer { flex: 1 1 auto; }
.ml-app-shell.theme-basic_erp .erp12-window-control {
  width: 28px;
  height: 27px;
  display: grid;
  place-items: center;
  margin-bottom: 4px;
  border-radius: 4px;
  color: var(--erp12-primary-deep);
  font-size: 15px;
  font-weight: 700;
}

.ml-app-shell.theme-basic_erp .erp12-window-title {
  min-height: 47px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 14px;
  background: #fff;
  border-bottom: 1px solid var(--erp12-line);
  color: var(--erp12-primary-deep);
}
.ml-app-shell.theme-basic_erp .erp12-title-icon {
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  background: rgba(var(--erp12-primary-rgb), .09);
  color: var(--erp12-primary);
  font-size: 16px;
}
.ml-app-shell.theme-basic_erp .erp12-window-title strong { font-size: 15px; font-weight: 800; }
.ml-app-shell.theme-basic_erp .erp12-title-context {
  margin-left: auto;
  padding: 4px 8px;
  border: 1px solid rgba(var(--erp12-primary-rgb), .15);
  border-radius: 4px;
  background: rgba(var(--erp12-primary-rgb), .05);
  color: #52657c;
  font-size: 9.5px;
  font-weight: 650;
}

.ml-app-shell.theme-basic_erp .erp12-content {
  min-height: 0;
  flex: 1 1 auto;
  width: 100%;
  overflow: auto !important;
  padding: 10px 12px 12px !important;
  background: #fbfdff !important;
  overscroll-behavior: contain;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface {
  width: min(100%, 1620px);
  min-height: 100%;
  margin: 0 auto;
  color: var(--erp12-text);
}
.ml-app-shell.theme-basic_erp .erp12-loading-cell {
  min-height: 220px;
  display: grid;
  place-items: center;
  color: var(--erp12-muted);
  font-size: 12px;
  font-weight: 700;
}

.ml-app-shell.theme-basic_erp .erp12-statusbar {
  min-height: 29px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0;
  background: #f4f7fa;
  border-top: 1px solid var(--erp12-line);
  color: #53667d;
  font-size: 9px;
}
.ml-app-shell.theme-basic_erp .erp12-statusbar > span {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border-right: 1px solid var(--erp12-line);
  white-space: nowrap;
}
.ml-app-shell.theme-basic_erp .erp12-statusbar strong { color: #30445d; font-weight: 750; }
.ml-app-shell.theme-basic_erp .erp12-status-spacer { flex: 1 1 auto; border-right: 0 !important; }

/* --------------------------------------------------------------------------
   Bottom ERP dock — second half of permission-filtered modules
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-bottom-dock {
  min-height: 78px;
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  padding: 7px 12px 8px;
  background: linear-gradient(100deg, var(--erp12-primary-deep), var(--erp12-primary) 58%, var(--erp12-secondary));
  border-top: 1px solid rgba(255,255,255,.20);
  box-shadow: 0 -4px 15px rgba(18, 49, 84, .15);
  overflow: hidden;
}
.ml-app-shell.theme-basic_erp .erp12-bottom-dock-inner {
  width: min(100%, 1540px);
  display: flex;
  justify-content: center;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.25) transparent;
}
.ml-app-shell.theme-basic_erp .erp12-bottom-dock a {
  min-width: 112px;
  min-height: 62px;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 6px 10px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 6px;
  background: rgba(255,255,255,.055);
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: none;
  font-size: 9.5px;
  font-weight: 700;
  text-align: center;
}
.ml-app-shell.theme-basic_erp .erp12-bottom-dock a:hover,
.ml-app-shell.theme-basic_erp .erp12-bottom-dock a.is-active {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.28);
  box-shadow: inset 0 -3px 0 #fff;
}
.ml-app-shell.theme-basic_erp .erp12-dock-icon {
  min-height: 25px;
  display: grid;
  place-items: center;
  font-size: 23px;
  line-height: 1;
}

/* --------------------------------------------------------------------------
   Hide only Theme-3 decorative / duplicated workflow chrome
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-operational-steps="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-operational-steps-container="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-page-hero="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-modern-background,
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-modern-hero,
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-progress-strip,
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-modern-icon="true"] {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Page surfaces: clean ERP aesthetics, not a generic CSS reset
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface > * {
  max-width: 100% !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is(section, article, fieldset):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]) {
  border-color: var(--erp12-line) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is([class*="card" i],[class*="panel" i],[class*="glass" i]):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]) {
  background: #fff !important;
  background-image: none !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: var(--erp12-radius) !important;
  box-shadow: 0 2px 9px rgba(28, 60, 95, .055) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is([class*="card" i],[class*="panel" i],[class*="glass" i]) :is([class*="card" i],[class*="panel" i],[class*="glass" i]):not(.label-designer-page *):not(.professional-report *) {
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [style*="linear-gradient"]:not(button):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]) {
  background-image: none !important;
}

/* Small subsection labels like the supplied ERP reference. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-section-title="true"]:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-section-header,
.ml-app-shell.theme-basic_erp .erp12-route-surface .cs-section-header {
  margin: 8px 0 6px !important;
  padding: 0 2px 5px !important;
  min-height: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(var(--erp12-primary-rgb), .18) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--erp12-primary) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-section-title="true"]:is(h1,h2,h3,h4,h5,h6,legend),
.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-section-header :is(h1,h2,h3,h4),
.ml-app-shell.theme-basic_erp .erp12-route-surface .cs-section-header :is(h1,h2,h3,h4) {
  font-size: 12px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--erp12-primary) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-section-header="true"] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-form-content-card {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 10px !important;
  background: #fff !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: var(--erp12-radius) !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Symmetric 3-field form engine
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface form,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] form {
  width: 100% !important;
  max-width: 1580px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] {
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  column-gap: 14px !important;
  row-gap: 10px !important;
  align-items: start !important;
  margin: 0 0 10px !important;
  padding: 12px !important;
  background: #fff !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: var(--erp12-radius) !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-shell="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-shell="true"] {
  display: contents !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"] > :not([data-basic-erp-field-row="true"]):not([data-basic-erp-field-shell="true"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] > :not([data-basic-erp-field-row="true"]):not([data-basic-erp-field-shell="true"]) {
  grid-column: 1 / -1 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] {
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--erp12-control-h) !important;
  display: grid !important;
  grid-template-columns: minmax(96px, var(--erp12-label-w)) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-wide="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-wide="true"] {
  grid-column: 1 / -1 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child {
  grid-column: 1 !important;
  grid-row: auto !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 4px 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #33465f !important;
  box-shadow: none !important;
  font-size: 11.5px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"] {
  position: relative !important;
  font-size: 0 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"]::before,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"]::before {
  content: attr(data-basic-erp-label);
  grid-column: 1;
  display: flex;
  align-items: center;
  min-height: 34px;
  padding: 4px 2px;
  color: #33465f;
  font-size: 11.5px;
  line-height: 1.2;
  font-weight: 700;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"] > :is(input,select,textarea,[role="combobox"],div),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"] > :is(input,select,textarea,[role="combobox"],div) {
  grid-column: 2 !important;
  min-width: 0 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]) {
  grid-column: 2 !important;
  min-width: 0 !important;
  width: 100% !important;
}

/* Bootstrap-like controls, driven by company branding. */
.ml-app-shell.theme-basic_erp .erp12-route-surface input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface select:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="combobox"]:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] select,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [role="combobox"] {
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--erp12-control-h) !important;
  height: var(--erp12-control-h) !important;
  margin: 0 !important;
  padding: 7px 9px !important;
  border: 1px solid #c4d0dd !important;
  border-radius: 4px !important;
  outline: none !important;
  background: #fff !important;
  background-image: none !important;
  color: #1e2c40 !important;
  box-shadow: inset 0 1px 2px rgba(22, 44, 69, .025) !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 550 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea {
  height: auto !important;
  min-height: 72px !important;
  resize: vertical !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface input:focus:not([type="checkbox"]):not([type="radio"]),
.ml-app-shell.theme-basic_erp .erp12-route-surface select:focus,
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:focus,
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="combobox"]:focus-within,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input:focus:not([type="checkbox"]):not([type="radio"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] select:focus,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea:focus {
  border-color: var(--erp12-primary) !important;
  box-shadow: 0 0 0 2px rgba(var(--erp12-primary-rgb), .12) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface input::placeholder,
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea::placeholder {
  color: #8b99aa !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface input[type="checkbox"],
.ml-app-shell.theme-basic_erp .erp12-route-surface input[type="radio"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input[type="checkbox"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input[type="radio"] {
  accent-color: var(--erp12-primary) !important;
}

/* --------------------------------------------------------------------------
   Buttons and action bars
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface button:not(.label-designer-page *):not(.professional-report *):not(.erp12-kpi-card):not(.erp12-table-action),
.ml-app-shell.theme-basic_erp .erp12-route-surface a[class*="btn" i]:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface a[class*="button" i]:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button:not([data-preserve-theme-design="true"]) {
  min-height: 38px !important;
  padding: 7px 14px !important;
  border: 1px solid #b8c7d8 !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #fff, #f4f7fa) !important;
  color: #30445d !important;
  box-shadow: 0 1px 2px rgba(21, 47, 77, .05) !important;
  font-size: 11.5px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  cursor: pointer;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface button[data-basic-erp-button="primary"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button[data-basic-erp-button="primary"] {
  border-color: var(--erp12-primary) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--erp12-primary) 90%, white), var(--erp12-primary)) !important;
  color: #fff !important;
  box-shadow: 0 2px 5px rgba(var(--erp12-primary-rgb), .18) !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface button[data-basic-erp-button="danger"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button[data-basic-erp-button="danger"] {
  border-color: #e5a3a3 !important;
  background: #fff6f6 !important;
  color: #b42323 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface button:hover:not(:disabled):not(.erp12-kpi-card),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button:hover:not(:disabled) {
  filter: brightness(.985);
}
.ml-app-shell.theme-basic_erp .erp12-route-surface button:disabled,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button:disabled { opacity: .55 !important; cursor: not-allowed !important; }

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-toolbar="true"] {
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 8px 0 !important;
  padding: 8px !important;
  background: #f7faff !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: 5px !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Bootstrap-style data tables and reports
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) {
  width: 100% !important;
  max-width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  background: #fff !important;
  color: #24364d !important;
  font-size: 11.5px !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) th,
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) th,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) td {
  min-height: 34px !important;
  padding: 7px 8px !important;
  border: 1px solid #d8e1eb !important;
  vertical-align: middle !important;
  line-height: 1.25 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) th,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) th {
  background: linear-gradient(180deg, color-mix(in srgb, var(--erp12-primary) 90%, white), var(--erp12-primary)) !important;
  color: #fff !important;
  border-color: color-mix(in srgb, var(--erp12-primary) 80%, #ffffff) !important;
  font-size: 10.5px !important;
  font-weight: 750 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) tbody tr:nth-child(even) td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) tbody tr:nth-child(even) td {
  background: rgba(var(--erp12-primary-rgb), .022) !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) tbody tr:hover td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) tbody tr:hover td {
  background: rgba(var(--erp12-primary-rgb), .075) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table button:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table button {
  min-height: 30px !important;
  height: 30px !important;
  padding: 4px 9px !important;
  border-radius: 4px !important;
  font-size: 10px !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [class*="filter" i]:has(input,select,button):not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface [class*="search" i]:has(input,select,button):not(.label-designer-page *):not(.professional-report *) {
  border-radius: 5px !important;
}

/* Tabs inside routed modules. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="tablist"]:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface :is([class*="tabs" i],[class*="tab-list" i],[class*="tabbar" i]):not(.label-designer-page *):not(.professional-report *) {
  display: flex !important;
  gap: 2px !important;
  align-items: flex-end !important;
  padding: 5px 6px 0 !important;
  background: #edf3f9 !important;
  border: 1px solid var(--erp12-line) !important;
  border-bottom-color: #b7c9dc !important;
  border-radius: 6px 6px 0 0 !important;
  box-shadow: none !important;
  overflow-x: auto !important;
}

/* --------------------------------------------------------------------------
   Basic ERP dashboard - reference-inspired but live-data driven
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-dashboard {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ml-app-shell.theme-basic_erp .erp12-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 10px;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-card {
  min-width: 0;
  min-height: 112px !important;
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  padding: 13px 14px !important;
  border: 1px solid #d4e0ec !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: var(--erp12-text) !important;
  box-shadow: 0 3px 10px rgba(23, 56, 92, .06) !important;
  text-align: left !important;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-card:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--erp12-kpi-tone, var(--erp12-primary)) 35%, #d4e0ec) !important;
  box-shadow: 0 6px 16px rgba(23, 56, 92, .09) !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-icon {
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(145deg, color-mix(in srgb, var(--erp12-kpi-tone, var(--erp12-primary)) 82%, white), var(--erp12-kpi-tone, var(--erp12-primary)));
  color: #fff;
  box-shadow: 0 5px 12px color-mix(in srgb, var(--erp12-kpi-tone, var(--erp12-primary)) 22%, transparent);
  font-size: 24px;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-copy { min-width: 0; display: block; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy small,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy strong,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy em { display: block; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy small { color: #354861; font-size: 10.5px; font-weight: 750; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy strong { margin-top: 6px; color: #15243b; font-size: 20px; line-height: 1; font-weight: 850; font-style: normal; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy em { margin-top: 7px; color: var(--erp12-muted); font-size: 9px; line-height: 1.3; font-style: normal; font-weight: 600; }

.ml-app-shell.theme-basic_erp .erp12-dashboard-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 305px;
  gap: 10px;
  align-items: stretch;
}
.ml-app-shell.theme-basic_erp .erp12-dashboard-side { display: flex; flex-direction: column; gap: 10px; }
.ml-app-shell.theme-basic_erp .erp12-dashboard-panel {
  min-width: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid #d7e1ec;
  border-radius: 8px;
  box-shadow: 0 2px 9px rgba(25, 55, 90, .05);
}
.ml-app-shell.theme-basic_erp .erp12-dashboard-panel-main { min-height: 290px; }
.ml-app-shell.theme-basic_erp .erp12-panel-heading {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--erp12-line);
  background: linear-gradient(180deg,#fff,#fafcff);
}
.ml-app-shell.theme-basic_erp .erp12-panel-heading strong { display: block; color: var(--erp12-primary); font-size: 11.5px; font-weight: 800; }
.ml-app-shell.theme-basic_erp .erp12-panel-heading small { display: block; margin-top: 2px; color: var(--erp12-muted); font-size: 8.7px; font-weight: 550; }
.ml-app-shell.theme-basic_erp .erp12-panel-badge {
  padding: 4px 7px;
  border: 1px solid rgba(var(--erp12-primary-rgb), .14);
  border-radius: 999px;
  background: rgba(var(--erp12-primary-rgb), .06);
  color: var(--erp12-primary-deep);
  font-size: 8px;
  font-weight: 750;
  white-space: nowrap;
}
.ml-app-shell.theme-basic_erp .erp12-table-scroll { width: 100%; overflow: auto; }
.ml-app-shell.theme-basic_erp .erp12-data-table { min-width: 680px; }
.ml-app-shell.theme-basic_erp .erp12-number-cell { font-weight: 800; color: var(--erp12-primary-deep); }
.ml-app-shell.theme-basic_erp .erp12-table-action {
  min-width: 58px;
  min-height: 29px !important;
  padding: 4px 9px !important;
  border: 1px solid var(--erp12-primary) !important;
  border-radius: 4px !important;
  background: var(--erp12-primary) !important;
  color: #fff !important;
  font-size: 9.5px !important;
  font-weight: 750 !important;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-empty-cell,
.ml-app-shell.theme-basic_erp .erp12-empty-panel { padding: 16px; text-align: center; color: var(--erp12-muted); font-size: 10px; }

.ml-app-shell.theme-basic_erp .erp12-session-list { margin: 0; padding: 4px 12px 10px; }
.ml-app-shell.theme-basic_erp .erp12-session-list > div {
  display: grid;
  grid-template-columns: 88px minmax(0,1fr);
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid #edf1f5;
}
.ml-app-shell.theme-basic_erp .erp12-session-list > div:last-child { border-bottom: 0; }
.ml-app-shell.theme-basic_erp .erp12-session-list dt { color: var(--erp12-muted); font-size: 9px; font-weight: 650; }
.ml-app-shell.theme-basic_erp .erp12-session-list dd { margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; color: #263a53; font-size: 10px; font-weight: 750; }

.ml-app-shell.theme-basic_erp .erp12-activity-list { padding: 4px 10px 10px; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button {
  width: 100%;
  min-height: 52px !important;
  display: grid !important;
  grid-template-columns: 11px minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 3px !important;
  border: 0 !important;
  border-bottom: 1px solid #edf1f5 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--erp12-text) !important;
  text-align: left !important;
}
.ml-app-shell.theme-basic_erp .erp12-activity-list button:last-child { border-bottom: 0 !important; }
.ml-app-shell.theme-basic_erp .erp12-activity-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--erp12-accent); }
.ml-app-shell.theme-basic_erp .erp12-activity-list button span:nth-child(2) { min-width: 0; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button strong { display: block; color: #31465f; font-size: 9.5px; line-height: 1.3; font-weight: 700; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button small { display: block; margin-top: 2px; color: var(--erp12-muted); font-size: 8px; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button em { color: var(--erp12-primary); font-size: 8.5px; font-style: normal; font-weight: 750; }

.ml-app-shell.theme-basic_erp .erp12-quick-actions {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 7px;
  padding: 10px;
}
.ml-app-shell.theme-basic_erp .erp12-quick-actions button {
  min-height: 54px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 7px 9px !important;
  border: 1px solid #d8e2ec !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #31465f !important;
  box-shadow: none !important;
  text-align: left !important;
}
.ml-app-shell.theme-basic_erp .erp12-quick-actions button:hover { background: rgba(var(--erp12-primary-rgb), .05) !important; border-color: rgba(var(--erp12-primary-rgb), .24) !important; }
.ml-app-shell.theme-basic_erp .erp12-quick-actions button > span {
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  background: rgba(var(--erp12-primary-rgb), .08);
  color: var(--erp12-primary);
  font-size: 17px;
}
.ml-app-shell.theme-basic_erp .erp12-quick-actions button strong { font-size: 9.5px; font-weight: 750; }

.ml-app-shell.theme-basic_erp .erp12-alert {
  padding: 9px 11px;
  border-radius: 5px;
  border: 1px solid var(--erp12-line);
  font-size: 10.5px;
  font-weight: 650;
}
.ml-app-shell.theme-basic_erp .erp12-alert-danger { background: #fff6f6; border-color: #efcaca; color: #a32929; }

/* Legacy Basic dashboard class compatibility so HD / loading states inherit V12. */
.ml-app-shell.theme-basic_erp .basic-vb-dashboard { width: 100%; }
.ml-app-shell.theme-basic_erp .basic-vb-group {
  margin: 0 0 10px !important;
  padding: 10px !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: 7px !important;
  background: #fff !important;
  box-shadow: none !important;
}
.ml-app-shell.theme-basic_erp .basic-vb-group-caption,
.ml-app-shell.theme-basic_erp .basic-vb-group-title {
  color: var(--erp12-primary) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

/* --------------------------------------------------------------------------
   Portalled modals
   -------------------------------------------------------------------------- */
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"]:not([data-workflow-label-modal="true"]):not([data-preserve-theme-design="true"]),
html[data-erp-theme="basic_erp"] body [role="dialog"]:not([data-workflow-label-modal="true"]):not([data-preserve-theme-design="true"]) {
  border-radius: 8px !important;
  border: 1px solid #9db3c9 !important;
  background: #fff !important;
  box-shadow: 0 22px 60px rgba(25, 55, 90, .24) !important;
  color: var(--erp12-text) !important;
}

/* --------------------------------------------------------------------------
   Searchable native select overlay
   -------------------------------------------------------------------------- */
html[data-erp-theme="basic_erp"] body .vb-select-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483200;
  background: rgba(20, 40, 65, .20);
}
html[data-erp-theme="basic_erp"] body .vb-select-window {
  position: fixed;
  max-height: min(430px, calc(100vh - 24px));
  overflow: hidden;
  border: 1px solid #91a9c0;
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 22px 60px rgba(20, 45, 74, .27);
}
html[data-erp-theme="basic_erp"] body .vb-select-caption {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px 6px 12px;
  background: linear-gradient(105deg, var(--erp12-primary-deep), var(--erp12-primary));
  color: #fff;
}
html[data-erp-theme="basic_erp"] body .vb-select-caption span { flex: 1; font-size: 11px; font-weight: 750; }
html[data-erp-theme="basic_erp"] body .vb-select-caption button {
  width: 29px;
  height: 27px;
  min-height: 27px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 4px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  font-size: 18px !important;
}
html[data-erp-theme="basic_erp"] body .vb-select-search-row {
  display: grid;
  grid-template-columns: 70px minmax(0,1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  background: #f7faff;
  border-bottom: 1px solid var(--erp12-line);
}
html[data-erp-theme="basic_erp"] body .vb-select-search-row label { font-size: 10px; font-weight: 700; color: #41566f; }
html[data-erp-theme="basic_erp"] body .vb-select-search-row input {
  width: 100%;
  height: 36px;
  min-height: 36px;
  padding: 6px 8px;
  border: 1px solid #bccada;
  border-radius: 4px;
  outline: none;
  font-size: 11px;
}
html[data-erp-theme="basic_erp"] body .vb-select-search-row input:focus { border-color: var(--erp12-primary); box-shadow: 0 0 0 2px rgba(var(--erp12-primary-rgb), .10); }
html[data-erp-theme="basic_erp"] body .vb-select-search-row button {
  min-height: 36px;
  padding: 5px 10px;
  border: 1px solid #bccada;
  border-radius: 4px;
  background: #fff;
  color: #32465e;
  font-size: 10px;
  font-weight: 700;
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-head,
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button {
  display: grid;
  grid-template-columns: 160px minmax(0,1fr);
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-head {
  min-height: 30px;
  align-items: center;
  background: var(--erp12-primary);
  color: #fff;
  border-bottom: 1px solid var(--erp12-primary-deep);
  font-size: 9px;
  font-weight: 750;
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-head span,
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button span { padding: 5px 8px; border-right: 1px solid rgba(255,255,255,.20); }
html[data-erp-theme="basic_erp"] body .vb-select-grid-body { max-height: 270px; overflow: auto; }
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button {
  width: 100%;
  min-height: 32px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #e2e8ef;
  background: #fff;
  color: #293c54;
  text-align: left;
  font-size: 10px;
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button:nth-child(even) { background: #f9fbfd; }
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button:hover,
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button.is-selected { background: rgba(var(--erp12-primary-rgb), .09); }
html[data-erp-theme="basic_erp"] body .vb-select-empty { padding: 20px; text-align: center; color: var(--erp12-muted); font-size: 10px; }
html[data-erp-theme="basic_erp"] body .vb-select-footer {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 5px 8px;
  border-top: 1px solid var(--erp12-line);
  background: #f7f9fb;
  color: var(--erp12-muted);
  font-size: 8.5px;
}

/* --------------------------------------------------------------------------
   Special workflow density rules — presentation only
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-form-grid,
.ml-app-shell.theme-basic_erp .erp12-route-surface :is(.form-grid,.fields-grid,.field-grid,.details-grid,[class*="form-grid" i],[class*="fields-grid" i],[class*="field-grid" i],[class*="details-grid" i]):has([data-basic-erp-field-row="true"]) {
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 10px 14px !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-section-icon,
.ml-app-shell.theme-basic_erp .erp12-route-surface :is(.cs-icon-badge,[class*="page-icon" i],[class*="section-icon" i],[class*="header-icon" i]):not(button *):not(a *) {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Keep Label Designer and printable/professional reports visually intact.
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface .label-designer-page,
.ml-app-shell.theme-basic_erp .erp12-route-surface .label-designer-page *,
.ml-app-shell.theme-basic_erp .erp12-route-surface .professional-report,
.ml-app-shell.theme-basic_erp .erp12-route-surface .professional-report *,
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-print-layout="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-print-layout="true"] * {
  font-family: inherit;
}

/* --------------------------------------------------------------------------
   Responsive density
   -------------------------------------------------------------------------- */
@media (max-width: 1380px) {
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 220px; min-width: 220px; padding-left: 12px; padding-right: 12px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy strong,
  .ml-app-shell.theme-basic_erp .erp12-brand-copy small { max-width: 142px; }
  .ml-app-shell.theme-basic_erp .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-nav-group > summary { padding-left: 12px; padding-right: 12px; font-size: 11.5px !important; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { width: 220px; }
  .ml-app-shell.theme-basic_erp .erp12-user-copy { display: none; }
  .ml-app-shell.theme-basic_erp .erp12-kpi-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .ml-app-shell.theme-basic_erp .erp12-quick-actions { grid-template-columns: repeat(4,minmax(0,1fr)); }
}

@media (max-width: 1120px) {
  .ml-app-shell.theme-basic_erp .erp12-topbar { min-height: 62px; }
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 190px; min-width: 190px; min-height: 62px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-logo { width: 38px; height: 38px; flex-basis: 38px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy strong { font-size: 15px; max-width: 115px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy small { display: none; }
  .ml-app-shell.theme-basic_erp .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-nav-group > summary { min-height: 62px; }
  .ml-app-shell.theme-basic_erp .erp12-header-tools { padding: 0 8px; gap: 6px; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { width: 180px; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface .inw-form-grid,
  .ml-app-shell.theme-basic_erp .erp12-route-surface :is(.form-grid,.fields-grid,.field-grid,.details-grid,[class*="form-grid" i],[class*="fields-grid" i],[class*="field-grid" i],[class*="details-grid" i]):has([data-basic-erp-field-row="true"]) { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .ml-app-shell.theme-basic_erp .erp12-dashboard-main-grid { grid-template-columns: 1fr; }
  .ml-app-shell.theme-basic_erp .erp12-dashboard-side { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 820px) {
  .ml-app-shell.theme-basic_erp.erp12-shell { overflow: auto !important; height: auto !important; min-height: 100vh !important; }
  .ml-app-shell.theme-basic_erp .erp12-topbar { flex-wrap: wrap; min-height: auto; }
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 100%; min-width: 100%; min-height: 58px; }
  .ml-app-shell.theme-basic_erp .erp12-topnav { order: 3; width: 100%; min-height: 48px; background: rgba(0,0,0,.05); }
  .ml-app-shell.theme-basic_erp .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-nav-group > summary { min-height: 48px; }
  .ml-app-shell.theme-basic_erp .erp12-header-tools { width: 100%; padding: 7px 10px; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { flex: 1 1 auto; width: auto; }
  .ml-app-shell.theme-basic_erp .erp12-utilitybar { flex-wrap: wrap; }
  .ml-app-shell.theme-basic_erp .erp12-workspace { min-height: 650px; padding: 8px; }
  .ml-app-shell.theme-basic_erp .erp12-bottom-dock { min-height: 72px; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] { grid-template-columns: 1fr !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface .inw-form-grid,
  .ml-app-shell.theme-basic_erp .erp12-route-surface :is(.form-grid,.fields-grid,.field-grid,.details-grid,[class*="form-grid" i],[class*="fields-grid" i],[class*="field-grid" i],[class*="details-grid" i]):has([data-basic-erp-field-row="true"]) { grid-template-columns: 1fr !important; }
  .ml-app-shell.theme-basic_erp .erp12-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ml-app-shell.theme-basic_erp .erp12-quick-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ml-app-shell.theme-basic_erp .erp12-dashboard-side { grid-template-columns: 1fr; }
}

@media (max-width: 540px) {
  .ml-app-shell.theme-basic_erp .erp12-kpi-grid { grid-template-columns: 1fr; }
  .ml-app-shell.theme-basic_erp .erp12-quick-actions { grid-template-columns: 1fr; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] { grid-template-columns: 1fr !important; gap: 3px !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child,
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child { grid-column: 1 !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]),
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]) { grid-column: 1 !important; }
  .ml-app-shell.theme-basic_erp .erp12-window-title { padding-left: 9px; padding-right: 9px; }
  .ml-app-shell.theme-basic_erp .erp12-title-context { display: none; }
  .ml-app-shell.theme-basic_erp .erp12-statusbar > span:nth-child(2),
  .ml-app-shell.theme-basic_erp .erp12-statusbar > span:nth-child(3) { display: none; }
}


/* ===== styles/basicErpReferenceThemeV13.css ===== */
/* ============================================================================
   BASIC ERP / DESKTOP OPERATIONS THEME V13
   ----------------------------------------------------------------------------
   Presentation-only theme. Every rule is scoped to Theme 3 so Classic Portal
   and Modern Dashboard retain their original visual design.
   V13 aligns the top module menu with the bottom dock and fixes all Theme-3
   dropdown stacking/overflow without touching operational logic.
   ========================================================================== */

.ml-app-shell.theme-basic_erp,
html[data-erp-theme="basic_erp"] body {
  --erp12-primary: var(--erp-primary, #075aa8);
  --erp12-primary-deep: var(--erp-primary-deep, #063d75);
  --erp12-secondary: var(--erp-secondary, #0a87b5);
  --erp12-accent: var(--erp-accent, #f59e0b);
  --erp12-primary-rgb: var(--erp-primary-rgb, 7, 90, 168);
  --erp12-secondary-rgb: var(--erp-secondary-rgb, 10, 135, 181);
  --erp12-accent-rgb: var(--erp-accent-rgb, 245, 158, 11);
  --erp12-bg: #eef4fa;
  --erp12-surface: #ffffff;
  --erp12-surface-soft: #f7faff;
  --erp12-line: #d7e1ec;
  --erp12-line-strong: #b8c8da;
  --erp12-text: #16233a;
  --erp12-muted: #607087;
  --erp12-danger: #dc2626;
  --erp12-success: #0b9a49;
  --erp12-warning: #d97706;
  --erp12-radius: 7px;
  --erp12-control-h: 38px;
  --erp12-label-w: 112px;
  --erp12-font: var(--erp-font-family, Inter, "Segoe UI", Arial, sans-serif);
}

html[data-erp-theme="basic_erp"],
html[data-erp-theme="basic_erp"] body,
html[data-erp-theme="basic_erp"] #root {
  margin: 0 !important;
  min-height: 100% !important;
  background: var(--erp12-bg) !important;
}

.ml-app-shell.theme-basic_erp.erp12-shell {
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 92% 8%, rgba(var(--erp12-secondary-rgb), .08), transparent 28%),
    linear-gradient(180deg, #f6f9fd 0%, var(--erp12-bg) 100%) !important;
  color: var(--erp12-text) !important;
  font-family: var(--erp12-font) !important;
  font-size: 13px !important;
}

.ml-app-shell.theme-basic_erp.erp12-shell *,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] * {
  box-sizing: border-box;
  font-family: var(--erp12-font) !important;
}

/* --------------------------------------------------------------------------
   Top application bar
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-topbar {
  min-height: 82px;
  flex: 0 0 auto;
  display: flex;
  align-items: stretch;
  gap: 0;
  background: linear-gradient(105deg, var(--erp12-primary-deep), var(--erp12-primary) 58%, var(--erp12-secondary));
  border-bottom: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 4px 16px rgba(15, 43, 78, .20);
  color: #fff;
  position: relative;
  z-index: 10000;
  overflow: visible !important;
  isolation: isolate;
}

.ml-app-shell.theme-basic_erp .erp12-brand {
  width: 255px;
  min-width: 255px;
  min-height: 82px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 18px;
  background: rgba(255,255,255,.97);
  border-right: 1px solid rgba(255,255,255,.25);
  color: var(--erp12-primary-deep) !important;
  text-decoration: none !important;
  box-shadow: 2px 0 12px rgba(10, 37, 70, .12);
}

.ml-app-shell.theme-basic_erp .erp12-brand-logo {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: var(--erp12-primary);
  font-size: 28px;
  font-weight: 900;
  overflow: hidden;
}

.ml-app-shell.theme-basic_erp .erp12-brand-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ml-app-shell.theme-basic_erp .erp12-brand-copy {
  min-width: 0;
  display: block;
}

.ml-app-shell.theme-basic_erp .erp12-brand-copy strong {
  display: block;
  max-width: 172px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  line-height: 1.1;
  font-weight: 800;
  color: var(--erp12-primary-deep) !important;
}

.ml-app-shell.theme-basic_erp .erp12-brand-copy small {
  display: block;
  margin-top: 3px;
  max-width: 172px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 9.5px;
  font-weight: 600;
  color: #50637a !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 7px 8px;
  overflow: visible !important;
  scrollbar-width: none;
  position: relative;
  z-index: 10020;
}
.ml-app-shell.theme-basic_erp .erp12-topnav::-webkit-scrollbar { display: none; }

/* Top modules intentionally mirror the bottom dock: icon above, label below. */
.ml-app-shell.theme-basic_erp .erp12-nav-link,
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary {
  width: auto;
  min-width: 104px;
  max-width: 142px;
  min-height: 66px;
  padding: 6px 9px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  white-space: nowrap;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 6px !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
  color: #fff !important;
  text-decoration: none !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  text-align: center;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-top-dock-icon {
  min-height: 25px;
  display: grid;
  place-items: center;
  font-size: 22px !important;
  line-height: 1 !important;
  opacity: 1 !important;
}
.ml-app-shell.theme-basic_erp .erp12-top-dock-label {
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px !important;
  line-height: 1.1 !important;
  opacity: 1 !important;
}
.ml-app-shell.theme-basic_erp .erp12-top-dock-caret {
  position: absolute;
  right: 7px;
  top: 7px;
  font-size: 10px !important;
  opacity: .82 !important;
}

.ml-app-shell.theme-basic_erp .erp12-nav-link:hover,
.ml-app-shell.theme-basic_erp .erp12-nav-link.is-active,
.ml-app-shell.theme-basic_erp .erp12-nav-group:hover > summary,
.ml-app-shell.theme-basic_erp .erp12-nav-group.is-active > summary,
.ml-app-shell.theme-basic_erp .erp12-nav-group[open] > summary {
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: inset 0 -3px 0 #fff !important;
}

.ml-app-shell.theme-basic_erp .erp12-nav-group {
  position: relative;
  flex: 0 0 auto;
  z-index: 10030;
}
.ml-app-shell.theme-basic_erp .erp12-nav-group[open] { z-index: 10060; }
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary { position: relative; list-style: none; }
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary::-webkit-details-marker { display: none; }

.ml-app-shell.theme-basic_erp .erp12-nav-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  width: 280px;
  max-height: min(520px, calc(100vh - 118px));
  overflow: auto;
  padding: 7px;
  border: 1px solid var(--erp12-line-strong);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 20px 50px rgba(17, 45, 78, .28);
  z-index: 10080;
}

.ml-app-shell.theme-basic_erp .erp12-nav-dropdown a {
  min-height: 36px;
  display: flex;
  align-items: center;
  padding: 7px 10px;
  border-radius: 5px;
  color: var(--erp12-text) !important;
  text-decoration: none !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}
.ml-app-shell.theme-basic_erp .erp12-nav-dropdown a:hover,
.ml-app-shell.theme-basic_erp .erp12-nav-dropdown a.is-active {
  background: rgba(var(--erp12-primary-rgb), .09) !important;
  color: var(--erp12-primary-deep) !important;
}

.ml-app-shell.theme-basic_erp .erp12-header-tools {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
}

.ml-app-shell.theme-basic_erp .erp12-global-search {
  width: clamp(210px, 20vw, 320px);
  position: relative;
}

.ml-app-shell.theme-basic_erp .erp12-global-search > input {
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 38px 0 12px !important;
  border: 1px solid rgba(255,255,255,.46) !important;
  border-radius: 7px !important;
  outline: none !important;
  background: rgba(255,255,255,.97) !important;
  color: #22324a !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.10) !important;
  font-size: 12px !important;
  font-weight: 550 !important;
}

.ml-app-shell.theme-basic_erp .erp12-global-search > span {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #40546e;
  font-size: 19px;
  pointer-events: none;
}

.ml-app-shell.theme-basic_erp .erp12-search-results {
  position: absolute;
  top: 45px;
  left: 0;
  right: 0;
  max-height: 390px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--erp12-line-strong);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(20, 47, 80, .22);
  z-index: 1200;
}

.ml-app-shell.theme-basic_erp .erp12-search-results button {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 9px;
  border: 0 !important;
  border-bottom: 1px solid #edf1f5 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: var(--erp12-text) !important;
  text-align: left;
  box-shadow: none !important;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-search-results button:hover { background: rgba(var(--erp12-primary-rgb), .07) !important; }
.ml-app-shell.theme-basic_erp .erp12-search-results button strong { font-size: 11.5px; }
.ml-app-shell.theme-basic_erp .erp12-search-results button small { font-size: 9px; color: var(--erp12-muted); }
.ml-app-shell.theme-basic_erp .erp12-search-empty { padding: 14px; font-size: 11px; color: var(--erp12-muted); }

.ml-app-shell.theme-basic_erp .erp12-header-tools .ml-icon-action {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  border-radius: 7px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-user-chip {
  max-width: 190px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
}
.ml-app-shell.theme-basic_erp .erp12-user-avatar {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.96);
  color: var(--erp12-primary-deep);
  border: 2px solid rgba(255,255,255,.52);
  font-size: 13px;
  font-weight: 850;
}
.ml-app-shell.theme-basic_erp .erp12-user-copy { min-width: 0; display: block; }
.ml-app-shell.theme-basic_erp .erp12-user-copy strong,
.ml-app-shell.theme-basic_erp .erp12-user-copy small {
  display: block;
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff !important;
}
.ml-app-shell.theme-basic_erp .erp12-user-copy strong { font-size: 11px; font-weight: 750; }
.ml-app-shell.theme-basic_erp .erp12-user-copy small { margin-top: 2px; font-size: 8.5px; opacity: .82; }

.ml-app-shell.theme-basic_erp .erp12-logout {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 11px !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  border-radius: 5px !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  box-shadow: none !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
}
.ml-app-shell.theme-basic_erp .erp12-logout:hover { background: rgba(255,255,255,.18) !important; }

/* --------------------------------------------------------------------------
   Utility / command ribbons
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-utilitybar {
  min-height: 47px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 18px;
  background: #fff;
  border-bottom: 1px solid var(--erp12-line);
  box-shadow: 0 2px 8px rgba(35, 62, 91, .05);
  position: relative;
  z-index: 300;
}
.ml-app-shell.theme-basic_erp .erp12-route-context {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #33465f;
  font-size: 11.5px;
}
.ml-app-shell.theme-basic_erp .erp12-route-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--erp12-primary);
  box-shadow: 0 0 0 4px rgba(var(--erp12-primary-rgb), .09);
}
.ml-app-shell.theme-basic_erp .erp12-utility-spacer { flex: 1 1 auto; }
.ml-app-shell.theme-basic_erp .erp12-fy-select {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: var(--erp12-muted);
}
.ml-app-shell.theme-basic_erp .erp12-fy-select select {
  width: auto !important;
  min-width: 150px !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 28px 0 9px !important;
  border: 1px solid var(--erp12-line-strong) !important;
  border-radius: 5px !important;
  background-color: #fff !important;
  color: var(--erp12-text) !important;
  box-shadow: none !important;
  font-size: 10.5px !important;
  font-weight: 650 !important;
}
.ml-app-shell.theme-basic_erp .erp12-session-date {
  white-space: nowrap;
  color: #42566f;
  font-size: 10.5px;
  font-weight: 700;
}

.ml-app-shell.theme-basic_erp .erp12-command-ribbon {
  min-height: 37px;
  flex: 0 0 auto;
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 1px;
  overflow-x: auto;
  padding: 0 12px;
  background: linear-gradient(90deg, rgba(var(--erp12-primary-rgb), .10), rgba(var(--erp12-secondary-rgb), .10));
  border-bottom: 1px solid rgba(var(--erp12-primary-rgb), .18);
  scrollbar-width: none;
}
.ml-app-shell.theme-basic_erp .erp12-command-ribbon::-webkit-scrollbar { display: none; }
.ml-app-shell.theme-basic_erp .erp12-command-ribbon a {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  border-bottom: 2px solid transparent;
  color: #42566f !important;
  text-decoration: none !important;
  white-space: nowrap;
  font-size: 10.5px;
  font-weight: 700;
}
.ml-app-shell.theme-basic_erp .erp12-command-ribbon a:hover,
.ml-app-shell.theme-basic_erp .erp12-command-ribbon a.is-active {
  background: rgba(255,255,255,.66);
  border-bottom-color: var(--erp12-primary);
  color: var(--erp12-primary-deep) !important;
}

/* --------------------------------------------------------------------------
   Main desktop work window
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-workspace {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
  align-items: stretch;
  padding: 10px 18px 8px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.ml-app-shell.theme-basic_erp .erp12-work-window {
  width: min(100%, 1660px);
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #fff;
  border: 1px solid #8fa8c2;
  border-radius: 7px 7px 4px 4px;
  box-shadow: 0 10px 26px rgba(30, 62, 98, .13);
}

.ml-app-shell.theme-basic_erp .erp12-window-tabs {
  height: 38px;
  min-height: 38px;
  display: flex;
  align-items: flex-end;
  gap: 2px;
  padding: 5px 8px 0;
  background: linear-gradient(180deg, #f7faff 0%, #e5edf7 100%);
  border-bottom: 1px solid #b7c9dc;
}
.ml-app-shell.theme-basic_erp .erp12-window-tabs > a,
.ml-app-shell.theme-basic_erp .erp12-active-tab {
  height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  border: 1px solid #b7c9dc;
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
  background: #edf3f9;
  color: #42566f !important;
  text-decoration: none !important;
  white-space: nowrap;
  font-size: 10.5px;
  font-weight: 700;
}
.ml-app-shell.theme-basic_erp .erp12-window-tabs > a.is-active,
.ml-app-shell.theme-basic_erp .erp12-active-tab {
  background: #fff;
  color: var(--erp12-primary-deep) !important;
  box-shadow: inset 0 2px 0 var(--erp12-primary);
}
.ml-app-shell.theme-basic_erp .erp12-window-spacer { flex: 1 1 auto; }
.ml-app-shell.theme-basic_erp .erp12-window-control {
  width: 28px;
  height: 27px;
  display: grid;
  place-items: center;
  margin-bottom: 4px;
  border-radius: 4px;
  color: var(--erp12-primary-deep);
  font-size: 15px;
  font-weight: 700;
}

.ml-app-shell.theme-basic_erp .erp12-window-title {
  min-height: 47px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 14px;
  background: #fff;
  border-bottom: 1px solid var(--erp12-line);
  color: var(--erp12-primary-deep);
}
.ml-app-shell.theme-basic_erp .erp12-title-icon {
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  background: rgba(var(--erp12-primary-rgb), .09);
  color: var(--erp12-primary);
  font-size: 16px;
}
.ml-app-shell.theme-basic_erp .erp12-window-title strong { font-size: 15px; font-weight: 800; }
.ml-app-shell.theme-basic_erp .erp12-title-context {
  margin-left: auto;
  padding: 4px 8px;
  border: 1px solid rgba(var(--erp12-primary-rgb), .15);
  border-radius: 4px;
  background: rgba(var(--erp12-primary-rgb), .05);
  color: #52657c;
  font-size: 9.5px;
  font-weight: 650;
}

.ml-app-shell.theme-basic_erp .erp12-content {
  min-height: 0;
  flex: 1 1 auto;
  width: 100%;
  overflow: auto !important;
  padding: 10px 12px 12px !important;
  background: #fbfdff !important;
  overscroll-behavior: contain;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface {
  width: min(100%, 1620px);
  min-height: 100%;
  margin: 0 auto;
  color: var(--erp12-text);
}
.ml-app-shell.theme-basic_erp .erp12-loading-cell {
  min-height: 220px;
  display: grid;
  place-items: center;
  color: var(--erp12-muted);
  font-size: 12px;
  font-weight: 700;
}

.ml-app-shell.theme-basic_erp .erp12-statusbar {
  min-height: 29px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0;
  background: #f4f7fa;
  border-top: 1px solid var(--erp12-line);
  color: #53667d;
  font-size: 9px;
}
.ml-app-shell.theme-basic_erp .erp12-statusbar > span {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border-right: 1px solid var(--erp12-line);
  white-space: nowrap;
}
.ml-app-shell.theme-basic_erp .erp12-statusbar strong { color: #30445d; font-weight: 750; }
.ml-app-shell.theme-basic_erp .erp12-status-spacer { flex: 1 1 auto; border-right: 0 !important; }

/* --------------------------------------------------------------------------
   Bottom ERP dock — second half of permission-filtered modules
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-bottom-dock {
  min-height: 78px;
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  padding: 7px 12px 8px;
  background: linear-gradient(100deg, var(--erp12-primary-deep), var(--erp12-primary) 58%, var(--erp12-secondary));
  border-top: 1px solid rgba(255,255,255,.20);
  box-shadow: 0 -4px 15px rgba(18, 49, 84, .15);
  overflow: hidden;
  position: relative;
  z-index: 250;
}
.ml-app-shell.theme-basic_erp .erp12-bottom-dock-inner {
  width: max-content;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 10px 2px;
  display: flex;
  justify-content: flex-start;
  gap: 6px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-padding-inline: 10px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.25) transparent;
}
.ml-app-shell.theme-basic_erp .erp12-bottom-dock-inner > :first-child { margin-left: 0 !important; }
.ml-app-shell.theme-basic_erp .erp12-bottom-dock-inner > :last-child { margin-right: 0 !important; }
.ml-app-shell.theme-basic_erp .erp12-bottom-dock a {
  min-width: 112px;
  min-height: 62px;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 6px 10px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 6px;
  background: rgba(255,255,255,.055);
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: none;
  font-size: 9.5px;
  font-weight: 700;
  text-align: center;
}
.ml-app-shell.theme-basic_erp .erp12-bottom-dock a:hover,
.ml-app-shell.theme-basic_erp .erp12-bottom-dock a.is-active {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.28);
  box-shadow: inset 0 -3px 0 #fff;
}
.ml-app-shell.theme-basic_erp .erp12-dock-icon {
  min-height: 25px;
  display: grid;
  place-items: center;
  font-size: 23px;
  line-height: 1;
}

/* --------------------------------------------------------------------------
   Hide only Theme-3 decorative / duplicated workflow chrome
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-operational-steps="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-operational-steps-container="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-page-hero="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-modern-background,
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-modern-hero,
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-progress-strip,
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-modern-icon="true"] {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Page surfaces: clean ERP aesthetics, not a generic CSS reset
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface > * {
  max-width: 100% !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is(section, article, fieldset):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]) {
  border-color: var(--erp12-line) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is([class*="card" i],[class*="panel" i],[class*="glass" i]):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]) {
  background: #fff !important;
  background-image: none !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: var(--erp12-radius) !important;
  box-shadow: 0 2px 9px rgba(28, 60, 95, .055) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is([class*="card" i],[class*="panel" i],[class*="glass" i]) :is([class*="card" i],[class*="panel" i],[class*="glass" i]):not(.label-designer-page *):not(.professional-report *) {
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [style*="linear-gradient"]:not(button):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]) {
  background-image: none !important;
}

/* Small subsection labels like the supplied ERP reference. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-section-title="true"]:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-section-header,
.ml-app-shell.theme-basic_erp .erp12-route-surface .cs-section-header {
  margin: 8px 0 6px !important;
  padding: 0 2px 5px !important;
  min-height: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(var(--erp12-primary-rgb), .18) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--erp12-primary) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-section-title="true"]:is(h1,h2,h3,h4,h5,h6,legend),
.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-section-header :is(h1,h2,h3,h4),
.ml-app-shell.theme-basic_erp .erp12-route-surface .cs-section-header :is(h1,h2,h3,h4) {
  font-size: 12px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--erp12-primary) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-section-header="true"] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-form-content-card {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 10px !important;
  background: #fff !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: var(--erp12-radius) !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Symmetric 3-field form engine
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface form,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] form {
  width: 100% !important;
  max-width: 1580px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] {
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  column-gap: 14px !important;
  row-gap: 10px !important;
  align-items: start !important;
  margin: 0 0 10px !important;
  padding: 12px !important;
  background: #fff !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: var(--erp12-radius) !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-shell="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-shell="true"] {
  display: contents !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"] > :not([data-basic-erp-field-row="true"]):not([data-basic-erp-field-shell="true"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] > :not([data-basic-erp-field-row="true"]):not([data-basic-erp-field-shell="true"]) {
  grid-column: 1 / -1 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] {
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--erp12-control-h) !important;
  display: grid !important;
  grid-template-columns: minmax(96px, var(--erp12-label-w)) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-wide="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-wide="true"] {
  grid-column: 1 / -1 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child {
  grid-column: 1 !important;
  grid-row: auto !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 4px 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #33465f !important;
  box-shadow: none !important;
  font-size: 11.5px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"] {
  position: relative !important;
  font-size: 0 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"]::before,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"]::before {
  content: attr(data-basic-erp-label);
  grid-column: 1;
  display: flex;
  align-items: center;
  min-height: 34px;
  padding: 4px 2px;
  color: #33465f;
  font-size: 11.5px;
  line-height: 1.2;
  font-weight: 700;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"] > :is(input,select,textarea,[role="combobox"],div),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"] > :is(input,select,textarea,[role="combobox"],div) {
  grid-column: 2 !important;
  min-width: 0 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]) {
  grid-column: 2 !important;
  min-width: 0 !important;
  width: 100% !important;
}

/* Bootstrap-like controls, driven by company branding. */
.ml-app-shell.theme-basic_erp .erp12-route-surface input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface select:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="combobox"]:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] select,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [role="combobox"] {
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--erp12-control-h) !important;
  height: var(--erp12-control-h) !important;
  margin: 0 !important;
  padding: 7px 9px !important;
  border: 1px solid #c4d0dd !important;
  border-radius: 4px !important;
  outline: none !important;
  background: #fff !important;
  background-image: none !important;
  color: #1e2c40 !important;
  box-shadow: inset 0 1px 2px rgba(22, 44, 69, .025) !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 550 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea {
  height: auto !important;
  min-height: 72px !important;
  resize: vertical !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface input:focus:not([type="checkbox"]):not([type="radio"]),
.ml-app-shell.theme-basic_erp .erp12-route-surface select:focus,
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:focus,
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="combobox"]:focus-within,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input:focus:not([type="checkbox"]):not([type="radio"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] select:focus,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea:focus {
  border-color: var(--erp12-primary) !important;
  box-shadow: 0 0 0 2px rgba(var(--erp12-primary-rgb), .12) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface input::placeholder,
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea::placeholder {
  color: #8b99aa !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface input[type="checkbox"],
.ml-app-shell.theme-basic_erp .erp12-route-surface input[type="radio"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input[type="checkbox"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input[type="radio"] {
  accent-color: var(--erp12-primary) !important;
}

/* --------------------------------------------------------------------------
   Buttons and action bars
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface button:not(.label-designer-page *):not(.professional-report *):not(.erp12-kpi-card):not(.erp12-table-action),
.ml-app-shell.theme-basic_erp .erp12-route-surface a[class*="btn" i]:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface a[class*="button" i]:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button:not([data-preserve-theme-design="true"]) {
  min-height: 38px !important;
  padding: 7px 14px !important;
  border: 1px solid #b8c7d8 !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #fff, #f4f7fa) !important;
  color: #30445d !important;
  box-shadow: 0 1px 2px rgba(21, 47, 77, .05) !important;
  font-size: 11.5px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  cursor: pointer;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface button[data-basic-erp-button="primary"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button[data-basic-erp-button="primary"] {
  border-color: var(--erp12-primary) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--erp12-primary) 90%, white), var(--erp12-primary)) !important;
  color: #fff !important;
  box-shadow: 0 2px 5px rgba(var(--erp12-primary-rgb), .18) !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface button[data-basic-erp-button="danger"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button[data-basic-erp-button="danger"] {
  border-color: #e5a3a3 !important;
  background: #fff6f6 !important;
  color: #b42323 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface button:hover:not(:disabled):not(.erp12-kpi-card),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button:hover:not(:disabled) {
  filter: brightness(.985);
}
.ml-app-shell.theme-basic_erp .erp12-route-surface button:disabled,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button:disabled { opacity: .55 !important; cursor: not-allowed !important; }

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-toolbar="true"] {
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 8px 0 !important;
  padding: 8px !important;
  background: #f7faff !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: 5px !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Bootstrap-style data tables and reports
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) {
  width: 100% !important;
  max-width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  background: #fff !important;
  color: #24364d !important;
  font-size: 11.5px !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) th,
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) th,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) td {
  min-height: 34px !important;
  padding: 7px 8px !important;
  border: 1px solid #d8e1eb !important;
  vertical-align: middle !important;
  line-height: 1.25 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) th,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) th {
  background: linear-gradient(180deg, color-mix(in srgb, var(--erp12-primary) 90%, white), var(--erp12-primary)) !important;
  color: #fff !important;
  border-color: color-mix(in srgb, var(--erp12-primary) 80%, #ffffff) !important;
  font-size: 10.5px !important;
  font-weight: 750 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) tbody tr:nth-child(even) td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) tbody tr:nth-child(even) td {
  background: rgba(var(--erp12-primary-rgb), .022) !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) tbody tr:hover td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) tbody tr:hover td {
  background: rgba(var(--erp12-primary-rgb), .075) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table button:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table button {
  min-height: 30px !important;
  height: 30px !important;
  padding: 4px 9px !important;
  border-radius: 4px !important;
  font-size: 10px !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [class*="filter" i]:has(input,select,button):not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface [class*="search" i]:has(input,select,button):not(.label-designer-page *):not(.professional-report *) {
  border-radius: 5px !important;
}

/* Tabs inside routed modules. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="tablist"]:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface :is([class*="tabs" i],[class*="tab-list" i],[class*="tabbar" i]):not(.label-designer-page *):not(.professional-report *) {
  display: flex !important;
  gap: 2px !important;
  align-items: flex-end !important;
  padding: 5px 6px 0 !important;
  background: #edf3f9 !important;
  border: 1px solid var(--erp12-line) !important;
  border-bottom-color: #b7c9dc !important;
  border-radius: 6px 6px 0 0 !important;
  box-shadow: none !important;
  overflow-x: auto !important;
}

/* --------------------------------------------------------------------------
   Basic ERP dashboard - reference-inspired but live-data driven
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-dashboard {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ml-app-shell.theme-basic_erp .erp12-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 10px;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-card {
  min-width: 0;
  min-height: 112px !important;
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  padding: 13px 14px !important;
  border: 1px solid #d4e0ec !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: var(--erp12-text) !important;
  box-shadow: 0 3px 10px rgba(23, 56, 92, .06) !important;
  text-align: left !important;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-card:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--erp12-kpi-tone, var(--erp12-primary)) 35%, #d4e0ec) !important;
  box-shadow: 0 6px 16px rgba(23, 56, 92, .09) !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-icon {
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(145deg, color-mix(in srgb, var(--erp12-kpi-tone, var(--erp12-primary)) 82%, white), var(--erp12-kpi-tone, var(--erp12-primary)));
  color: #fff;
  box-shadow: 0 5px 12px color-mix(in srgb, var(--erp12-kpi-tone, var(--erp12-primary)) 22%, transparent);
  font-size: 24px;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-copy { min-width: 0; display: block; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy small,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy strong,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy em { display: block; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy small { color: #354861; font-size: 10.5px; font-weight: 750; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy strong { margin-top: 6px; color: #15243b; font-size: 20px; line-height: 1; font-weight: 850; font-style: normal; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy em { margin-top: 7px; color: var(--erp12-muted); font-size: 9px; line-height: 1.3; font-style: normal; font-weight: 600; }

.ml-app-shell.theme-basic_erp .erp12-dashboard-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 305px;
  gap: 10px;
  align-items: stretch;
}
.ml-app-shell.theme-basic_erp .erp12-dashboard-side { display: flex; flex-direction: column; gap: 10px; }
.ml-app-shell.theme-basic_erp .erp12-dashboard-panel {
  min-width: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid #d7e1ec;
  border-radius: 8px;
  box-shadow: 0 2px 9px rgba(25, 55, 90, .05);
}
.ml-app-shell.theme-basic_erp .erp12-dashboard-panel-main { min-height: 290px; }
.ml-app-shell.theme-basic_erp .erp12-panel-heading {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--erp12-line);
  background: linear-gradient(180deg,#fff,#fafcff);
}
.ml-app-shell.theme-basic_erp .erp12-panel-heading strong { display: block; color: var(--erp12-primary); font-size: 11.5px; font-weight: 800; }
.ml-app-shell.theme-basic_erp .erp12-panel-heading small { display: block; margin-top: 2px; color: var(--erp12-muted); font-size: 8.7px; font-weight: 550; }
.ml-app-shell.theme-basic_erp .erp12-panel-badge {
  padding: 4px 7px;
  border: 1px solid rgba(var(--erp12-primary-rgb), .14);
  border-radius: 999px;
  background: rgba(var(--erp12-primary-rgb), .06);
  color: var(--erp12-primary-deep);
  font-size: 8px;
  font-weight: 750;
  white-space: nowrap;
}
.ml-app-shell.theme-basic_erp .erp12-table-scroll { width: 100%; overflow: auto; }
.ml-app-shell.theme-basic_erp .erp12-data-table { min-width: 680px; }
.ml-app-shell.theme-basic_erp .erp12-number-cell { font-weight: 800; color: var(--erp12-primary-deep); }
.ml-app-shell.theme-basic_erp .erp12-table-action {
  min-width: 58px;
  min-height: 29px !important;
  padding: 4px 9px !important;
  border: 1px solid var(--erp12-primary) !important;
  border-radius: 4px !important;
  background: var(--erp12-primary) !important;
  color: #fff !important;
  font-size: 9.5px !important;
  font-weight: 750 !important;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-empty-cell,
.ml-app-shell.theme-basic_erp .erp12-empty-panel { padding: 16px; text-align: center; color: var(--erp12-muted); font-size: 10px; }

.ml-app-shell.theme-basic_erp .erp12-session-list { margin: 0; padding: 4px 12px 10px; }
.ml-app-shell.theme-basic_erp .erp12-session-list > div {
  display: grid;
  grid-template-columns: 88px minmax(0,1fr);
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid #edf1f5;
}
.ml-app-shell.theme-basic_erp .erp12-session-list > div:last-child { border-bottom: 0; }
.ml-app-shell.theme-basic_erp .erp12-session-list dt { color: var(--erp12-muted); font-size: 9px; font-weight: 650; }
.ml-app-shell.theme-basic_erp .erp12-session-list dd { margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; color: #263a53; font-size: 10px; font-weight: 750; }

.ml-app-shell.theme-basic_erp .erp12-activity-list { padding: 4px 10px 10px; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button {
  width: 100%;
  min-height: 52px !important;
  display: grid !important;
  grid-template-columns: 11px minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 3px !important;
  border: 0 !important;
  border-bottom: 1px solid #edf1f5 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--erp12-text) !important;
  text-align: left !important;
}
.ml-app-shell.theme-basic_erp .erp12-activity-list button:last-child { border-bottom: 0 !important; }
.ml-app-shell.theme-basic_erp .erp12-activity-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--erp12-accent); }
.ml-app-shell.theme-basic_erp .erp12-activity-list button span:nth-child(2) { min-width: 0; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button strong { display: block; color: #31465f; font-size: 9.5px; line-height: 1.3; font-weight: 700; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button small { display: block; margin-top: 2px; color: var(--erp12-muted); font-size: 8px; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button em { color: var(--erp12-primary); font-size: 8.5px; font-style: normal; font-weight: 750; }

.ml-app-shell.theme-basic_erp .erp12-quick-actions {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 7px;
  padding: 10px;
}
.ml-app-shell.theme-basic_erp .erp12-quick-actions button {
  min-height: 54px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 7px 9px !important;
  border: 1px solid #d8e2ec !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #31465f !important;
  box-shadow: none !important;
  text-align: left !important;
}
.ml-app-shell.theme-basic_erp .erp12-quick-actions button:hover { background: rgba(var(--erp12-primary-rgb), .05) !important; border-color: rgba(var(--erp12-primary-rgb), .24) !important; }
.ml-app-shell.theme-basic_erp .erp12-quick-actions button > span {
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  background: rgba(var(--erp12-primary-rgb), .08);
  color: var(--erp12-primary);
  font-size: 17px;
}
.ml-app-shell.theme-basic_erp .erp12-quick-actions button strong { font-size: 9.5px; font-weight: 750; }

.ml-app-shell.theme-basic_erp .erp12-alert {
  padding: 9px 11px;
  border-radius: 5px;
  border: 1px solid var(--erp12-line);
  font-size: 10.5px;
  font-weight: 650;
}
.ml-app-shell.theme-basic_erp .erp12-alert-danger { background: #fff6f6; border-color: #efcaca; color: #a32929; }

/* Legacy Basic dashboard class compatibility so HD / loading states inherit V12. */
.ml-app-shell.theme-basic_erp .basic-vb-dashboard { width: 100%; }
.ml-app-shell.theme-basic_erp .basic-vb-group {
  margin: 0 0 10px !important;
  padding: 10px !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: 7px !important;
  background: #fff !important;
  box-shadow: none !important;
}
.ml-app-shell.theme-basic_erp .basic-vb-group-caption,
.ml-app-shell.theme-basic_erp .basic-vb-group-title {
  color: var(--erp12-primary) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

/* --------------------------------------------------------------------------
   Portalled modals
   -------------------------------------------------------------------------- */
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"]:not([data-workflow-label-modal="true"]):not([data-preserve-theme-design="true"]),
html[data-erp-theme="basic_erp"] body [role="dialog"]:not([data-workflow-label-modal="true"]):not([data-preserve-theme-design="true"]) {
  border-radius: 8px !important;
  border: 1px solid #9db3c9 !important;
  background: #fff !important;
  box-shadow: 0 22px 60px rgba(25, 55, 90, .24) !important;
  color: var(--erp12-text) !important;
}

/* --------------------------------------------------------------------------
   Searchable native select overlay
   -------------------------------------------------------------------------- */
html[data-erp-theme="basic_erp"] body .vb-select-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483200;
  background: rgba(20, 40, 65, .20);
}
html[data-erp-theme="basic_erp"] body .vb-select-window {
  position: fixed;
  max-height: min(430px, calc(100vh - 24px));
  overflow: hidden;
  border: 1px solid #91a9c0;
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 22px 60px rgba(20, 45, 74, .27);
}
html[data-erp-theme="basic_erp"] body .vb-select-caption {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px 6px 12px;
  background: linear-gradient(105deg, var(--erp12-primary-deep), var(--erp12-primary));
  color: #fff;
}
html[data-erp-theme="basic_erp"] body .vb-select-caption span { flex: 1; font-size: 11px; font-weight: 750; }
html[data-erp-theme="basic_erp"] body .vb-select-caption button {
  width: 29px;
  height: 27px;
  min-height: 27px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 4px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  font-size: 18px !important;
}
html[data-erp-theme="basic_erp"] body .vb-select-search-row {
  display: grid;
  grid-template-columns: 70px minmax(0,1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  background: #f7faff;
  border-bottom: 1px solid var(--erp12-line);
}
html[data-erp-theme="basic_erp"] body .vb-select-search-row label { font-size: 10px; font-weight: 700; color: #41566f; }
html[data-erp-theme="basic_erp"] body .vb-select-search-row input {
  width: 100%;
  height: 36px;
  min-height: 36px;
  padding: 6px 8px;
  border: 1px solid #bccada;
  border-radius: 4px;
  outline: none;
  font-size: 11px;
}
html[data-erp-theme="basic_erp"] body .vb-select-search-row input:focus { border-color: var(--erp12-primary); box-shadow: 0 0 0 2px rgba(var(--erp12-primary-rgb), .10); }
html[data-erp-theme="basic_erp"] body .vb-select-search-row button {
  min-height: 36px;
  padding: 5px 10px;
  border: 1px solid #bccada;
  border-radius: 4px;
  background: #fff;
  color: #32465e;
  font-size: 10px;
  font-weight: 700;
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-head,
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button {
  display: grid;
  grid-template-columns: 160px minmax(0,1fr);
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-head {
  min-height: 30px;
  align-items: center;
  background: var(--erp12-primary);
  color: #fff;
  border-bottom: 1px solid var(--erp12-primary-deep);
  font-size: 9px;
  font-weight: 750;
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-head span,
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button span { padding: 5px 8px; border-right: 1px solid rgba(255,255,255,.20); }
html[data-erp-theme="basic_erp"] body .vb-select-grid-body { max-height: 270px; overflow: auto; }
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button {
  width: 100%;
  min-height: 32px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #e2e8ef;
  background: #fff;
  color: #293c54;
  text-align: left;
  font-size: 10px;
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button:nth-child(even) { background: #f9fbfd; }
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button:hover,
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button.is-selected { background: rgba(var(--erp12-primary-rgb), .09); }
html[data-erp-theme="basic_erp"] body .vb-select-empty { padding: 20px; text-align: center; color: var(--erp12-muted); font-size: 10px; }
html[data-erp-theme="basic_erp"] body .vb-select-footer {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 5px 8px;
  border-top: 1px solid var(--erp12-line);
  background: #f7f9fb;
  color: var(--erp12-muted);
  font-size: 8.5px;
}

/* --------------------------------------------------------------------------
   Special workflow density rules — presentation only
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-form-grid,
.ml-app-shell.theme-basic_erp .erp12-route-surface :is(.form-grid,.fields-grid,.field-grid,.details-grid,[class*="form-grid" i],[class*="fields-grid" i],[class*="field-grid" i],[class*="details-grid" i]):has([data-basic-erp-field-row="true"]) {
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 10px 14px !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-section-icon,
.ml-app-shell.theme-basic_erp .erp12-route-surface :is(.cs-icon-badge,[class*="page-icon" i],[class*="section-icon" i],[class*="header-icon" i]):not(button *):not(a *) {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Keep Label Designer and printable/professional reports visually intact.
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface .label-designer-page,
.ml-app-shell.theme-basic_erp .erp12-route-surface .label-designer-page *,
.ml-app-shell.theme-basic_erp .erp12-route-surface .professional-report,
.ml-app-shell.theme-basic_erp .erp12-route-surface .professional-report *,
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-print-layout="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-print-layout="true"] * {
  font-family: inherit;
}

/* --------------------------------------------------------------------------
   Theme-3 dropdown stacking fix
   --------------------------------------------------------------------------
   Several legacy pages render menus/select lists with absolute positioning.
   Keep their popup surfaces above the desktop work window instead of letting
   a parent card/window stacking context visually cover them.
*/
.ml-app-shell.theme-basic_erp .erp12-topbar :is(.dropdown-menu,[role="menu"],[class*="dropdown-menu" i],[class*="popover" i]),
.ml-app-shell.theme-basic_erp .erp12-utilitybar :is(.dropdown-menu,[role="menu"],[class*="dropdown-menu" i],[class*="popover" i]),
.ml-app-shell.theme-basic_erp .erp12-command-ribbon :is(.dropdown-menu,[role="menu"],[class*="dropdown-menu" i],[class*="popover" i]) {
  z-index: 10100 !important;
}
html[data-erp-theme="basic_erp"] body :is(.react-select__menu,.select__menu,[class*="select-menu" i],[class*="dropdown-menu" i],[class*="autocomplete" i],[class*="suggestion" i]):not(.erp12-route-surface *) {
  z-index: 2147483000 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .css-search-select:has(.css-search-select-dropdown) {
  position: relative !important;
  z-index: 12000 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .css-search-select-dropdown {
  z-index: 12010 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface :is([data-erp-dropdown="true"],[role="listbox"],[class*="autocomplete" i],[class*="suggestion" i]) {
  z-index: 12010 !important;
}

/* --------------------------------------------------------------------------
   Responsive density
   -------------------------------------------------------------------------- */
@media (max-width: 1380px) {
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 220px; min-width: 220px; padding-left: 12px; padding-right: 12px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy strong,
  .ml-app-shell.theme-basic_erp .erp12-brand-copy small { max-width: 142px; }
  .ml-app-shell.theme-basic_erp .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-nav-group > summary { min-width: 92px; max-width: 118px; padding: 5px 7px; font-size: 9.5px !important; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { width: 220px; }
  .ml-app-shell.theme-basic_erp .erp12-user-copy { display: none; }
  .ml-app-shell.theme-basic_erp .erp12-kpi-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .ml-app-shell.theme-basic_erp .erp12-quick-actions { grid-template-columns: repeat(4,minmax(0,1fr)); }
}

@media (max-width: 1120px) {
  .ml-app-shell.theme-basic_erp .erp12-topbar { min-height: 74px; }
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 190px; min-width: 190px; min-height: 62px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-logo { width: 38px; height: 38px; flex-basis: 38px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy strong { font-size: 15px; max-width: 115px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy small { display: none; }
  .ml-app-shell.theme-basic_erp .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-nav-group > summary { min-width: 86px; max-width: 108px; min-height: 58px; }
  .ml-app-shell.theme-basic_erp .erp12-header-tools { padding: 0 8px; gap: 6px; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { width: 180px; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface .inw-form-grid,
  .ml-app-shell.theme-basic_erp .erp12-route-surface :is(.form-grid,.fields-grid,.field-grid,.details-grid,[class*="form-grid" i],[class*="fields-grid" i],[class*="field-grid" i],[class*="details-grid" i]):has([data-basic-erp-field-row="true"]) { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .ml-app-shell.theme-basic_erp .erp12-dashboard-main-grid { grid-template-columns: 1fr; }
  .ml-app-shell.theme-basic_erp .erp12-dashboard-side { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 820px) {
  .ml-app-shell.theme-basic_erp.erp12-shell { overflow: auto !important; height: auto !important; min-height: 100vh !important; }
  .ml-app-shell.theme-basic_erp .erp12-topbar { flex-wrap: wrap; min-height: auto; }
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 100%; min-width: 100%; min-height: 58px; }
  .ml-app-shell.theme-basic_erp .erp12-topnav { order: 3; width: 100%; min-height: 58px; background: rgba(0,0,0,.05); flex-wrap: wrap; overflow: visible !important; }
  .ml-app-shell.theme-basic_erp .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-nav-group > summary { min-width: 86px; min-height: 52px; }
  .ml-app-shell.theme-basic_erp .erp12-header-tools { width: 100%; padding: 7px 10px; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { flex: 1 1 auto; width: auto; }
  .ml-app-shell.theme-basic_erp .erp12-utilitybar { flex-wrap: wrap; }
  .ml-app-shell.theme-basic_erp .erp12-workspace { min-height: 650px; padding: 8px; }
  .ml-app-shell.theme-basic_erp .erp12-bottom-dock { min-height: 72px; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] { grid-template-columns: 1fr !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface .inw-form-grid,
  .ml-app-shell.theme-basic_erp .erp12-route-surface :is(.form-grid,.fields-grid,.field-grid,.details-grid,[class*="form-grid" i],[class*="fields-grid" i],[class*="field-grid" i],[class*="details-grid" i]):has([data-basic-erp-field-row="true"]) { grid-template-columns: 1fr !important; }
  .ml-app-shell.theme-basic_erp .erp12-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ml-app-shell.theme-basic_erp .erp12-quick-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ml-app-shell.theme-basic_erp .erp12-dashboard-side { grid-template-columns: 1fr; }
}

@media (max-width: 540px) {
  .ml-app-shell.theme-basic_erp .erp12-kpi-grid { grid-template-columns: 1fr; }
  .ml-app-shell.theme-basic_erp .erp12-quick-actions { grid-template-columns: 1fr; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] { grid-template-columns: 1fr !important; gap: 3px !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child,
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child { grid-column: 1 !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]),
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]) { grid-column: 1 !important; }
  .ml-app-shell.theme-basic_erp .erp12-window-title { padding-left: 9px; padding-right: 9px; }
  .ml-app-shell.theme-basic_erp .erp12-title-context { display: none; }
  .ml-app-shell.theme-basic_erp .erp12-statusbar > span:nth-child(2),
  .ml-app-shell.theme-basic_erp .erp12-statusbar > span:nth-child(3) { display: none; }
}


/* ===== styles/basicErpReferenceThemeV14.css ===== */
/* ============================================================================
   BASIC ERP / DESKTOP OPERATIONS THEME V13
   ----------------------------------------------------------------------------
   Presentation-only theme. Every rule is scoped to Theme 3 so Classic Portal
   and Modern Dashboard retain their original visual design.
   V13 aligns the top module menu with the bottom dock and fixes all Theme-3
   dropdown stacking/overflow without touching operational logic.
   ========================================================================== */

.ml-app-shell.theme-basic_erp,
html[data-erp-theme="basic_erp"] body {
  --erp12-primary: var(--erp-primary, #075aa8);
  --erp12-primary-deep: var(--erp-primary-deep, #063d75);
  --erp12-secondary: var(--erp-secondary, #0a87b5);
  --erp12-accent: var(--erp-accent, #f59e0b);
  --erp12-primary-rgb: var(--erp-primary-rgb, 7, 90, 168);
  --erp12-secondary-rgb: var(--erp-secondary-rgb, 10, 135, 181);
  --erp12-accent-rgb: var(--erp-accent-rgb, 245, 158, 11);
  --erp12-bg: #eef4fa;
  --erp12-surface: #ffffff;
  --erp12-surface-soft: #f7faff;
  --erp12-line: #d7e1ec;
  --erp12-line-strong: #b8c8da;
  --erp12-text: #16233a;
  --erp12-muted: #607087;
  --erp12-danger: #dc2626;
  --erp12-success: #0b9a49;
  --erp12-warning: #d97706;
  --erp12-radius: 7px;
  --erp12-control-h: 38px;
  --erp12-label-w: 112px;
  --erp12-font: var(--erp-font-family, Inter, "Segoe UI", Arial, sans-serif);
}

html[data-erp-theme="basic_erp"],
html[data-erp-theme="basic_erp"] body,
html[data-erp-theme="basic_erp"] #root {
  margin: 0 !important;
  min-height: 100% !important;
  background: var(--erp12-bg) !important;
}

.ml-app-shell.theme-basic_erp.erp12-shell {
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 92% 8%, rgba(var(--erp12-secondary-rgb), .08), transparent 28%),
    linear-gradient(180deg, #f6f9fd 0%, var(--erp12-bg) 100%) !important;
  color: var(--erp12-text) !important;
  font-family: var(--erp12-font) !important;
  font-size: 13px !important;
}

.ml-app-shell.theme-basic_erp.erp12-shell *,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] * {
  box-sizing: border-box;
  font-family: var(--erp12-font) !important;
}

/* --------------------------------------------------------------------------
   Top application bar
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-topbar {
  min-height: 82px;
  flex: 0 0 auto;
  display: flex;
  align-items: stretch;
  gap: 0;
  background: linear-gradient(105deg, var(--erp12-primary-deep), var(--erp12-primary) 58%, var(--erp12-secondary));
  border-bottom: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 4px 16px rgba(15, 43, 78, .20);
  color: #fff;
  position: relative;
  z-index: 10000;
  overflow: visible !important;
  isolation: isolate;
}

.ml-app-shell.theme-basic_erp .erp12-brand {
  width: 255px;
  min-width: 255px;
  min-height: 82px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 18px;
  background: rgba(255,255,255,.97);
  border-right: 1px solid rgba(255,255,255,.25);
  color: var(--erp12-primary-deep) !important;
  text-decoration: none !important;
  box-shadow: 2px 0 12px rgba(10, 37, 70, .12);
}

.ml-app-shell.theme-basic_erp .erp12-brand-logo {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: var(--erp12-primary);
  font-size: 28px;
  font-weight: 900;
  overflow: hidden;
}

.ml-app-shell.theme-basic_erp .erp12-brand-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ml-app-shell.theme-basic_erp .erp12-brand-copy {
  min-width: 0;
  display: block;
}

.ml-app-shell.theme-basic_erp .erp12-brand-copy strong {
  display: block;
  max-width: 172px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  line-height: 1.1;
  font-weight: 800;
  color: var(--erp12-primary-deep) !important;
}

.ml-app-shell.theme-basic_erp .erp12-brand-copy small {
  display: block;
  margin-top: 3px;
  max-width: 172px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 9.5px;
  font-weight: 600;
  color: #50637a !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 7px 8px;
  overflow: visible !important;
  scrollbar-width: none;
  position: relative;
  z-index: 10020;
}
.ml-app-shell.theme-basic_erp .erp12-topnav::-webkit-scrollbar { display: none; }

/* Top modules intentionally mirror the bottom dock: icon above, label below. */
.ml-app-shell.theme-basic_erp .erp12-nav-link,
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary {
  width: auto;
  min-width: 104px;
  max-width: 142px;
  min-height: 66px;
  padding: 6px 9px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  white-space: nowrap;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 6px !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
  color: #fff !important;
  text-decoration: none !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  text-align: center;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-top-dock-icon {
  min-height: 25px;
  display: grid;
  place-items: center;
  font-size: 22px !important;
  line-height: 1 !important;
  opacity: 1 !important;
}
.ml-app-shell.theme-basic_erp .erp12-top-dock-label {
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px !important;
  line-height: 1.1 !important;
  opacity: 1 !important;
}
.ml-app-shell.theme-basic_erp .erp12-top-dock-caret {
  position: absolute;
  right: 7px;
  top: 7px;
  font-size: 10px !important;
  opacity: .82 !important;
}

.ml-app-shell.theme-basic_erp .erp12-nav-link:hover,
.ml-app-shell.theme-basic_erp .erp12-nav-link.is-active,
.ml-app-shell.theme-basic_erp .erp12-nav-group:hover > summary,
.ml-app-shell.theme-basic_erp .erp12-nav-group.is-active > summary,
.ml-app-shell.theme-basic_erp .erp12-nav-group[open] > summary {
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: inset 0 -3px 0 #fff !important;
}

.ml-app-shell.theme-basic_erp .erp12-nav-group {
  position: relative;
  flex: 0 0 auto;
  z-index: 10030;
}
.ml-app-shell.theme-basic_erp .erp12-nav-group[open] { z-index: 10060; }
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary { position: relative; list-style: none; }
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary::-webkit-details-marker { display: none; }

.ml-app-shell.theme-basic_erp .erp12-nav-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  width: 280px;
  max-height: min(520px, calc(100vh - 118px));
  overflow: auto;
  padding: 7px;
  border: 1px solid var(--erp12-line-strong);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 20px 50px rgba(17, 45, 78, .28);
  z-index: 10080;
}

.ml-app-shell.theme-basic_erp .erp12-nav-dropdown a {
  min-height: 36px;
  display: flex;
  align-items: center;
  padding: 7px 10px;
  border-radius: 5px;
  color: var(--erp12-text) !important;
  text-decoration: none !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}
.ml-app-shell.theme-basic_erp .erp12-nav-dropdown a:hover,
.ml-app-shell.theme-basic_erp .erp12-nav-dropdown a.is-active {
  background: rgba(var(--erp12-primary-rgb), .09) !important;
  color: var(--erp12-primary-deep) !important;
}

.ml-app-shell.theme-basic_erp .erp12-header-tools {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
}

.ml-app-shell.theme-basic_erp .erp12-global-search {
  width: clamp(210px, 20vw, 320px);
  position: relative;
}

.ml-app-shell.theme-basic_erp .erp12-global-search > input {
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 38px 0 12px !important;
  border: 1px solid rgba(255,255,255,.46) !important;
  border-radius: 7px !important;
  outline: none !important;
  background: rgba(255,255,255,.97) !important;
  color: #22324a !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.10) !important;
  font-size: 12px !important;
  font-weight: 550 !important;
}

.ml-app-shell.theme-basic_erp .erp12-global-search > span {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #40546e;
  font-size: 19px;
  pointer-events: none;
}

.ml-app-shell.theme-basic_erp .erp12-search-results {
  position: absolute;
  top: 45px;
  left: 0;
  right: 0;
  max-height: 390px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--erp12-line-strong);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(20, 47, 80, .22);
  z-index: 1200;
}

.ml-app-shell.theme-basic_erp .erp12-search-results button {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 9px;
  border: 0 !important;
  border-bottom: 1px solid #edf1f5 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: var(--erp12-text) !important;
  text-align: left;
  box-shadow: none !important;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-search-results button:hover { background: rgba(var(--erp12-primary-rgb), .07) !important; }
.ml-app-shell.theme-basic_erp .erp12-search-results button strong { font-size: 11.5px; }
.ml-app-shell.theme-basic_erp .erp12-search-results button small { font-size: 9px; color: var(--erp12-muted); }
.ml-app-shell.theme-basic_erp .erp12-search-empty { padding: 14px; font-size: 11px; color: var(--erp12-muted); }

.ml-app-shell.theme-basic_erp .erp12-header-tools .ml-icon-action {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  border-radius: 7px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-user-chip {
  max-width: 190px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
}
.ml-app-shell.theme-basic_erp .erp12-user-avatar {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.96);
  color: var(--erp12-primary-deep);
  border: 2px solid rgba(255,255,255,.52);
  font-size: 13px;
  font-weight: 850;
}
.ml-app-shell.theme-basic_erp .erp12-user-copy { min-width: 0; display: block; }
.ml-app-shell.theme-basic_erp .erp12-user-copy strong,
.ml-app-shell.theme-basic_erp .erp12-user-copy small {
  display: block;
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff !important;
}
.ml-app-shell.theme-basic_erp .erp12-user-copy strong { font-size: 11px; font-weight: 750; }
.ml-app-shell.theme-basic_erp .erp12-user-copy small { margin-top: 2px; font-size: 8.5px; opacity: .82; }

.ml-app-shell.theme-basic_erp .erp12-logout {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 11px !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  border-radius: 5px !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  box-shadow: none !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
}
.ml-app-shell.theme-basic_erp .erp12-logout:hover { background: rgba(255,255,255,.18) !important; }

/* --------------------------------------------------------------------------
   Utility / command ribbons
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-utilitybar {
  min-height: 47px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 18px;
  background: #fff;
  border-bottom: 1px solid var(--erp12-line);
  box-shadow: 0 2px 8px rgba(35, 62, 91, .05);
  position: relative;
  z-index: 300;
}
.ml-app-shell.theme-basic_erp .erp12-route-context {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #33465f;
  font-size: 11.5px;
}
.ml-app-shell.theme-basic_erp .erp12-route-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--erp12-primary);
  box-shadow: 0 0 0 4px rgba(var(--erp12-primary-rgb), .09);
}
.ml-app-shell.theme-basic_erp .erp12-utility-spacer { flex: 1 1 auto; }
.ml-app-shell.theme-basic_erp .erp12-fy-select {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: var(--erp12-muted);
}
.ml-app-shell.theme-basic_erp .erp12-fy-select select {
  width: auto !important;
  min-width: 150px !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 28px 0 9px !important;
  border: 1px solid var(--erp12-line-strong) !important;
  border-radius: 5px !important;
  background-color: #fff !important;
  color: var(--erp12-text) !important;
  box-shadow: none !important;
  font-size: 10.5px !important;
  font-weight: 650 !important;
}
.ml-app-shell.theme-basic_erp .erp12-session-date {
  white-space: nowrap;
  color: #42566f;
  font-size: 10.5px;
  font-weight: 700;
}

.ml-app-shell.theme-basic_erp .erp12-command-ribbon {
  min-height: 37px;
  flex: 0 0 auto;
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 1px;
  overflow-x: auto;
  padding: 0 12px;
  background: linear-gradient(90deg, rgba(var(--erp12-primary-rgb), .10), rgba(var(--erp12-secondary-rgb), .10));
  border-bottom: 1px solid rgba(var(--erp12-primary-rgb), .18);
  scrollbar-width: none;
}
.ml-app-shell.theme-basic_erp .erp12-command-ribbon::-webkit-scrollbar { display: none; }
.ml-app-shell.theme-basic_erp .erp12-command-ribbon a {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  border-bottom: 2px solid transparent;
  color: #42566f !important;
  text-decoration: none !important;
  white-space: nowrap;
  font-size: 10.5px;
  font-weight: 700;
}
.ml-app-shell.theme-basic_erp .erp12-command-ribbon a:hover,
.ml-app-shell.theme-basic_erp .erp12-command-ribbon a.is-active {
  background: rgba(255,255,255,.66);
  border-bottom-color: var(--erp12-primary);
  color: var(--erp12-primary-deep) !important;
}

/* --------------------------------------------------------------------------
   Main desktop work window
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-workspace {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
  align-items: stretch;
  padding: 10px 18px 8px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.ml-app-shell.theme-basic_erp .erp12-work-window {
  width: min(100%, 1660px);
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #fff;
  border: 1px solid #8fa8c2;
  border-radius: 7px 7px 4px 4px;
  box-shadow: 0 10px 26px rgba(30, 62, 98, .13);
}

.ml-app-shell.theme-basic_erp .erp12-window-tabs {
  height: 38px;
  min-height: 38px;
  display: flex;
  align-items: flex-end;
  gap: 2px;
  padding: 5px 8px 0;
  background: linear-gradient(180deg, #f7faff 0%, #e5edf7 100%);
  border-bottom: 1px solid #b7c9dc;
}
.ml-app-shell.theme-basic_erp .erp12-window-tabs > a,
.ml-app-shell.theme-basic_erp .erp12-active-tab {
  height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  border: 1px solid #b7c9dc;
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
  background: #edf3f9;
  color: #42566f !important;
  text-decoration: none !important;
  white-space: nowrap;
  font-size: 10.5px;
  font-weight: 700;
}
.ml-app-shell.theme-basic_erp .erp12-window-tabs > a.is-active,
.ml-app-shell.theme-basic_erp .erp12-active-tab {
  background: #fff;
  color: var(--erp12-primary-deep) !important;
  box-shadow: inset 0 2px 0 var(--erp12-primary);
}
.ml-app-shell.theme-basic_erp .erp12-window-spacer { flex: 1 1 auto; }
.ml-app-shell.theme-basic_erp .erp12-window-control {
  width: 28px;
  height: 27px;
  display: grid;
  place-items: center;
  margin-bottom: 4px;
  border-radius: 4px;
  color: var(--erp12-primary-deep);
  font-size: 15px;
  font-weight: 700;
}

.ml-app-shell.theme-basic_erp .erp12-window-title {
  min-height: 47px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 14px;
  background: #fff;
  border-bottom: 1px solid var(--erp12-line);
  color: var(--erp12-primary-deep);
}
.ml-app-shell.theme-basic_erp .erp12-title-icon {
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  background: rgba(var(--erp12-primary-rgb), .09);
  color: var(--erp12-primary);
  font-size: 16px;
}
.ml-app-shell.theme-basic_erp .erp12-window-title strong { font-size: 15px; font-weight: 800; }
.ml-app-shell.theme-basic_erp .erp12-title-context {
  margin-left: auto;
  padding: 4px 8px;
  border: 1px solid rgba(var(--erp12-primary-rgb), .15);
  border-radius: 4px;
  background: rgba(var(--erp12-primary-rgb), .05);
  color: #52657c;
  font-size: 9.5px;
  font-weight: 650;
}

.ml-app-shell.theme-basic_erp .erp12-content {
  min-height: 0;
  flex: 1 1 auto;
  width: 100%;
  overflow: auto !important;
  padding: 10px 12px 12px !important;
  background: #fbfdff !important;
  overscroll-behavior: contain;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface {
  width: min(100%, 1620px);
  min-height: 100%;
  margin: 0 auto;
  color: var(--erp12-text);
}
.ml-app-shell.theme-basic_erp .erp12-loading-cell {
  min-height: 220px;
  display: grid;
  place-items: center;
  color: var(--erp12-muted);
  font-size: 12px;
  font-weight: 700;
}

.ml-app-shell.theme-basic_erp .erp12-statusbar {
  min-height: 29px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0;
  background: #f4f7fa;
  border-top: 1px solid var(--erp12-line);
  color: #53667d;
  font-size: 9px;
}
.ml-app-shell.theme-basic_erp .erp12-statusbar > span {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border-right: 1px solid var(--erp12-line);
  white-space: nowrap;
}
.ml-app-shell.theme-basic_erp .erp12-statusbar strong { color: #30445d; font-weight: 750; }
.ml-app-shell.theme-basic_erp .erp12-status-spacer { flex: 1 1 auto; border-right: 0 !important; }

/* --------------------------------------------------------------------------
   Bottom ERP dock — second half of permission-filtered modules
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-bottom-dock {
  min-height: 78px;
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  padding: 7px 12px 8px;
  background: linear-gradient(100deg, var(--erp12-primary-deep), var(--erp12-primary) 58%, var(--erp12-secondary));
  border-top: 1px solid rgba(255,255,255,.20);
  box-shadow: 0 -4px 15px rgba(18, 49, 84, .15);
  overflow: hidden;
  position: relative;
  z-index: 250;
}
.ml-app-shell.theme-basic_erp .erp12-bottom-dock-inner {
  width: max-content;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 10px 2px;
  display: flex;
  justify-content: flex-start;
  gap: 6px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-padding-inline: 10px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.25) transparent;
}
.ml-app-shell.theme-basic_erp .erp12-bottom-dock-inner > :first-child { margin-left: 0 !important; }
.ml-app-shell.theme-basic_erp .erp12-bottom-dock-inner > :last-child { margin-right: 0 !important; }
.ml-app-shell.theme-basic_erp .erp12-bottom-dock a {
  min-width: 112px;
  min-height: 62px;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 6px 10px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 6px;
  background: rgba(255,255,255,.055);
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: none;
  font-size: 9.5px;
  font-weight: 700;
  text-align: center;
}
.ml-app-shell.theme-basic_erp .erp12-bottom-dock a:hover,
.ml-app-shell.theme-basic_erp .erp12-bottom-dock a.is-active {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.28);
  box-shadow: inset 0 -3px 0 #fff;
}
.ml-app-shell.theme-basic_erp .erp12-dock-icon {
  min-height: 25px;
  display: grid;
  place-items: center;
  font-size: 23px;
  line-height: 1;
}

/* --------------------------------------------------------------------------
   Hide only Theme-3 decorative / duplicated workflow chrome
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-operational-steps="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-operational-steps-container="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-page-hero="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-modern-background,
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-modern-hero,
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-progress-strip,
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-modern-icon="true"] {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Page surfaces: clean ERP aesthetics, not a generic CSS reset
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface > * {
  max-width: 100% !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is(section, article, fieldset):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]) {
  border-color: var(--erp12-line) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is([class*="card" i],[class*="panel" i],[class*="glass" i]):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]) {
  background: #fff !important;
  background-image: none !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: var(--erp12-radius) !important;
  box-shadow: 0 2px 9px rgba(28, 60, 95, .055) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is([class*="card" i],[class*="panel" i],[class*="glass" i]) :is([class*="card" i],[class*="panel" i],[class*="glass" i]):not(.label-designer-page *):not(.professional-report *) {
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [style*="linear-gradient"]:not(button):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]) {
  background-image: none !important;
}

/* Small subsection labels like the supplied ERP reference. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-section-title="true"]:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-section-header,
.ml-app-shell.theme-basic_erp .erp12-route-surface .cs-section-header {
  margin: 8px 0 6px !important;
  padding: 0 2px 5px !important;
  min-height: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(var(--erp12-primary-rgb), .18) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--erp12-primary) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-section-title="true"]:is(h1,h2,h3,h4,h5,h6,legend),
.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-section-header :is(h1,h2,h3,h4),
.ml-app-shell.theme-basic_erp .erp12-route-surface .cs-section-header :is(h1,h2,h3,h4) {
  font-size: 12px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--erp12-primary) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-section-header="true"] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-form-content-card {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 10px !important;
  background: #fff !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: var(--erp12-radius) !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Symmetric 3-field form engine
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface form,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] form {
  width: 100% !important;
  max-width: 1580px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] {
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  column-gap: 14px !important;
  row-gap: 10px !important;
  align-items: start !important;
  margin: 0 0 10px !important;
  padding: 12px !important;
  background: #fff !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: var(--erp12-radius) !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-shell="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-shell="true"] {
  display: contents !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"] > :not([data-basic-erp-field-row="true"]):not([data-basic-erp-field-shell="true"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] > :not([data-basic-erp-field-row="true"]):not([data-basic-erp-field-shell="true"]) {
  grid-column: 1 / -1 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] {
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--erp12-control-h) !important;
  display: grid !important;
  grid-template-columns: minmax(96px, var(--erp12-label-w)) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-wide="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-wide="true"] {
  grid-column: 1 / -1 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child {
  grid-column: 1 !important;
  grid-row: auto !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 4px 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #33465f !important;
  box-shadow: none !important;
  font-size: 11.5px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"] {
  position: relative !important;
  font-size: 0 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"]::before,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"]::before {
  content: attr(data-basic-erp-label);
  grid-column: 1;
  display: flex;
  align-items: center;
  min-height: 34px;
  padding: 4px 2px;
  color: #33465f;
  font-size: 11.5px;
  line-height: 1.2;
  font-weight: 700;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"] > :is(input,select,textarea,[role="combobox"],div),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"] > :is(input,select,textarea,[role="combobox"],div) {
  grid-column: 2 !important;
  min-width: 0 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]) {
  grid-column: 2 !important;
  min-width: 0 !important;
  width: 100% !important;
}

/* Bootstrap-like controls, driven by company branding. */
.ml-app-shell.theme-basic_erp .erp12-route-surface input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface select:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="combobox"]:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] select,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [role="combobox"] {
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--erp12-control-h) !important;
  height: var(--erp12-control-h) !important;
  margin: 0 !important;
  padding: 7px 9px !important;
  border: 1px solid #c4d0dd !important;
  border-radius: 4px !important;
  outline: none !important;
  background: #fff !important;
  background-image: none !important;
  color: #1e2c40 !important;
  box-shadow: inset 0 1px 2px rgba(22, 44, 69, .025) !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 550 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea {
  height: auto !important;
  min-height: 72px !important;
  resize: vertical !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface input:focus:not([type="checkbox"]):not([type="radio"]),
.ml-app-shell.theme-basic_erp .erp12-route-surface select:focus,
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:focus,
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="combobox"]:focus-within,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input:focus:not([type="checkbox"]):not([type="radio"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] select:focus,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea:focus {
  border-color: var(--erp12-primary) !important;
  box-shadow: 0 0 0 2px rgba(var(--erp12-primary-rgb), .12) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface input::placeholder,
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea::placeholder {
  color: #8b99aa !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface input[type="checkbox"],
.ml-app-shell.theme-basic_erp .erp12-route-surface input[type="radio"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input[type="checkbox"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input[type="radio"] {
  accent-color: var(--erp12-primary) !important;
}

/* --------------------------------------------------------------------------
   Buttons and action bars
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface button:not(.label-designer-page *):not(.professional-report *):not(.erp12-kpi-card):not(.erp12-table-action),
.ml-app-shell.theme-basic_erp .erp12-route-surface a[class*="btn" i]:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface a[class*="button" i]:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button:not([data-preserve-theme-design="true"]) {
  min-height: 38px !important;
  padding: 7px 14px !important;
  border: 1px solid #b8c7d8 !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #fff, #f4f7fa) !important;
  color: #30445d !important;
  box-shadow: 0 1px 2px rgba(21, 47, 77, .05) !important;
  font-size: 11.5px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  cursor: pointer;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface button[data-basic-erp-button="primary"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button[data-basic-erp-button="primary"] {
  border-color: var(--erp12-primary) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--erp12-primary) 90%, white), var(--erp12-primary)) !important;
  color: #fff !important;
  box-shadow: 0 2px 5px rgba(var(--erp12-primary-rgb), .18) !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface button[data-basic-erp-button="danger"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button[data-basic-erp-button="danger"] {
  border-color: #e5a3a3 !important;
  background: #fff6f6 !important;
  color: #b42323 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface button:hover:not(:disabled):not(.erp12-kpi-card),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button:hover:not(:disabled) {
  filter: brightness(.985);
}
.ml-app-shell.theme-basic_erp .erp12-route-surface button:disabled,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] button:disabled { opacity: .55 !important; cursor: not-allowed !important; }

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-toolbar="true"] {
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 8px 0 !important;
  padding: 8px !important;
  background: #f7faff !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: 5px !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Bootstrap-style data tables and reports
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) {
  width: 100% !important;
  max-width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  background: #fff !important;
  color: #24364d !important;
  font-size: 11.5px !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) th,
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) th,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) td {
  min-height: 34px !important;
  padding: 7px 8px !important;
  border: 1px solid #d8e1eb !important;
  vertical-align: middle !important;
  line-height: 1.25 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) th,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) th {
  background: linear-gradient(180deg, color-mix(in srgb, var(--erp12-primary) 90%, white), var(--erp12-primary)) !important;
  color: #fff !important;
  border-color: color-mix(in srgb, var(--erp12-primary) 80%, #ffffff) !important;
  font-size: 10.5px !important;
  font-weight: 750 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) tbody tr:nth-child(even) td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) tbody tr:nth-child(even) td {
  background: rgba(var(--erp12-primary-rgb), .022) !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) tbody tr:hover td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) tbody tr:hover td {
  background: rgba(var(--erp12-primary-rgb), .075) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface table button:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table button {
  min-height: 30px !important;
  height: 30px !important;
  padding: 4px 9px !important;
  border-radius: 4px !important;
  font-size: 10px !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [class*="filter" i]:has(input,select,button):not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface [class*="search" i]:has(input,select,button):not(.label-designer-page *):not(.professional-report *) {
  border-radius: 5px !important;
}

/* Tabs inside routed modules. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="tablist"]:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface :is([class*="tabs" i],[class*="tab-list" i],[class*="tabbar" i]):not(.label-designer-page *):not(.professional-report *) {
  display: flex !important;
  gap: 2px !important;
  align-items: flex-end !important;
  padding: 5px 6px 0 !important;
  background: #edf3f9 !important;
  border: 1px solid var(--erp12-line) !important;
  border-bottom-color: #b7c9dc !important;
  border-radius: 6px 6px 0 0 !important;
  box-shadow: none !important;
  overflow-x: auto !important;
}

/* --------------------------------------------------------------------------
   Basic ERP dashboard - reference-inspired but live-data driven
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-dashboard {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ml-app-shell.theme-basic_erp .erp12-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 10px;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-card {
  min-width: 0;
  min-height: 112px !important;
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  padding: 13px 14px !important;
  border: 1px solid #d4e0ec !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: var(--erp12-text) !important;
  box-shadow: 0 3px 10px rgba(23, 56, 92, .06) !important;
  text-align: left !important;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-card:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--erp12-kpi-tone, var(--erp12-primary)) 35%, #d4e0ec) !important;
  box-shadow: 0 6px 16px rgba(23, 56, 92, .09) !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-icon {
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(145deg, color-mix(in srgb, var(--erp12-kpi-tone, var(--erp12-primary)) 82%, white), var(--erp12-kpi-tone, var(--erp12-primary)));
  color: #fff;
  box-shadow: 0 5px 12px color-mix(in srgb, var(--erp12-kpi-tone, var(--erp12-primary)) 22%, transparent);
  font-size: 24px;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-copy { min-width: 0; display: block; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy small,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy strong,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy em { display: block; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy small { color: #354861; font-size: 10.5px; font-weight: 750; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy strong { margin-top: 6px; color: #15243b; font-size: 20px; line-height: 1; font-weight: 850; font-style: normal; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy em { margin-top: 7px; color: var(--erp12-muted); font-size: 9px; line-height: 1.3; font-style: normal; font-weight: 600; }

.ml-app-shell.theme-basic_erp .erp12-dashboard-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 305px;
  gap: 10px;
  align-items: stretch;
}
.ml-app-shell.theme-basic_erp .erp12-dashboard-side { display: flex; flex-direction: column; gap: 10px; }
.ml-app-shell.theme-basic_erp .erp12-dashboard-panel {
  min-width: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid #d7e1ec;
  border-radius: 8px;
  box-shadow: 0 2px 9px rgba(25, 55, 90, .05);
}
.ml-app-shell.theme-basic_erp .erp12-dashboard-panel-main { min-height: 290px; }
.ml-app-shell.theme-basic_erp .erp12-panel-heading {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--erp12-line);
  background: linear-gradient(180deg,#fff,#fafcff);
}
.ml-app-shell.theme-basic_erp .erp12-panel-heading strong { display: block; color: var(--erp12-primary); font-size: 11.5px; font-weight: 800; }
.ml-app-shell.theme-basic_erp .erp12-panel-heading small { display: block; margin-top: 2px; color: var(--erp12-muted); font-size: 8.7px; font-weight: 550; }
.ml-app-shell.theme-basic_erp .erp12-panel-badge {
  padding: 4px 7px;
  border: 1px solid rgba(var(--erp12-primary-rgb), .14);
  border-radius: 999px;
  background: rgba(var(--erp12-primary-rgb), .06);
  color: var(--erp12-primary-deep);
  font-size: 8px;
  font-weight: 750;
  white-space: nowrap;
}
.ml-app-shell.theme-basic_erp .erp12-table-scroll { width: 100%; overflow: auto; }
.ml-app-shell.theme-basic_erp .erp12-data-table { min-width: 680px; }
.ml-app-shell.theme-basic_erp .erp12-number-cell { font-weight: 800; color: var(--erp12-primary-deep); }
.ml-app-shell.theme-basic_erp .erp12-table-action {
  min-width: 58px;
  min-height: 29px !important;
  padding: 4px 9px !important;
  border: 1px solid var(--erp12-primary) !important;
  border-radius: 4px !important;
  background: var(--erp12-primary) !important;
  color: #fff !important;
  font-size: 9.5px !important;
  font-weight: 750 !important;
  cursor: pointer;
}
.ml-app-shell.theme-basic_erp .erp12-empty-cell,
.ml-app-shell.theme-basic_erp .erp12-empty-panel { padding: 16px; text-align: center; color: var(--erp12-muted); font-size: 10px; }

.ml-app-shell.theme-basic_erp .erp12-session-list { margin: 0; padding: 4px 12px 10px; }
.ml-app-shell.theme-basic_erp .erp12-session-list > div {
  display: grid;
  grid-template-columns: 88px minmax(0,1fr);
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid #edf1f5;
}
.ml-app-shell.theme-basic_erp .erp12-session-list > div:last-child { border-bottom: 0; }
.ml-app-shell.theme-basic_erp .erp12-session-list dt { color: var(--erp12-muted); font-size: 9px; font-weight: 650; }
.ml-app-shell.theme-basic_erp .erp12-session-list dd { margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; color: #263a53; font-size: 10px; font-weight: 750; }

.ml-app-shell.theme-basic_erp .erp12-activity-list { padding: 4px 10px 10px; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button {
  width: 100%;
  min-height: 52px !important;
  display: grid !important;
  grid-template-columns: 11px minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 3px !important;
  border: 0 !important;
  border-bottom: 1px solid #edf1f5 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--erp12-text) !important;
  text-align: left !important;
}
.ml-app-shell.theme-basic_erp .erp12-activity-list button:last-child { border-bottom: 0 !important; }
.ml-app-shell.theme-basic_erp .erp12-activity-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--erp12-accent); }
.ml-app-shell.theme-basic_erp .erp12-activity-list button span:nth-child(2) { min-width: 0; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button strong { display: block; color: #31465f; font-size: 9.5px; line-height: 1.3; font-weight: 700; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button small { display: block; margin-top: 2px; color: var(--erp12-muted); font-size: 8px; }
.ml-app-shell.theme-basic_erp .erp12-activity-list button em { color: var(--erp12-primary); font-size: 8.5px; font-style: normal; font-weight: 750; }

.ml-app-shell.theme-basic_erp .erp12-quick-actions {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 7px;
  padding: 10px;
}
.ml-app-shell.theme-basic_erp .erp12-quick-actions button {
  min-height: 54px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 7px 9px !important;
  border: 1px solid #d8e2ec !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #31465f !important;
  box-shadow: none !important;
  text-align: left !important;
}
.ml-app-shell.theme-basic_erp .erp12-quick-actions button:hover { background: rgba(var(--erp12-primary-rgb), .05) !important; border-color: rgba(var(--erp12-primary-rgb), .24) !important; }
.ml-app-shell.theme-basic_erp .erp12-quick-actions button > span {
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  background: rgba(var(--erp12-primary-rgb), .08);
  color: var(--erp12-primary);
  font-size: 17px;
}
.ml-app-shell.theme-basic_erp .erp12-quick-actions button strong { font-size: 9.5px; font-weight: 750; }

.ml-app-shell.theme-basic_erp .erp12-alert {
  padding: 9px 11px;
  border-radius: 5px;
  border: 1px solid var(--erp12-line);
  font-size: 10.5px;
  font-weight: 650;
}
.ml-app-shell.theme-basic_erp .erp12-alert-danger { background: #fff6f6; border-color: #efcaca; color: #a32929; }

/* Legacy Basic dashboard class compatibility so HD / loading states inherit V12. */
.ml-app-shell.theme-basic_erp .basic-vb-dashboard { width: 100%; }
.ml-app-shell.theme-basic_erp .basic-vb-group {
  margin: 0 0 10px !important;
  padding: 10px !important;
  border: 1px solid var(--erp12-line) !important;
  border-radius: 7px !important;
  background: #fff !important;
  box-shadow: none !important;
}
.ml-app-shell.theme-basic_erp .basic-vb-group-caption,
.ml-app-shell.theme-basic_erp .basic-vb-group-title {
  color: var(--erp12-primary) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

/* --------------------------------------------------------------------------
   Portalled modals
   -------------------------------------------------------------------------- */
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"]:not([data-workflow-label-modal="true"]):not([data-preserve-theme-design="true"]),
html[data-erp-theme="basic_erp"] body [role="dialog"]:not([data-workflow-label-modal="true"]):not([data-preserve-theme-design="true"]) {
  border-radius: 8px !important;
  border: 1px solid #9db3c9 !important;
  background: #fff !important;
  box-shadow: 0 22px 60px rgba(25, 55, 90, .24) !important;
  color: var(--erp12-text) !important;
}

/* --------------------------------------------------------------------------
   Searchable native select overlay
   -------------------------------------------------------------------------- */
html[data-erp-theme="basic_erp"] body .vb-select-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483200;
  background: rgba(20, 40, 65, .20);
}
html[data-erp-theme="basic_erp"] body .vb-select-window {
  position: fixed;
  max-height: min(430px, calc(100vh - 24px));
  overflow: hidden;
  border: 1px solid #91a9c0;
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 22px 60px rgba(20, 45, 74, .27);
}
html[data-erp-theme="basic_erp"] body .vb-select-caption {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px 6px 12px;
  background: linear-gradient(105deg, var(--erp12-primary-deep), var(--erp12-primary));
  color: #fff;
}
html[data-erp-theme="basic_erp"] body .vb-select-caption span { flex: 1; font-size: 11px; font-weight: 750; }
html[data-erp-theme="basic_erp"] body .vb-select-caption button {
  width: 29px;
  height: 27px;
  min-height: 27px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 4px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  font-size: 18px !important;
}
html[data-erp-theme="basic_erp"] body .vb-select-search-row {
  display: grid;
  grid-template-columns: 70px minmax(0,1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  background: #f7faff;
  border-bottom: 1px solid var(--erp12-line);
}
html[data-erp-theme="basic_erp"] body .vb-select-search-row label { font-size: 10px; font-weight: 700; color: #41566f; }
html[data-erp-theme="basic_erp"] body .vb-select-search-row input {
  width: 100%;
  height: 36px;
  min-height: 36px;
  padding: 6px 8px;
  border: 1px solid #bccada;
  border-radius: 4px;
  outline: none;
  font-size: 11px;
}
html[data-erp-theme="basic_erp"] body .vb-select-search-row input:focus { border-color: var(--erp12-primary); box-shadow: 0 0 0 2px rgba(var(--erp12-primary-rgb), .10); }
html[data-erp-theme="basic_erp"] body .vb-select-search-row button {
  min-height: 36px;
  padding: 5px 10px;
  border: 1px solid #bccada;
  border-radius: 4px;
  background: #fff;
  color: #32465e;
  font-size: 10px;
  font-weight: 700;
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-head,
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button {
  display: grid;
  grid-template-columns: 160px minmax(0,1fr);
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-head {
  min-height: 30px;
  align-items: center;
  background: var(--erp12-primary);
  color: #fff;
  border-bottom: 1px solid var(--erp12-primary-deep);
  font-size: 9px;
  font-weight: 750;
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-head span,
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button span { padding: 5px 8px; border-right: 1px solid rgba(255,255,255,.20); }
html[data-erp-theme="basic_erp"] body .vb-select-grid-body { max-height: 270px; overflow: auto; }
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button {
  width: 100%;
  min-height: 32px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #e2e8ef;
  background: #fff;
  color: #293c54;
  text-align: left;
  font-size: 10px;
}
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button:nth-child(even) { background: #f9fbfd; }
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button:hover,
html[data-erp-theme="basic_erp"] body .vb-select-grid-body button.is-selected { background: rgba(var(--erp12-primary-rgb), .09); }
html[data-erp-theme="basic_erp"] body .vb-select-empty { padding: 20px; text-align: center; color: var(--erp12-muted); font-size: 10px; }
html[data-erp-theme="basic_erp"] body .vb-select-footer {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 5px 8px;
  border-top: 1px solid var(--erp12-line);
  background: #f7f9fb;
  color: var(--erp12-muted);
  font-size: 8.5px;
}

/* --------------------------------------------------------------------------
   Special workflow density rules — presentation only
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-form-grid,
.ml-app-shell.theme-basic_erp .erp12-route-surface :is(.form-grid,.fields-grid,.field-grid,.details-grid,[class*="form-grid" i],[class*="fields-grid" i],[class*="field-grid" i],[class*="details-grid" i]):has([data-basic-erp-field-row="true"]) {
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 10px 14px !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface .inw-section-icon,
.ml-app-shell.theme-basic_erp .erp12-route-surface :is(.cs-icon-badge,[class*="page-icon" i],[class*="section-icon" i],[class*="header-icon" i]):not(button *):not(a *) {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Keep Label Designer and printable/professional reports visually intact.
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface .label-designer-page,
.ml-app-shell.theme-basic_erp .erp12-route-surface .label-designer-page *,
.ml-app-shell.theme-basic_erp .erp12-route-surface .professional-report,
.ml-app-shell.theme-basic_erp .erp12-route-surface .professional-report *,
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-print-layout="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-print-layout="true"] * {
  font-family: inherit;
}

/* --------------------------------------------------------------------------
   Theme-3 dropdown stacking fix
   --------------------------------------------------------------------------
   Several legacy pages render menus/select lists with absolute positioning.
   Keep their popup surfaces above the desktop work window instead of letting
   a parent card/window stacking context visually cover them.
*/
.ml-app-shell.theme-basic_erp .erp12-topbar :is(.dropdown-menu,[role="menu"],[class*="dropdown-menu" i],[class*="popover" i]),
.ml-app-shell.theme-basic_erp .erp12-utilitybar :is(.dropdown-menu,[role="menu"],[class*="dropdown-menu" i],[class*="popover" i]),
.ml-app-shell.theme-basic_erp .erp12-command-ribbon :is(.dropdown-menu,[role="menu"],[class*="dropdown-menu" i],[class*="popover" i]) {
  z-index: 10100 !important;
}
html[data-erp-theme="basic_erp"] body :is(.react-select__menu,.select__menu,[class*="select-menu" i],[class*="dropdown-menu" i],[class*="autocomplete" i],[class*="suggestion" i]):not(.erp12-route-surface *) {
  z-index: 2147483000 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .css-search-select:has(.css-search-select-dropdown) {
  position: relative !important;
  z-index: 12000 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .css-search-select-dropdown {
  z-index: 12010 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface :is([data-erp-dropdown="true"],[role="listbox"],[class*="autocomplete" i],[class*="suggestion" i]) {
  z-index: 12010 !important;
}

/* --------------------------------------------------------------------------
   Responsive density
   -------------------------------------------------------------------------- */
@media (max-width: 1380px) {
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 220px; min-width: 220px; padding-left: 12px; padding-right: 12px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy strong,
  .ml-app-shell.theme-basic_erp .erp12-brand-copy small { max-width: 142px; }
  .ml-app-shell.theme-basic_erp .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-nav-group > summary { min-width: 92px; max-width: 118px; padding: 5px 7px; font-size: 9.5px !important; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { width: 220px; }
  .ml-app-shell.theme-basic_erp .erp12-user-copy { display: none; }
  .ml-app-shell.theme-basic_erp .erp12-kpi-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .ml-app-shell.theme-basic_erp .erp12-quick-actions { grid-template-columns: repeat(4,minmax(0,1fr)); }
}

@media (max-width: 1120px) {
  .ml-app-shell.theme-basic_erp .erp12-topbar { min-height: 74px; }
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 190px; min-width: 190px; min-height: 62px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-logo { width: 38px; height: 38px; flex-basis: 38px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy strong { font-size: 15px; max-width: 115px; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy small { display: none; }
  .ml-app-shell.theme-basic_erp .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-nav-group > summary { min-width: 86px; max-width: 108px; min-height: 58px; }
  .ml-app-shell.theme-basic_erp .erp12-header-tools { padding: 0 8px; gap: 6px; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { width: 180px; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface .inw-form-grid,
  .ml-app-shell.theme-basic_erp .erp12-route-surface :is(.form-grid,.fields-grid,.field-grid,.details-grid,[class*="form-grid" i],[class*="fields-grid" i],[class*="field-grid" i],[class*="details-grid" i]):has([data-basic-erp-field-row="true"]) { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .ml-app-shell.theme-basic_erp .erp12-dashboard-main-grid { grid-template-columns: 1fr; }
  .ml-app-shell.theme-basic_erp .erp12-dashboard-side { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 820px) {
  .ml-app-shell.theme-basic_erp.erp12-shell { overflow: auto !important; height: auto !important; min-height: 100vh !important; }
  .ml-app-shell.theme-basic_erp .erp12-topbar { flex-wrap: wrap; min-height: auto; }
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 100%; min-width: 100%; min-height: 58px; }
  .ml-app-shell.theme-basic_erp .erp12-topnav { order: 3; width: 100%; min-height: 58px; background: rgba(0,0,0,.05); flex-wrap: wrap; overflow: visible !important; }
  .ml-app-shell.theme-basic_erp .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-nav-group > summary { min-width: 86px; min-height: 52px; }
  .ml-app-shell.theme-basic_erp .erp12-header-tools { width: 100%; padding: 7px 10px; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { flex: 1 1 auto; width: auto; }
  .ml-app-shell.theme-basic_erp .erp12-utilitybar { flex-wrap: wrap; }
  .ml-app-shell.theme-basic_erp .erp12-workspace { min-height: 650px; padding: 8px; }
  .ml-app-shell.theme-basic_erp .erp12-bottom-dock { min-height: 72px; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] { grid-template-columns: 1fr !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface .inw-form-grid,
  .ml-app-shell.theme-basic_erp .erp12-route-surface :is(.form-grid,.fields-grid,.field-grid,.details-grid,[class*="form-grid" i],[class*="fields-grid" i],[class*="field-grid" i],[class*="details-grid" i]):has([data-basic-erp-field-row="true"]) { grid-template-columns: 1fr !important; }
  .ml-app-shell.theme-basic_erp .erp12-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ml-app-shell.theme-basic_erp .erp12-quick-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ml-app-shell.theme-basic_erp .erp12-dashboard-side { grid-template-columns: 1fr; }
}

@media (max-width: 540px) {
  .ml-app-shell.theme-basic_erp .erp12-kpi-grid { grid-template-columns: 1fr; }
  .ml-app-shell.theme-basic_erp .erp12-quick-actions { grid-template-columns: 1fr; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] { grid-template-columns: 1fr !important; gap: 3px !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child,
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :is(label,.form-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"],[class*="field-label" i]):first-child { grid-column: 1 !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]),
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]) { grid-column: 1 !important; }
  .ml-app-shell.theme-basic_erp .erp12-window-title { padding-left: 9px; padding-right: 9px; }
  .ml-app-shell.theme-basic_erp .erp12-title-context { display: none; }
  .ml-app-shell.theme-basic_erp .erp12-statusbar > span:nth-child(2),
  .ml-app-shell.theme-basic_erp .erp12-statusbar > span:nth-child(3) { display: none; }
}

/* ============================================================================
   V14 CORRECTIONS
   - Header modules shrink inside their own lane instead of running underneath
     search/user controls.
   - Dashboard KPI cards are isolated from legacy/global card/button styling.
   - Gate Pass and Agreement entry are single visual work sheets in Basic ERP.
   - Company Settings category buttons stay above all transformed page surfaces.
   These rules remain strictly scoped to Theme 3.
   ========================================================================== */

/* ---------- top header: three real lanes, no module/search overlap ---------- */
.ml-app-shell.theme-basic_erp .erp12-topbar {
  display: grid !important;
  grid-template-columns: 235px minmax(0, 1fr) auto !important;
  align-items: stretch !important;
}
.ml-app-shell.theme-basic_erp .erp12-brand {
  width: 235px !important;
  min-width: 0 !important;
}
.ml-app-shell.theme-basic_erp .erp12-topnav {
  min-width: 0 !important;
  width: 100% !important;
  overflow: visible !important;
  gap: 4px !important;
  padding: 7px 6px !important;
}
.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group {
  flex: 1 1 76px !important;
  width: auto !important;
  min-width: 64px !important;
  max-width: 104px !important;
}
.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group > summary {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}
.ml-app-shell.theme-basic_erp .erp12-nav-link,
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary {
  min-width: 0 !important;
  min-height: 66px !important;
  padding: 6px 5px !important;
}
.ml-app-shell.theme-basic_erp .erp12-top-dock-label {
  min-height: 22px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: normal !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  line-height: 1.05 !important;
  text-align: center !important;
}
.ml-app-shell.theme-basic_erp .erp12-header-tools {
  min-width: 355px !important;
  max-width: 430px !important;
  padding: 0 10px !important;
  gap: 7px !important;
  position: relative !important;
  z-index: 10120 !important;
  background: linear-gradient(90deg, transparent, rgba(0,0,0,.05)) !important;
}
.ml-app-shell.theme-basic_erp .erp12-global-search {
  flex: 1 1 190px !important;
  width: auto !important;
  min-width: 165px !important;
  max-width: 225px !important;
}
.ml-app-shell.theme-basic_erp .erp12-user-chip { max-width: 115px !important; }
.ml-app-shell.theme-basic_erp .erp12-user-copy strong { max-width: 78px !important; }
.ml-app-shell.theme-basic_erp .erp12-user-copy small { display: none !important; }
.ml-app-shell.theme-basic_erp .erp12-utilitybar {
  min-height: 39px !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

/* ---------- dashboard: stable, symmetric KPI cards ---------- */
.ml-app-shell.theme-basic_erp .erp12-kpi-grid {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  align-items: stretch !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-card {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 104px !important;
  display: grid !important;
  grid-template-columns: 56px minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 13px !important;
  overflow: hidden !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-icon {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  margin: 0 !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-copy {
  min-width: 0 !important;
  width: 100% !important;
  display: block !important;
  position: static !important;
  transform: none !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > small,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > strong,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > em {
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  padding: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > small {
  white-space: normal !important;
  line-height: 1.25 !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > strong { white-space: nowrap !important; }
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > em {
  white-space: normal !important;
  line-height: 1.25 !important;
}

/* ---------- Gate Pass registration: one dense work sheet ---------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-form {
  margin: 0 !important;
  padding: 0 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 8px 12px !important;
  padding: 12px !important;
  border: 1px solid var(--erp12-line-strong) !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: none !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet > .inw-section-card,
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet > .inw-section-card > .inw-section-body,
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet .inw-form-grid {
  display: contents !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet .inw-section-header,
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet [data-basic-erp-section-title="true"] {
  display: none !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet .inw-section-card {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet .inw-section-body > :not(.inw-form-grid),
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet > :not(.inw-section-card) {
  grid-column: 1 / -1 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet [data-basic-erp-field-row="true"] {
  grid-column: auto !important;
  margin: 0 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet [data-basic-erp-wide="true"],
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet table,
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet [data-basic-erp-toolbar="true"] {
  grid-column: 1 / -1 !important;
}

/* ---------- Agreement create/edit: one visual sheet, no section headings ---------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form .agreement-form-content-card {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 9px 13px !important;
  margin: 0 !important;
  padding: 12px !important;
  border: 1px solid var(--erp12-line-strong) !important;
  border-radius: 6px !important;
  background: #fff !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form .agreement-section-heading,
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form .agreement-section-title,
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form [data-basic-erp-section-title="true"] {
  display: none !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form .agreement-section {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form .agreement-form-content-card > [data-basic-erp-field-table="true"] {
  display: contents !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form .agreement-form-content-card > :not([data-basic-erp-field-table="true"]):not([data-basic-erp-section-title="true"]) {
  grid-column: 1 / -1;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form .agreement-form-content-card > div:has(input,select,textarea):not([data-basic-erp-field-table="true"]) {
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form [data-basic-erp-field-table="true"] {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px 12px !important;
}

/* ---------- Company Settings: guarantee interactive category navigation ---------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-panel {
  position: relative !important;
  z-index: 80 !important;
  isolation: isolate !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-items {
  position: relative !important;
  z-index: 81 !important;
  pointer-events: auto !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-button {
  position: relative !important;
  z-index: 82 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-button > * {
  pointer-events: none !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-content-panel {
  position: relative !important;
  z-index: 1 !important;
}

@media (max-width: 1450px) {
  .ml-app-shell.theme-basic_erp .erp12-topbar { grid-template-columns: 205px minmax(0, 1fr) auto !important; }
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 205px !important; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy strong { max-width: 130px !important; font-size: 15px !important; }
  .ml-app-shell.theme-basic_erp .erp12-brand-copy small { max-width: 130px !important; }
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group { min-width: 58px !important; max-width: 92px !important; }
  .ml-app-shell.theme-basic_erp .erp12-header-tools { min-width: 320px !important; max-width: 365px !important; }
  .ml-app-shell.theme-basic_erp .erp12-global-search { min-width: 150px !important; max-width: 190px !important; }
}

@media (max-width: 1120px) {
  .ml-app-shell.theme-basic_erp .erp12-topbar { display: flex !important; }
  .ml-app-shell.theme-basic_erp .erp12-brand { width: 190px !important; min-width: 190px !important; }
  .ml-app-shell.theme-basic_erp .erp12-topnav { overflow-x: auto !important; overflow-y: visible !important; }
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group { flex: 0 0 82px !important; min-width: 82px !important; }
  .ml-app-shell.theme-basic_erp .erp12-header-tools { min-width: 300px !important; }
  .ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet,
  .ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form .agreement-form-content-card,
  .ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form [data-basic-erp-field-table="true"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 820px) {
  .ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/inward"] .inward-registration-sheet,
  .ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form .agreement-form-content-card,
  .ml-app-shell.theme-basic_erp .erp12-route-surface .agreement-entry-form [data-basic-erp-field-table="true"] {
    grid-template-columns: 1fr !important;
  }
}


/* ===== styles/basicErpReferenceThemeV15.css ===== */
/*
 * Basic ERP / VB.NET Theme V15
 * Scope: basic_erp only.
 * Purpose:
 *  - remove the Live Booking Snapshot from Inward Registration in ERP mode
 *  - convert Company Settings category navigation into one horizontal tab strip
 *  - keep Classic Portal and Modern Dashboard untouched
 */

/* Inward registration: the modern review/snapshot card is intentionally absent in ERP mode. */
.ml-app-shell.theme-basic_erp .erp12-route-surface .inward-live-booking-snapshot {
  display: none !important;
}

/* Company Settings: compact horizontal category tabs so selected content begins immediately below. */
.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-workspace {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-panel {
  position: relative !important;
  top: auto !important;
  z-index: 90 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 8px !important;
  padding: 6px !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 6px !important;
  overflow: visible !important;
  border: 1px solid var(--erp12-line-strong) !important;
  border-radius: 5px !important;
  background: #f7f9fc !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-title {
  display: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-search {
  grid-column: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 1px solid var(--erp12-line-strong) !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-search input {
  min-height: 34px !important;
  height: 34px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-items {
  grid-column: 2 !important;
  position: relative !important;
  z-index: 91 !important;
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  padding: 0 0 2px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain !important;
  scrollbar-width: thin !important;
  pointer-events: auto !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-button {
  position: relative !important;
  z-index: 92 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 118px !important;
  max-width: none !important;
  min-height: 38px !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 6px 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  text-align: center !important;
  border: 1px solid var(--erp12-line-strong) !important;
  border-radius: 4px !important;
  background: linear-gradient(180deg, #ffffff 0%, #edf2f7 100%) !important;
  color: var(--erp12-text) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-button:hover {
  border-color: rgba(var(--erp12-primary-rgb), .55) !important;
  background: rgba(var(--erp12-primary-rgb), .08) !important;
  color: var(--erp12-primary-deep) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-button[data-active="true"] {
  border-color: var(--erp12-primary) !important;
  background: linear-gradient(180deg, rgba(var(--erp12-primary-rgb), .17), rgba(var(--erp12-primary-rgb), .07)) !important;
  color: var(--erp12-primary-deep) !important;
  box-shadow: inset 0 -3px 0 var(--erp12-primary) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-button .settings-nav-icon {
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  flex: 0 0 auto !important;
  display: inline !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-empty {
  flex: 1 0 100% !important;
  min-width: 260px !important;
  padding: 8px 10px !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-content-panel {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-content-scroll {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding-bottom: 56px !important;
}

@media (max-width: 1080px) {
  .ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-panel {
    grid-template-columns: 1fr !important;
  }

  .ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-search,
  .ml-app-shell.theme-basic_erp .erp12-route-surface[data-vb-route="/company-settings"] .settings-nav-items {
    grid-column: 1 !important;
  }
}


/* ===== styles/basicErpReferenceThemeV16.css ===== */
/*
 * Basic ERP / Desktop Theme V16
 * Scope: Theme 3 (basic_erp) only.
 * - removes company identity/user name from the top header
 * - keeps KPI cards in one horizontal strip with icon + content side-by-side
 * - removes moving shine/shimmer effects from ERP pages
 * - preserves Classic Portal and Modern Dashboard unchanged
 */

/* --------------------------------------------------------------------------
   Header: module-first ERP bar. MainLayout no longer renders brand/user blocks
   in Theme 3; these rules let navigation use that recovered space cleanly.
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-topbar {
  min-height: 76px !important;
  height: auto !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 6px 10px !important;
  justify-content: center !important;
  gap: 6px !important;
}

.ml-app-shell.theme-basic_erp .erp12-header-tools {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  padding: 0 12px 0 8px !important;
  gap: 8px !important;
}

.ml-app-shell.theme-basic_erp .erp12-header-tools .erp12-logout {
  min-width: 76px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 15px !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
}

/* On the ERP branch these elements are not rendered anymore; defensive rules
   also protect against stale hot-reload DOM during development. */
.ml-app-shell.theme-basic_erp .erp12-brand,
.ml-app-shell.theme-basic_erp .erp12-user-chip {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Dashboard KPIs: always one horizontal row. On narrow displays the row scrolls
   horizontally rather than dropping the KPI cards into a vertical stack.
   Every card itself is horizontal: circular icon left, text block right.
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-kpi-grid {
  width: 100% !important;
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 1px 1px 5px !important;
  scrollbar-width: thin !important;
}

.ml-app-shell.theme-basic_erp .erp12-kpi-card {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 205px !important;
  max-width: none !important;
  min-height: 106px !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 13px !important;
  padding: 12px 14px !important;
  overflow: hidden !important;
  text-align: left !important;
}

.ml-app-shell.theme-basic_erp .erp12-kpi-card > .erp12-kpi-icon {
  position: static !important;
  inset: auto !important;
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
  flex: 0 0 58px !important;
  margin: 0 !important;
  transform: none !important;
  border: 0 !important;
  border-radius: 50% !important;
  font-size: 24px !important;
  line-height: 1 !important;
}

.ml-app-shell.theme-basic_erp .erp12-kpi-card > .erp12-kpi-copy {
  position: static !important;
  inset: auto !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-kpi-copy > small,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > strong,
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > em {
  position: static !important;
  inset: auto !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.ml-app-shell.theme-basic_erp .erp12-kpi-copy > small {
  font-size: 11px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  white-space: normal !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > strong {
  font-size: 22px !important;
  font-weight: 850 !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
}
.ml-app-shell.theme-basic_erp .erp12-kpi-copy > em {
  font-size: 9.5px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  white-space: normal !important;
}

/* --------------------------------------------------------------------------
   ERP must feel like a stable desktop form, not a glass card carousel. Disable
   moving shine/shimmer/pulse animation only inside Theme 3 content.
   -------------------------------------------------------------------------- */
.ml-app-shell.theme-basic_erp .erp12-route-surface *,
.ml-app-shell.theme-basic_erp .erp12-dashboard * {
  animation: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-cms-polished="true"]::after,
.ml-app-shell.theme-basic_erp .erp12-route-surface .finance-hero::after,
.ml-app-shell.theme-basic_erp .erp12-route-surface .reports-dashboard-shell > section:first-child::after,
.ml-app-shell.theme-basic_erp .erp12-route-surface .report-workspace-hero::after,
.ml-app-shell.theme-basic_erp .erp12-route-surface .lot-glass::after,
.ml-app-shell.theme-basic_erp .erp12-route-surface .ops-glass::after,
.ml-app-shell.theme-basic_erp .erp12-route-surface .outward-hero::after,
.ml-app-shell.theme-basic_erp .erp12-route-surface .outward-process-hero::after,
.ml-app-shell.theme-basic_erp .erp12-route-surface .company-shatter-loader::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface .animate-shimmer,
.ml-app-shell.theme-basic_erp .erp12-route-surface [class*="shimmer" i],
.ml-app-shell.theme-basic_erp .erp12-route-surface [class*="shine" i] {
  animation: none !important;
}

@media (max-width: 1180px) {
  .ml-app-shell.theme-basic_erp .erp12-topnav {
    justify-content: flex-start !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-kpi-card {
    flex: 0 0 220px !important;
  }
}


/* ===== styles/basicErpReferenceThemeV17.css ===== */
/*
 * Basic ERP V17
 * Theme 3 only.
 * Fixes the top ERP module strip so it always starts at Home/first permitted
 * module instead of centering an overflowing flex row off-screen. Keeps
 * dropdowns above the work window and preserves the bottom-dock visual language.
 */

/* Remove the old V14 three-column header reservation. Theme 3 no longer renders
   a brand block, so the header has exactly two lanes: modules + tools. */
.ml-app-shell.theme-basic_erp .erp12-topbar {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav {
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  padding: 6px 8px !important;
  overflow: visible !important;
  transform: none !important;
  margin: 0 !important;
}

/* Fit the permitted top-half modules into the available lane instead of using
   a centered row whose first modules can live at a negative x-position. */
.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group {
  flex: 1 1 72px !important;
  width: auto !important;
  min-width: 58px !important;
  max-width: 98px !important;
  margin: 0 !important;
  transform: none !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group > summary,
.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 64px !important;
  padding: 6px 5px !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav .erp12-top-dock-label {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.ml-app-shell.theme-basic_erp .erp12-header-tools {
  grid-column: 2 !important;
  min-width: 0 !important;
  max-width: 350px !important;
  width: auto !important;
  flex: none !important;
  margin: 0 !important;
  padding: 0 10px 0 6px !important;
  align-self: stretch !important;
  position: relative !important;
  z-index: 10100 !important;
}

.ml-app-shell.theme-basic_erp .erp12-global-search {
  width: min(245px, 20vw) !important;
  min-width: 150px !important;
  max-width: 245px !important;
}

/* Keep details dropdowns outside/above the central desktop work window. */
.ml-app-shell.theme-basic_erp .erp12-nav-group[open] {
  z-index: 2147482000 !important;
}
.ml-app-shell.theme-basic_erp .erp12-nav-dropdown {
  z-index: 2147482100 !important;
}

/* Label-designer trigger placed on the Gate Pass register must stay usable in
   the dense ERP action strip. */
.ml-app-shell.theme-basic_erp .erp12-route-surface .gate-card-btn,
.ml-app-shell.theme-basic_erp .erp12-route-surface button[data-label-printer-trigger="true"] {
  min-height: 34px !important;
}

@media (max-width: 1320px) {
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group {
    min-width: 52px !important;
    max-width: 86px !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-global-search {
    width: 165px !important;
    min-width: 140px !important;
  }
}

@media (max-width: 1120px) {
  .ml-app-shell.theme-basic_erp .erp12-topbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-header-tools {
    min-width: 90px !important;
    max-width: 150px !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-global-search {
    display: none !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group {
    min-width: 48px !important;
    max-width: 78px !important;
  }
}


/* ===== styles/basicErpReferenceThemeV18.css ===== */
/*
 * Basic ERP V18
 * Theme 3 only.
 *
 * Top dock repair:
 * - long module names render completely and symmetrically
 * - Inward Management / Outward Management / Storage Management use two lines
 * - no centred clipping / negative text offsets / ellipsis on top tiles
 * - Classic Portal and Modern Dashboard are not targeted by this stylesheet
 */

.ml-app-shell.theme-basic_erp .erp12-topbar {
  grid-template-columns: minmax(0, 1fr) auto !important;
  min-width: 0 !important;
  overflow: visible !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav {
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  padding: 6px 7px !important;
  margin: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

/* Each tile owns its complete caption area. Keep enough width for the common
   two-word operation names without allowing one tile to push its neighbours. */
.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group {
  flex: 1 1 92px !important;
  width: auto !important;
  min-width: 82px !important;
  max-width: 112px !important;
  margin: 0 !important;
  transform: none !important;
  overflow: visible !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
.ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group > summary {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 68px !important;
  height: 68px !important;
  padding: 5px 5px 6px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  overflow: visible !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav .erp12-top-dock-icon {
  flex: 0 0 25px !important;
  width: 100% !important;
  height: 25px !important;
  min-height: 25px !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 20px !important;
  line-height: 1 !important;
  overflow: visible !important;
}

/* Do NOT use nowrap/ellipsis here. That was the reason labels appeared as
   "ward Management" / "rage Management". A two-line caption is deliberate. */
.ml-app-shell.theme-basic_erp .erp12-topnav .erp12-top-dock-label {
  flex: 0 0 25px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 25px !important;
  min-height: 25px !important;
  margin: 0 !important;
  padding: 0 1px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  hyphens: none !important;
  text-align: center !important;
  font-size: 9.8px !important;
  line-height: 1.08 !important;
  font-weight: 750 !important;
}

.ml-app-shell.theme-basic_erp .erp12-topnav .erp12-top-dock-caret {
  position: absolute !important;
  right: 4px !important;
  top: 4px !important;
  margin: 0 !important;
  font-size: 8px !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

/* Give operational modules more header width. Search remains available but
   no longer steals enough space to make the module captions unreadable. */
.ml-app-shell.theme-basic_erp .erp12-header-tools {
  grid-column: 2 !important;
  width: auto !important;
  min-width: 245px !important;
  max-width: 310px !important;
  padding: 0 8px 0 5px !important;
  gap: 6px !important;
  position: relative !important;
  z-index: 2147481000 !important;
}

.ml-app-shell.theme-basic_erp .erp12-global-search {
  width: min(190px, 15vw) !important;
  min-width: 135px !important;
  max-width: 190px !important;
}

/* Keep module dropdowns above the ERP work window. */
.ml-app-shell.theme-basic_erp .erp12-nav-group,
.ml-app-shell.theme-basic_erp .erp12-nav-group > summary {
  position: relative !important;
}
.ml-app-shell.theme-basic_erp .erp12-nav-group[open] {
  z-index: 2147482000 !important;
}
.ml-app-shell.theme-basic_erp .erp12-nav-dropdown {
  z-index: 2147482100 !important;
}

@media (max-width: 1500px) {
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group {
    flex-basis: 84px !important;
    min-width: 74px !important;
    max-width: 100px !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-topnav .erp12-top-dock-label {
    font-size: 9.2px !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-header-tools {
    min-width: 205px !important;
    max-width: 255px !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-global-search {
    width: 145px !important;
    min-width: 125px !important;
  }
}

@media (max-width: 1220px) {
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-link,
  .ml-app-shell.theme-basic_erp .erp12-topnav > .erp12-nav-group {
    flex-basis: 72px !important;
    min-width: 66px !important;
    max-width: 88px !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-topnav .erp12-top-dock-label {
    font-size: 8.7px !important;
    line-height: 1.05 !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-header-tools {
    min-width: 92px !important;
    max-width: 145px !important;
  }
  .ml-app-shell.theme-basic_erp .erp12-global-search {
    display: none !important;
  }
}


/* ===== styles/basicErpReferenceThemeV19.css ===== */
/* ============================================================================
   BASIC ERP / DESKTOP OPERATIONS THEME V19 — CONTRAST SAFETY
   ----------------------------------------------------------------------------
   Theme-3-only visual correction.  This file intentionally does not contain
   selectors for Classic Portal or Modern Dashboard.

   V12–V18 flatten modern gradient/card surfaces into white WinForms/Bootstrap
   panels.  Some page components kept their original white/light inline text,
   which could become invisible after the gradient was removed.  V19 restores
   a predictable readable foreground on those converted surfaces and provides
   a runtime contrast-marker target for legacy inline styles.
   ========================================================================== */

.ml-app-shell.theme-basic_erp,
html[data-erp-theme="basic_erp"] body {
  --erp19-text: #1f2f43;
  --erp19-heading: #14243a;
  --erp19-muted: #607087;
  --erp19-faint: #7b899b;
  --erp19-surface: #ffffff;
  --erp19-soft: #f7f9fc;
  --erp19-border: #ccd7e3;
}

/* Main route and portalled WinForms dialogs always start with readable text. */
.ml-app-shell.theme-basic_erp .erp12-route-surface,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] {
  color: var(--erp19-text) !important;
}

/*
 * V12–V18 deliberately remove modern gradients in Theme 3.  Reset the text on
 * exactly those converted elements as well, otherwise old `color:#fff` inline
 * styles become white-on-white.
 */
.ml-app-shell.theme-basic_erp .erp12-route-surface [style*="linear-gradient"]:not(button):not(a):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [style*="linear-gradient"]:not(button):not(a):not([data-preserve-theme-design="true"]) {
  color: var(--erp19-text) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [style*="linear-gradient"]:not(button):not(a):not(.label-designer-page *):not(.professional-report *)
  :is(h1,h2,h3,h4,h5,h6,p,label,legend,span,strong,small,div):not(button *):not(a *):not([class*="badge" i]):not([class*="pill" i]):not([class*="status" i]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [style*="linear-gradient"]:not(button):not(a)
  :is(h1,h2,h3,h4,h5,h6,p,label,legend,span,strong,small,div):not(button *):not(a *):not([class*="badge" i]):not([class*="pill" i]):not([class*="status" i]) {
  color: inherit !important;
}

/* Cards/panels/glass shells are forced to white by the ERP renderer; ensure
   inherited modern white text cannot disappear inside them. */
.ml-app-shell.theme-basic_erp .erp12-route-surface
  :is([class*="card" i],[class*="panel" i],[class*="glass" i]):not(.label-designer-page *):not(.professional-report *):not([data-print-layout="true"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"]
  :is([class*="card" i],[class*="panel" i],[class*="glass" i]):not([data-preserve-theme-design="true"]) {
  color: var(--erp19-text) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface
  :is([class*="card" i],[class*="panel" i],[class*="glass" i]):not(.label-designer-page *):not(.professional-report *)
  :is(h1,h2,h3,h4,h5,h6,p,label,legend):not(button *):not(a *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"]
  :is([class*="card" i],[class*="panel" i],[class*="glass" i])
  :is(h1,h2,h3,h4,h5,h6,p,label,legend):not(button *):not(a *) {
  color: var(--erp19-text) !important;
}

/* High-value page text.  Keep links/buttons/status pills free to use their own
   branded/semantic foregrounds. */
.ml-app-shell.theme-basic_erp .erp12-route-surface
  :is(h1,h2,h3,h4,h5,h6,legend):not(.label-designer-page *):not(.professional-report *):not(button *):not(a *) {
  color: var(--erp19-heading) !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface
  :is(label,.form-label,.field-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"]):not(.label-designer-page *):not(.professional-report *):not(button *):not(a *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"]
  :is(label,.form-label,.field-label,.cs-form-label,.hd-field-label,[data-erp-field-label="true"]):not(button *):not(a *) {
  color: #31455e !important;
}

/* Bootstrap-like controls: explicit foreground/background for every page. */
.ml-app-shell.theme-basic_erp .erp12-route-surface
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface select:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface textarea:not(.label-designer-page *):not(.professional-report *),
.ml-app-shell.theme-basic_erp .erp12-route-surface [role="combobox"]:not(.label-designer-page *):not(.professional-report *),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] select,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] textarea,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [role="combobox"] {
  background-color: #fff !important;
  color: #1d2c40 !important;
  border-color: #bac8d7 !important;
  -webkit-text-fill-color: #1d2c40 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface :is(input,textarea)::placeholder,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] :is(input,textarea)::placeholder {
  color: #7f8ea1 !important;
  -webkit-text-fill-color: #7f8ea1 !important;
  opacity: 1 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface select option,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] select option {
  background: #fff !important;
  color: #1d2c40 !important;
}

/* Spreadsheet bodies stay readable regardless of page-level theme tokens. */
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) tbody td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) tbody td {
  background-color: #fff !important;
  color: #24364d !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface table:not(.label-designer-page table):not(.professional-report table) tbody tr:nth-child(even) td,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] table:not(.professional-report table) tbody tr:nth-child(even) td {
  background-color: #f8fafc !important;
}

/* Search/select popup grids must not inherit white text from the branded shell. */
html[data-erp-theme="basic_erp"] body
  :is(.vb-select-window,.vb-select-grid-body,.css-search-select-dropdown,.react-select__menu,.select__menu,[class*="dropdown-menu" i],[class*="autocomplete" i],[class*="suggestion" i]) {
  color: var(--erp19-text) !important;
}
html[data-erp-theme="basic_erp"] body
  :is(.vb-select-grid-body,.css-search-select-dropdown,.react-select__menu,.select__menu,[class*="dropdown-menu" i],[class*="autocomplete" i],[class*="suggestion" i])
  :is(div,span,strong,small,label):not(button *) {
  color: inherit !important;
}

/* Theme-3 runtime contrast audit marks only elements whose *computed* contrast
   is actually too low.  This catches inline legacy colors on pages not covered
   by predictable class names while leaving semantic colored text untouched. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-contrast="dark"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-contrast="dark"] {
  color: #1f2f43 !important;
  -webkit-text-fill-color: #1f2f43 !important;
}
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-contrast="light"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-contrast="light"] {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Explicit fixes for Grower/Agreement legacy hero descendants after their
   modern backgrounds are flattened by Theme 3. */
.ml-app-shell.theme-basic_erp .erp12-route-surface
  :is(.grower-page,.growers-page,.add-grower-page,.agreement-entry-form,[class*="grower" i],[class*="agreement" i])
  :is(h1,h2,h3,h4,h5,h6,p,label,legend):not(button *):not(a *):not(.professional-report *) {
  color: var(--erp19-heading) !important;
}

/* Never restyle the other two themes or professional/print designs. */


/* ===== styles/basicErpReferenceThemeV20.css ===== */
/* ============================================================================
   BASIC ERP / DESKTOP OPERATIONS THEME V20 — FIELD WIDTH / SYMMETRY REPAIR
   ----------------------------------------------------------------------------
   Theme 3 only.  This layer fixes legacy form wrappers that retained narrow
   inline/max-width constraints after being placed in the 3-column ERP form
   grid.  Classic Portal and Modern Dashboard are intentionally not targeted.
   ========================================================================== */

/* Make every logical ERP field occupy its complete grid cell.  V12 used
   display:contents for intermediate wrappers; legacy pages with nested fixed
   widths could therefore leave the actual input in a tiny content box. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-shell="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-shell="true"] {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  align-self: stretch !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-table="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-table="true"] {
  grid-auto-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
}

/* A field pair is deliberately Label + a generously sized control. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  grid-template-columns: 118px minmax(180px, 1fr) !important;
  align-self: stretch !important;
}

/* Direct control branch: remove old page-specific max-width/flex-basis rules. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] > :not(label):not(.form-label):not(.cs-form-label):not(.hd-field-label):not([data-erp-field-label="true"]):not([class*="field-label" i]) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 1 1 auto !important;
  justify-self: stretch !important;
}

/* Common legacy/custom input wrappers.  Restrict this to marked ERP rows so
   search toolbars, compact table filters and action controls keep their sizes. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"]
  :is(.input-group,.input-wrapper,.form-control-wrap,.select-wrapper,.dropdown-wrapper,.cs-searchable-select,.react-select__container,[class*="input-wrap" i],[class*="select-wrap" i],[class*="dropdown-wrap" i],[class*="control-wrap" i]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"]
  :is(.input-group,.input-wrapper,.form-control-wrap,.select-wrapper,.dropdown-wrapper,.cs-searchable-select,.react-select__container,[class*="input-wrap" i],[class*="select-wrap" i],[class*="dropdown-wrap" i],[class*="control-wrap" i]) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 1 1 auto !important;
}

/* Direct-label fields are themselves grid rows; their nested control must fill
   column two rather than keeping the component's original compact width. */
.ml-app-shell.theme-basic_erp .erp12-route-surface label[data-basic-erp-direct-label="true"] > :is(input,select,textarea,[role="combobox"],.input-group,.input-wrapper,.form-control-wrap,.select-wrapper,.dropdown-wrapper,.cs-searchable-select,div:has(> input),div:has(> select),div:has(> textarea),div:has(> [role="combobox"])),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] label[data-basic-erp-direct-label="true"] > :is(input,select,textarea,[role="combobox"],.input-group,.input-wrapper,.form-control-wrap,.select-wrapper,.dropdown-wrapper,.cs-searchable-select,div:has(> input),div:has(> select),div:has(> textarea),div:has(> [role="combobox"])) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 1 1 auto !important;
  justify-self: stretch !important;
}

/* Inputs themselves always fill the available control lane.  Explicitly clear
   legacy max-width/min-content sizing that appears on older Grower, Agreement,
   Finance, Inventory and modal forms. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),select,textarea,[role="combobox"]),
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),select,textarea,[role="combobox"]) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 1 1 auto !important;
}

/* Keep search-select trigger buttons aligned with normal edit fields. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"] :is(.cs-searchable-select,[role="combobox"]) > button,
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] :is(.cs-searchable-select,[role="combobox"]) > button {
  width: 100% !important;
  max-width: none !important;
}

/* Wide/remarks fields still span the form and receive a useful control lane. */
.ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"][data-basic-erp-wide="true"],
html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"][data-basic-erp-wide="true"] {
  grid-template-columns: 118px minmax(260px, 1fr) !important;
}

/* At smaller desktop widths the existing ERP renderer changes to two columns;
   maintain the same field width repair without forcing horizontal overflow. */
@media (max-width: 1120px) {
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] {
    grid-template-columns: 112px minmax(160px, 1fr) !important;
  }
}

@media (max-width: 820px) {
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] {
    grid-template-columns: 108px minmax(0, 1fr) !important;
  }
}

@media (max-width: 540px) {
  .ml-app-shell.theme-basic_erp .erp12-route-surface [data-basic-erp-field-row="true"],
  html[data-erp-theme="basic_erp"] body [data-erp-modal-panel="true"] [data-basic-erp-field-row="true"] {
    grid-template-columns: 1fr !important;
  }
}


/* ===== styles/cmsDesignSystem.css ===== */
/*  */

/* ===== styles/finalUnifiedDesign.css ===== */
/* Final unified Cold Storage / HD Orchards design layer. Imported last. */
:root{--ops-radius:18px;--ops-radius-sm:12px;--ops-border:rgba(15,23,42,.12);--ops-shadow:0 16px 45px rgba(15,23,42,.14);--ops-surface:#fff;--ops-muted:#64748b;--ops-text:#0f172a}

.ref-more-category-icon,
.ref-more-category-strip{width:100%!important;max-width:100%!important;display:flex!important;flex-direction:row!important;gap:8px!important;overflow-x:auto!important;padding:10px 18px!important;border:0!important;border-bottom:1px solid var(--ops-border)!important;background:#f8fafc!important;position:sticky!important;top:0!important;z-index:3!important;}

.ref-more-module-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(170px,1fr))!important;gap:14px!important;padding:18px!important;align-items:stretch!important;}

.ref-more-module-card{min-height:126px!important;height:100%!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;gap:10px!important;padding:16px!important;border:1px solid var(--ops-border)!important;border-radius:18px!important;background:linear-gradient(145deg,#fff,#f8fafc)!important;box-shadow:0 8px 22px rgba(15,23,42,.08)!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;}
.ref-more-module-card:hover{transform:translateY(-3px)!important;box-shadow:0 16px 32px rgba(15,23,42,.14)!important;border-color:rgba(22,163,74,.45)!important;}

.path,
.pathname{display:none!important;}

.hd-code-details-modal,
.hd-detail-modal,
.hd-form-modal,
.hd-modal,
.hd-tracking-modal{width:min(1120px,calc(100vw - 28px))!important;max-height:min(90vh,900px)!important;display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;overflow:hidden!important;border-radius:22px!important;background:#fff!important;box-shadow:var(--ops-shadow)!important;}

.hd-modal-overlay,
.hd-tracking-modal-overlay{position:fixed!important;inset:0!important;width:100%!important;height:100%!important;display:grid!important;place-items:center!important;padding:14px!important;overflow:auto!important;background:rgba(15,23,42,.5)!important;z-index:10000!important;}

.hd-form-modal-head,
.hd-modal-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;width:auto!important;min-height:72px!important;padding:14px 18px!important;border-bottom:1px solid var(--ops-border)!important;background:linear-gradient(135deg,#fff,#f8fafc)!important;}

.hd-form-modal-title,
.hd-modal-title-layout{display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important;}

.hd-modal-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:10px!important;width:auto!important;min-height:68px!important;padding:12px 18px!important;border-top:1px solid var(--ops-border)!important;background:#fff!important;}

.hd-modal-close{width:40px!important;height:40px!important;display:grid!important;place-items:center!important;flex:0 0 40px!important;border-radius:12px!important;}

.hd-detail-photo-section,
.hd-detail-section,
.hd-form-section{position:relative!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;margin:0 0 14px!important;border:1px solid var(--ops-border)!important;border-radius:16px!important;background:#fff!important;box-shadow:0 5px 18px rgba(15,23,42,.06)!important;}

.hd-detail-sections{display:grid!important;gap:14px!important;}
.hd-form-section-head,.hd-form-section-toggle{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;width:100%!important;padding:13px 16px!important;border:0!important;background:transparent!important;}
.hd-form-section-copy,.hd-form-section-meta{display:flex!important;align-items:center!important;gap:8px!important;min-width:0!important;}
.hd-form-section-state{display:inline-flex!important;align-items:center!important;min-height:24px!important;padding:3px 8px!important;border-radius:999px!important;background:#f1f5f9!important;color:#475569!important;}
.hd-form-section-chevron{width:auto!important;height:auto!important;border:0!important;background:transparent!important;box-shadow:none!important;}

.hd-form-grid{position:static!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important;height:auto!important;max-height:none!important;overflow:visible!important;padding:16px!important;}

/* Robust scoped fallbacks for historical class names. */
[class*="more-modules"][class*="layout"],[class*="module-modal"][class*="layout"],[class*="modules-modal"][class*="body"]{grid-template-columns:1fr!important;display:block!important}
[class*="more-modules"] [class*="sidebar"],[class*="module-modal"] [class*="sidebar"]{width:100%!important;display:flex!important;overflow-x:auto!important;border-right:0!important;border-bottom:1px solid var(--ops-border)!important}
[class*="more-modules"] [class*="grid"],[class*="module-modal"] [class*="grid"]{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(170px,1fr))!important;gap:14px!important;width:100%!important}
[class*="more-modules"] [class*="route"],[class*="more-modules"] [class*="path"],[class*="module-modal"] [class*="route"],[class*="module-modal"] [class*="path"]{display:none!important}
[class*="hd-"][class*="modal"] [class*="section"],[class*="crud"][class*="modal"] [class*="section"]{height:auto!important;max-height:none!important;overflow:visible!important;position:relative!important}
[class*="hd-"][class*="modal"] input,[class*="hd-"][class*="modal"] select,[class*="hd-"][class*="modal"] textarea{background:#fff!important;color:#0f172a!important;border:1px solid #cbd5e1!important;opacity:1!important;min-height:44px!important;position:relative!important;z-index:1!important}
[class*="hd-"][class*="modal"] [role="listbox"],[class*="crud"][class*="modal"] [role="listbox"]{z-index:10050!important}
@media(max-width:900px){.hd-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:620px){.hd-form-grid{grid-template-columns:1fr!important}[class*="more-modules"] [class*="grid"],[class*="module-modal"] [class*="grid"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:380px){[class*="more-modules"] [class*="grid"],[class*="module-modal"] [class*="grid"]{grid-template-columns:1fr!important}}


/* Stable classes attached directly to the current JSX. */
.final-module-modal{width:min(1240px,calc(100vw - 32px))!important;max-height:min(88vh,900px)!important;display:grid!important;grid-template-rows:auto minmax(0,1fr)!important;border-radius:24px!important;background:#fff!important;overflow:hidden!important;box-shadow:0 30px 90px rgba(15,23,42,.28)!important}
.final-module-modal-layout{display:block!important;grid-template-columns:1fr!important;min-width:0!important;overflow:auto!important;background:#f8fafc!important}
.final-module-category-chips{position:sticky!important;top:0!important;z-index:5!important;width:100%!important;max-width:none!important;display:flex!important;flex-direction:row!important;align-items:center!important;gap:8px!important;overflow-x:auto!important;padding:12px 18px!important;border:0!important;border-bottom:1px solid rgba(15,23,42,.1)!important;background:rgba(255,255,255,.96)!important}
.final-module-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important;align-items:stretch!important;width:100%!important;padding:18px!important;margin:0!important}
.final-module-card{display:flex!important;min-width:0!important;min-height:132px!important;height:100%!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;gap:10px!important;padding:16px!important;border:1px solid rgba(15,23,42,.11)!important;border-radius:18px!important;background:linear-gradient(145deg,#fff 0%,#f8fafc 100%)!important;box-shadow:0 8px 24px rgba(15,23,42,.08)!important}
.final-module-card svg{width:24px!important;height:24px!important}
.final-module-route{display:none!important}
.final-operational-modal{width:min(1120px,calc(100vw - 28px))!important;max-height:min(92vh,920px)!important;display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;overflow:hidden!important;border-radius:22px!important;background:#fff!important;box-shadow:0 28px 80px rgba(15,23,42,.26)!important}
.final-operational-modal-header{position:relative!important;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important;gap:14px!important;min-height:82px!important;height:auto!important;padding:16px 20px!important;margin:0!important;overflow:visible!important;background:linear-gradient(135deg,#fff,#f8fafc)!important;border-bottom:1px solid rgba(15,23,42,.1)!important}
.final-operational-modal-header>*{position:static!important;transform:none!important;margin-top:0!important}
.final-operational-modal-body{min-height:0!important;overflow-y:auto!important;overflow-x:visible!important;padding:18px!important;background:#f8fafc!important}
.final-form-section{position:relative!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;margin:0 0 14px!important;border:1px solid rgba(15,23,42,.1)!important;border-radius:16px!important;background:#fff!important;box-shadow:0 6px 20px rgba(15,23,42,.06)!important}
.final-form-grid{position:static!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;padding:16px!important}
.final-operational-modal-footer{position:relative!important;z-index:10!important;display:flex!important;justify-content:flex-end!important;gap:10px!important;min-height:70px!important;padding:12px 18px!important;background:#fff!important;border-top:1px solid rgba(15,23,42,.1)!important}
@media(max-width:1200px){.final-module-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:900px){.final-module-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.final-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:620px){.final-module-modal,.final-operational-modal{width:calc(100vw - 16px)!important;max-height:94vh!important;border-radius:18px!important}.final-module-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:12px!important}.final-form-grid{grid-template-columns:1fr!important}.final-operational-modal-body{padding:12px!important}}
@media(max-width:380px){.final-module-grid{grid-template-columns:1fr!important}}


/* ===== styles/glassmorphism.css ===== */
/* ============================================
   ULTRA MODERN GLASSMORPHISM STYLES
   Cold Storage Management SaaS
   ============================================ */

/* ============================================
   BASE GLASS EFFECTS
   ============================================ */

.glass {
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  border-radius: 20px;
}

.glass-dark {
  background: rgba(13, 30, 55, 0.65);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
  border-radius: 20px;
}

.glass-premium {
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(30px) saturate(200%);
  -webkit-backdrop-filter: blur(30px) saturate(200%);
  border: 1px solid rgba(255, 255, 255, 0.15);
  box-shadow: 0 12px 48px 0 rgba(31, 38, 135, 0.2);
  border-radius: 24px;
}

.glass-frost {
  background: rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(10px) saturate(120%);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 20px 0 rgba(31, 38, 135, 0.1);
  border-radius: 16px;
}

/* ============================================
   GLASS BUTTONS
   ============================================ */

.glass-button {
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(10px) saturate(180%);
  -webkit-backdrop-filter: blur(10px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: white;
  padding: 12px 24px;
  border-radius: 12px;
  font-weight: 500;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.glass-button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
  transition: left 0.5s ease;
}

.glass-button:hover {
  background: rgba(255, 255, 255, 0.15);
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(31, 38, 135, 0.25);
}

.glass-button:hover::before {
  left: 100%;
}

.glass-button:active {
  transform: translateY(0);
  box-shadow: none;
}

.glass-button-primary {
  background: linear-gradient(135deg, color-mix(in srgb, var(--erp-primary) 80%, transparent), color-mix(in srgb, var(--erp-secondary) 80%, transparent));
  border-color: color-mix(in srgb, var(--erp-primary) 30%, transparent);
}

.glass-button-primary:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--erp-primary) 90%, transparent), color-mix(in srgb, var(--erp-secondary) 90%, transparent));
  box-shadow: 0 8px 32px color-mix(in srgb, var(--erp-primary) 40%, transparent);
}

.glass-button-secondary {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.1);
}

.glass-button-secondary:hover {
  background: rgba(255, 255, 255, 0.12);
}

.glass-button-success {
  background: linear-gradient(135deg, rgba(76, 175, 80, 0.8), rgba(102, 187, 106, 0.8));
  border-color: rgba(76, 175, 80, 0.3);
}

.glass-button-danger {
  background: linear-gradient(135deg, rgba(244, 67, 54, 0.8), rgba(239, 83, 80, 0.8));
  border-color: rgba(244, 67, 54, 0.3);
}

.glass-button-warning {
  background: linear-gradient(135deg, rgba(255, 193, 7, 0.8), rgba(255, 202, 40, 0.8));
  border-color: rgba(255, 193, 7, 0.3);
}

.glass-button-sm {
  padding: 8px 16px;
  font-size: 0.875rem;
  border-radius: 8px;
}

.glass-button-lg {
  padding: 16px 32px;
  font-size: 1.125rem;
  border-radius: 16px;
}

.glass-button-disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none !important;
}

/* ============================================
   GLASS INPUTS
   ============================================ */

.glass-input {
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(10px) saturate(180%);
  -webkit-backdrop-filter: blur(10px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: white;
  padding: 12px 16px;
  border-radius: 12px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  width: 100%;
  font-size: 1rem;
}

.glass-input:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--erp-primary) 50%, transparent);
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--erp-primary) 10%, transparent);
}

.glass-input::placeholder {
  color: rgba(255, 255, 255, 0.4);
}

.glass-input-error {
  border-color: rgba(244, 67, 54, 0.5);
}

.glass-input-error:focus {
  border-color: rgba(244, 67, 54, 0.5);
  box-shadow: 0 0 0 3px rgba(244, 67, 54, 0.1);
}

.glass-input-success {
  border-color: rgba(76, 175, 80, 0.5);
}

.glass-input-success:focus {
  border-color: rgba(76, 175, 80, 0.5);
  box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.1);
}

/* ============================================
   GLASS CARDS
   ============================================ */

.glass-card {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.glass-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.05), transparent);
  border-radius: 20px;
  pointer-events: none;
}

.glass-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 48px rgba(31, 38, 135, 0.2);
  border-color: rgba(255, 255, 255, 0.15);
}

.glass-card-hover {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-card-hover:hover {
  transform: translateY(-4px) scale(1.01);
  box-shadow: 0 12px 48px rgba(31, 38, 135, 0.25);
  background: rgba(255, 255, 255, 0.08);
}

.glass-card-premium {
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(30px) saturate(200%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 24px;
}

.glass-card-dark {
  background: rgba(13, 30, 55, 0.5);
  backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 20px;
}

/* ============================================
   GLASS HEADER / NAVBAR
   ============================================ */

.glass-header {
  background: rgba(13, 30, 55, 0.7);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding: 16px 24px;
  position: sticky;
  top: 0;
  z-index: 100;
}

.glass-header-transparent {
  background: transparent;
  border-bottom: none;
}

/* ============================================
   GLASS SIDEBAR
   ============================================ */

.glass-sidebar {
  background: rgba(13, 30, 55, 0.7);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-right: 1px solid rgba(255, 255, 255, 0.06);
  width: 280px;
  height: 100vh;
  position: sticky;
  top: 0;
  overflow-y: auto;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-sidebar-item {
  display: flex;
  align-items: center;
  padding: 12px 20px;
  margin: 4px 12px;
  border-radius: 12px;
  color: rgba(255, 255, 255, 0.7);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
  text-decoration: none;
  position: relative;
}

.glass-sidebar-item:hover {
  background: rgba(255, 255, 255, 0.08);
  color: white;
  transform: translateX(4px);
}

.glass-sidebar-item-active {
  background: color-mix(in srgb, var(--erp-primary) 20%, transparent);
  color: white;
  border-left: 3px solid var(--color-primary);
}

.glass-sidebar-item-active::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--erp-primary), var(--erp-secondary));
  border-radius: 0 3px 3px 0;
}

/* ============================================
   GLASS MODAL
   ============================================ */

.glass-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  animation: fadeIn 0.3s ease-out;
}

.glass-modal {
  background: rgba(13, 30, 55, 0.85);
  backdrop-filter: blur(30px) saturate(200%);
  -webkit-backdrop-filter: blur(30px) saturate(200%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 24px;
  padding: 32px;
  max-width: 600px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
  animation: slideUp 0.3s ease-out;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.4);
}

/* ============================================
   GLASS TABLE
   ============================================ */

.glass-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.glass-table th {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(10px);
  padding: 12px 16px;
  text-align: left;
  color: rgba(255, 255, 255, 0.8);
  font-weight: 600;
  font-size: 0.875rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.glass-table td {
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.9);
}

.glass-table tr {
  transition: all 0.2s ease;
}

.glass-table tr:hover {
  background: rgba(255, 255, 255, 0.04);
}

/* ============================================
   GLASS CHIPS / BADGES
   ============================================ */

.glass-chip {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 500;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.8);
}

.glass-chip-primary {
  background: color-mix(in srgb, var(--erp-primary) 30%, transparent);
  border-color: color-mix(in srgb, var(--erp-primary) 20%, transparent);
  color: #8bb4e0;
}

.glass-chip-success {
  background: rgba(76, 175, 80, 0.3);
  border-color: rgba(76, 175, 80, 0.2);
  color: #81c784;
}

.glass-chip-danger {
  background: rgba(244, 67, 54, 0.3);
  border-color: rgba(244, 67, 54, 0.2);
  color: #ef9a9a;
}

.glass-chip-warning {
  background: rgba(255, 193, 7, 0.3);
  border-color: rgba(255, 193, 7, 0.2);
  color: #ffd54f;
}

/* ============================================
   GLASS STATS CARD
   ============================================ */

.glass-stats {
  display: flex;
  align-items: center;
  padding: 20px 24px;
}

.glass-stats-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  margin-right: 16px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.glass-stats-content {
  flex: 1;
}

.glass-stats-label {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.875rem;
  font-weight: 500;
}

.glass-stats-value {
  color: white;
  font-size: 1.5rem;
  font-weight: 700;
  margin-top: 4px;
}

.glass-stats-change {
  display: inline-flex;
  align-items: center;
  font-size: 0.75rem;
  font-weight: 500;
  margin-top: 4px;
  padding: 2px 8px;
  border-radius: 6px;
}

.glass-stats-change-positive {
  color: #81c784;
  background: rgba(76, 175, 80, 0.15);
}

.glass-stats-change-negative {
  color: #ef9a9a;
  background: rgba(244, 67, 54, 0.15);
}

/* ============================================
   ANIMATIONS
   ============================================ */

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideLeft {
  from {
    opacity: 0;
    transform: translateX(20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideRight {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

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

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

@keyframes glassPulse {
  0%, 100% {
    background: rgba(255, 255, 255, 0.05);
  }
  50% {
    background: rgba(255, 255, 255, 0.1);
  }
}

@keyframes pulse {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.05);
    opacity: 0.8;
  }
}

/* ============================================
   GLASS LOADING SPINNER
   ============================================ */

.glass-spinner {
  display: inline-block;
  width: 48px;
  height: 48px;
  border: 3px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  border-top-color: var(--color-primary);
  animation: spin 0.8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
  backdrop-filter: blur(10px);
  background: rgba(255, 255, 255, 0.05);
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* ============================================
   GLASS TOAST / NOTIFICATION
   ============================================ */

.glass-toast {
  background: rgba(13, 30, 55, 0.85);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 16px 20px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  color: white;
  animation: slideUp 0.3s ease-out;
}

.glass-toast-success {
  border-left: 4px solid #4caf50;
}

.glass-toast-error {
  border-left: 4px solid #f44336;
}

.glass-toast-warning {
  border-left: 4px solid #ffc107;
}

.glass-toast-info {
  border-left: 4px solid #03a9f4;
}

/* ============================================
   RESPONSIVE GLASS
   ============================================ */

@media (max-width: 768px) {
  .glass-sidebar {
    width: 100%;
    height: auto;
    position: fixed;
    bottom: 0;
    top: auto;
    border-right: none;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    max-height: 80vh;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .glass-sidebar-open {
    transform: translateY(0);
  }

  .glass-modal {
    padding: 20px;
    margin: 16px;
    max-height: 80vh;
  }

  .glass-stats {
    flex-direction: column;
    align-items: flex-start;
  }

  .glass-stats-icon {
    margin-right: 0;
    margin-bottom: 12px;
  }
}

/* ============================================
   DARK THEME OVERRIDES
   ============================================ */

@media (prefers-color-scheme: dark) {
  .glass {
    background: rgba(13, 30, 55, 0.5);
    border-color: rgba(255, 255, 255, 0.06);
  }

  .glass-premium {
    background: rgba(13, 30, 55, 0.7);
    border-color: rgba(255, 255, 255, 0.08);
  }
}

/* ============================================
   UTILITY CLASSES
   ============================================ */

.glass-blur-sm {
  backdrop-filter: blur(8px) saturate(120%);
  -webkit-backdrop-filter: blur(8px) saturate(120%);
}

.glass-blur-md {
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
}

.glass-blur-lg {
  backdrop-filter: blur(24px) saturate(200%);
  -webkit-backdrop-filter: blur(24px) saturate(200%);
}

.glass-blur-xl {
  backdrop-filter: blur(40px) saturate(200%);
  -webkit-backdrop-filter: blur(40px) saturate(200%);
}

.glass-border {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.glass-border-light {
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.glass-shadow {
  box-shadow: 0 8px 32px rgba(31, 38, 135, 0.15);
}

.glass-shadow-lg {
  box-shadow: 0 12px 48px rgba(31, 38, 135, 0.2);
}

.glass-shadow-dark {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.glass-rounded {
  border-radius: 16px;
}

.glass-rounded-lg {
  border-radius: 24px;
}

.glass-rounded-full {
  border-radius: 9999px;
}
/* ============================================
   LOGIN PAGE SPECIFIC STYLES
   ============================================ */

/* Glass Card with subtle glow effect */
.glass-card-premium {
  position: relative;
  overflow: visible;
}

.glass-card-premium::after {
  content: '';
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  background: linear-gradient(45deg, 
    color-mix(in srgb, var(--erp-primary) 30%, transparent),
    color-mix(in srgb, var(--erp-secondary) 30%, transparent),
    rgba(255, 152, 0, 0.3),
    color-mix(in srgb, var(--erp-primary) 30%, transparent)
  );
  border-radius: 26px;
  z-index: -1;
  animation: borderGlow 3s ease-in-out infinite;
  background-size: 300% 300%;
}

@keyframes borderGlow {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/* Remember me checkbox styling */
input[type="checkbox"].glass {
  appearance: none;
  -webkit-appearance: none;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 4px;
  transition: all 0.3s ease;
  position: relative;
}

input[type="checkbox"].glass:checked {
  background: linear-gradient(135deg, var(--erp-primary), var(--erp-secondary));
  border-color: var(--erp-primary);
}

input[type="checkbox"].glass:checked::after {
  content: '✓';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 12px;
  font-weight: bold;
}

input[type="checkbox"].glass:focus {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--erp-primary) 20%, transparent);
}

/* Password toggle button animation */
.relative button {
  transition: transform 0.2s ease;
}

.relative button:hover {
  transform: scale(1.1);
}

.relative button:active {
  transform: scale(0.95);
}

/* Error message animation */
.animate-fade-in {
  animation: fadeIn 0.3s ease-out;
}

/* Responsive adjustments */
@media (max-width: 640px) {
  .glass-card-premium {
    padding: 20px !important;
    margin: 16px;
  }
  
  .glass-card-premium h1 {
    font-size: 1.5rem !important;
  }
}

/* ===== styles/globals.css ===== */
/* ============================================
   GLOBAL STYLES
   Cold Storage Management SaaS
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Poppins:wght@400;500;600;700&display=swap');

/* ============================================
   RESET & BASE
   ============================================ */
/* Light Theme Variables */
:root {
  --erp-primary: #1a5fa8;
  --erp-secondary: #00b8e6;
  --erp-accent: #ff9800;
  --color-primary: var(--erp-primary);
  --color-secondary: var(--erp-secondary);
  --color-accent: var(--erp-accent);
  --bg-primary: #f8fafc;
  --bg-secondary: #ffffff;
  --text-primary: #1a1a2e;
  --text-secondary: #6b7280;
  --border-light: rgba(0,0,0,0.06);
  --glass-bg: rgba(255,255,255,0.7);
  --glass-border: rgba(255,255,255,0.8);
  --glass-shadow: 0 4px 24px rgba(0,0,0,0.04);
  --shadow-hover: 0 12px 48px rgba(0,0,0,0.08);
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: linear-gradient(155deg, color-mix(in srgb, var(--erp-primary) 7%, #f8fafc), #f8fafc 48%, color-mix(in srgb, var(--erp-secondary) 7%, #f8fafc));
  color: #0f172a;
  min-height: 100vh;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ============================================
   SCROLLBAR STYLING
   ============================================ */

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.02);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.25);
}

/* ============================================
   ANIMATED BACKGROUND
   ============================================ */

.bg-animated {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  overflow: hidden;
}

.bg-animated-gradient {
  position: absolute;
  width: 600px;
  height: 600px;
  border-radius: 50%;
  filter: blur(120px);
  opacity: 0.3;
  animation: floatGradient 20s ease-in-out infinite alternate;
}

.bg-animated-gradient-1 {
  top: -200px;
  right: -100px;
  background: radial-gradient(circle, var(--erp-primary), transparent 70%);
  animation-delay: 0s;
}

.bg-animated-gradient-2 {
  bottom: -200px;
  left: -100px;
  background: radial-gradient(circle, var(--erp-secondary), transparent 70%);
  animation-delay: -5s;
}

.bg-animated-gradient-3 {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, var(--erp-accent), transparent 70%);
  animation-delay: -10s;
  opacity: 0.15;
}

@keyframes floatGradient {
  0% {
    transform: translate(0, 0) scale(1);
  }
  25% {
    transform: translate(100px, -50px) scale(1.1);
  }
  50% {
    transform: translate(-50px, 100px) scale(0.9);
  }
  75% {
    transform: translate(50px, -100px) scale(1.05);
  }
  100% {
    transform: translate(-100px, 50px) scale(1);
  }
}

/* ============================================
   GLASS OVERLAY FOR SECTIONS
   ============================================ */

.section-glass {
  position: relative;
  padding: 24px;
  margin: 16px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.section-glass::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.03), transparent 50%);
  border-radius: 24px;
  pointer-events: none;
}

/* ============================================
   TEXT UTILITIES
   ============================================ */

.text-gradient {
  background: linear-gradient(135deg, var(--erp-primary), var(--erp-secondary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.text-gradient-accent {
  background: linear-gradient(135deg, var(--erp-accent), color-mix(in srgb, var(--erp-accent) 70%, white));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.text-glass {
  color: rgba(255, 255, 255, 0.7);
}

.text-glass-light {
  color: rgba(255, 255, 255, 0.5);
}

.text-glass-dark {
  color: rgba(13, 30, 55, 0.7);
}

/* ============================================
   ANIMATION UTILITIES
   ============================================ */

.animate-fade-in {
  animation: fadeIn 0.5s ease-out;
}

.animate-slide-up {
  animation: slideUp 0.5s ease-out;
}

.animate-slide-down {
  animation: slideDown 0.5s ease-out;
}

.animate-slide-left {
  animation: slideLeft 0.5s ease-out;
}

.animate-slide-right {
  animation: slideRight 0.5s ease-out;
}

.animate-float {
  animation: float 3s ease-in-out infinite;
}

.animate-pulse {
  animation: pulse 2s ease-in-out infinite;
}

.animate-shimmer {
  animation: shimmer 2s ease-in-out infinite;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.05), transparent);
  background-size: 200% 100%;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 768px) {
  .section-glass {
    padding: 16px;
    margin: 8px;
    border-radius: 16px;
  }

  .bg-animated-gradient {
    width: 300px;
    height: 300px;
    filter: blur(80px);
  }
}
/* Glass Sidebar Animations */
@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slide-up {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

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

@keyframes shimmer {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(100%);
  }
}

@keyframes pulse {
  0%, 100% {
    opacity: 0.5;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.1);
  }
}

.animate-fade-in {
  animation: fade-in 0.3s ease-out;
}

.animate-slide-up {
  animation: slide-up 0.4s ease-out;
}

.animate-float {
  animation: float 6s ease-in-out infinite;
}

.animate-pulse {
  animation: pulse 2s ease-in-out infinite;
}
@keyframes float {
  0%, 100% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(-20px) rotate(5deg); }
}

@keyframes pulse {
  0%, 100% { opacity: 0.3; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.3); }
}

@keyframes shimmer {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

@keyframes fade-in {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}
@import './premiumWaterMotion.css';


/* ===== styles/operationsAesthetics.css ===== */
@keyframes opsDiagonalShine{0%{transform:translate3d(-145%,0,0) skewX(-22deg)}55%,100%{transform:translate3d(245%,0,0) skewX(-22deg)}}
@keyframes opsReadyPulse{0%,100%{box-shadow:0 12px 30px rgba(15,23,42,.08),0 0 0 0 rgba(16,185,129,.24)}50%{box-shadow:0 18px 42px rgba(15,23,42,.12),0 0 0 7px rgba(16,185,129,0)}}
@keyframes shatterPiece{0%,100%{opacity:.34;transform:translate(var(--sx,0),var(--sy,0)) rotate(var(--sr,0deg)) scale(.72)}42%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}64%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}}
@keyframes shatterHalo{0%,100%{transform:scale(.96);filter:saturate(.96)}50%{transform:scale(1.04);filter:saturate(1.12)}}
@keyframes loaderDots{0%,80%,100%{transform:translateY(0);opacity:.35}40%{transform:translateY(-4px);opacity:1}}

.company-shatter-loader{min-height:220px;display:grid;place-items:center;align-content:center;gap:12px;padding:28px;border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.91),rgba(248,250,252,.74));border:1px solid rgba(255,255,255,.84);box-shadow:0 18px 48px rgba(15,23,42,.09),inset 0 1px 0 rgba(255,255,255,.95);backdrop-filter:blur(22px) saturate(1.15);position:relative;overflow:hidden}
.company-shatter-loader:after{content:"";position:absolute;inset:-20%;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.72) 49%,transparent 63%);animation:opsDiagonalShine 2.5s ease-in-out infinite}
.company-shatter-loader.is-compact{min-height:150px;padding:18px}.company-shatter-loader.is-overlay{position:fixed;inset:0;z-index:99999;border:0;border-radius:0;background:rgba(248,250,252,.86)}
.company-shatter-orbit{width:92px;height:92px;border-radius:50%;padding:13px;background:radial-gradient(circle,color-mix(in srgb,var(--loader-primary,#4f46e5) 20%,transparent),transparent 68%);animation:shatterHalo 2.4s ease-in-out infinite;position:relative;display:grid;place-items:center}.company-shatter-base-logo{position:absolute;width:66px;height:66px;object-fit:contain;border-radius:10px;opacity:.16;filter:drop-shadow(0 8px 14px rgba(15,23,42,.13));animation:loaderBaseLogo 1.7s cubic-bezier(.2,.8,.2,1) infinite}@keyframes loaderBaseLogo{0%,100%{opacity:.08;transform:scale(.86)}42%,64%{opacity:.38;transform:scale(1)}}
.company-shatter-grid{width:66px;height:66px;display:grid;position:relative;z-index:2;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:1px;filter:drop-shadow(0 8px 14px rgba(15,23,42,.14))}
.company-shatter-piece{display:block;background-repeat:no-repeat;background-size:300% 300%;border-radius:2px;animation:shatterPiece 1.7s cubic-bezier(.2,.8,.2,1) infinite;animation-delay:calc(var(--piece-index) * 55ms)}
.company-shatter-piece:nth-child(1){--sx:-17px;--sy:-14px;--sr:-17deg}.company-shatter-piece:nth-child(2){--sx:0;--sy:-21px;--sr:8deg}.company-shatter-piece:nth-child(3){--sx:18px;--sy:-14px;--sr:18deg}.company-shatter-piece:nth-child(4){--sx:-23px;--sy:0;--sr:-8deg}.company-shatter-piece:nth-child(5){--sx:0;--sy:0;--sr:0deg}.company-shatter-piece:nth-child(6){--sx:23px;--sy:0;--sr:11deg}.company-shatter-piece:nth-child(7){--sx:-17px;--sy:17px;--sr:14deg}.company-shatter-piece:nth-child(8){--sx:0;--sy:22px;--sr:-8deg}.company-shatter-piece:nth-child(9){--sx:18px;--sy:17px;--sr:-17deg}
.company-shatter-label{font-size:12px;font-weight:900;color:#334155;letter-spacing:.025em}.company-shatter-dots{display:flex;gap:5px}.company-shatter-dots i{width:5px;height:5px;border-radius:50%;background:var(--loader-primary,#4f46e5);animation:loaderDots 1.1s ease-in-out infinite}.company-shatter-dots i:nth-child(2){animation-delay:.14s}.company-shatter-dots i:nth-child(3){animation-delay:.28s}

.ops-status-strip{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.ops-status-pill{display:flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;border:1px solid rgba(148,163,184,.18);background:rgba(255,255,255,.74);box-shadow:0 8px 20px rgba(15,23,42,.045);font-size:10px;font-weight:850;color:#475569;backdrop-filter:blur(12px)}.ops-status-pill b{font-size:12px;color:#0f172a}.ops-status-pill.ready{color:#047857;background:rgba(236,253,245,.78);border-color:rgba(16,185,129,.19)}.ops-status-pill.waiting{color:#b45309;background:rgba(255,251,235,.8);border-color:rgba(245,158,11,.18)}.ops-status-pill.processed{color:#4f46e5;background:rgba(238,242,255,.8);border-color:rgba(99,102,241,.17)}
/* Ready records remain selectable; only the recommended next queue receives motion. */
.ops-ready-blink{border-color:rgba(16,185,129,.30)!important;position:relative}
@keyframes opsNextQueueMotion{0%,82%,100%{transform:translateX(0);box-shadow:0 0 0 1px rgba(16,185,129,.18),0 10px 25px rgba(16,185,129,.10)}86%{transform:translateX(-2px);box-shadow:0 0 0 3px rgba(16,185,129,.23),0 15px 34px rgba(16,185,129,.18)}90%{transform:translateX(2px)}94%{transform:translateX(-1px)}98%{transform:translateX(1px)}}
.ops-next-queue{animation:opsNextQueueMotion 2.8s ease-in-out infinite!important;border-color:rgba(16,185,129,.46)!important;position:relative!important;padding-right:58px!important}
.ops-next-queue:after{content:"NEXT";position:absolute;top:8px;right:8px;padding:3px 7px;border-radius:999px;background:#10b981;color:white;font-size:7.5px;font-weight:1000;letter-spacing:.09em;box-shadow:0 5px 14px rgba(16,185,129,.25);z-index:2}

/* Common operational/finance/report aesthetic layer. Existing inline layouts stay intact. */
.finance-dashboard-shell,.reports-dashboard-shell,.report-workspace-shell,.weigh-shell,.unload-shell,.storage-allocation-page,.lot-shell{background:linear-gradient(145deg,color-mix(in srgb,var(--erp-primary,#4f46e5) 5%,#f8fafc) 0%,#f8fafc 48%,color-mix(in srgb,var(--erp-secondary,#0891b2) 6%,#f8fafc) 100%)!important;position:relative;isolation:isolate}
.finance-dashboard-shell:before,.reports-dashboard-shell:before,.report-workspace-shell:before,.lot-shell:before{content:"";position:fixed;left:-120px;top:90px;width:390px;height:390px;border-radius:50%;background:radial-gradient(circle,rgba(79,70,229,.12),transparent 68%);filter:blur(8px);pointer-events:none;z-index:-1}
.finance-dashboard-shell:after,.reports-dashboard-shell:after,.report-workspace-shell:after,.lot-shell:after{content:"";position:fixed;right:-140px;bottom:-100px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(8,145,178,.11),transparent 68%);filter:blur(9px);pointer-events:none;z-index:-1}
.finance-dashboard-shell .finance-hero,.reports-dashboard-shell>section:first-child,.report-workspace-hero,.lot-glass,.ops-glass{position:relative;overflow:hidden;box-shadow:0 18px 46px rgba(15,23,42,.09),inset 0 1px 0 rgba(255,255,255,.9)!important;backdrop-filter:blur(20px) saturate(1.14)}
.finance-dashboard-shell .finance-hero:after,.reports-dashboard-shell>section:first-child:after,.report-workspace-hero:after,.lot-glass:after,.ops-glass:after{content:"";position:absolute;top:-35%;left:-30%;width:22%;height:175%;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.58),transparent);animation:opsDiagonalShine 4.2s ease-in-out infinite}
.finance-dashboard-shell .finance-hover,.reports-dashboard-shell button,.report-workspace-shell button{transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}.finance-dashboard-shell .finance-hover:hover,.reports-dashboard-shell button:hover,.report-workspace-shell button:hover{transform:translateY(-2px);filter:saturate(1.05);box-shadow:0 11px 26px rgba(15,23,42,.11)!important}
.finance-dashboard-shell table,.report-workspace-shell table{border-collapse:separate!important;border-spacing:0 6px!important}.finance-dashboard-shell .finance-table-row,.report-workspace-shell tbody tr{background:rgba(255,255,255,.88)!important;box-shadow:0 8px 20px rgba(15,23,42,.045)}
@media(max-width:760px){.ops-status-strip{gap:5px}.ops-status-pill{padding:6px 8px}.company-shatter-loader{min-height:180px}.company-shatter-orbit{width:72px;height:72px}.company-shatter-grid{width:52px;height:52px}}

/* Keep the same elevated liquid-glass language across Gate and Outward workspaces. */
.gate-scroll,.outward-dashboard-shell,.outward-process-shell,.outward-detail-shell{position:relative;isolation:isolate}
.gate-scroll>div,.outward-dashboard-shell .outward-filter-card,.outward-dashboard-shell .outward-register-card,.outward-process-shell .outward-info-tile,.outward-detail-shell .outward-info-tile{transition:transform .22s ease,box-shadow .22s ease,filter .22s ease}
.gate-scroll>div:hover,.outward-dashboard-shell .outward-filter-card:hover,.outward-dashboard-shell .outward-register-card:hover,.outward-process-shell .outward-info-tile:hover,.outward-detail-shell .outward-info-tile:hover{filter:saturate(1.025);box-shadow:0 18px 42px rgba(15,23,42,.09)}
.outward-dashboard-shell .outward-hero,.outward-process-shell .outward-process-hero,.outward-detail-shell .outward-hero{position:relative;overflow:hidden;box-shadow:0 22px 54px rgba(15,23,42,.14),inset 0 1px 0 rgba(255,255,255,.32)!important}
.outward-dashboard-shell .outward-hero:after,.outward-process-shell .outward-process-hero:after,.outward-detail-shell .outward-hero:after{content:"";position:absolute;top:-35%;left:-30%;width:20%;height:180%;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.44),transparent);animation:opsDiagonalShine 4.4s ease-in-out infinite}

/* Canonical inward item-flow deck. Tare/Final Net deliberately stays inside Weighment. */
.inward-flow-deck{
  width:100%;
  padding:12px;
  border-radius:20px;
  background:linear-gradient(145deg,rgba(255,255,255,.94),color-mix(in srgb,var(--erp-primary,#4f46e5) 4%,rgba(255,255,255,.86)));
  border:1px solid color-mix(in srgb,var(--erp-primary,#4f46e5) 13%,rgba(226,232,240,.72));
  box-shadow:0 16px 38px rgba(15,23,42,.07),inset 0 1px 0 rgba(255,255,255,.92);
  backdrop-filter:blur(20px) saturate(145%);
  -webkit-backdrop-filter:blur(20px) saturate(145%);
  position:relative;
  overflow:hidden;
}
.inward-flow-deck:after{
  content:"";
  position:absolute;
  top:-70%;left:-18%;width:15%;height:240%;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.74),transparent);
  transform:skewX(-20deg);
  animation:opsDiagonalShine 6.2s ease-in-out infinite;
}
.inward-flow-deck-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;padding:0 2px;position:relative;z-index:2}
.inward-flow-deck-head>div{display:grid;gap:1px}.inward-flow-eyebrow{font-size:8.5px;line-height:1;font-weight:1000;letter-spacing:.13em;color:var(--erp-primary,#4f46e5)}.inward-flow-deck-head strong{font-size:12.5px;color:#0f172a;letter-spacing:-.01em}.inward-flow-current-label{padding:5px 9px;border-radius:999px;background:color-mix(in srgb,var(--erp-primary,#4f46e5) 10%,white);border:1px solid color-mix(in srgb,var(--erp-primary,#4f46e5) 16%,transparent);color:var(--erp-primary-deep,var(--erp-primary,#4f46e5));font-size:9px;font-weight:950;white-space:nowrap}
.inward-flow-strip{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:8px;
  width:100%;
  min-width:0;
  position:relative;
  z-index:2;
}
.inward-flow-node{
  min-width:0;
  min-height:72px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 16px;
  grid-template-rows:auto 1fr;
  align-items:center;
  column-gap:8px;
  row-gap:2px;
  padding:9px 10px;
  border-radius:15px;
  border:1px solid rgba(148,163,184,.18);
  background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(248,250,252,.78));
  box-shadow:0 8px 20px rgba(15,23,42,.05),inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease;
  position:relative;
  overflow:hidden;
}
.inward-flow-node:not(:last-child):after{
  content:"";
  position:absolute;
  top:50%;right:-9px;
  width:10px;height:2px;
  background:#cbd5e1;
  z-index:5;
}
.inward-flow-node.done{background:linear-gradient(145deg,rgba(236,253,245,.95),rgba(255,255,255,.88));border-color:rgba(16,185,129,.24);box-shadow:0 9px 22px rgba(16,185,129,.08),inset 0 1px 0 rgba(255,255,255,.92)}
.inward-flow-node.current{background:linear-gradient(145deg,color-mix(in srgb,var(--erp-primary,#4f46e5) 11%,white),color-mix(in srgb,var(--erp-secondary,#0891b2) 7%,white));border-color:color-mix(in srgb,var(--erp-primary,#4f46e5) 42%,transparent);box-shadow:0 13px 30px color-mix(in srgb,var(--erp-primary,#4f46e5) 16%,transparent),0 0 0 3px color-mix(in srgb,var(--erp-primary,#4f46e5) 7%,transparent),inset 0 1px 0 rgba(255,255,255,.92);transform:translateY(-1px)}
.inward-flow-node.current:before{content:"";position:absolute;inset:auto 0 0;height:3px;background:linear-gradient(90deg,var(--erp-primary,#4f46e5),var(--erp-secondary,#0891b2));border-radius:0 0 15px 15px}
.inward-flow-node.next{opacity:.78}
.inward-flow-node.compact{min-height:58px;padding:7px 8px;grid-template-columns:29px minmax(0,1fr) 14px}
.inward-flow-sequence{grid-column:1/-1;font-size:7.5px;font-weight:1000;letter-spacing:.1em;color:#94a3b8;line-height:1}.inward-flow-node.done .inward-flow-sequence{color:#059669}.inward-flow-node.current .inward-flow-sequence{color:var(--erp-primary,#4f46e5)}
.inward-flow-icon{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.94);box-shadow:0 6px 14px rgba(15,23,42,.07);border:1px solid rgba(255,255,255,.9);font-size:15px;flex:0 0 auto}.inward-flow-node.current .inward-flow-icon{box-shadow:0 7px 18px color-mix(in srgb,var(--erp-primary,#4f46e5) 18%,transparent);animation:opsReadyPulse 1.8s ease-in-out infinite}.inward-flow-node.done .inward-flow-icon{background:rgba(236,253,245,.98)}
.inward-flow-copy{display:grid;min-width:0;gap:2px}.inward-flow-copy b{font-size:9.8px;color:#0f172a;white-space:normal;line-height:1.18}.inward-flow-copy small{font-size:7.7px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inward-flow-node.current .inward-flow-copy small{color:var(--erp-primary-deep,var(--erp-primary,#4f46e5));font-weight:850}
.inward-flow-state{width:15px;height:15px;border-radius:50%;display:grid;place-items:center;font-size:8px;font-weight:1000;border:1px solid #cbd5e1;color:#94a3b8;background:#fff}.inward-flow-state.done{border-color:#10b981;background:#10b981;color:#fff}.inward-flow-state.current{border-color:var(--erp-primary,#4f46e5);background:var(--erp-primary,#4f46e5);color:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--erp-primary,#4f46e5) 10%,transparent)}
.inward-flow-deck.compact .inward-flow-deck-head{display:none}
@media(max-width:1180px){.inward-flow-strip{grid-template-columns:repeat(6,150px);overflow-x:auto;padding-bottom:4px;scroll-snap-type:x proximity}.inward-flow-node{scroll-snap-align:start}.inward-flow-deck{overflow:hidden}}
@media(max-width:700px){.inward-flow-deck{padding:9px;border-radius:16px}.inward-flow-deck-head{align-items:flex-start}.inward-flow-current-label{max-width:48%;overflow:hidden;text-overflow:ellipsis}.inward-flow-strip{grid-template-columns:repeat(6,140px);gap:7px}.inward-flow-node{min-height:66px;padding:8px}.inward-flow-copy b{font-size:9.2px}}

/* =========================================================
   ERP-WIDE UNIFIED VISUAL SYSTEM
   Presentation-only. Existing page logic, routes and handlers are untouched.
   ========================================================= */
.ml-main-children{
  --erp-card-radius:18px;
  --erp-control-radius:11px;
  --erp-card-shadow:0 14px 34px rgba(15,23,42,.075),0 3px 10px rgba(15,23,42,.035);
  --erp-card-shadow-hover:0 20px 46px rgba(15,23,42,.105),0 6px 15px rgba(15,23,42,.045);
  --erp-card-bg:linear-gradient(145deg,rgba(255,255,255,.94),color-mix(in srgb,var(--erp-primary,#4f46e5) 4%,rgba(255,255,255,.88)));
  color:#0f172a;
}
.ml-main-children [data-cms-polished="true"]{
  background:var(--erp-card-bg)!important;
  border:1px solid color-mix(in srgb,rgb(var(--cms-item-accent-rgb,79,70,229)) 16%,rgba(226,232,240,.86))!important;
  border-radius:var(--erp-card-radius)!important;
  box-shadow:var(--erp-card-shadow)!important;
  backdrop-filter:blur(18px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(145%)!important;
  overflow:hidden;
}
.ml-main-children [data-cms-polished="true"]:hover{box-shadow:var(--erp-card-shadow-hover)!important;transform:translateY(-2px)}
.ml-main-children [data-cms-polished="true"]:not(button):not(a):after{
  content:"";
  position:absolute;
  top:-70%;left:-30%;width:13%;height:240%;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.60),transparent);
  transform:skewX(-20deg);
  animation:opsDiagonalShine 7.5s ease-in-out infinite;
  opacity:.55;
  z-index:0;
}
.ml-main-children [data-cms-polished="true"]>*{position:relative;z-index:1}
.ml-main-children :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){border-radius:var(--erp-control-radius)!important;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease!important}
.ml-main-children :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea):focus{outline:none!important;border-color:color-mix(in srgb,var(--erp-primary,#4f46e5) 62%,#cbd5e1)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--erp-primary,#4f46e5) 11%,transparent)!important}
.ml-main-children :is(button,a[role="button"]){border-radius:var(--erp-control-radius);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
@media(hover:hover) and (pointer:fine){.ml-main-children :is(button,a[role="button"]):not(:disabled):hover{transform:translateY(-1px);filter:saturate(1.04)}}
.ml-main-children table{border-collapse:separate!important;border-spacing:0 5px!important}
.ml-main-children table thead th{font-size:10.5px!important;font-weight:900!important;text-transform:uppercase;letter-spacing:.035em;color:#64748b!important}
.ml-main-children table tbody tr{transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.ml-main-children table tbody tr:hover{background:color-mix(in srgb,var(--erp-primary,#4f46e5) 3%,white)!important}
.ml-main-children :is([role="dialog"],[class*="modal-panel" i],[class*="modal-content" i]){border-radius:22px!important;box-shadow:0 30px 80px rgba(15,23,42,.18)!important}
.ml-main-children :is(.badge,[class*="badge" i],[class*="pill" i],[class*="chip" i]){font-weight:850}

/* Final table polish: presentation-only and shared by existing Cold Storage tables.
   Keeps all business handlers untouched while making registers consistently striped,
   readable and animated. Scoped to the company workspace so print/templates are safe. */
.ml-main-children table tbody tr:nth-child(even) > td{
  background:color-mix(in srgb,var(--erp-primary,#4f46e5) 2.2%,#fff);
}
.ml-main-children table tbody tr > td{
  border-top:1px solid rgba(148,163,184,.10);
  border-bottom:1px solid rgba(148,163,184,.10);
  transition:background .18s ease,box-shadow .18s ease,transform .18s ease;
}
.ml-main-children table tbody tr > td:first-child{
  border-left:1px solid rgba(148,163,184,.10);
  border-radius:9px 0 0 9px;
}
.ml-main-children table tbody tr > td:last-child{
  border-right:1px solid rgba(148,163,184,.10);
  border-radius:0 9px 9px 0;
}
@media(hover:hover) and (pointer:fine){
  .ml-main-children table tbody tr:hover > td{
    background:color-mix(in srgb,var(--erp-primary,#4f46e5) 5%,#fff)!important;
    box-shadow:0 7px 18px rgba(15,23,42,.045);
  }
}
@media(prefers-reduced-motion:reduce){
  .ml-main-children table tbody tr,.hd-data-table tbody tr{animation:none!important;transition:none!important}
}


/* ===== styles/premiumWaterMotion.css ===== */
.water-motion-surface{position:relative;isolation:isolate;overflow:hidden}.water-motion-surface::before,.water-motion-surface::after{content:"";position:absolute;z-index:-1;border-radius:50%;pointer-events:none;filter:blur(1px);opacity:.24}.water-motion-surface::before{width:240px;height:240px;right:-110px;top:8%;border:1px solid rgba(59,130,246,.32);box-shadow:inset 0 0 45px rgba(14,165,233,.14);animation:freshagro-water-ring 7s ease-in-out infinite}.water-motion-surface::after{width:150px;height:150px;left:-70px;bottom:12%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.9),rgba(56,189,248,.13) 48%,rgba(139,92,246,.09));animation:freshagro-water-float 8s ease-in-out infinite alternate}@keyframes freshagro-water-ring{0%,100%{transform:scale(.88);opacity:.15}48%{transform:scale(1.08);opacity:.3}}@keyframes freshagro-water-float{from{transform:translate3d(0,-8px,0) rotate(-4deg)}to{transform:translate3d(18px,14px,0) rotate(7deg)}}.freshagro-success-ripple{position:relative}.freshagro-success-ripple::after{content:"";position:absolute;inset:50%;border-radius:50%;border:2px solid rgba(14,165,233,.35);animation:freshagro-success-splash .65s ease-out forwards}@keyframes freshagro-success-splash{from{inset:50%;opacity:.75}to{inset:-18px;opacity:0}}@media(prefers-reduced-motion:reduce){.water-motion-surface::before,.water-motion-surface::after,.freshagro-success-ripple::after{animation:none!important}}

/* ===== styles/productionHardening.css ===== */

/* Final HD CRUD form scroll/visibility guard. Kept here as well as the HD
   stylesheet so the generic production hardening layer can never re-hide form
   controls or take ownership of the modal scroll area. */
#root .hd-form-modal{
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  overflow:hidden!important;
}
#root .hd-form-modal .hd-form-body{
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
}
#root .hd-form-modal .hd-form-section{
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
}
#root .hd-form-modal .hd-form-grid{
  min-width:0!important;
  overflow:visible!important;
}
#root .hd-form-modal .hd-field,
#root .hd-form-modal .hd-field input,
#root .hd-form-modal .hd-field select,
#root .hd-form-modal .hd-field textarea{
  min-width:0!important;
  visibility:visible!important;
  opacity:1!important;
}


/* ===== theme/global.css ===== */
@import './tokens';

/* =========================================================
   GLOBAL RESET
   ========================================================= */

*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  width: 100%;
  min-width: 0;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

body {
  width: 100%;
  min-width: 0;
  min-height: 100vh;
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: #eef1f8;
  color: #0d0f1c;
  overflow-x: hidden;
}

button,
input,
select,
textarea {
  font: inherit;
}

img,
svg,
video,
canvas,
iframe {
  display: block;
  max-width: 100%;
}

table {
  border-collapse: collapse;
}

/* =========================================================
   GLASS CARDS
   ========================================================= */

.glass-card {
  width: 100%;
  min-width: 0;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 8px 24px rgba(13, 15, 28, 0.08);
  transition:
    box-shadow 260ms cubic-bezier(.4, 0, .2, 1),
    transform 260ms cubic-bezier(.4, 0, .2, 1);
}

@media (hover: hover) and (pointer: fine) {
  .glass-card:hover {
    box-shadow: 0 24px 64px rgba(13, 15, 28, 0.14);
    transform: translateY(-2px);
  }
}

/* =========================================================
   BUTTONS
   ========================================================= */

.btn {
  min-height: 38px;
  max-width: 100%;
  padding: 9px 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 8px;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  transition:
    background 160ms cubic-bezier(.4, 0, .2, 1),
    color 160ms cubic-bezier(.4, 0, .2, 1),
    box-shadow 160ms cubic-bezier(.4, 0, .2, 1),
    transform 160ms cubic-bezier(.4, 0, .2, 1);
  gap: 8px;
}

.btn-primary {
  background: #4f46e5;
  color: white;
}

.btn-secondary {
  background: rgba(13, 15, 28, 0.07);
  color: #0d0f1c;
}

.btn-danger {
  background: #dc2626;
  color: white;
}

.btn-success {
  background: #059669;
  color: white;
}

@media (hover: hover) and (pointer: fine) {
  .btn-primary:hover {
    background: #4338ca;
    transform: translateY(-1px);
  }

  .btn-secondary:hover {
    background: rgba(13, 15, 28, 0.12);
  }

  .btn-danger:hover {
    background: #b91c1c;
  }

  .btn-success:hover {
    background: #047857;
  }
}

.btn:disabled,
.btn-primary:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

/* =========================================================
   FORM ELEMENTS
   ========================================================= */

.field {
  width: 100%;
  min-width: 0;
  margin-bottom: 16px;
}

.field-label {
  display: block;
  margin-bottom: 4px;
  font-weight: 500;
  color: #0d0f1c;
}

.input,
.select,
.textarea {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(13, 15, 28, 0.1);
  border-radius: 8px;
  background: white;
  color: #0d0f1c;
  font-size: 14px;
  outline: none;
  transition:
    border-color 160ms cubic-bezier(.4, 0, .2, 1),
    box-shadow 160ms cubic-bezier(.4, 0, .2, 1);
}

.textarea {
  min-height: 96px;
  resize: vertical;
}

.input:focus,
.select:focus,
.textarea:focus {
  outline: none;
  border-color: #4f46e5;
  box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.12);
}

.input.error,
.select.error,
.textarea.error {
  border-color: #dc2626;
}

.error-text {
  color: #dc2626;
  font-size: 13px;
  margin-top: 4px;
  display: block;
}

/* =========================================================
   BADGE
   ========================================================= */

.badge {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}

/* =========================================================
   SIDEBAR
   ========================================================= */

.sidebar {
  width: 240px;
  min-width: 240px;
  height: 100dvh;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 100;
  padding: 20px 14px;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border-right: 1px solid rgba(13, 15, 28, 0.07);
  box-shadow: 8px 0 28px rgba(13, 15, 28, 0.04);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  transition:
    width 220ms cubic-bezier(.4, 0, .2, 1),
    min-width 220ms cubic-bezier(.4, 0, .2, 1),
    transform 220ms cubic-bezier(.4, 0, .2, 1);
}

.sidebar-brand {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 19px;
  font-weight: 700;
  color: #0d0f1c;
  padding: 0 10px 18px;
}

.sidebar-brand > * {
  min-width: 0;
}

.brand-icon {
  flex-shrink: 0;
  font-size: 26px;
}

.sidebar-nav {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
  overflow-y: auto;
}

.sidebar-link {
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border-radius: 8px;
  color: #3d4257;
  text-decoration: none;
  line-height: 1.25;
  transition:
    background 160ms cubic-bezier(.4, 0, .2, 1),
    color 160ms cubic-bezier(.4, 0, .2, 1),
    transform 160ms cubic-bezier(.4, 0, .2, 1);
}

.sidebar-link span:not(.sidebar-icon) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidebar-link.active {
  background: rgba(79, 70, 229, 0.12);
  color: #4f46e5;
  font-weight: 500;
}

.sidebar-icon {
  flex: 0 0 auto;
  font-size: 18px;
}

@media (hover: hover) and (pointer: fine) {
  .sidebar-link:hover {
    background: rgba(79, 70, 229, 0.08);
    color: #4f46e5;
  }
}

/*
  Use .sidebar-toggle with your existing React menu button.
  On tablet/mobile toggle the class "open" on .sidebar.
*/
.sidebar-toggle {
  display: none;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(13, 15, 28, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.9);
  color: #0d0f1c;
  cursor: pointer;
}

.sidebar-backdrop {
  display: none;
}

/* =========================================================
   MAIN LAYOUT
   ========================================================= */

.main-layout {
  width: calc(100% - 240px);
  min-width: 0;
  min-height: 100dvh;
  margin-left: 240px;
  padding: 24px 32px;
  overflow-x: hidden;
  transition:
    margin-left 220ms cubic-bezier(.4, 0, .2, 1),
    width 220ms cubic-bezier(.4, 0, .2, 1),
    padding 220ms cubic-bezier(.4, 0, .2, 1);
}

.main-layout > * {
  min-width: 0;
  max-width: 100%;
}

/* Useful generic wrappers for CMS pages */
.page-container {
  width: 100%;
  max-width: 1600px;
  min-width: 0;
  margin: 0 auto;
}

.responsive-grid {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.form-grid {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.table-responsive {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-responsive table {
  min-width: 720px;
}

/* =========================================================
   STAGE RAIL
   ========================================================= */

.stage-rail {
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 24px 0;
  margin-bottom: 32px;
  position: relative;
}

.stage-node {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  position: relative;
  flex: 1 1 0;
}

.stage-icon {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  background: rgba(13, 15, 28, 0.07);
  transition: all 260ms cubic-bezier(.4, 0, .2, 1);
  position: relative;
  z-index: 2;
}

.stage-node.current .stage-icon {
  background: #4f46e5;
  color: white;
  box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.2);
}

.stage-node.done .stage-icon {
  background: #059669;
  color: white;
}

.stage-node.locked .stage-icon {
  opacity: 0.4;
}

.stage-label {
  max-width: 100%;
  font-size: 12px;
  font-weight: 500;
  color: #3d4257;
  text-align: center;
  overflow-wrap: anywhere;
}

.stage-connector {
  position: absolute;
  top: 20px;
  left: calc(50% + 20px);
  right: calc(-50% + 20px);
  height: 2px;
  background: rgba(13, 15, 28, 0.1);
  z-index: 1;
}

.stage-connector.completed {
  background: #059669;
}

/* =========================================================
   WORKFLOW
   ========================================================= */

.workflow-header {
  width: 100%;
  min-width: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}

.workflow-header > * {
  min-width: 0;
}

.workflow-stats {
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  padding: 8px 16px;
  background: rgba(255, 255, 255, 0.72);
  border-radius: 8px;
}

.stage-content {
  width: 100%;
  min-width: 0;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: 16px;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.85);
}

.stage-actions {
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid rgba(13, 15, 28, 0.07);
}

/* =========================================================
   MODAL
   ========================================================= */

.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(13, 15, 28, 0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  overflow-y: auto;
}

.modal-content {
  width: min(720px, 100%);
  max-width: 100%;
  max-height: calc(100dvh - 40px);
  overflow-x: hidden;
  overflow-y: auto;
  background: white;
  border-radius: 16px;
  padding: 24px;
  animation: modalSlideIn 260ms cubic-bezier(.4, 0, .2, 1);
}

@keyframes modalSlideIn {
  from {
    opacity: 0;
    transform: translateY(-20px) scale(0.95);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* =========================================================
   TOAST
   ========================================================= */

.toast-container {
  position: fixed;
  top: 24px;
  right: 24px;
  z-index: 2000;
  width: min(380px, calc(100vw - 32px));
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.toast {
  width: 100%;
  min-width: 0;
  padding: 12px 16px;
  border-radius: 8px;
  font-weight: 500;
  animation: slideInRight 260ms cubic-bezier(.4, 0, .2, 1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  pointer-events: auto;
}

.toast > * {
  min-width: 0;
  overflow-wrap: anywhere;
}

.toast-close {
  flex: 0 0 auto;
  background: none;
  border: none;
  font-size: 18px;
  cursor: pointer;
  opacity: 0.5;
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(20px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* =========================================================
   LOADING
   ========================================================= */

.loading {
  width: 100%;
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6b7280;
}

.spinner {
  width: 20px;
  height: 20px;
  border: 2px solid rgba(79, 70, 229, 0.2);
  border-top-color: #4f46e5;
  border-radius: 50%;
  animation: spin 600ms linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* =========================================================
   EMPTY STATE
   ========================================================= */

.empty-state {
  width: 100%;
  text-align: center;
  padding: 48px 24px;
}

.empty-icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.empty-title {
  font-size: 18px;
  font-weight: 600;
  color: #0d0f1c;
  margin-bottom: 8px;
}

.empty-description {
  color: #6b7280;
  margin-bottom: 16px;
}

/* =========================================================
   SKELETON
   ========================================================= */

.skeleton {
  max-width: 100%;
  background: linear-gradient(
    90deg,
    rgba(13, 15, 28, 0.05) 25%,
    rgba(13, 15, 28, 0.1) 50%,
    rgba(13, 15, 28, 0.05) 75%
  );
  background-size: 200% 100%;
  animation: skeleton 1.5s ease-in-out infinite;
  border-radius: 8px;
}

@keyframes skeleton {
  0% {
    background-position: 200% 0;
  }

  100% {
    background-position: -200% 0;
  }
}

/* =========================================================
   RESPONSIVENESS
   ========================================================= */

/* ---------------------------------------------------------
   WIDE DESKTOP: 1600px+
   --------------------------------------------------------- */

@media (min-width: 1600px) {
  .sidebar {
    width: 250px;
    min-width: 250px;
  }

  .main-layout {
    width: calc(100% - 250px);
    margin-left: 250px;
    padding: 26px 34px;
  }

  .responsive-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* ---------------------------------------------------------
   LAPTOP / SMALL DESKTOP: 1200px - 1599px
   --------------------------------------------------------- */

@media (min-width: 1200px) and (max-width: 1599px) {
  .sidebar {
    width: 218px;
    min-width: 218px;
    padding: 16px 10px;
  }

  .sidebar-brand {
    padding: 0 8px 16px;
    gap: 8px;
    font-size: 17px;
  }

  .brand-icon {
    font-size: 23px;
  }

  .sidebar-link {
    gap: 8px;
    padding: 8px 9px;
    font-size: 13px;
  }

  .sidebar-icon {
    font-size: 17px;
  }

  .main-layout {
    width: calc(100% - 218px);
    margin-left: 218px;
    padding: 18px 20px;
  }

  .glass-card,
  .stage-content {
    padding: 18px;
  }

  .responsive-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
  }

  .workflow-header {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .workflow-stats {
    flex: 1 1 auto;
  }
}

/* Common 1280 / 1366 laptops */
@media (min-width: 1200px) and (max-width: 1399px) {
  .sidebar {
    width: 205px;
    min-width: 205px;
  }

  .main-layout {
    width: calc(100% - 205px);
    margin-left: 205px;
    padding: 14px 16px;
  }

  .responsive-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .form-grid {
    gap: 12px;
  }

  .stage-rail {
    padding: 18px 0;
    margin-bottom: 24px;
  }

  .stage-label {
    font-size: 11px;
  }
}

/* ---------------------------------------------------------
   TABLET LANDSCAPE / SMALL LAPTOP: 992px - 1199px
   Sidebar becomes overlay drawer
   --------------------------------------------------------- */

@media (min-width: 992px) and (max-width: 1199px) {
  .sidebar {
    width: min(300px, 34vw);
    min-width: min(300px, 34vw);
    transform: translateX(-105%);
    box-shadow: 18px 0 50px rgba(13, 15, 28, 0.14);
  }

  .sidebar.open {
    transform: translateX(0);
  }

  .sidebar-toggle {
    display: inline-flex;
  }

  .sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: block;
    background: rgba(13, 15, 28, 0.32);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
      opacity 180ms ease,
      visibility 180ms ease;
  }

  .sidebar-backdrop.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .main-layout {
    width: 100%;
    margin-left: 0;
    padding: 16px 18px;
  }

  .responsive-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .workflow-header {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .workflow-stats {
    width: 100%;
  }

  .stage-rail {
    overflow-x: auto;
    justify-content: flex-start;
    gap: 0;
    padding-bottom: 12px;
    -webkit-overflow-scrolling: touch;
  }

  .stage-node {
    flex: 0 0 130px;
    min-width: 130px;
  }
}

/* ---------------------------------------------------------
   TABLET PORTRAIT: 768px - 991px
   --------------------------------------------------------- */

@media (min-width: 768px) and (max-width: 991px) {
  .sidebar {
    width: min(300px, 72vw);
    min-width: min(300px, 72vw);
    transform: translateX(-105%);
    box-shadow: 18px 0 50px rgba(13, 15, 28, 0.16);
  }

  .sidebar.open {
    transform: translateX(0);
  }

  .sidebar-toggle {
    display: inline-flex;
  }

  .sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: block;
    background: rgba(13, 15, 28, 0.34);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  .sidebar-backdrop.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .main-layout {
    width: 100%;
    margin-left: 0;
    padding: 14px;
  }

  .glass-card,
  .stage-content {
    padding: 18px;
  }

  .responsive-grid,
  .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .workflow-header {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .workflow-stats {
    width: 100%;
  }

  .stage-rail {
    overflow-x: auto;
    justify-content: flex-start;
    padding: 18px 4px 12px;
    margin-bottom: 20px;
    -webkit-overflow-scrolling: touch;
  }

  .stage-node {
    flex: 0 0 120px;
    min-width: 120px;
  }

  .stage-actions {
    justify-content: flex-start;
  }
}

/* ---------------------------------------------------------
   LARGE MOBILE / SMALL TABLET: 600px - 767px
   --------------------------------------------------------- */

@media (min-width: 600px) and (max-width: 767px) {
  .sidebar {
    width: min(292px, 84vw);
    min-width: min(292px, 84vw);
    transform: translateX(-105%);
  }

  .sidebar.open {
    transform: translateX(0);
  }

  .sidebar-toggle {
    display: inline-flex;
  }

  .sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: block;
    background: rgba(13, 15, 28, 0.36);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  .sidebar-backdrop.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .main-layout {
    width: 100%;
    margin-left: 0;
    padding: 12px;
  }

  .glass-card,
  .stage-content {
    padding: 16px;
    border-radius: 14px;
  }

  .responsive-grid,
  .form-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .workflow-header {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .workflow-stats {
    width: 100%;
    gap: 8px;
    padding: 8px 10px;
  }

  .stage-rail {
    overflow-x: auto;
    justify-content: flex-start;
    padding: 16px 2px 10px;
    margin-bottom: 18px;
  }

  .stage-node {
    flex: 0 0 112px;
    min-width: 112px;
  }

  .stage-actions {
    justify-content: stretch;
  }

  .stage-actions .btn {
    flex: 1 1 180px;
  }

  .modal-overlay {
    padding: 12px;
  }

  .modal-content {
    max-height: calc(100dvh - 24px);
    padding: 18px;
  }
}

/* ---------------------------------------------------------
   MOBILE: below 600px
   --------------------------------------------------------- */

@media (max-width: 599px) {
  .sidebar {
    width: min(282px, 88vw);
    min-width: min(282px, 88vw);
    padding: 14px 10px;
    transform: translateX(-105%);
  }

  .sidebar.open {
    transform: translateX(0);
  }

  .sidebar-toggle {
    display: inline-flex;
  }

  .sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: block;
    background: rgba(13, 15, 28, 0.4);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
      opacity 180ms ease,
      visibility 180ms ease;
  }

  .sidebar-backdrop.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .sidebar-brand {
    padding: 0 8px 14px;
    font-size: 17px;
  }

  .sidebar-link {
    padding: 9px;
    font-size: 13px;
  }

  .main-layout {
    width: 100%;
    margin-left: 0;
    padding: 10px;
  }

  .glass-card,
  .stage-content {
    padding: 14px;
    border-radius: 12px;
  }

  .responsive-grid,
  .form-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .field {
    margin-bottom: 12px;
  }

  .input,
  .select,
  .textarea {
    font-size: 16px; /* prevents iOS zoom */
    padding: 10px 11px;
  }

  .workflow-header {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    margin-bottom: 16px;
  }

  .workflow-stats {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 10px;
  }

  .stage-rail {
    overflow-x: auto;
    justify-content: flex-start;
    padding: 14px 0 10px;
    margin-bottom: 16px;
    scroll-snap-type: x proximity;
  }

  .stage-node {
    flex: 0 0 104px;
    min-width: 104px;
    scroll-snap-align: start;
  }

  .stage-icon {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
    font-size: 17px;
  }

  .stage-connector {
    top: 18px;
    left: calc(50% + 18px);
    right: calc(-50% + 18px);
  }

  .stage-label {
    font-size: 10.5px;
  }

  .stage-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    margin-top: 18px;
    padding-top: 18px;
  }

  .stage-actions .btn,
  .stage-actions > button,
  .stage-actions > a {
    width: 100%;
  }

  .btn {
    min-height: 40px;
    white-space: normal;
  }

  .modal-overlay {
    align-items: flex-end;
    padding: 8px;
  }

  .modal-content {
    width: 100%;
    max-height: calc(100dvh - 16px);
    padding: 16px;
    border-radius: 16px 16px 10px 10px;
  }

  .toast-container {
    top: 10px;
    right: 10px;
    left: 10px;
    width: auto;
  }

  .toast {
    padding: 11px 12px;
    gap: 10px;
    font-size: 13px;
  }

  .empty-state {
    padding: 34px 16px;
  }

  .empty-icon {
    font-size: 40px;
    margin-bottom: 12px;
  }

  .empty-title {
    font-size: 16px;
  }

  .table-responsive {
    margin-left: 0;
    margin-right: 0;
  }
}

/* ---------------------------------------------------------
   SMALL MOBILE: below 420px
   --------------------------------------------------------- */

@media (max-width: 419px) {
  .sidebar {
    width: min(270px, 90vw);
    min-width: min(270px, 90vw);
  }

  .main-layout {
    padding: 8px;
  }

  .glass-card,
  .stage-content {
    padding: 12px;
  }

  .workflow-stats {
    grid-template-columns: minmax(0, 1fr);
  }

  .stage-node {
    flex-basis: 96px;
    min-width: 96px;
  }

  .badge {
    white-space: normal;
    text-align: center;
  }
}

/* ---------------------------------------------------------
   VERY SMALL MOBILE: below 360px
   --------------------------------------------------------- */

@media (max-width: 359px) {
  .sidebar {
    width: min(258px, 92vw);
    min-width: min(258px, 92vw);
  }

  .main-layout {
    padding: 6px;
  }

  .glass-card,
  .stage-content {
    padding: 10px;
    border-radius: 10px;
  }

  .btn {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .modal-overlay {
    padding: 4px;
  }

  .modal-content {
    max-height: calc(100dvh - 8px);
    padding: 12px;
  }
}

/* ---------------------------------------------------------
   SHORT LAPTOP / TABLET HEIGHT
   --------------------------------------------------------- */

@media (min-width: 768px) and (max-height: 800px) {
  .sidebar {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .sidebar-brand {
    padding-bottom: 12px;
  }

  .sidebar-link {
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .main-layout {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .stage-rail {
    padding-top: 14px;
    padding-bottom: 10px;
    margin-bottom: 18px;
  }
}

/* ---------------------------------------------------------
   TOUCH DEVICES
   --------------------------------------------------------- */

@media (hover: none), (pointer: coarse) {
  .btn,
  .sidebar-link,
  .toast-close,
  .sidebar-toggle {
    -webkit-tap-highlight-color: transparent;
  }

  .btn:active {
    transform: scale(0.985);
  }
}

/* ---------------------------------------------------------
   REDUCED MOTION
   --------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}