/* Theme harmony overrides
   Purpose: unify login, dashboard, and app-wide surfaces into one blue/teal/green system
   Scope: color, tone, and finish only. No layout redesigns. */

:root{
  --bg:#f4f8fd;
  --sur:#ffffff;
  --sur2:#f6faff;
  --sur3:#e8f1fb;
  --bg2:#edf5fc;

  --ink:#0f172a;
  --ink2:#334155;
  --ink3:#64748b;
  --ink4:#94a3b8;

  --acc:#2563eb;
  --acc2:#1d4ed8;
  --acc-s:rgba(37,99,235,.10);

  --grn:#15803d;
  --grn-s:rgba(21,128,61,.12);

  --amb:#d97706;
  --amb-s:rgba(217,119,6,.12);

  --red:#dc2626;
  --red-s:rgba(220,38,38,.12);

  /* Purple was visually off-system; map it into the same teal family. */
  --pur:#0f766e;
  --pur-s:rgba(15,118,110,.12);

  --tl:#0f766e;
  --tl-s:rgba(15,118,110,.12);

  --bdr:#dbe7f3;
  --bdr2:#c7d7ea;

  --sh:0 1px 2px rgba(15,23,42,.04),0 12px 30px rgba(15,23,42,.06);
  --sh2:0 18px 42px rgba(15,23,42,.10);
}

body{
  background:linear-gradient(180deg,#f9fbff 0%, var(--bg) 50%, #edf5fb 100%);
  color:var(--ink);
}

::-webkit-scrollbar-thumb{
  background:#bfd0e4;
}

/* Login */
#login-screen{
  background:
    radial-gradient(circle at top left, rgba(37,99,235,.16), transparent 34%),
    radial-gradient(circle at 85% 12%, rgba(14,165,233,.08), transparent 24%),
    linear-gradient(135deg, #eef6ff 0%, #f8fbff 48%, #eef9f6 100%);
}

.l-pane{
  background:
    radial-gradient(circle at 16% 16%, rgba(37,99,235,.08), transparent 20%),
    radial-gradient(circle at 84% 20%, rgba(15,118,110,.08), transparent 18%),
    radial-gradient(circle at 72% 82%, rgba(14,165,233,.05), transparent 18%),
    linear-gradient(180deg, #fcfdff 0%, #f7fbff 54%, #f1faf7 100%);
}

.l-pane::after{
  border-color:rgba(148,163,184,.10);
  background-image:
    linear-gradient(rgba(148,163,184,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,163,184,.07) 1px, transparent 1px);
}

.l-mini-ico,
.sid-ico{
  background:linear-gradient(135deg, #1d4ed8 0%, #0f766e 100%);
  box-shadow:0 14px 28px rgba(29,78,216,.16);
}

.lcard{
  background:rgba(255,255,255,.92);
  border:1px solid rgba(219,231,243,.96);
  box-shadow:0 30px 72px rgba(15,23,42,.10);
}

.lcard-head h3,
.l-mini-brand{
  color:var(--ink);
}

.lf label,
.ff label{
  color:var(--ink2);
}

.lf input,
.ff input,
.ff select,
.ff textarea,
.flt,
.sbox{
  border-color:var(--bdr);
  background:linear-gradient(180deg,#ffffff 0%, #fbfdff 100%);
}

.lf input:focus,
.ff input:focus,
.ff select:focus,
.ff textarea:focus,
.flt:focus,
.sbox:focus-within{
  border-color:var(--acc);
  box-shadow:0 0 0 4px rgba(37,99,235,.08);
}

.pw-eye:hover{
  background:#eef6ff;
  color:var(--ink);
}

.lrem input[type=checkbox]{
  accent-color:var(--acc);
}

.lbtn{
  background:linear-gradient(135deg, #0f172a 0%, #1d4ed8 52%, #0f766e 100%);
  box-shadow:0 18px 34px rgba(29,78,216,.18);
}

.lbtn:hover:not(:disabled){
  box-shadow:0 24px 42px rgba(29,78,216,.22);
}

.l-note i{
  color:var(--tl);
}

/* App chrome */
.sid{
  background:linear-gradient(180deg,#0f172a 0%, #162235 56%, #17304c 100%);
  border-right-color:rgba(191,219,254,.10);
  box-shadow:12px 0 34px rgba(15,23,42,.10);
}

.sid-brand{
  border-bottom-color:rgba(191,219,254,.10);
}

.sid-txt h2{
  color:#f8fbff;
}

.sid-txt span{
  color:#8ba2bf;
}

.nav-sec{
  color:#6f86a1;
}

.navi{
  color:#9fb2c8;
}

.navi:hover{
  color:#ecf5ff;
  background:rgba(255,255,255,.06);
}

.navi.act{
  color:#ffffff;
  background:linear-gradient(90deg, rgba(37,99,235,.22), rgba(15,118,110,.12));
  border-left-color:#60a5fa;
}

.sid-foot{
  border-top-color:rgba(191,219,254,.10);
}

.topbar{
  background:rgba(255,255,255,.84);
  border-bottom-color:rgba(219,231,243,.92);
  box-shadow:0 6px 20px rgba(15,23,42,.04);
}

.icon-btn{
  color:var(--ink3);
  border-color:var(--bdr);
  background:rgba(255,255,255,.72);
}

.icon-btn:hover{
  background:#eef6ff;
  color:var(--ink);
}

/* Shared surfaces */
.panel,
.tbar,
.twrap,
.dash-panel,
.inventory-sheet,
.recv-card,
.load-card{
  border-color:rgba(219,231,243,.94);
  box-shadow:var(--sh);
}

.panel,
.twrap,
.recv-card,
.load-card{
  background:linear-gradient(180deg, rgba(255,255,255,.97), rgba(248,251,255,.94));
}

.tbar{
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);
}

.mhd,
.mft,
.tfooter,
.inventory-footer{
  border-color:var(--bdr);
}

.mft,
.tfooter{
  background:linear-gradient(180deg,#f8fbff 0%, #f2f8ff 100%);
}

.ptitle,
.mhd h3{
  color:var(--ink);
}

.ptitle i{
  color:var(--acc);
}

/* Controls */
.btn{
  box-shadow:0 4px 12px rgba(15,23,42,.05);
}

.bp{
  background:linear-gradient(135deg, #2563eb 0%, #1d4ed8 70%, #0f766e 100%);
}

.bp:hover:not(:disabled){
  background:linear-gradient(135deg, #1d4ed8 0%, #1e40af 70%, #115e59 100%);
}

.bg{
  background:linear-gradient(135deg, #15803d 0%, #166534 100%);
}

.bw{
  background:linear-gradient(135deg, #d97706 0%, #b45309 100%);
}

.bi{
  background:linear-gradient(135deg, #0ea5e9 0%, #0f766e 100%);
}

.bo{
  color:var(--ink2);
  border-color:var(--bdr);
  background:rgba(255,255,255,.82);
}

.bo:hover:not(:disabled){
  background:#eef6ff;
  color:var(--ink);
  border-color:#bfd7fb;
}

.pbtn{
  border-color:var(--bdr);
  background:linear-gradient(180deg,#ffffff 0%, #f8fbff 100%);
  color:var(--ink2);
}

.pbtn:hover{
  background:#eef6ff;
}

.pbtn.act{
  background:var(--acc);
  border-color:var(--acc);
}

/* Tables and badges */
thead th{
  background:linear-gradient(180deg,#f4f9ff 0%, #edf5ff 100%);
  color:#32527c;
  border-bottom-color:var(--bdr);
}

tbody td{
  border-bottom-color:#e8f0f8;
}

tbody tr:hover td{
  background:#f3f9ff;
}

.bdg{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);
}

.b-ok{
  background:rgba(21,128,61,.12);
  color:#166534;
}

.b-low{
  background:rgba(217,119,6,.12);
  color:#b45309;
}

.b-red{
  background:rgba(220,38,38,.12);
  color:#b91c1c;
}

.b-acc{
  background:rgba(37,99,235,.12);
  color:#1d4ed8;
}

.b-pur,
.b-tl{
  background:rgba(15,118,110,.12);
  color:#0f766e;
}

.b-grey{
  background:#edf4fb;
  color:#5f738b;
}

/* Dashboard */
#pg-dashboard::before{
  background:
    radial-gradient(circle at top left, rgba(37,99,235,.08), transparent 34%),
    radial-gradient(circle at 78% 18%, rgba(15,118,110,.05), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.42), transparent 88%);
}

.sc,
.dash-stat{
  border-color:rgba(219,231,243,.96);
  background:
    linear-gradient(180deg, rgba(255,255,255,.99), rgba(247,251,255,.97)),
    radial-gradient(circle at top right, rgba(37,99,235,.04), transparent 38%);
}

.sc:hover{
  border-color:#c6daf5;
}

.sc::after{
  background:var(--acc);
}

.sc.gn::after{
  background:var(--grn);
}

.sc.am::after{
  background:var(--amb);
}

.sc.re::after{
  background:var(--red);
}

.sc.pu::after{
  background:var(--tl);
}

.sc .sc-ico,
#pg-dashboard .sc .sc-ico{
  background:rgba(37,99,235,.08);
  color:#4068b0;
}

.sc.gn .sc-ico,
#pg-dashboard .sc.gn .sc-ico{
  background:rgba(21,128,61,.08);
  color:#2f7a52;
}

.sc.am .sc-ico,
#pg-dashboard .sc.am .sc-ico{
  background:rgba(217,119,6,.08);
  color:#a26a22;
}

.sc.re .sc-ico,
#pg-dashboard .sc.re .sc-ico{
  background:rgba(220,38,38,.08);
  color:#a34e4e;
}

.sc.pu .sc-ico,
#pg-dashboard .sc.pu .sc-ico{
  background:rgba(15,118,110,.08);
  color:#2a7d76;
}

.sc-lbl,
.dash-stat .sc-lbl{
  color:#6d8098;
}

.dash-title-pill{
  background:#edf5ff;
  color:#486887;
}

#pg-dashboard .ptitle i{
  color:#4a72b5;
}

#pg-dashboard .alert{
  border-color:rgba(203,219,233,.72);
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(247,250,255,.94));
}

#pg-dashboard .alert::before{
  background:rgba(148,163,184,.42);
}

#pg-dashboard .alert > i{
  background:rgba(15,23,42,.03);
}

#pg-dashboard .alert.ai{
  background:linear-gradient(180deg,rgba(243,248,255,.97),rgba(243,249,255,.94));
  border-color:rgba(37,99,235,.12);
}

#pg-dashboard .alert.aw{
  background:linear-gradient(180deg,rgba(255,251,245,.97),rgba(255,249,242,.94));
  border-color:rgba(217,119,6,.12);
}

#pg-dashboard .alert.ad{
  background:linear-gradient(180deg,rgba(255,247,247,.97),rgba(255,248,248,.94));
  border-color:rgba(220,38,38,.10);
}

#pg-dashboard .alert.ai::before{
  background:rgba(37,99,235,.42);
}

#pg-dashboard .alert.aw::before{
  background:rgba(217,119,6,.42);
}

#pg-dashboard .alert.ad::before{
  background:rgba(220,38,38,.38);
}

#alerts-toggle-btn{
  background:rgba(255,255,255,.84);
  border-color:rgba(203,219,233,.86);
  color:#556b82;
}

#alerts-toggle-btn:hover:not(:disabled){
  background:#ffffff;
  border-color:#bfd0e4;
  color:var(--ink);
}

/* Inventory/table-family surfaces */
.inventory-summary-card{
  border-color:rgba(219,231,243,.94);
  box-shadow:0 8px 20px rgba(15,23,42,.05);
}

.inventory-ribbon{
  border-color:rgba(219,231,243,.94);
  box-shadow:0 8px 22px rgba(15,23,42,.05);
}

.inventory-sheet-top{
  background:linear-gradient(180deg,#f8fbff 0%, #eef6ff 100%);
  border-bottom-color:var(--bdr);
}

.inventory-sheet-meta{
  background:#dcfce7;
  border-color:#bbf7d0;
  color:#166534;
}

/* ── Inventory packaging structure (Add Item modal) ─────────── */
#mo-inv .pkg-card{background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(248,251,255,.96));border:1px solid rgba(219,231,243,.95);border-radius:20px;box-shadow:0 18px 42px rgba(15,23,42,.08),inset 0 1px 0 rgba(255,255,255,.8);overflow:hidden}
#mo-inv .pkg-card-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:18px 20px 16px;border-bottom:1px solid rgba(226,232,240,.95);background:linear-gradient(180deg,rgba(248,251,255,.92),rgba(255,255,255,.96))}
#mo-inv .pkg-card-hd-left{display:flex;align-items:flex-start;gap:12px;min-width:0;flex:1}
#mo-inv .pkg-card-hd-icon{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,rgba(37,99,235,.14),rgba(15,118,110,.10));display:flex;align-items:center;justify-content:center;color:var(--acc);font-size:1rem;flex-shrink:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
#mo-inv .pkg-card-hd-title{font-size:1.02rem;font-weight:800;letter-spacing:-.02em;color:var(--ink);line-height:1.15}
#mo-inv .pkg-card-hd-sub{font-size:.82rem;color:var(--ink3);line-height:1.45;margin-top:4px;max-width:60ch}
#mo-inv .pkg-seg{display:inline-flex;align-items:center;gap:8px;padding:0;background:transparent;border:none;border-radius:0;box-shadow:none;flex-shrink:0}
#mo-inv .pkg-seg-btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:1.5px solid rgba(226,232,240,.98);border-radius:12px;font-size:.84rem;font-weight:700;font-family:var(--font);color:var(--ink3);background:#fff;cursor:pointer;transition:all .18s ease;white-space:nowrap}
#mo-inv .pkg-seg-btn:hover{color:var(--ink);border-color:rgba(148,163,184,.95)}
#mo-inv .pkg-seg-radio{width:14px;height:14px;border-radius:50%;border:2px solid rgba(148,163,184,.85);background:#fff;flex-shrink:0;transition:all .18s ease}
#mo-inv .pkg-seg-btn.pkg-seg-active{color:var(--acc);border-color:rgba(37,99,235,.45);background:rgba(239,246,255,.92);box-shadow:0 0 0 3px rgba(37,99,235,.08)}
#mo-inv .pkg-seg-btn.pkg-seg-active .pkg-seg-radio{border-color:var(--acc);background:var(--acc);box-shadow:inset 0 0 0 3px #fff}
#mo-inv .pkg-card-body{padding:18px 20px 20px}
#mo-inv .pkg-single-note{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:linear-gradient(180deg,rgba(239,246,255,.9),rgba(248,250,252,.98));border:1px solid rgba(191,219,254,.7);font-size:.84rem;color:var(--ink2);line-height:1.45}
#mo-inv .pkg-builder-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(260px,.95fr);gap:16px;align-items:start}
#mo-inv .pkg-builder-col{min-width:0}
#mo-inv .pkg-builder-head{margin-bottom:10px}
#mo-inv .pkg-builder-title{font-size:.88rem;font-weight:800;color:var(--ink)}
#mo-inv .pkg-levels{display:flex;flex-direction:column;gap:10px}
#mo-inv .pkg-lvl{padding:12px 14px;border:1px solid rgba(226,232,240,.95);border-radius:14px;box-shadow:0 6px 16px rgba(15,23,42,.03)}
#mo-inv .pkg-lvl-tone-1{background:linear-gradient(180deg,rgba(240,253,244,.92),rgba(255,255,255,.98));border-color:rgba(34,197,94,.18)}
#mo-inv .pkg-lvl-tone-2{background:linear-gradient(180deg,rgba(239,246,255,.95),rgba(255,255,255,.98));border-color:rgba(37,99,235,.16)}
#mo-inv .pkg-lvl-tone-3{background:linear-gradient(180deg,rgba(245,243,255,.95),rgba(255,255,255,.98));border-color:rgba(124,58,237,.16)}
#mo-inv .pkg-lvl-tone-4{background:linear-gradient(180deg,rgba(255,247,237,.95),rgba(255,255,255,.98));border-color:rgba(234,88,12,.16)}
#mo-inv .pkg-lvl-tone-5{background:linear-gradient(180deg,rgba(254,242,242,.95),rgba(255,255,255,.98));border-color:rgba(220,38,38,.16)}
#mo-inv .pkg-lvl-row{display:flex;align-items:center;gap:10px;width:100%}
#mo-inv .pkg-lvl-badge{width:30px;height:30px;border-radius:999px;display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:800;color:#fff;flex-shrink:0;box-shadow:0 6px 12px rgba(15,23,42,.12)}
#mo-inv .pkg-lvl-badge-1{background:linear-gradient(135deg,#16a34a,#15803d)}
#mo-inv .pkg-lvl-badge-2{background:linear-gradient(135deg,#2563eb,#1d4ed8)}
#mo-inv .pkg-lvl-badge-3{background:linear-gradient(135deg,#7c3aed,#6d28d9)}
#mo-inv .pkg-lvl-badge-4{background:linear-gradient(135deg,#ea580c,#c2410c)}
#mo-inv .pkg-lvl-badge-5{background:linear-gradient(135deg,#dc2626,#b91c1c)}
#mo-inv .pkg-lvl-label{flex:1 1 150px;min-width:110px;font-size:.84rem;font-weight:700;line-height:1.3;color:var(--ink)}
#mo-inv .pkg-lvl-fields{display:flex;align-items:center;gap:8px;flex:0 0 auto}
#mo-inv .pkg-lvl-input{width:72px;min-height:44px;padding:0 10px;border:1.5px solid rgba(203,213,225,.95);border-radius:10px;font-family:var(--font);font-size:.95rem;font-weight:800;text-align:center;background:#fff;color:var(--ink);box-sizing:border-box}
#mo-inv .pkg-lvl-select{width:158px;min-height:44px;padding:0 34px 0 10px;border:1.5px solid rgba(203,213,225,.95);border-radius:10px;font-family:var(--font);font-size:.82rem;font-weight:700;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748b' d='M1.4 1.4 6 6l4.6-4.6' stroke='%2364748b' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;appearance:none;color:var(--ink);box-sizing:border-box}
#mo-inv .pkg-lvl-input:focus,#mo-inv .pkg-lvl-select:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 4px rgba(37,99,235,.12)}
#mo-inv .pkg-lvl-unit-ico{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;box-shadow:0 6px 12px rgba(15,23,42,.1)}
#mo-inv .pkg-lvl-unit-ico i{font-size:.78rem}
#mo-inv .pkg-lvl-rm,#mo-inv .pkg-lvl-rm-spacer{width:28px;height:28px;flex-shrink:0}
#mo-inv .pkg-lvl-rm{border:none;border-radius:8px;background:transparent;color:var(--red);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:.8}
#mo-inv .pkg-lvl-rm:hover{background:var(--red-s);opacity:1}
#mo-inv .pkg-lvl-err{margin-top:8px;padding:8px 10px;border-radius:10px;background:var(--red-s);border:1px solid rgba(220,38,38,.16);color:var(--red);font-size:.76rem;font-weight:700;display:flex;align-items:center;gap:8px}
#mo-inv .pkg-ps-ico-1,#mo-inv .pkg-lvl-unit-ico.pkg-ps-ico-1{background:linear-gradient(135deg,#16a34a,#15803d)}
#mo-inv .pkg-ps-ico-2,#mo-inv .pkg-lvl-unit-ico.pkg-ps-ico-2{background:linear-gradient(135deg,#2563eb,#1d4ed8)}
#mo-inv .pkg-ps-ico-3,#mo-inv .pkg-lvl-unit-ico.pkg-ps-ico-3{background:linear-gradient(135deg,#7c3aed,#6d28d9)}
#mo-inv .pkg-ps-ico-4,#mo-inv .pkg-lvl-unit-ico.pkg-ps-ico-4{background:linear-gradient(135deg,#ea580c,#c2410c)}
#mo-inv .pkg-ps-ico-5,#mo-inv .pkg-lvl-unit-ico.pkg-ps-ico-5{background:linear-gradient(135deg,#dc2626,#b91c1c)}
#mo-inv .pkg-add-wrap{margin-top:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
#mo-inv .pkg-add-btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:none;border-radius:10px;background:transparent;color:var(--acc);font-size:.84rem;font-weight:800;font-family:var(--font);cursor:pointer}
#mo-inv .pkg-add-btn:hover{background:rgba(37,99,235,.06)}
#mo-inv .pkg-max-note{font-size:.74rem;color:var(--ink4);font-weight:600}
#mo-inv .pkg-preview-box{background:linear-gradient(180deg,rgba(240,253,244,.55),rgba(236,253,245,.35));border:1px solid rgba(34,197,94,.18);border-radius:16px;padding:16px;box-shadow:0 8px 20px rgba(15,23,42,.04)}
#mo-inv .pkg-preview-hd{margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid rgba(34,197,94,.12)}
#mo-inv .pkg-preview-title{font-size:.88rem;font-weight:800;color:var(--ink)}
#mo-inv .pkg-preview-placeholder{font-size:.82rem;color:var(--ink3);line-height:1.5;padding:8px 0 12px}
#mo-inv .pkg-preview-steps{display:flex;flex-direction:column;gap:6px}
#mo-inv .pkg-ps-step{display:flex;align-items:center;gap:10px;padding:4px 0}
#mo-inv .pkg-ps-ico{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
#mo-inv .pkg-ps-qty{font-size:.9rem;font-weight:700;color:var(--ink)}
#mo-inv .pkg-ps-num{font-weight:900}
#mo-inv .pkg-ps-qty-1 .pkg-ps-num{color:#15803d}
#mo-inv .pkg-ps-qty-2 .pkg-ps-num{color:#1d4ed8}
#mo-inv .pkg-ps-qty-3 .pkg-ps-num{color:#6d28d9}
#mo-inv .pkg-ps-qty-4 .pkg-ps-num{color:#c2410c}
#mo-inv .pkg-ps-qty-5 .pkg-ps-num{color:#b91c1c}
#mo-inv .pkg-ps-arrow{display:flex;align-items:center;justify-content:center;height:16px;color:var(--ink4);opacity:.55;padding-left:11px}
#mo-inv .pkg-preview-usable{margin-top:12px;padding:12px 14px;border-radius:14px;background:linear-gradient(180deg,rgba(240,253,244,.95),rgba(236,253,245,.98));border:1px solid rgba(34,197,94,.18)}
#mo-inv .pkg-preview-usable-label{font-size:.72rem;font-weight:800;color:#166534;margin-bottom:4px}
#mo-inv .pkg-preview-usable-val{font-size:1.25rem;font-weight:900;color:#166534;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#mo-inv .pkg-preview-check{font-size:1rem;color:#16a34a}
#mo-inv .pkg-val-err{margin-top:14px;padding:11px 12px;border-radius:14px;background:var(--red-s);border:1px solid rgba(220,38,38,.18);color:var(--red);font-size:.83rem;font-weight:700;display:flex;align-items:center;gap:8px}
#mo-inv .pkg-status-pill{min-height:48px;display:flex;align-items:center;gap:8px;padding:0 14px;background:linear-gradient(180deg,#fff,rgba(248,250,252,.98));border:1px solid rgba(226,232,240,.96);border-radius:12px;font-size:.82rem;box-shadow:0 8px 18px rgba(15,23,42,.04)}
#mo-inv .pkg-unit-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
#mo-inv #inv-qty{width:100%!important;text-align:left!important;padding-left:14px!important;border:1.5px solid rgba(203,213,225,.95)!important;border-radius:12px!important;font-size:1.02rem!important;font-weight:800!important;font-family:var(--font)!important;box-sizing:border-box!important;min-height:44px}
#mo-inv #inv-unit-field>div{display:grid!important;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:10px}
#mo-inv #inv-unit,#mo-inv #inv-unit-custom,#mo-inv #inv-cat,#mo-inv #inv-eq-condition{min-height:44px;border:1.5px solid rgba(203,213,225,.95)!important;border-radius:12px!important;font-family:var(--font)!important;box-sizing:border-box!important}
#mo-inv #inv-unit{padding:0 40px 0 14px!important;font-size:.9rem!important;font-weight:700!important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748b' d='M1.4 1.4 6 6l4.6-4.6' stroke='%2364748b' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center!important;appearance:none!important}
#mo-inv #inv-unit-custom{padding:0 14px!important;font-size:.92rem!important}
#mo-inv #inv-cat,#mo-inv #inv-eq-condition{padding:0 40px 0 14px!important;font-size:.92rem!important;font-weight:700!important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748b' d='M1.4 1.4 6 6l4.6-4.6' stroke='%2364748b' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center!important;appearance:none!important}
@media (max-width:980px){
  #mo-inv .pkg-builder-grid{grid-template-columns:1fr}
}
@media (max-width:720px){
  #mo-inv .pkg-card-hd{flex-direction:column;align-items:stretch}
  #mo-inv .pkg-seg{width:100%;display:grid;grid-template-columns:1fr 1fr}
  #mo-inv .pkg-seg-btn{justify-content:center}
  #mo-inv .pkg-lvl-row{flex-wrap:wrap}
  #mo-inv .pkg-lvl-label{flex:1 1 100%;padding-left:40px}
  #mo-inv .pkg-lvl-fields{flex:1 1 100%;padding-left:40px}
  #mo-inv .pkg-lvl-unit-ico{margin-left:40px}
  #mo-inv .pkg-lvl-rm,#mo-inv .pkg-lvl-rm-spacer{margin-left:auto}
  #mo-inv #inv-unit-field>div{grid-template-columns:1fr}
  #mo-inv .pkg-unit-row{grid-template-columns:1fr}
}
