:root {
  --ink: #17221d;
  --muted: #69736d;
  --line: #e6eae6;
  --canvas: #f5f7f4;
  --panel: #ffffff;
  --green: #176b4a;
  --green-2: #228661;
  --green-soft: #e5f4ec;
  --navy: #18373b;
  --amber: #bd7922;
  --amber-soft: #fff3df;
  --blue: #3c72b5;
  --blue-soft: #eaf2fb;
  --violet: #715aa4;
  --violet-soft: #f0ecfa;
  --red: #c2534c;
  --red-soft: #fbe9e7;
  --shadow: 0 12px 35px rgba(35, 58, 45, .08);
  --radius: 16px;
  --layer-modal: 100;
  --layer-order-modal: 110;
  --layer-nested-modal: 130;
}

/* Local authenticated application shell */
.login-screen{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:24px;background:var(--canvas)}
.login-screen[hidden]{display:none}
.login-card{width:min(460px,100%);display:grid;gap:22px;padding:38px;border:1px solid var(--line);border-radius:24px;background:var(--panel);box-shadow:var(--shadow)}
.login-card h1{margin:8px 0 5px;font:800 32px/1.15 Manrope,sans-serif;color:var(--ink)}
.login-card p{margin:0;color:var(--muted)}
.login-card label{display:grid;gap:8px;font-weight:700;color:var(--ink)}
.login-card .text-input{width:100%;height:50px;font-size:16px}
.login-card .button{height:50px;justify-content:center;font-size:16px}
.login-card>small{color:var(--muted);text-align:center}
.login-card code{font-size:12px}
.login-brand{color:var(--ink)}
.login-error{min-height:20px;color:#b42318!important;font-weight:700}
.data-state{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;background:var(--surface-soft);color:var(--muted);font-size:12px;font-weight:700}
.data-state:before{content:"";width:7px;height:7px;border-radius:50%;background:#41b883;box-shadow:0 0 0 3px rgba(65,184,131,.14)}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--canvas); color: var(--ink); font-family: "DM Sans", system-ui, sans-serif; }
button, input { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible { outline: 3px solid rgba(34, 134, 97, .22); outline-offset: 2px; }
svg.icon { width: 18px; height: 18px; display: block; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.app-shell { min-height: 100vh; display: flex; }
.sidebar { width: 220px; height: 100vh; position: fixed; inset: 0 auto 0 0; z-index: 20; background: #102f2c; color: #dbe9e4; padding: 0 15px 18px; display: flex; flex-direction: column; box-shadow: 4px 0 24px rgba(17, 44, 40, .08); }
.brand { display:flex;align-items:center;gap:10px; }
.sidebar-brand { height:65px;padding:0 9px;border-bottom:1px solid rgba(255,255,255,.08); }
.brand-logo { display:block;width:auto;height:auto;max-width:104px;max-height:48px;object-fit:contain; }
.brand small { display:block;font-size:9px;letter-spacing:1.8px;color:#9dbbb2;writing-mode:vertical-rl;transform:rotate(180deg); }
.login-brand { justify-content:center;padding:0; }
.login-brand { justify-content:center;margin-bottom:8px; }
.login-brand .brand-logo { width:126px;max-width:126px;max-height:65px; }
.login-brand small { color:var(--muted); }
.nav-label { margin: 0 12px 9px; font-size: 10px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; color: #6f9990; }
.nav-label.gap { margin-top: 27px; }
.nav-item { border: 0; width: 100%; background: transparent; color: #b8cec8; display: flex; align-items: center; gap: 12px; padding: 11px 12px; margin: 2px 0; border-radius: 9px; cursor: pointer; text-align: left; font-weight: 600; font-size: 14px; transition: .2s ease; }
.nav-item:hover { background: rgba(255,255,255,.06); color: white; }
.nav-item.active { background: #e5f53f; color: #13332e; box-shadow: 0 5px 16px rgba(0,0,0,.14); }
.nav-item svg { width: 19px; }
.nav-item b { margin-left: auto; background: #d9624c; color: white; border-radius: 20px; min-width: 22px; height: 20px; display: grid; place-items: center; font-size: 10px; }
.sidebar-card { margin-top: auto; background: rgba(255,255,255,.065); border: 1px solid rgba(255,255,255,.08); border-radius: 13px; padding: 15px; }
.sidebar-card .sparkle { width: 30px; height: 30px; border-radius: 8px; background: rgba(229,245,63,.13); color: #e5f53f; display: grid; place-items: center; margin-bottom: 11px; }
.sidebar-card strong { color: #f4faf7; font-size: 13px; }
.sidebar-card p { margin: 5px 0 9px; color: #91aaa4; font-size: 11px; line-height: 1.5; }
.text-button { border: 0; background: transparent; padding: 0; color: var(--green); font-weight: 700; font-size: 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.sidebar-card .text-button { color: #e5f53f; }
.text-button svg { width: 14px; }
.sidebar-user { margin-top: 14px; padding: 14px 6px 0; border-top: 1px solid rgba(255,255,255,.1); display: grid; grid-template-columns: 34px 1fr auto; gap: 9px; align-items: center; }
.avatar { width: 34px; height: 34px; border-radius: 10px; background: #74ae9e; color: white; display: grid; place-items: center; font-size: 11px; font-weight: 700; }
.sidebar-user strong, .sidebar-user span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidebar-user strong { font-size: 11px; color: #f3f8f6; }.sidebar-user span { font-size: 9px; color: #7d9f97; margin-top: 2px; }
.sidebar-user button { border: 0; background: none; color: #83a69d; cursor: pointer; padding: 3px; }
.main { width: calc(100% - 220px); margin-left: 220px; min-width: 0; }
.topbar { height: 65px; background: rgba(255,255,255,.92); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; padding: 0 31px; position: sticky; top: 0; z-index: 15; backdrop-filter: blur(12px); }
.page-heading { display: flex; gap: 5px; font-size: 13px; }.page-heading span { color: #9ba39e; }.page-heading strong { font-weight: 700; }
.top-actions { display: flex; gap: 9px; align-items: center; }
.global-search { height: 36px; width: 280px; border: 1px solid #dde2de; background: #f7f8f6; border-radius: 9px; padding: 0 9px; display: flex; align-items: center; gap: 7px; color: #8a948e; }
.global-search input { border: 0; outline: 0; flex: 1; min-width: 0; background: transparent; font-size: 12px; }
.global-search kbd { border: 1px solid #d8ddd9; border-radius: 5px; background: #fff; padding: 2px 5px; font: 10px "DM Sans"; color: #8b958f; }
.global-search-shell { position:relative; }
.global-search-results { position:absolute; top:43px; right:0; width:min(520px,calc(100vw - 32px)); max-height:min(620px,calc(100vh - 88px)); overflow:auto; padding:8px; border:1px solid var(--line); border-radius:13px; background:var(--panel); box-shadow:0 18px 48px var(--overlay); color:var(--ink); z-index:80; }
.global-search-summary { display:flex; justify-content:space-between; align-items:center; padding:5px 8px 8px; color:var(--muted); font-size:11px; }
.global-search-summary span { font-weight:700; color:var(--ink); }
.global-search-group + .global-search-group { border-top:1px solid var(--line); margin-top:6px; padding-top:6px; }
.global-search-group h3 { margin:0; padding:5px 8px; color:var(--muted); font:700 10px "DM Sans"; letter-spacing:1px; text-transform:uppercase; }
.global-search-result { display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:10px; align-items:center; padding:9px; border-radius:9px; color:var(--ink); text-decoration:none; outline:0; }
.global-search-result:hover,.global-search-result.active { background:var(--surface-selected); }
.global-search-result-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:var(--green-soft); color:var(--green); font-size:9px; font-weight:800; }
.global-search-result-icon.order { background:var(--blue-soft); color:var(--blue); }
.global-search-result-icon.contact { background:var(--violet-soft); color:var(--violet); }
.global-search-result-icon.product { background:var(--amber-soft); color:var(--amber); }
.global-search-result-copy { min-width:0; }
.global-search-result-copy strong,.global-search-result-copy span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.global-search-result-copy strong { font-size:12px; }
.global-search-result-copy span,.global-search-result > small { margin-top:3px; color:var(--muted); font-size:10px; }
.global-search-result > small { margin:0; text-transform:capitalize; }
.global-search-empty,.global-search-loading { display:grid; gap:4px; padding:18px 12px; text-align:center; }
.global-search-empty strong { font-size:13px; }
.global-search-empty span,.global-search-loading { color:var(--muted); font-size:11px; }
.icon-button, .help-button, .mobile-menu { border: 1px solid #dde2de; background: #fff; height: 36px; border-radius: 9px; cursor: pointer; display: grid; place-items: center; position: relative; }
.icon-button { width: 36px; }.help-button { padding: 0 11px; display: flex; gap: 6px; align-items: center; font-weight: 600; font-size: 12px; }
.notification-dot { position: absolute; width: 7px; height: 7px; background: #e2624a; border: 2px solid white; border-radius: 50%; top: 7px; right: 7px; }
.mobile-menu { display: none; width: 36px; }
.sidebar-backdrop { display:none;border:0;padding:0;background:var(--overlay); }
.sidebar-close { display:none; }
.content { padding: 29px 31px 55px; max-width: 1600px; margin: 0 auto; }
.view { display: none; animation: fade .22s ease; }.view.active { display: block; }
@keyframes fade { from { opacity: .3; transform: translateY(3px); } to { opacity: 1; transform: none; } }
.welcome-row, .section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 23px; }
.eyebrow { margin: 0 0 7px !important; color: #809087 !important; font-weight: 700; font-size: 10px !important; letter-spacing: 1.5px; }
h1, h2, h3 { font-family: "Manrope", sans-serif; margin: 0; letter-spacing: -.5px; }
.welcome-row h1, .section-head h1 { font-size: 27px; line-height: 1.2; }.welcome-row p, .section-head p { margin: 7px 0 0; color: var(--muted); font-size: 13px; }
.button-row { display: flex; gap: 9px; }
.button { height: 39px; border-radius: 9px; border: 1px solid transparent; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; font-size: 12px; font-weight: 700; cursor: pointer; transition: .18s; white-space: nowrap; }
.button:hover { transform: translateY(-1px); box-shadow: 0 5px 12px rgba(18, 48, 41, .1); }.button:active { transform: none; }
.button.primary { background: var(--green); color: white; }.button.secondary { background: white; color: #354139; border-color: #dce2dd; }.button.white { background: white; color: #123d33; }.button.compact { height: 34px; }
.metrics-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 15px; }
.metric-card { background: white; border: 1px solid var(--line); border-radius: 13px; padding: 17px 18px 15px; position: relative; overflow: hidden; }
.metric-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--green); }.metric-card.amber::before { background: #d29439; }.metric-card.blue::before { background: #4b83c8; }.metric-card.violet::before { background: #8268b4; }
.metric-top { display: flex; justify-content: space-between; color: #68746d; font-size: 11px; font-weight: 600; }.metric-top svg { color: #98a29c; width: 17px; }
.metric-card > strong { display: block; font: 700 25px "Manrope"; margin: 9px 0 7px; letter-spacing: -.7px; }
.metric-foot { display: flex; align-items: center; gap: 6px; font-size: 9px; color: #929a95; }.trend, .attention, .neutral { font-weight: 700; border-radius: 20px; padding: 3px 6px; }.trend.up { background: var(--green-soft); color: #257454; }.attention { background: var(--amber-soft); color: #a36518; }.neutral { background: #edf0ee; color: #607068; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 2.1fr) minmax(255px, .85fr); gap: 15px; }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 2px 5px rgba(37,51,43,.02); }
.panel-head { padding: 18px 20px 14px; display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.panel-head h2 { font-size: 15px; }.panel-head p { margin: 3px 0 0; font-size: 10px; color: #8a948e; }
.order-flow { min-height: 262px; }
.flow-rail { display: grid; grid-template-columns: 1fr 30px 1fr 30px 1fr 30px 1fr; align-items: center; padding: 10px 30px 21px; }
.flow-step { border: 0; background: transparent; text-align: center; cursor: pointer; border-radius: 10px; padding: 4px; }
.flow-step:hover { background: #f7f9f6; }
.flow-icon { width: 42px; height: 42px; margin: 0 auto 8px; border-radius: 12px; display: grid; place-items: center; }.flow-icon.rose { background: var(--red-soft); color: var(--red); }.flow-icon.amber { background: var(--amber-soft); color: var(--amber); }.flow-icon.blue { background: var(--blue-soft); color: var(--blue); }.flow-icon.green { background: var(--green-soft); color: var(--green); }
.flow-step strong, .flow-step small, .flow-step em { display: block; }.flow-step strong { font: 700 20px "Manrope"; }.flow-step small { font-weight: 700; font-size: 11px; margin-top: 1px; }.flow-step em { font-style: normal; font-size: 8px; color: #929a95; margin-top: 3px; }
.flow-line { height: 1px; background: #dfe5e0; position: relative; }.flow-line::after { content: ""; position: absolute; right: -1px; top: -3px; width: 6px; height: 6px; border-top: 1px solid #cbd3cd; border-right: 1px solid #cbd3cd; transform: rotate(45deg); }
.flow-callout { margin: 0 20px 18px; border: 1px solid #f1dfbf; background: #fff9ef; border-radius: 10px; padding: 10px 12px; display: grid; grid-template-columns: 30px 1fr auto; gap: 10px; align-items: center; color: #8b5b1d; }.flow-callout > svg { background: #fbe8c7; border-radius: 8px; padding: 7px; width: 30px; height: 30px; }.flow-callout strong, .flow-callout span { display: block; }.flow-callout strong { font-size: 10px; }.flow-callout span { font-size: 9px; color: #9b7d52; margin-top: 2px; }.flow-callout button { border: 0; background: none; color: #875617; font-weight: 700; font-size: 9px; cursor: pointer; }
.attention-panel { grid-column: 2; grid-row: 1 / span 2; }.icon-button.small { width: 29px; height: 29px; border: 0; }
.attention-list { padding: 0 13px; }.attention-list > button { width: 100%; border: 0; border-bottom: 1px solid #eef0ee; background: transparent; padding: 13px 6px; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 9px; cursor: pointer; text-align: left; }.attention-list > button:hover { background: #fafbfa; }.task-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; }.task-icon.red { color: var(--red); background: var(--red-soft); }.task-icon.amber { color: var(--amber); background: var(--amber-soft); }.task-icon.blue { color: var(--blue); background: var(--blue-soft); }.attention-list strong { display: block; font-size: 10px; }.attention-list p { margin: 3px 0 0; font-size: 8px; color: #919994; }.attention-list b { min-width: 20px; height: 20px; display: grid; place-items: center; background: #f0f2ef; color: #59685f; font-size: 9px; border-radius: 20px; }
.completion { margin: 18px; background: #f1f7f3; border-radius: 12px; padding: 14px; display: flex; gap: 12px; align-items: center; }.ring { width: 43px; height: 43px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--green) 0 86%, #dce9e0 86%); position: relative; }.ring::after { content: ""; background: #f1f7f3; width: 32px; height: 32px; border-radius: 50%; position: absolute; }.ring span { z-index: 1; font-size: 9px; font-weight: 700; }.completion strong { font-size: 10px; }.completion p { margin: 3px 0 0; font-size: 8px; color: #718179; }
.recent-orders { grid-column: 1; overflow: hidden; }.segmented { background: #f3f5f2; border-radius: 8px; padding: 3px; display: flex; }.segmented button { border: 0; background: transparent; border-radius: 6px; padding: 5px 9px; font-size: 8px; color: #768078; cursor: pointer; }.segmented button.active { background: white; color: #28352e; font-weight: 700; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.table-wrap { overflow-x: auto; } table { width: 100%; border-collapse: collapse; text-align: left; white-space: nowrap; } th { background: #f8f9f7; color: #879088; font-size: 8px; text-transform: uppercase; letter-spacing: .6px; padding: 9px 14px; border-top: 1px solid #edf0ed; border-bottom: 1px solid #edf0ed; } td { padding: 11px 14px; border-bottom: 1px solid #eff1ef; font-size: 10px; } tbody tr:hover { background: #fbfcfa; } .order-clickable { cursor: pointer; transition: background .15s, box-shadow .15s; }.order-clickable:hover { background: #f4f9f6 !important; box-shadow: inset 3px 0 0 var(--green); }.order-clickable:focus-visible { outline: 2px solid var(--green); outline-offset: -2px; } td strong, td > span { display: block; } td > span { font-size: 8px; color: #919a94; margin-top: 2px; }.source { display: inline-flex !important; align-items: center; gap: 5px; color: #55635b !important; font-size: 9px !important; }.source svg { width: 12px; }.person { display: flex !important; align-items: center; gap: 5px; color: #49574f !important; font-size: 9px !important; }.person > span { width: 21px; height: 21px; border-radius: 6px; background: #d9edf4; color: #3d6a78; display: grid; place-items: center; font-size: 7px; font-weight: 700; }.person.coral > span { background: #fae2da; color: #aa5c48; }.status { display: inline-flex !important; padding: 4px 7px; border-radius: 20px; font-weight: 700; font-size: 8px !important; margin: 0 !important; }.status.new { color: #a44d46; background: var(--red-soft); }.status.approval { color: #9b651f; background: var(--amber-soft); }.status.processing { color: #3d6fae; background: var(--blue-soft); }.status.ready { color: #247153; background: var(--green-soft); }.muted { color: #a5ada8 !important; }.row-more { border: 0; background: transparent; padding: 5px; cursor: pointer; color: #89938d; }
.section-head { align-items: center; }.section-head h1 { font-size: 25px; }.stage-tabs { display: flex; gap: 4px; border-bottom: 1px solid #dfe4df; overflow-x: auto; margin-bottom: 15px; }.stage-tabs button { border: 0; background: transparent; padding: 10px 13px; color: #68736c; font-size: 11px; cursor: pointer; border-bottom: 2px solid transparent; }.stage-tabs button.active { color: var(--green); font-weight: 700; border-color: var(--green); }.stage-tabs span { background: #edf0ed; border-radius: 10px; font-size: 8px; padding: 2px 5px; margin-left: 4px; }.order-queue, .catalog-panel { overflow: hidden; }.toolbar { min-height: 57px; padding: 10px 15px; display: flex; gap: 8px; align-items: center; }.table-search { width: 245px; height: 34px; border: 1px solid #dde2de; border-radius: 8px; display: flex; align-items: center; gap: 7px; padding: 0 9px; color: #929b95; }.table-search input { border: 0; background: transparent; outline: 0; min-width: 0; width: 100%; font-size: 10px; }.table-search svg { width: 14px; }.filter-button, .view-toggle { height: 34px; background: white; border: 1px solid #dfe3e0; border-radius: 8px; padding: 0 10px; font-size: 9px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }.filter-button svg { width: 13px; }.filter-button span { background: #e5f1eb; color: var(--green); border-radius: 10px; padding: 2px 5px; }.order-table th, .order-table td { padding: 13px 15px; }.order-table td { font-size: 10px; }.order-table input[type="checkbox"] { accent-color: var(--green); }.payment { font-size: 8px; font-weight: 700; }.payment.paid { color: #257454; }.payment.terms { color: #a86c20; }
.catalog-summary { display: flex; align-items: center; gap: 26px; background: white; border: 1px solid var(--line); border-radius: 12px; padding: 12px 17px; margin-bottom: 15px; }.catalog-summary > div:not(.currency-switch) { display: flex; align-items: center; gap: 8px; font-size: 10px; color: #707b74; }.catalog-summary svg { width: 16px; color: #729085; }.catalog-summary strong { color: var(--ink); }.currency-switch { margin-left: auto; display: flex; align-items: center; gap: 3px; background: #f2f4f1; border-radius: 8px; padding: 3px; }.currency-switch > span { font-size: 8px; color: #879088; padding: 0 6px; }.currency-switch button { border: 0; background: transparent; border-radius: 6px; padding: 5px 9px; font-size: 8px; cursor: pointer; }.currency-switch button.active { background: white; color: var(--green); font-weight: 700; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.variant-banner { border-radius: 15px; background: linear-gradient(112deg,#173c36,#1f5c4b); min-height: 154px; margin-bottom: 15px; color: white; display: grid; grid-template-columns: 160px 1fr auto; align-items: center; overflow: hidden; padding: 0 25px 0 5px; position: relative; }.variant-banner::after { content: ""; position: absolute; width: 230px; height: 230px; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; left: -58px; top: -108px; }.banner-visual { height: 154px; position: relative; }.bottle { position: absolute; border-radius: 8px 8px 18px 18px; bottom: -8px; background: #d1ee67; filter: drop-shadow(0 15px 14px rgba(0,0,0,.2)); }.bottle::before { content: ""; position: absolute; width: 40%; height: 18px; background: #e9f7ab; left: 30%; top: -15px; border-radius: 4px 4px 1px 1px; }.bottle::after { content: "BRODI"; position: absolute; color: #275c48; background: #f8fbe9; width: 70%; height: 37%; left: 15%; top: 30%; border-radius: 4px; font: 800 8px "Manrope"; display: grid; place-items: center; }.bottle.one { width: 54px; height: 97px; left: 37px; transform: rotate(-7deg); }.bottle.two { width: 44px; height: 78px; left: 95px; bottom: -4px; background: #67cbbb; transform: rotate(7deg); }.spark { position: absolute; color: #e6f452; }.spark.s1 { left: 19px; top: 30px; font-size: 19px; }.spark.s2 { left: 130px; top: 25px; font-size: 11px; }.tag { display: inline-block; background: rgba(215,241,86,.13); color: #e0ee69; border: 1px solid rgba(226,242,109,.16); border-radius: 20px; padding: 4px 8px; font-size: 8px; letter-spacing: .8px; font-weight: 700; }.variant-banner h2 { margin-top: 10px; font-size: 17px; }.variant-banner p { color: #b7d0c8; max-width: 640px; font-size: 10px; line-height: 1.55; margin: 5px 0 0; }.spacer { flex: 1; }.view-toggle { width: 34px; padding: 0; justify-content: center; color: #859088; }.view-toggle.active { color: var(--green); background: var(--green-soft); border-color: #cfe5d8; }.product-list { border-top: 1px solid #edf0ed; }.product-row { display: grid; grid-template-columns: 2.2fr .75fr .8fr .9fr .7fr 30px; align-items: center; gap: 12px; padding: 13px 16px; border-bottom: 1px solid #eef1ee; }.product-row:hover { background: #fbfcfb; }.product-main { display: flex; align-items: center; gap: 11px; }.product-art { width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; position: relative; overflow: hidden; }.product-art.cloth { background: #edf3f1; }.cloth-stack { width: 25px; height: 19px; border-radius: 3px; background: #59a99a; box-shadow: -4px 4px 0 #8ed0c0, 4px -3px 0 #377f75; transform: rotate(-5deg); }.product-art.spray { background: #f1f5e5; }.spray-bottle { width: 18px; height: 29px; border-radius: 3px 3px 7px 7px; background: #d2e96d; position: relative; }.spray-bottle::before { content:""; width: 15px; height: 7px; background:#4f7366; position:absolute; top:-4px; left:4px; border-radius:2px; }.product-art.brush { background: #f7eee5; }.brush-shape { width: 27px; height: 10px; background: #d7aa77; border-radius: 10px; position: relative; }.brush-shape::after { content:""; width: 18px; height: 10px; background: repeating-linear-gradient(90deg,#46685d 0 2px,transparent 2px 4px); position:absolute; top:7px; left:5px; }.product-art.set { background: #efeafa; }.set-shape { width: 28px; height: 28px; border: 2px solid #866eb8; border-radius: 8px; position: relative; }.set-shape::after { content:"3"; width: 15px; height: 15px; border-radius:50%; background:#866eb8; color:white; display:grid; place-items:center; font-size:8px; position:absolute; right:-6px; top:-6px; }.product-main strong, .product-main span { display: block; }.product-main strong { font-size: 10px; }.product-main span { font-size: 8px; color: #8c9590; margin-top: 3px; }.product-row > div > small { display: block; color: #939b96; font-size: 7px; text-transform: uppercase; letter-spacing: .5px; margin-bottom: 4px; }.product-row > div > strong { font-size: 10px; }.type-badge { font-size: 8px; font-weight: 700; color: #5d6a62; background: #eef1ee; border-radius: 20px; padding: 4px 7px; display: inline-block; }.stock-line { display: flex; align-items: center; gap: 5px; font-size: 9px; }.stock-line i { width: 6px; height: 6px; border-radius: 50%; background: #47a376; }.stock-line.low i { background: #dc9440; }
.relationship-map { min-height: 255px; display: grid; grid-template-columns: .9fr 1.3fr; padding: 24px; margin-bottom: 15px; background: linear-gradient(135deg,#153933,#1a493e); color: white; overflow: hidden; }.map-copy { padding: 8px 26px 8px 5px; }.tag.dark { background: rgba(255,255,255,.08); color: #dff26b; }.map-copy h2 { font-size: 20px; margin-top: 14px; max-width: 390px; }.map-copy > p { color: #aac6bd; font-size: 11px; line-height: 1.6; max-width: 420px; }.map-legend { display: flex; flex-wrap: wrap; gap: 14px; font-size: 8px; color: #c0d2cc; margin-top: 20px; }.legend { width: 7px; height: 7px; border-radius: 50%; display: inline-block; margin-right: 5px; }.legend.shipping { background: #cfe75c; }.legend.billing { background: #71c8b1; }.legend.contact { background: #d6b16e; }
.entity-map { display: grid; grid-template-columns: 1fr 60px 1.2fr; align-items: center; position: relative; }.entity { background: white; color: var(--ink); border-radius: 12px; padding: 14px; box-shadow: 0 10px 25px rgba(0,0,0,.12); }.billing-entity { max-width: 210px; }.entity-icon { width: 31px; height: 31px; border-radius: 8px; background: #ddf1e9; color: var(--green); display: grid; place-items: center; margin-bottom: 10px; }.entity small, .entity strong, .entity em { display: block; }.entity > small, .shipping-entity small { font-size: 7px; letter-spacing: .7px; color: #8c9890; }.entity > strong { font-size: 11px; margin-top: 4px; }.entity em { font-style: normal; font-size: 8px; color: #808c85; margin-top: 3px; }.entity-contact { border-top: 1px solid #edf0ed; display: flex; align-items: center; gap: 7px; margin-top: 12px; padding-top: 10px; }.entity-contact > span, .shipping-entity > b { width: 26px; height: 26px; border-radius: 7px; background: #f0e7d7; color: #9c7542; display: grid; place-items: center; font-size: 7px; }.entity-contact b { font-size: 8px; }.entity-contact small { font-size: 7px; color: #929a95; }.connector-line { height: 92px; position: relative; }.connector-line span { position: absolute; background: #719188; height: 1px; }.connector-line span:first-child { left: 0; right: 50%; top: 50%; }.connector-line span:nth-child(2) { width: 1px; height: 61px; right: 50%; top: 18px; }.connector-line span:nth-child(3) { left: 50%; right: 0; top: 18px; box-shadow: 0 60px 0 #719188; }.shipping-stack { display: grid; gap: 10px; }.shipping-entity { display: grid; grid-template-columns: 31px 1fr auto; gap: 10px; align-items: center; padding: 12px; }.shipping-entity .entity-icon { margin: 0; background: #f1f6da; color: #71841f; }.shipping-entity strong { font-size: 9px; }.shipping-entity em { font-size: 7px; }.shipping-entity > b { margin-left: auto; background: #e4eef4; color: #4f7184; }.customer-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }.customer-card { padding: 17px; }.customer-card header { display: flex; justify-content: space-between; }.customer-card header > span { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 10px; background: #eef5e0; color: #62812f; }.customer-card h3 { font-size: 13px; margin-top: 14px; }.customer-card > p { color: #78847d; font-size: 9px; }.customer-meta { background:#f7f8f6; border-radius:9px; padding: 10px; display:grid; gap:7px; margin-top:12px; }.customer-meta div { display:flex; justify-content:space-between; font-size:8px; }.customer-meta span { color:#89928d; }.customer-card footer { display:flex; align-items:center; gap:7px; margin-top:13px; font-size:8px; color:#66736b; }.contact-stack { display:flex; }.contact-stack span { width:22px;height:22px;border:2px solid white;border-radius:50%;background:#d7e8e3;color:#376a5d;display:grid;place-items:center;font-size:6px;font-weight:700;margin-left:-5px; }.contact-stack span:first-child { margin-left:0; }
.rep-hero { margin: -29px -31px 20px; padding: 36px 35px 43px; background: linear-gradient(120deg,#153934,#1c5648); color:white; display:flex; justify-content:space-between; align-items:center; position:relative; overflow:hidden; }.rep-hero::after { content:""; position:absolute; width:300px;height:300px;border:50px solid rgba(211,238,92,.06);border-radius:50%;right:80px;top:-140px; }.portal-pill { display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:20px;background:rgba(215,239,95,.13);color:#ddec73;font-size:8px;font-weight:700;letter-spacing:.8px; }.portal-pill svg { width:12px; }.rep-hero h1 { margin-top:13px;font-size:25px; }.rep-hero p { color:#b7cec7;font-size:11px;margin:6px 0 0; }.rep-hero .button { position:relative;z-index:1; }.rep-metrics { display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:-37px;position:relative;z-index:2;margin-bottom:15px; }.rep-metrics article { background:white;border:1px solid var(--line);border-radius:13px;padding:15px;display:flex;gap:11px;align-items:center;box-shadow:var(--shadow); }.metric-icon { width:38px;height:38px;border-radius:10px;display:grid;place-items:center; }.metric-icon.mint { background:#e5f3ed;color:#267457; }.metric-icon.sand { background:#fcf0dd;color:#a86f26; }.metric-icon.sky { background:#e6f0f6;color:#4c7690; }.metric-icon.lilac { background:#eee9f7;color:#735ca0; }.rep-metrics small,.rep-metrics strong,.rep-metrics em { display:block; }.rep-metrics small { color:#7c8780;font-size:8px; }.rep-metrics strong { font:700 15px "Manrope";margin-top:2px; }.rep-metrics em { font-style:normal;font-size:7px;color:#5e9b78;margin-top:3px; }.rep-grid { display:grid;grid-template-columns:1.2fr .8fr;gap:15px; }.rep-customers { padding:0 18px 12px; }.rep-customer { padding:12px 0;border-top:1px solid #edf0ed;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px; }.rep-customer > span { width:34px;height:34px;border-radius:9px;background:#edf4df;color:#637e33;display:grid;place-items:center;font-size:10px;font-weight:700; }.rep-customer strong,.rep-customer small { display:block; }.rep-customer strong { font-size:10px; }.rep-customer small { font-size:7px;color:#8a948e;margin-top:3px; }.rep-customer button { border:1px solid #dae0db;background:white;border-radius:7px;font-size:8px;font-weight:700;padding:6px 9px;cursor:pointer; }.earnings-card { overflow:hidden; }.earnings-total { margin:0 18px 14px;padding:17px;border-radius:12px;background:linear-gradient(130deg,#eff7f3,#f7faef); }.earnings-total span,.earnings-total strong,.earnings-total small { display:block; }.earnings-total span { font-size:8px;color:#708078; }.earnings-total strong { font:700 23px "Manrope";margin:4px 0; }.earnings-total small { font-size:7px;color:#87918b; }.earnings-bars { padding:0 20px;display:grid;gap:11px; }.earnings-bars > div { display:grid;grid-template-columns:48px 1fr 65px;gap:8px;align-items:center;font-size:8px; }.earnings-bars i { height:5px;border-radius:5px;background:#edf0ed;overflow:hidden; }.earnings-bars b { display:block;height:100%;border-radius:5px;background:#59a983; }.earnings-bars strong { font-size:8px;text-align:right; }.rule-note { display:flex;gap:7px;margin:17px 18px;background:#f5f6f4;border-radius:9px;padding:10px;color:#758078;font-size:7px;line-height:1.4; }.rule-note svg { width:13px;flex:none; }
.plan-status { background:#e7f4ed;color:#2f7558;border-radius:20px;padding:6px 10px;font-size:9px;font-weight:700; }.plan-status i { display:inline-block;width:6px;height:6px;border-radius:50%;background:#3a9c6e;margin-right:5px; }.roadmap-layout { display:grid;grid-template-columns:.7fr 1.3fr;gap:16px;align-items:start; }.roadmap-intro { padding:26px;position:sticky;top:85px;background:linear-gradient(145deg,#183c36,#1c5044);color:white; }.roadmap-intro h2 { font-size:21px;margin-top:14px; }.roadmap-intro > p { color:#aec6bf;font-size:10px;line-height:1.65; }.decision-list { display:grid;gap:9px;margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1); }.decision-list span { display:flex;align-items:center;gap:7px;font-size:9px;color:#d7e4e0; }.decision-list svg { width:14px;color:#dcec70; }.decision-list .pending { color:#96afa7; }.decision-list .pending svg { color:#bdc8c4; }.roadmap-phases { display:grid;gap:10px; }.roadmap-phases article { background:white;border:1px solid var(--line);border-radius:14px;padding:19px;display:grid;grid-template-columns:44px 1fr;gap:14px; }.phase-num { width:40px;height:40px;border-radius:11px;background:#e6f2ec;color:#297153;display:grid;place-items:center;font:700 12px "Manrope"; }.roadmap-phases small { font-size:7px;letter-spacing:.8px;color:#8b968f;font-weight:700; }.roadmap-phases h3 { font-size:14px;margin-top:4px; }.roadmap-phases p { color:#758078;font-size:9px;line-height:1.5;margin:5px 0 10px; }.phase-chips { display:flex;gap:6px; }.phase-chips span { background:#f0f3f0;color:#65716a;border-radius:20px;padding:4px 7px;font-size:7px;font-weight:600; }
.drawer-backdrop { position:fixed;inset:0;background:rgba(10,28,23,.42);z-index:90;opacity:0;visibility:hidden;transition:.22s;backdrop-filter:blur(2px); }.drawer-backdrop.open { opacity:1;visibility:visible; }.order-drawer { position:absolute;right:0;top:0;height:100%;width:min(610px,95vw);background:#f6f8f5;box-shadow:-20px 0 60px rgba(12,37,29,.2);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .28s cubic-bezier(.2,.8,.2,1); }.drawer-backdrop.open .order-drawer { transform:none; }.drawer-header { background:white;border-bottom:1px solid var(--line);padding:20px 22px;display:flex;justify-content:space-between;align-items:flex-start;gap:16px; }.drawer-title-row { display:flex;align-items:center;gap:9px; }.drawer-title-row h2 { font-size:19px; }.drawer-header p { margin:5px 0 0;color:#7d8881;font-size:9px; }.drawer-header-actions { display:flex;gap:7px; }.drawer-body { padding:17px 20px 25px;overflow-y:auto;display:grid;gap:12px; }.drawer-section { background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden; }.drawer-section-head { padding:13px 15px 10px;display:flex;justify-content:space-between;align-items:center; }.drawer-section-head h3 { font-size:11px; }.drawer-section-head span { color:#89938d;font-size:8px; }.placed-by-card { padding:0 15px 15px;display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center; }.placed-avatar { width:38px;height:38px;border-radius:10px;background:#dcefe7;color:#2d7257;display:grid;place-items:center;font-size:10px;font-weight:800; }.placed-by-card strong,.placed-by-card span,.placed-by-card small { display:block; }.placed-by-card strong { font-size:10px; }.placed-by-card span { color:#738078;font-size:8px;margin-top:2px; }.placed-by-card small { color:#87938b;font-size:7px;margin-top:3px; }.source-pill { border-radius:20px;padding:5px 8px;background:#eef3ef;color:#5d6b63;font-size:7px !important;font-weight:700;white-space:nowrap; }.next-action { padding:13px 14px;display:flex;gap:10px;align-items:center;background:#fff8eb;border:1px solid #f0deba;border-radius:11px;color:#81591e; }.next-action > i { width:31px;height:31px;border-radius:9px;background:#fae7c2;display:grid;place-items:center;flex:none; }.next-action svg { width:16px; }.next-action strong,.next-action span { display:block; }.next-action strong { font-size:9px; }.next-action span { color:#9a7a4c;font-size:8px;margin-top:2px; }.status-track { padding:5px 17px 17px;display:grid;grid-template-columns:repeat(4,1fr); }.track-step { position:relative;padding-top:24px;text-align:center;color:#9aa39d;font-size:7px; }.track-step::before { content:"";position:absolute;top:9px;left:50%;right:-50%;height:2px;background:#e3e7e4; }.track-step:last-child::before { display:none; }.track-step i { position:absolute;top:4px;left:50%;margin-left:-6px;width:12px;height:12px;border-radius:50%;background:white;border:2px solid #d8dfda;z-index:1; }.track-step.done,.track-step.current { color:#2e6d53;font-weight:700; }.track-step.done::before { background:#5aa27f; }.track-step.done i,.track-step.current i { background:#3b8b68;border-color:#3b8b68;box-shadow:0 0 0 3px #e2f0e9; }.track-step.current i { background:#fff;border-width:3px; }.order-items { padding:0 15px; }.order-item { display:grid;grid-template-columns:43px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-top:1px solid #edf0ed; }.order-item:first-child { border-top:0; }.order-item .product-art { width:40px;height:40px; }.order-item strong,.order-item span,.order-item small { display:block; }.order-item strong { font-size:9px; }.order-item span { color:#7b8780;font-size:8px;margin-top:3px; }.order-item small { color:#9aa29d;font-size:7px;margin-top:3px; }.item-price { text-align:right; }.item-price strong { font-size:9px; }.item-price span { font-size:7px; }.order-totals { border-top:1px solid #e6eae7;margin:0 15px;padding:12px 0 14px;display:grid;gap:7px; }.total-row { display:flex;justify-content:space-between;color:#69766e;font-size:8px; }.total-row.grand { border-top:1px solid #e8ece9;padding-top:9px;margin-top:2px;color:var(--ink);font-weight:800;font-size:11px; }.detail-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px; }.detail-block { padding:0 15px 14px; }.detail-block strong,.detail-block span { display:block; }.detail-block strong { font-size:9px; }.detail-block span { color:#77837c;font-size:8px;line-height:1.5;margin-top:4px; }.contact-chip { display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid #edf0ed; }.contact-chip > i { width:26px;height:26px;border-radius:7px;background:#e8f2ee;color:#3b775f;display:grid;place-items:center;font-style:normal;font-size:7px;font-weight:800; }.contact-chip strong { font-size:8px; }.contact-chip span { font-size:7px;margin-top:2px; }.activity-list { padding:0 15px 14px; }.activity { display:grid;grid-template-columns:18px 1fr auto;gap:8px;position:relative;padding:8px 0; }.activity:not(:last-child)::after { content:"";position:absolute;left:8px;top:25px;bottom:-7px;width:1px;background:#dfe5e1; }.activity > i { width:17px;height:17px;border-radius:50%;background:#e5f2eb;color:#39795d;display:grid;place-items:center;z-index:1; }.activity > i svg { width:9px; }.activity strong,.activity span { display:block; }.activity strong { font-size:8px; }.activity span { color:#7d8881;font-size:7px;margin-top:2px; }.activity time { color:#9ba49e;font-size:7px;white-space:nowrap; }.drawer-footer { background:white;border-top:1px solid var(--line);padding:12px 18px;display:flex;justify-content:space-between;gap:9px; }.drawer-footer .button:last-child { margin-left:auto; }
.modal-backdrop { position:fixed;inset:0;background:rgba(12,29,25,.56);z-index:100;display:grid;place-items:center;padding:20px;opacity:0;visibility:hidden;transition:.2s;backdrop-filter:blur(4px); }.modal-backdrop.open { opacity:1;visibility:visible; }.product-modal { width:min(860px,96vw);max-height:92vh;background:white;border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.3);display:flex;flex-direction:column;transform:translateY(12px) scale(.99);transition:.22s;overflow:hidden; }.modal-backdrop.open .product-modal { transform:none; }.product-modal > header { padding:18px 22px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center; }.modal-kicker { display:block;font-size:7px;color:#819088;letter-spacing:1.2px;font-weight:700;margin-bottom:4px; }.product-modal h2 { font-size:17px; }.modal-close { width:32px;height:32px;border:1px solid var(--line);background:white;border-radius:8px;display:grid;place-items:center;cursor:pointer; }.wizard-steps { padding:14px 28px;background:#f8faf8;display:flex;align-items:center;border-bottom:1px solid var(--line); }.wizard-step { display:flex;align-items:center;gap:8px;opacity:.48; }.wizard-step.active,.wizard-step.done { opacity:1; }.wizard-step > span { width:25px;height:25px;border:1px solid #cbd3ce;border-radius:50%;display:grid;place-items:center;font-size:9px;font-weight:700;background:white; }.wizard-step.active > span { background:var(--green);border-color:var(--green);color:white; }.wizard-step.done > span { background:#e4f2eb;border-color:#cce4d6;color:var(--green); }.wizard-step strong,.wizard-step small { display:block;white-space:nowrap; }.wizard-step strong { font-size:9px; }.wizard-step small { font-size:7px;color:#8a958e;margin-top:2px; }.wizard-steps > i { height:1px;flex:1;background:#dfe4e0;margin:0 14px; }.wizard-body { overflow-y:auto;min-height:410px; }.wizard-page { display:none;padding:24px 28px; }.wizard-page.active { display:block;animation:fade .18s ease; }.field-label { display:block;font-size:9px;font-weight:700;margin:0 0 6px;color:#4c5a52; }.text-input { width:100%;height:38px;border:1px solid #dbe1dc;border-radius:8px;padding:0 11px;font-size:10px;outline:0; }.text-input:focus,.money-input:focus-within { border-color:#72ae93;box-shadow:0 0 0 3px rgba(40,126,91,.1); }.type-label { margin-top:18px; }.type-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }.type-card { border:1px solid #dce2dd;border-radius:12px;background:white;text-align:left;padding:14px;cursor:pointer;position:relative; }.type-card:hover { border-color:#9bbbab; }.type-card.active { border:2px solid var(--green);padding:13px;background:#fbfdfb; }.type-card > svg { position:absolute;right:10px;top:10px;width:16px;height:16px;color:var(--green);opacity:0; }.type-card.active > svg { opacity:1; }.type-icon { width:34px;height:34px;border-radius:9px;display:grid;place-items:center;margin-bottom:10px; }.type-card strong { display:block;font-size:10px; }.type-card p { font-size:8px;color:#7d8881;line-height:1.5;margin:4px 0 0; }.currency-prices { display:grid;grid-template-columns:1fr 1fr 1fr;gap:11px;margin-top:18px; }.money-input { height:38px;border:1px solid #dbe1dc;border-radius:8px;display:flex;align-items:center;overflow:hidden; }.money-input span { align-self:stretch;padding:0 9px;background:#f4f6f3;color:#707c74;font-size:9px;display:flex;align-items:center;border-right:1px solid #dbe1dc; }.money-input input { border:0;outline:0;width:100%;padding:0 9px;font-size:10px; }.step-copy { display:flex;justify-content:space-between;gap:20px;align-items:start;margin-bottom:18px; }.step-copy h3 { font-size:15px; }.step-copy p { font-size:9px;color:#7c8880;margin:4px 0 0; }.option-builder { display:grid;gap:10px; }.option-group { border:1px solid #dfe4df;border-radius:11px;overflow:hidden; }.option-group header { padding:10px 12px;background:#f8f9f7;display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:8px;border-bottom:1px solid #e7eae7; }.drag { color:#a1aaa4; }.drag svg { width:15px; }.option-group header small,.option-group header strong { display:block; }.option-group header small { font-size:6px;color:#959e98;letter-spacing:.8px; }.option-group header strong { font-size:10px;margin-top:2px; }.option-values { padding:12px;display:flex;flex-wrap:wrap;gap:7px; }.option-values > span { border:1px solid #dce2dd;background:#fbfcfb;border-radius:7px;padding:7px 8px;font-size:9px;display:flex;align-items:center;gap:6px; }.option-values > span button { border:0;background:none;color:#97a099;cursor:pointer;padding:0; }.add-value { border:1px dashed #9cb7a9;background:#f5faf7;color:var(--green);border-radius:7px;padding:7px 9px;font-size:8px;font-weight:700;cursor:pointer; }.swatch { width:9px;height:9px;border-radius:50%;display:inline-block; }.swatch.blue { background:#4f8fb3; }.swatch.green { background:#55a67e; }.builder-tip { display:flex;gap:10px;background:#edf6f1;color:#3e6555;padding:12px;border-radius:10px;margin-top:14px; }.builder-tip > svg { width:17px;color:var(--green); }.builder-tip strong { display:block;font-size:9px; }.builder-tip p { margin:3px 0 0;font-size:8px;color:#6b8277; }.select-actions { display:flex;gap:6px; }.select-actions button { border:1px solid #dce2dd;background:white;border-radius:7px;padding:6px 9px;font-size:8px;font-weight:700;cursor:pointer; }.variant-table { border:1px solid #dfe4df;border-radius:10px;overflow:hidden; }.variant-head,.variant-row { display:grid;grid-template-columns:28px 1.25fr 1fr .8fr .8fr .6fr;align-items:center;gap:8px;padding:8px 10px; }.variant-head { background:#f6f8f5;border-bottom:1px solid #dfe4df;text-transform:uppercase;color:#89948d;font-size:7px;letter-spacing:.5px;font-weight:700; }.variant-row { border-bottom:1px solid #edf0ed;font-size:8px; }.variant-row:last-child { border-bottom:0; }.variant-row:not(.selected) { opacity:.45;background:#fafbfa; }.variant-row input[type="checkbox"] { accent-color:var(--green); }.variant-row > input:not([type="checkbox"]) { height:27px;border:1px solid #dfe3df;border-radius:6px;padding:0 6px;font-size:8px;min-width:0;width:100%; }.variant-name { display:flex;align-items:center;gap:6px;font-weight:700; }.variant-name i { width:8px;height:8px;border-radius:50%; }.variant-name i.blue { background:#4f8fb3; }.variant-name i.green { background:#55a67e; }.selection-summary { margin-top:12px;display:flex;justify-content:space-between;background:#f2f7f4;border-radius:8px;padding:9px 11px;font-size:8px;color:#708078; }.selection-summary > span:first-child { display:flex;align-items:center;gap:5px;color:var(--green); }.selection-summary svg { width:13px; }.product-modal > footer { padding:13px 20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;background:#fbfcfb; }.footer-actions { display:flex;align-items:center;gap:13px; }.footer-actions > span { display:flex;align-items:center;gap:4px;color:#7b8880;font-size:8px; }.footer-actions > span svg { width:12px;color:var(--green); }.toast { position:fixed;right:24px;bottom:24px;background:#183a33;color:white;border-radius:12px;padding:12px 16px;display:flex;align-items:center;gap:10px;box-shadow:0 15px 35px rgba(0,0,0,.22);z-index:150;transform:translateY(25px);opacity:0;pointer-events:none;transition:.25s; }.toast.show { transform:none;opacity:1; }.toast > svg { width:27px;height:27px;padding:6px;border-radius:50%;background:#e0f15b;color:#163b33; }.toast strong,.toast span { display:block; }.toast strong { font-size:10px; }.toast span { font-size:8px;color:#a9c2ba;margin-top:2px; }
.order-create-backdrop { z-index:110; }.order-create-modal { width:min(1080px,97vw);max-height:94vh;background:white;border-radius:18px;box-shadow:0 30px 90px rgba(0,0,0,.3);display:flex;flex-direction:column;overflow:hidden;transform:translateY(12px) scale(.99);transition:.22s; }.order-create-backdrop.open .order-create-modal { transform:none; }.create-order-header { padding:17px 22px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center; }.create-order-header h2 { font-size:18px; }.create-order-steps { background:#f7f9f7;border-bottom:1px solid var(--line);padding:13px 30px;display:flex;align-items:center;justify-content:center; }.create-step { display:flex;align-items:center;gap:8px;opacity:.45; }.create-step.active,.create-step.done { opacity:1; }.create-step > span { width:25px;height:25px;border:1px solid #cbd3ce;border-radius:50%;background:white;display:grid;place-items:center;font-size:9px;font-weight:800; }.create-step.active > span { color:white;background:var(--green);border-color:var(--green); }.create-step.done > span { color:var(--green);background:#e4f2eb;border-color:#cce4d6; }.create-step strong,.create-step small { display:block;white-space:nowrap; }.create-step strong { font-size:9px; }.create-step small { font-size:7px;color:#8b968f;margin-top:2px; }.create-order-steps > i { width:95px;height:1px;background:#dce2dd;margin:0 18px; }.create-order-body { min-height:520px;overflow-y:auto;background:#f7f8f6; }.create-order-page { display:none;padding:24px 28px; }.create-order-page.active { display:block;animation:fade .18s ease; }.product-order-page { padding:0; }.order-step-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:17px; }.order-step-heading h3 { font-size:16px; }.order-step-heading p { font-size:9px;color:#7c8780;margin:4px 0 0; }.customer-search { width:100%;height:39px;border:1px solid #dce2dd;background:white;border-radius:9px;padding:0 11px;display:flex;align-items:center;gap:8px;color:#8b958f;margin-bottom:12px; }.customer-search svg { width:15px; }.customer-search input { border:0;outline:0;background:transparent;width:100%;font-size:10px; }.customer-select-list { display:grid;grid-template-columns:1fr 1fr;gap:10px; }.customer-select-card { border:1px solid #dce2dd;background:white;border-radius:12px;padding:14px;display:grid;grid-template-columns:40px 1fr 24px;align-items:center;gap:11px;text-align:left;cursor:pointer;transition:.16s; }.customer-select-card:hover { border-color:#9cbbaa;transform:translateY(-1px); }.customer-select-card.selected { border:2px solid var(--green);padding:13px;background:#fbfdfb;box-shadow:0 4px 12px rgba(33,105,75,.08); }.customer-select-avatar { width:40px;height:40px;border-radius:10px;background:#eaf2dd;color:#58782d;display:grid;place-items:center;font-size:10px;font-weight:800;flex:none; }.customer-select-avatar.blue-bg { background:#e4eff5;color:#4e7488; }.customer-select-avatar.coral-bg { background:#f8e5de;color:#a25f4d; }.customer-select-avatar.lilac-bg { background:#eee8f8;color:#755da1; }.customer-select-card strong,.customer-select-card small,.customer-select-card em { display:block; }.customer-select-card strong { font-size:10px; }.customer-select-card small { color:#7f8a83;font-size:8px;margin-top:3px; }.customer-select-card em { color:#5e6b63;font-size:7px;font-style:normal;margin-top:7px;display:flex;gap:4px;align-items:center; }.customer-select-card em svg { width:11px; }.selected-check { width:20px;height:20px;border-radius:50%;background:#e4f1ea;color:var(--green);display:grid;place-items:center;opacity:0; }.selected-check svg { width:12px; }.customer-select-card.selected .selected-check { opacity:1; }.selected-customer-strip { padding:11px 18px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px; }.selected-customer-strip .customer-select-avatar { width:34px;height:34px;border-radius:8px; }.selected-customer-strip small,.selected-customer-strip strong,.selected-customer-strip em { display:block; }.selected-customer-strip small { color:#8c9690;font-size:6px;letter-spacing:.7px;font-weight:700; }.selected-customer-strip strong { font-size:9px; }.selected-customer-strip em { font-style:normal;color:#7f8a83;font-size:7px;margin-top:2px; }.selected-customer-strip > button { border:0;background:transparent;color:var(--green);font-size:8px;font-weight:700;cursor:pointer;margin-left:5px; }.order-currency { margin-left:auto;background:#f2f4f1;border-radius:8px;padding:3px;display:flex;align-items:center;gap:2px; }.order-currency > span { color:#87918b;font-size:7px;padding:0 6px; }.order-currency button { border:0;background:transparent;border-radius:6px;padding:5px 8px;font-size:8px;cursor:pointer; }.order-currency button.active { background:white;color:var(--green);font-weight:800;box-shadow:0 1px 4px rgba(0,0,0,.08); }.order-product-layout { display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);min-height:465px; }.product-picker { padding:17px 18px 20px;border-right:1px solid var(--line); }.order-product-heading { display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px; }.order-product-heading h3 { font-size:14px; }.order-product-heading p { margin:3px 0 0;color:#818b85;font-size:8px; }.order-product-heading > span { color:#7f8983;font-size:8px;background:#ecefec;border-radius:20px;padding:5px 8px; }.product-picker-tools { display:flex;gap:8px;margin-bottom:10px; }.product-picker-tools > label { height:35px;flex:1;border:1px solid #dce2dd;background:white;border-radius:8px;display:flex;align-items:center;gap:7px;padding:0 9px;color:#8b958f; }.product-picker-tools label svg { width:14px; }.product-picker-tools input { width:100%;border:0;outline:0;background:transparent;font-size:9px; }.product-type-tabs { background:#ecefeb;border-radius:8px;padding:3px;display:flex; }.product-type-tabs button { border:0;background:transparent;border-radius:6px;padding:5px 8px;font-size:7px;cursor:pointer;color:#727e76; }.product-type-tabs button.active { background:white;color:var(--green);font-weight:800;box-shadow:0 1px 4px rgba(0,0,0,.07); }.order-product-results { display:grid;gap:7px; }.order-product-card { background:white;border:1px solid #e0e4e1;border-radius:10px;padding:9px;display:grid;grid-template-columns:42px minmax(120px,1fr) minmax(120px,.9fr) 75px 56px;gap:9px;align-items:center;transition:.15s; }.order-product-card:hover { border-color:#b5cbbf;box-shadow:0 4px 12px rgba(30,74,55,.05); }.order-product-card .product-art { width:40px;height:40px; }.order-product-info strong,.order-product-info span { display:block; }.order-product-info strong { font-size:9px; }.order-product-info span { color:#8a948e;font-size:7px;margin-top:3px; }.order-variant-select label { display:block;color:#8c9690;font-size:6px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px; }.order-variant-select select { width:100%;height:30px;border:1px solid #dce2dd;border-radius:7px;background:white;padding:0 7px;font-size:8px;outline:0; }.order-product-price small,.order-product-price strong { display:block; }.order-product-price small { color:#909a94;font-size:6px; }.order-product-price strong { font-size:9px;margin-top:3px; }.quick-add { height:30px;border:0;background:#e3f1ea;color:var(--green);border-radius:7px;font-size:8px;font-weight:800;cursor:pointer; }.quick-add:hover { background:var(--green);color:white; }.order-cart { background:#f2f5f2;padding:16px;display:flex;flex-direction:column; }.order-cart-head { display:flex;justify-content:space-between;align-items:center;padding-bottom:11px;border-bottom:1px solid #dde3de; }.order-cart-head > div { display:flex;align-items:baseline;gap:6px; }.order-cart-head h3 { font-size:13px; }.order-cart-head span { color:#8a958e;font-size:7px; }.order-cart-head button { border:0;background:transparent;color:#8a958e;font-size:7px;cursor:pointer; }.order-cart-empty { text-align:center;margin:auto;padding:30px 20px;color:#7f8a83; }.order-cart-empty > span { width:42px;height:42px;border-radius:12px;background:white;color:#91a099;display:grid;place-items:center;margin:0 auto 10px; }.order-cart-empty strong { display:block;color:#536159;font-size:9px; }.order-cart-empty p { font-size:7px;line-height:1.5;max-width:180px;margin:4px auto 0; }.order-cart-empty.hidden { display:none; }.order-cart-items { display:grid;gap:7px;padding:10px 0;max-height:270px;overflow-y:auto; }.order-cart-item { background:white;border:1px solid #e0e4e1;border-radius:9px;padding:9px;display:grid;grid-template-columns:1fr auto;gap:8px; }.order-cart-item strong,.order-cart-item span { display:block; }.order-cart-item strong { font-size:8px; }.order-cart-item span { color:#849088;font-size:7px;margin-top:3px; }.order-cart-item > button { border:0;background:transparent;color:#a1a9a4;cursor:pointer;padding:0;align-self:start; }.cart-item-bottom { grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #eef0ee;padding-top:7px; }.quantity-control { display:flex;align-items:center;border:1px solid #dce2dd;border-radius:7px;overflow:hidden; }.quantity-control button { width:25px;height:24px;border:0;background:#f7f9f7;cursor:pointer;color:#536159; }.quantity-control span { width:27px;text-align:center;margin:0;color:var(--ink);font-size:8px; }.cart-item-bottom > strong { font-size:9px; }.order-cart-totals { margin-top:auto;border-top:1px solid #dce2dd;padding-top:10px;display:none;gap:6px; }.order-cart-totals.visible { display:grid; }.order-cart-totals > div { display:flex;justify-content:space-between;color:#6d7971;font-size:8px; }.order-cart-totals .cart-grand { padding-top:9px;margin-top:3px;border-top:1px solid #dce2dd;color:var(--ink);font-size:11px;font-weight:800; }.review-ready { display:inline-flex;align-items:center;gap:5px;color:#2e7658;background:#e5f2eb;border-radius:20px;padding:6px 9px;font-size:8px;font-weight:700; }.review-ready svg { width:12px; }.order-review-grid { display:grid;grid-template-columns:1.3fr .7fr;gap:12px; }.review-main { display:grid;gap:10px; }.review-card { background:white;border:1px solid var(--line);border-radius:11px;overflow:hidden; }.review-card > header { padding:11px 13px;border-bottom:1px solid #edf0ed;display:flex;justify-content:space-between;align-items:center; }.review-card h4 { margin:0;font:700 10px "Manrope"; }.review-card header button { border:0;background:transparent;color:var(--green);font-size:8px;font-weight:700;cursor:pointer; }.review-customer-content { padding:12px;display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center; }.review-customer-content .customer-select-avatar { width:36px;height:36px;border-radius:9px; }.review-customer-content strong,.review-customer-content span,.review-customer-content small { display:block; }.review-customer-content strong { font-size:9px; }.review-customer-content span { font-size:7px;color:#77837c;margin-top:3px; }.review-customer-content small { font-size:7px;color:#909a94;margin-top:3px; }.review-customer-content > em { font-style:normal;font-size:7px;background:#edf3ef;color:#53695e;padding:5px 7px;border-radius:20px; }.review-items { padding:0 12px; }.review-item { padding:10px 0;border-top:1px solid #edf0ed;display:grid;grid-template-columns:1fr auto;gap:10px; }.review-item:first-child { border-top:0; }.review-item strong,.review-item span { display:block; }.review-item strong { font-size:8px; }.review-item span { color:#859088;font-size:7px;margin-top:3px; }.review-item > b { font-size:8px; }.review-card textarea { width:100%;height:65px;border:0;resize:none;padding:11px 13px;outline:0;font-size:9px; }.review-sidebar { display:grid;gap:10px;align-content:start; }.review-sidebar .review-card { padding-bottom:11px; }.review-sidebar label { display:block;font-size:7px;color:#68756d;font-weight:700;margin:10px 12px 0; }.review-sidebar input,.review-sidebar select { width:100%;height:32px;border:1px solid #dce2dd;border-radius:7px;background:white;margin-top:4px;padding:0 8px;font-size:8px;outline:0; }.review-total-card { background:linear-gradient(135deg,#183d36,#1f594a);color:white;border-radius:11px;padding:15px; }.review-total-card > span { color:#a9c2ba;font-size:7px; }.review-total-card > strong { display:block;font:700 21px "Manrope";margin:4px 0 12px; }.review-total-card > small { color:#a9c2ba;font-size:7px; }.review-total-card > div { border-top:1px solid rgba(255,255,255,.1);padding-top:8px;margin-top:9px;display:flex;justify-content:space-between;font-size:7px;color:#b7cbc4; }.review-total-card b { color:white; }.create-order-footer { padding:12px 18px;border-top:1px solid var(--line);background:white;display:flex;justify-content:space-between;align-items:center; }.create-order-footer > div { display:flex;align-items:center;gap:13px; }.create-order-footer > div > span { display:flex;align-items:center;gap:4px;color:#7e8982;font-size:7px; }.create-order-footer > div > span svg { width:11px;color:var(--green); }
.order-create-backdrop { z-index:var(--layer-order-modal); }
.modal-backdrop.nested-modal { z-index:var(--layer-nested-modal); }
.customer-select-card[hidden] { display:none; }
.order-relationship-toolbar,.order-customer-context { display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:12px;margin-bottom:12px; }
.order-customer-context[hidden] { display:none; }
.order-relationship-field { display:grid;gap:6px;font-size:12px;font-weight:750; }
.order-relationship-field select { width:100%;height:44px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font-size:14px;outline:0; }
.order-relationship-field small { font-size:11px;line-height:1.4;font-weight:500; }
.order-selection-summary,.order-billing-preview { min-height:72px;border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;align-items:center;gap:11px; }
.order-selection-icon { width:38px;height:38px;border-radius:10px;display:grid;place-items:center;flex:none; }
.order-selection-icon svg { width:18px; }
.order-selection-summary strong,.order-selection-summary small,.order-billing-preview small,.order-billing-preview strong { display:block; }
.order-selection-summary strong,.order-billing-preview strong { font-size:14px; }
.order-selection-summary small,.order-billing-preview small,.order-billing-preview p { font-size:12px;line-height:1.4;margin:3px 0 0; }
.order-billing-preview > div { min-width:0;flex:1; }
.order-billing-preview > b { align-self:flex-start;white-space:nowrap;font-size:12px;font-weight:700;padding:5px 8px;border-radius:999px; }
.order-customer-form { display:grid;grid-template-columns:minmax(260px,.72fr) minmax(340px,1.28fr);gap:14px;align-items:start;margin-bottom:14px; }
.customer-combobox { position:relative; }
.customer-picker-input { height:44px;border:1px solid var(--line);border-radius:10px;padding:0 12px;display:flex;align-items:center;gap:9px; }
.customer-picker-input[hidden] { display:none; }
.customer-picker-input svg { width:17px;color:var(--icon-muted); }
.customer-picker-input input { width:100%;border:0;outline:0;background:transparent;color:var(--ink);font-size:14px; }
.customer-select-list.custom-select-menu { position:absolute;top:72px;left:0;right:0;z-index:8;display:grid;grid-template-columns:1fr;gap:0;max-height:310px;overflow-y:auto;border:1px solid var(--line);border-radius:11px;padding:5px; }
.customer-select-list.custom-select-menu[hidden],.custom-select-menu[hidden] { display:none; }
.customer-select-list .customer-select-card { width:100%;border:0;border-bottom:1px solid var(--line);border-radius:7px;padding:10px;grid-template-columns:38px 1fr 22px;box-shadow:none;transform:none; }
.customer-select-list .customer-select-card:last-child { border-bottom:0; }
.customer-select-list .customer-select-card:hover { transform:none; }
.customer-select-list .customer-select-avatar { width:38px;height:38px;font-size:12px; }
.customer-select-list .customer-select-card strong { font-size:14px; }
.customer-select-list .customer-select-card small,.customer-select-list .customer-select-card em { font-size:11px;margin-top:2px; }
.selected-order-customer { min-height:64px;border:1px solid var(--line);border-radius:11px;padding:10px 11px;display:grid;grid-template-columns:40px 1fr 34px;align-items:center;gap:10px; }
.selected-order-customer[hidden] { display:none; }
.selected-order-customer .customer-select-avatar { width:40px;height:40px;font-size:12px; }
.selected-order-customer strong,.selected-order-customer small { display:block; }
.selected-order-customer strong { font-size:15px; }
.selected-order-customer small { font-size:12px;line-height:1.35;margin-top:3px; }
.selected-order-customer > button { width:32px;height:32px;border:1px solid var(--line);border-radius:8px;background:var(--control-bg);color:var(--green);display:grid;place-items:center;cursor:pointer; }
.selected-order-customer > button svg { width:15px; }
.order-customer-context { grid-template-columns:minmax(260px,.72fr) minmax(340px,1.28fr); }
.custom-contact-select { position:relative; }
.custom-contact-select > button,.order-variant-select > button { width:100%;height:44px;border:1px solid var(--line);border-radius:10px;padding:0 11px;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;cursor:pointer; }
.custom-contact-select > button svg,.order-variant-select > button svg { width:15px;flex:none;color:var(--icon-muted); }
.contact-select-menu { position:absolute;z-index:8;top:49px;left:0;right:0;border:1px solid var(--line);border-radius:10px;padding:5px;max-height:240px;overflow-y:auto; }
.contact-select-menu button,.variant-select-menu button { width:100%;border:0;border-bottom:1px solid var(--line);padding:9px;display:flex;align-items:center;justify-content:space-between;gap:9px;text-align:left;cursor:pointer; }
.contact-select-menu button:last-child,.variant-select-menu button:last-child { border-bottom:0; }
.contact-select-menu strong,.contact-select-menu small { display:block; }
.contact-select-menu strong { font-size:13px; }
.contact-select-menu small { font-size:11px;margin-top:2px; }
.contact-select-menu em { font-style:normal;font-size:10px;padding:3px 6px;border-radius:999px;background:var(--green-soft);color:var(--green);margin-left:auto; }
.contact-select-menu svg,.variant-select-menu svg { width:14px;color:var(--green);flex:none; }
.custom-select-empty { display:block;padding:11px;color:var(--muted);font-size:12px; }
.order-product-layout { grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr); }
.product-picker { padding:14px 14px 17px; }
.product-picker-tools { align-items:flex-start; }
.product-type-tabs { flex-wrap:wrap;justify-content:flex-end;max-width:310px; }
.order-product-results { gap:6px; }
.order-product-card { padding:8px;grid-template-columns:38px minmax(110px,.82fr) minmax(145px,1.18fr) 82px 52px;gap:7px; }
.order-product-card .product-art { width:36px;height:36px;border:1px solid var(--line);border-radius:9px; }
.order-product-card .product-art.has-image img { object-fit:contain;padding:3px; }
.order-product-info strong { font-size:12px;line-height:1.25; }
.order-product-info span { font-size:10px; }
.order-product-info em { display:block;color:var(--green);font-size:10px;font-style:normal;font-weight:700;margin-top:3px; }
.order-variant-select { position:relative;min-width:0; }
.order-variant-select > button { height:34px;border-radius:8px;font-size:11px; }
.order-variant-select > button span { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.variant-select-menu { position:absolute;top:52px;left:0;right:0;min-width:230px;z-index:9;border:1px solid var(--line);border-radius:10px;padding:5px;max-height:245px;overflow-y:auto; }
.variant-select-menu strong,.variant-select-menu small { display:block; }
.variant-select-menu strong { font-size:12px; }
.variant-select-menu small { font-size:10px;margin-top:2px; }
.order-product-price small,.order-product-price strong,.order-product-price em { display:block; }
.order-product-price strong { font-size:12px; }
.order-product-price em { color:var(--muted);font-size:9px;font-style:normal;line-height:1.25;margin-top:2px; }
.quick-add { height:32px;font-size:12px; }
.order-cart { padding:13px; }
.order-cart-items { gap:6px;padding:8px 0;max-height:460px; }
.order-cart-item { padding:8px;grid-template-columns:minmax(0,1fr) 24px;gap:5px 7px; }
.cart-item-identity strong { font-size:12px;line-height:1.25; }
.cart-item-identity span { font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.cart-remove { width:24px;height:24px;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:16px; }
.cart-line-values { grid-column:1/-1;display:grid;grid-template-columns:minmax(185px,1.25fr) 82px minmax(95px,.75fr);gap:9px;align-items:start;padding-top:7px;border-top:1px solid var(--line); }
.order-cart-item .cart-field-head { height:18px;display:flex;align-items:center;justify-content:space-between;gap:6px;margin:0 0 3px; }
.cart-field-head b { color:var(--muted);font-size:11px;line-height:1;font-weight:700; }
.cart-selling-price .cart-field-head b { color:var(--ink);font-size:12px;font-weight:800; }
.cart-field-head em { color:var(--muted);font-size:10px;line-height:1;font-style:normal;font-weight:600;white-space:nowrap; }
.order-cart-item .cart-selling-input { width:100%;min-width:185px;height:32px;border:1px solid var(--line);border-radius:7px;display:flex;align-items:center;overflow:hidden;margin-top:0; }
.cart-selling-price small { height:100%;padding:0 8px;display:grid;place-items:center;border-right:1px solid var(--line);font-size:11px;color:var(--muted); }
.cart-selling-price input { flex:1;width:0;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--ink);padding:0 8px;font-size:13px;font-weight:750;text-align:left; }
.order-cart-item .cart-last-price { display:block;color:var(--muted);font-size:10px;line-height:1.25;font-weight:600;margin-top:4px;white-space:nowrap; }
.cart-quantity .quantity-control { height:30px; }
.cart-quantity .quantity-control button { width:23px;height:28px; }
.cart-quantity .quantity-control span { width:24px;font-size:11px; }
.cart-line-total { text-align:right; }
.cart-line-total .cart-field-head { justify-content:flex-end; }
.cart-line-total strong { height:30px;display:flex;align-items:center;justify-content:flex-end;font-size:12px;white-space:nowrap; }
.cart-quote { color:var(--amber);font-size:11px;font-weight:750;align-self:center; }
.order-cart-totals { padding-top:8px; }
.drawer-body { grid-auto-rows:max-content;align-content:start; }
@media (max-width: 1100px) { .metrics-grid,.rep-metrics { grid-template-columns:repeat(2,1fr); }.dashboard-grid { grid-template-columns:1fr; }.attention-panel { grid-column:1;grid-row:auto; }.recent-orders { grid-column:1; }.customer-grid { grid-template-columns:repeat(2,1fr); }.variant-banner { grid-template-columns:125px 1fr; }.variant-banner .button { display:none; }.roadmap-layout { grid-template-columns:1fr; }.roadmap-intro { position:static; }.rep-grid { grid-template-columns:1fr; } }
@media (max-width: 760px) { .sidebar { transform:translateX(-100%);transition:.25s; }.sidebar.open { transform:none; }.main { width:100%;margin-left:0; }.topbar { padding:0 15px; }.mobile-menu { display:grid; }.page-heading { display:none; }.global-search { width:190px; }.help-button span { display:none; }.content { padding:20px 15px 40px; }.welcome-row,.section-head { align-items:flex-start;flex-direction:column; }.metrics-grid,.rep-metrics,.customer-grid { grid-template-columns:1fr; }.flow-rail { grid-template-columns:1fr 1fr;gap:12px; }.flow-line { display:none; }.variant-banner { grid-template-columns:90px 1fr;padding-right:15px; }.banner-visual { height:140px; }.variant-banner h2 { font-size:14px; }.catalog-summary { flex-wrap:wrap;gap:12px; }.currency-switch { margin-left:0; }.product-row { grid-template-columns:1.6fr .7fr .8fr 24px; }.product-row .hide-mobile { display:none; }.relationship-map { grid-template-columns:1fr;padding:18px; }.entity-map { margin-top:20px; }.rep-hero { margin:-20px -15px 20px;padding:28px 20px 52px;align-items:flex-start;gap:18px;flex-direction:column; }.type-grid,.currency-prices { grid-template-columns:1fr; }.wizard-step small { display:none; }.wizard-step strong { font-size:8px; }.wizard-steps { padding:12px 15px; }.wizard-page { padding:19px 16px; }.variant-head,.variant-row { grid-template-columns:23px 1.2fr 1fr .7fr; }.variant-head > :nth-child(5),.variant-head > :nth-child(6),.variant-row > :nth-child(5),.variant-row > :nth-child(6) { display:none; }.selection-summary { flex-direction:column;gap:5px; }.modal-backdrop { padding:8px; }.product-modal { max-height:96vh; }.global-search kbd { display:none; }.order-drawer { width:100%; }.drawer-header { padding:16px; }.drawer-body { padding:12px; }.detail-grid { grid-template-columns:1fr; }.drawer-footer { flex-wrap:wrap; }.drawer-footer .button { flex:1; }.drawer-footer .button:last-child { margin-left:0; }.theme-toggle { display:none; } }

.hidden { display:none !important; }

/* Canonical order workflow */
.status.rfq { color:#a44d46;background:var(--red-soft); }
.status.pre_order { color:#946019;background:var(--amber-soft); }
.status.order { color:#356ca8;background:var(--blue-soft); }
.status.in_shipping { color:#6e4e97;background:#eee6f7; }
.status.shipped { color:#247153;background:var(--green-soft); }
.status.invoiced { color:#31594a;background:#dcebe4; }
.status.qb_synced { color:#17644a;background:#d6f1e5; }
.workflow-track { grid-template-columns:repeat(var(--stage-count,6),1fr);padding-left:10px;padding-right:10px; }
.workflow-track .track-step { font-size:11px; }
.gate-list { display:grid;padding:0 16px 15px; }
.gate-row { display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:11px 0;border-top:1px solid var(--line); }
.gate-row > i { width:27px;height:27px;border-radius:8px;display:grid;place-items:center; }
.gate-row > i svg { width:14px; }
.gate-row strong,.gate-row span { display:block; }
.gate-row strong { font-size:14px; }
.gate-row span { margin-top:2px;color:var(--muted);font-size:12px; }
.gate-row b { border-radius:999px;padding:5px 8px;font-size:11px; }
.gate-row.complete > i,.gate-row.complete b { color:var(--green);background:var(--green-soft); }
.gate-row.blocked > i,.gate-row.blocked b { color:#946019;background:var(--amber-soft); }
.button.has-blockers { background:#9a6a23; }

@media (max-width:760px) {
  .workflow-track { overflow-x:auto;grid-template-columns:repeat(var(--stage-count,6),minmax(90px,1fr)); }
}
.rule-chip,.linked-chip { flex:none;border:1px solid var(--line);background:var(--green-soft);color:var(--green);border-radius:999px;padding:7px 10px;font-size:8px;font-weight:800;display:inline-flex;align-items:center;gap:5px;white-space:nowrap; }
.linked-chip svg { width:12px; }
.component-search { width:100%;height:38px;border:1px solid var(--line);border-radius:8px;background:var(--input-bg);color:var(--ink);padding:0 12px;font-size:9px;outline:0;margin-bottom:12px; }
.component-search:focus { border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 16%,transparent);background:var(--input-bg); }
.component-layout { display:grid;grid-template-columns:minmax(240px,.9fr) minmax(300px,1.1fr);gap:14px;align-items:start; }
.catalog-pick-list { border:1px solid var(--line);border-radius:11px;background:var(--panel);overflow:hidden;max-height:285px;overflow-y:auto; }
.catalog-pick-row { width:100%;border:0;border-bottom:1px solid var(--line);background:var(--panel);color:var(--ink);padding:11px;display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center;text-align:left;cursor:pointer; }
.catalog-pick-row:last-child { border-bottom:0; }
.catalog-pick-row:hover,.catalog-pick-row.selected { background:var(--surface-soft); }
.catalog-pick-row.selected { box-shadow:inset 3px 0 var(--green); }
.catalog-pick-art { width:34px;height:34px;border-radius:9px;background:var(--green-soft);display:grid;place-items:center;color:var(--green);font-size:12px;font-weight:800; }
.catalog-pick-row strong,.catalog-pick-row small { display:block; }
.catalog-pick-row strong { font-size:9px;color:var(--ink); }
.catalog-pick-row small { font-size:7px;color:var(--muted);margin-top:3px; }
.catalog-pick-row > span:last-child { color:var(--green);font-size:8px;font-weight:800; }
.selected-component-card { border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--ink);padding:14px;min-height:155px; }
.selected-component-card.empty,.selected-components.empty { display:grid;place-items:center;text-align:center;color:var(--muted);font-size:8px;border:1px dashed var(--line);background:var(--surface-soft); }
.component-card-head { display:flex;gap:10px;align-items:center;padding-bottom:12px;border-bottom:1px solid var(--line); }
.component-card-head .catalog-pick-art { width:40px;height:40px; }
.component-card-head strong,.component-card-head small { display:block; }
.component-card-head strong { font-size:10px; }
.component-card-head small { font-size:7px;color:var(--muted);margin-top:3px; }
.component-controls { display:grid;grid-template-columns:1fr 115px;gap:10px;margin-top:12px; }
.component-controls select { width:100%;height:36px;border:1px solid var(--line);border-radius:8px;background:var(--input-bg);color:var(--ink);padding:0 8px;font-size:8px;outline:0; }
.qty-field { height:36px;border:1px solid var(--line);border-radius:8px;background:var(--input-bg);color:var(--ink);display:grid;grid-template-columns:30px 1fr 30px;overflow:hidden; }
.qty-field button { border:0;background:var(--control-bg);color:var(--green);font-size:14px;cursor:pointer; }
.qty-field input { border:0;outline:0;min-width:0;width:100%;text-align:center;font-size:9px;font-weight:800;background:var(--input-bg);color:var(--ink); }
.component-note { display:flex;justify-content:space-between;align-items:center;margin-top:10px;color:var(--muted);font-size:7px; }
.component-note strong { color:var(--ink);font-size:8px; }
.component-selection-head { height:29px;display:flex;align-items:flex-start;justify-content:space-between;color:var(--ink);font-size:8px; }
.component-selection-head span { color:var(--muted); }
.selected-components { display:grid;gap:8px;min-height:150px; }
.set-component-row { border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink);padding:10px;display:grid;grid-template-columns:1fr auto;gap:8px; }
.set-component-row > div:first-child strong,.set-component-row > div:first-child small { display:block; }
.set-component-row > div:first-child strong { font-size:9px; }
.set-component-row > div:first-child small { font-size:7px;color:var(--muted);margin-top:3px; }
.set-component-row select { width:100%;height:30px;border:1px solid var(--line);border-radius:7px;background:var(--input-bg);color:var(--ink);padding:0 7px;font-size:7px;margin-top:8px; }
.set-row-actions { display:flex;align-items:center;gap:6px; }
.set-row-actions .qty-field { width:92px;height:30px;grid-template-columns:25px 1fr 25px; }
.remove-component { width:27px;height:27px;border:1px solid var(--line);background:var(--surface-raised);border-radius:7px;color:var(--red);cursor:pointer; }
.bundle-review { display:grid;gap:7px;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--ink);padding:5px 12px; }
.bundle-review-row { padding:9px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center; }
.bundle-review-row:last-child { border-bottom:0; }
.bundle-review-row strong,.bundle-review-row small { display:block; }
.bundle-review-row strong { font-size:9px; }
.bundle-review-row small { font-size:7px;color:var(--muted);margin-top:3px; }
.bundle-review-row > b { font-size:9px;color:var(--green); }
.bundle-price-card { display:grid;grid-template-columns:1fr 1fr 1fr;gap:11px;margin-top:14px;background:var(--surface-soft);border:1px solid var(--line);border-radius:11px;padding:14px; }
.bundle-value-summary { display:grid;grid-template-columns:repeat(3,1fr);margin-top:12px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel);color:var(--ink); }
.bundle-value-summary > div { padding:11px 13px;border-right:1px solid var(--line);background:var(--panel); }
.bundle-value-summary > div:last-child { border-right:0;background:var(--green-soft); }
.bundle-value-summary span,.bundle-value-summary strong { display:block; }
.bundle-value-summary span { font-size:7px;color:var(--muted); }
.bundle-value-summary strong { font-size:11px;margin-top:4px;color:var(--ink); }
.bundle-value-summary > div:last-child strong { color:var(--green); }
.component-error { color:var(--red);background:var(--red-soft);border:1px solid var(--red);border-radius:8px;padding:8px 10px;font-size:8px;margin-top:10px; }
.wizard-submit-error { margin:16px 28px 0;font-size:12px;line-height:1.45; }
.wizard-submit-error[hidden] { display:none; }
.pricing-mode-control { margin-top:16px;padding:14px;border:1px solid var(--line);border-radius:11px;background:var(--surface-soft);display:flex;align-items:center;justify-content:space-between;gap:18px; }
.pricing-mode-control strong,.pricing-mode-control span { display:block; }
.pricing-mode-control strong { font-size:14px; }
.pricing-mode-control span { margin-top:3px;color:var(--muted);font-size:12px; }
.pricing-mode-switch { display:flex;flex:none;padding:3px;border-radius:9px;background:var(--panel);border:1px solid var(--line); }
.pricing-mode-switch button { border:0;border-radius:7px;background:transparent;color:var(--muted);padding:8px 11px;font-size:12px;font-weight:700;cursor:pointer; }
.pricing-mode-switch button.active { background:var(--green);color:white; }
.currency-prices.quote-only .money-input { position:relative;opacity:.65; }
.currency-prices.quote-only .money-input::after { content:"Quote only";position:absolute;right:10px;color:var(--green);font-size:11px;font-weight:800; }
.currency-prices.quote-only [data-base-price] { color:transparent;pointer-events:none; }

@media (max-width:760px) {
  .component-layout { grid-template-columns:1fr; }
  .catalog-pick-list { max-height:170px; }
  .bundle-price-card,.bundle-value-summary { grid-template-columns:1fr; }
  .bundle-value-summary > div { border-right:0;border-bottom:1px solid var(--line); }
  .bundle-value-summary > div:last-child { border-bottom:0; }
  .pricing-mode-control { align-items:flex-start;flex-direction:column; }
}

/* Readability pass: keep operational content comfortably legible at normal browser zoom. */
html,body { font-size:15px;line-height:1.45; }
.nav-item { font-size:13px; }
.nav-label,.eyebrow,.modal-kicker { font-size:11px !important; }
.brand small,.nav-item b,.avatar,.sidebar-user strong { font-size:12px; }
.sidebar-user span { font-size:11px; }
.sidebar-card strong { font-size:15px; }
.sidebar-card p { font-size:13px; }
.page-heading,.global-search input,.help-button,.text-button { font-size:14px; }
.welcome-row p,.section-head p { font-size:15px;line-height:1.55; }
.button { font-size:14px;min-height:42px; }
.metric-top { font-size:13px; }
.metric-foot,.flow-step em,.flow-callout span,.attention-list p,.completion p { font-size:12px; }
.flow-step small,.flow-callout strong,.attention-list strong,.completion strong { font-size:13px; }
.panel-head h2 { font-size:18px; }
.panel-head p { font-size:13px; }
.segmented button,.stage-tabs span,.currency-switch > span,.currency-switch button { font-size:12px; }
th { font-size:11px; }
td,.order-table td { font-size:14px; }
td > span { font-size:12px;line-height:1.4; }
.source,.person { font-size:13px !important; }
.person > span { font-size:10px; }
.status,.payment { font-size:12px !important; }
.stage-tabs button,.catalog-summary > div:not(.currency-switch),.table-search input,.filter-button,.view-toggle { font-size:13px; }
.tag { font-size:11px; }
.product-info strong,.product-row strong,.customer-card h3 { font-size:14px; }
.product-info span,.product-row small,.customer-card p,.customer-meta span,.customer-card footer { font-size:12px; }

.product-modal > header,.create-order-header { padding:21px 25px; }
.product-modal h2,.create-order-header h2 { font-size:22px; }
.wizard-step strong,.create-step strong { font-size:13px; }
.wizard-step small,.create-step small { font-size:11px; }
.wizard-step > span,.create-step > span { width:30px;height:30px;font-size:12px; }
.wizard-steps,.create-order-steps { padding-top:17px;padding-bottom:17px; }
.wizard-page,.create-order-page { padding-top:27px;padding-bottom:27px; }
.field-label { font-size:13px; }
.text-input,.money-input input { font-size:14px;height:43px; }
.money-input { height:43px; }
.money-input span { font-size:13px; }
.type-card { padding:17px; }
.type-card.active { padding:16px; }
.type-card strong { font-size:15px; }
.type-card p { font-size:12px;line-height:1.55; }
.step-copy h3 { font-size:19px; }
.step-copy p { font-size:13px;line-height:1.5; }
.option-group header strong { font-size:14px; }
.option-group header small { font-size:11px; }
.option-values > span,.add-value,.select-actions button { font-size:13px; }
.builder-tip strong { font-size:13px; }
.builder-tip p { font-size:12px;line-height:1.5; }
.variant-head { font-size:11px; }
.variant-row { font-size:13px; }
.variant-row > input:not([type="checkbox"]) { height:34px;font-size:13px; }
.selection-summary,.footer-actions > span { font-size:12px;line-height:1.45; }
.rule-chip,.linked-chip,.component-search { font-size:12px; }
.catalog-pick-row strong,.component-card-head strong,.set-component-row > div:first-child strong,.bundle-review-row strong { font-size:14px; }
.catalog-pick-row small,.component-card-head small,.set-component-row > div:first-child small,.bundle-review-row small,.component-note,.component-selection-head { font-size:12px; }
.catalog-pick-row > span:last-child,.component-note strong,.bundle-review-row > b { font-size:13px; }
.component-controls select,.set-component-row select,.qty-field input { font-size:13px; }
.selected-component-card.empty,.selected-components.empty { font-size:13px;line-height:1.5; }
.bundle-value-summary span { font-size:12px; }
.bundle-value-summary strong { font-size:16px; }

.order-step-heading h3 { font-size:20px; }
.order-step-heading p { font-size:13px;line-height:1.5; }
.customer-search input { font-size:14px; }
.customer-select-card { padding:17px;grid-template-columns:46px 1fr 28px; }
.customer-select-card.selected { padding:16px; }
.customer-select-avatar { width:46px;height:46px;font-size:13px; }
.customer-select-card strong { font-size:15px; }
.customer-select-card small { font-size:13px;line-height:1.45; }
.customer-select-card em { font-size:12px; }
.selected-customer-strip small { font-size:10px; }
.selected-customer-strip strong { font-size:14px; }
.selected-customer-strip em,.selected-customer-strip > button,.order-currency > span,.order-currency button { font-size:12px; }
.order-product-heading h3,.order-cart-head h3 { font-size:18px; }
.order-product-heading p,.order-product-heading > span,.order-cart-head span,.order-cart-head button { font-size:12px; }
.product-picker-tools input,.order-product-info strong,.order-product-price strong,.quick-add { font-size:13px; }
.product-type-tabs button,.order-product-info span,.order-variant-select label,.order-product-price small { font-size:11px; }
.order-variant-select select { height:36px;font-size:13px; }
.order-product-card { padding:12px;grid-template-columns:48px minmax(145px,1fr) minmax(145px,.9fr) 90px 66px; }
.order-product-card .product-art { width:46px;height:46px; }
.order-cart-empty strong { font-size:14px; }
.order-cart-empty p { font-size:12px; }
.order-cart-item strong,.order-cart-totals > div { font-size:13px; }
.order-cart-item span,.quantity-control span { font-size:12px; }
.cart-item-bottom > strong,.review-card h4,.review-customer-content strong,.review-item strong,.review-item > b { font-size:14px; }
.order-cart-totals .cart-grand { font-size:16px; }
.review-ready,.review-card header button { font-size:12px; }
.review-customer-content span,.review-customer-content small,.review-customer-content > em,.review-item span { font-size:12px; }
.review-card textarea,.review-sidebar input,.review-sidebar select { font-size:14px; }
.review-sidebar label { font-size:12px; }
.review-total-card > span,.review-total-card > small,.review-total-card > div,.create-order-footer > div > span { font-size:12px; }

.drawer-kicker,.detail-label,.timeline small { font-size:11px; }
.drawer-header h2,.detail-section h3 { font-size:18px; }
.drawer-subtitle,.detail-value,.timeline strong,.timeline span { font-size:13px;line-height:1.5; }

@media (max-width:760px) {
  html,body { font-size:14px; }
  .wizard-step strong,.create-step strong { font-size:12px; }
  .wizard-step small,.create-step small { display:none; }
  .customer-select-list { grid-template-columns:1fr; }
  .order-product-card { grid-template-columns:46px minmax(0,1fr) 112px; }
  .order-product-card .product-art { grid-column:1;grid-row:1 / 3; }
  .order-product-info { grid-column:2;grid-row:1; }
  .order-variant-select { grid-column:3;grid-row:1 / 3; }
  .order-product-price { grid-column:2;grid-row:2; }
  .quick-add { grid-column:2 / 4;grid-row:3;width:100%; }
}

/* Order workspace, filters and full-page details */
.order-tools { position:relative;flex-wrap:wrap; }
.tool-menu-wrap { position:relative; }
.tool-popover { position:absolute;left:0;top:calc(100% + 8px);z-index:35;width:260px;padding:14px;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 45px rgba(20,45,35,.16); }
.tool-popover[hidden] { display:none; }
.tool-popover label { display:block;font-size:13px;font-weight:700;color:var(--muted);margin-bottom:12px; }
.tool-popover select { display:block;width:100%;height:40px;border:1px solid var(--line);border-radius:8px;margin-top:6px;padding:0 9px;font-size:14px; }
.tool-popover-actions { display:flex;justify-content:flex-end;gap:8px;padding-top:3px; }
.date-popover { width:190px;padding:7px; }
.date-popover button { width:100%;border:0;border-radius:7px;padding:9px 10px;text-align:left;font-size:13px;cursor:pointer; }
.date-popover button:hover,.date-popover button.active { background:var(--green-soft);color:var(--green);font-weight:800; }
.toolbar-result { margin-left:auto;color:var(--muted);font-size:13px;font-weight:700; }
.filter-button.has-filters { border-color:var(--green);color:var(--green); }
.open-full-order { width:34px;height:34px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--green);font-size:17px;font-weight:800;cursor:pointer; }
.open-full-order:hover { color:white;background:var(--green);border-color:var(--green); }
.drawer-header-actions { display:flex;gap:7px;align-items:center; }
.drawer-header p { font-size:13px;color:var(--muted); }
.drawer-section-head h3 { font-size:15px; }
.drawer-section-head span { font-size:12px;color:var(--muted); }
.placed-avatar { width:44px;height:44px;font-size:13px; }
.placed-by-card { grid-template-columns:44px 1fr auto; }
.placed-by-card strong { font-size:14px; }
.placed-by-card span { font-size:12px;color:var(--muted); }
.placed-by-card small { font-size:11px;color:var(--muted); }
.source-pill { font-size:11px !important; }
.next-action strong { font-size:14px; }
.next-action span { font-size:12px;line-height:1.45; }
.track-step { font-size:11px;padding-top:27px; }
.order-item { grid-template-columns:50px 1fr auto;gap:12px;padding:14px 0; }
.order-item .product-art { width:46px;height:46px; }
.order-item strong { font-size:14px; }
.order-item span { font-size:12px;color:var(--muted); }
.order-item small { font-size:11px;color:var(--muted); }
.item-price strong { font-size:14px; }
.item-price span { font-size:11px; }
.total-row { font-size:13px;color:var(--muted); }
.total-row.grand { font-size:16px; }
.detail-block strong { font-size:14px; }
.detail-block span { font-size:12px;color:var(--muted);line-height:1.6; }
.contact-chip > i { width:34px;height:34px;font-size:11px; }
.contact-chip strong { font-size:13px; }
.contact-chip span { font-size:11px; }
.activity { grid-template-columns:22px 1fr auto;gap:10px;padding:10px 0; }
.activity > i { width:21px;height:21px; }
.activity strong { font-size:13px; }
.activity span { font-size:12px;color:var(--muted);line-height:1.4; }
.activity time { font-size:11px;color:var(--muted); }

/* The drawer is a primary reading surface, so it deliberately uses a larger
   scale than dense tables and keeps secondary information comfortably legible. */
.order-drawer { width:min(660px,96vw); }
.drawer-header { padding:22px 24px; }
.drawer-header h2 { font-size:22px; }
.drawer-header p { font-size:14px;line-height:1.5; }
.drawer-body { padding:20px 22px 28px;gap:15px; }
.drawer-section-head { padding:16px 17px 12px; }
.drawer-section-head h3 { font-size:17px; }
.drawer-section-head span { font-size:13px; }
.placed-by-card { grid-template-columns:48px 1fr auto;padding:0 17px 17px;gap:12px; }
.placed-avatar { width:48px;height:48px;font-size:14px; }
.placed-by-card strong { font-size:16px; }
.placed-by-card span { font-size:14px; }
.placed-by-card small { font-size:13px;line-height:1.45; }
.source-pill { font-size:12px !important; }
.next-action { padding:16px; }
.next-action strong { font-size:16px; }
.next-action span { font-size:14px; }
.track-step { font-size:13px;padding-top:30px; }
.order-items { padding:0 17px; }
.order-item { grid-template-columns:54px 1fr auto;gap:14px;padding:16px 0; }
.order-item .product-art { width:50px;height:50px; }
.order-item strong,.item-price strong { font-size:16px; }
.order-item span { font-size:14px; }
.order-item small,.item-price span { font-size:13px; }
.order-totals { margin:0 17px;padding:15px 0 17px;gap:9px; }
.total-row { font-size:15px; }
.total-row.grand { font-size:18px; }
.detail-block { padding:0 17px 17px; }
.detail-block strong { font-size:16px; }
.detail-block span { font-size:14px;line-height:1.65; }
.contact-chip strong,.activity strong { font-size:15px; }
.contact-chip span,.activity span { font-size:13px; }
.activity time { font-size:12px; }
.activity-list { padding:0 17px 17px; }
.drawer-footer { padding:14px 20px; }

.full-order-nav { display:flex;align-items:center;justify-content:space-between;margin-bottom:18px; }
.full-order-nav > span { font-size:13px;color:var(--muted);font-weight:700; }
.full-order-header { display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px; }
.full-order-header h1 { font-size:30px;margin:3px 0 5px; }
.full-order-header p { margin:0;color:var(--muted);font-size:14px; }
.full-order-title { display:flex;align-items:center;gap:12px; }
.order-detail-layout { display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.52fr);gap:16px;align-items:start; }
.order-detail-layout > .next-action { grid-column:1 / -1; }
.order-detail-layout > .drawer-section:nth-of-type(1),
.order-detail-layout > .drawer-section:nth-of-type(2),
.order-detail-layout > .drawer-section:nth-of-type(3) { grid-column:1; }
.order-detail-layout > .detail-grid { grid-column:2;grid-row:2 / span 3;grid-template-columns:1fr; }
.order-detail-layout > .drawer-section:last-child { grid-column:1 / -1; }
.order-detail-layout .drawer-section { margin:0;box-shadow:var(--shadow);border-radius:13px;overflow:hidden; }
.order-detail-layout .next-action { margin:0; }
.order-detail-layout .detail-grid .drawer-section + .drawer-section { margin-top:16px; }

/* Relationship and sales-rep readability */
.map-copy h2 { font-size:24px;line-height:1.3; }
.map-copy p { font-size:15px;line-height:1.6; }
.map-legend { font-size:13px; }
.entity small,.entity em { font-size:12px; }
.entity strong { font-size:15px; }
.entity-contact b,.entity-contact small { font-size:12px; }
.customer-card h3 { font-size:19px; }
.customer-card p { font-size:15px;line-height:1.55; }
.customer-meta div,.customer-meta span,.customer-card footer { font-size:14px; }
.customer-meta strong { font-size:16px; }
.rep-hero p { font-size:16px; }
.portal-pill { font-size:12px; }
.rep-metrics small { font-size:14px; }
.rep-metrics strong { font-size:22px; }
.rep-metrics em { font-size:13px; }
.rep-customer strong { font-size:16px; }
.rep-customer small { font-size:14px;line-height:1.55; }
.quick-order { font-size:14px;min-height:38px;padding:0 13px; }
.earnings-total > span,.earnings-total > small,.earnings-bars span,.earnings-bars strong,.rule-note { font-size:14px;line-height:1.55; }

/* Reorderable product options and values */
.drag { border:0;background:transparent;padding:3px;cursor:grab; }
.drag:active,.option-values > span[draggable="true"]:active { cursor:grabbing; }
.option-values > span[draggable="true"] { cursor:grab; }
.option-group.dragging,.option-values > span.dragging { opacity:.45; }

@media (max-width:900px) {
  .order-detail-layout { grid-template-columns:1fr; }
  .order-detail-layout > .drawer-section,
  .order-detail-layout > .detail-grid,
  .order-detail-layout > .drawer-section:last-child { grid-column:1;grid-row:auto; }
  .full-order-header { align-items:flex-start;flex-direction:column; }
}

@media (max-width:760px) {
  .tool-popover { position:fixed;left:14px;right:14px;top:145px;width:auto; }
  .toolbar-result { width:100%;margin-left:0; }
  .full-order-nav > span { display:none; }
  .full-order-header h1 { font-size:24px; }
  .full-order-title { align-items:flex-start;flex-direction:column;gap:5px; }
}
@media (max-width: 480px) { .global-search { width:130px; }.button-row { width:100%; }.button-row .button { flex:1; }.flow-callout { grid-template-columns:30px 1fr; }.flow-callout button { grid-column:2;text-align:left;padding:0; }.entity-map { grid-template-columns:1fr;gap:8px; }.connector-line { display:none; }.billing-entity { max-width:none; }.rep-metrics { margin-top:-25px; }.toolbar { overflow-x:auto; }.table-search { min-width:190px; } }
@media (max-width: 900px) { .order-create-modal { width:98vw;max-height:97vh; }.create-order-body { min-height:0; }.customer-select-list { grid-template-columns:1fr; }.order-product-layout { grid-template-columns:1fr; }.product-picker { border-right:0;border-bottom:1px solid var(--line); }.order-cart { min-height:310px; }.order-review-grid { grid-template-columns:1fr; }.create-order-steps > i { width:45px;margin:0 9px; } }
@media (max-width: 600px) { .create-order-header { padding:14px 16px; }.create-order-steps { padding:10px 14px; }.create-step small { display:none; }.create-order-steps > i { width:25px;margin:0 6px; }.create-order-page { padding:18px 14px; }.order-step-heading { flex-direction:column; }.selected-customer-strip { padding:9px 12px;flex-wrap:wrap; }.selected-customer-strip > button { margin-left:auto; }.order-currency { width:100%;margin-left:44px; }.product-picker { padding:14px 12px; }.product-picker-tools { flex-direction:column; }.product-type-tabs { align-self:flex-start; }.order-product-card { grid-template-columns:38px 1fr 70px 52px; }.order-product-card .product-art { width:36px;height:36px; }.order-variant-select { grid-column:2 / -1;grid-row:2; }.order-cart { padding:13px; }.create-order-footer { padding:10px 12px; }.create-order-footer > div > span { display:none; }.create-order-footer .button { padding:0 10px; }.review-customer-content { grid-template-columns:36px 1fr; }.review-customer-content > em { grid-column:2;justify-self:start; } }
@media (max-width: 700px) { .order-relationship-toolbar,.order-customer-context { grid-template-columns:1fr; }.customer-select-list { grid-template-columns:1fr; } }

/* Checkout pricing */
.checkout-pricing-card { padding-bottom:12px; }
.checkout-pricing-card > small { display:block;margin:8px 12px 0;color:var(--muted);font-size:11px;line-height:1.45; }
.order-payment-card { padding-bottom:12px; }
.payment-method-picker { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px;border:0;padding:0; }
.payment-method-picker button { min-width:0;min-height:68px;padding:10px;border:1px solid var(--line);border-radius:10px;display:flex;align-items:flex-start;gap:8px;text-align:left;cursor:pointer; }
.payment-method-picker button > svg { width:18px;height:18px;flex:none;margin-top:1px; }
.payment-method-picker button span,.payment-method-picker button strong,.payment-method-picker button small { display:block; }
.payment-method-picker button strong { font-size:12px;line-height:1.25; }
.payment-method-picker button small { margin-top:4px;font-size:10px;line-height:1.35; }
.payment-account-note { margin:9px 12px 0;padding:9px 10px;border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px; }
.payment-account-note span { color:var(--muted); }
.card-settlement-note { margin:12px;padding:11px;border:1px solid var(--line);border-radius:10px;display:flex;align-items:flex-start;gap:9px; }
.card-settlement-note[hidden],#purchaseOrderFields[hidden] { display:none !important; }
.card-settlement-note > svg { width:18px;height:18px;flex:none; }
.card-settlement-note strong,.card-settlement-note small { display:block; }
.card-settlement-note strong { font-size:12px; }
.card-settlement-note small { margin-top:3px;font-size:10px;line-height:1.4; }
.rep-commission-context { margin:12px 0;padding:13px 15px;border:1px solid var(--line);border-radius:11px;display:flex;align-items:baseline;gap:8px 14px;flex-wrap:wrap; }
.rep-commission-context strong { font-size:13px; }
.rep-commission-context span { font-size:12px;line-height:1.5; }
.checkout-summary-row { margin:0 !important;padding:7px 0 !important;border-top:0 !important; }
.checkout-summary-row + .checkout-summary-row { border-top:1px solid var(--line) !important; }
.review-total-card > .checkout-summary-row:first-child { padding-top:0 !important; }
.review-total-card > span { display:block;margin-top:13px;padding-top:12px;border-top:1px solid var(--line); }

/* Inline RFQ pricing */
.pricing-workbench .drawer-section-head { align-items:flex-start; }
.pricing-workbench .drawer-section-head p { margin:4px 0 0;color:var(--muted);font-size:12px; }
.pricing-editor-body { display:grid;gap:10px;padding:4px 15px 16px; }
.pricing-line { display:grid;grid-template-columns:1fr 150px;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line); }
.pricing-line strong,.pricing-line small { display:block; }
.pricing-line strong { font-size:14px; }.pricing-line small { color:var(--muted);font-size:12px;margin-top:3px; }
.pricing-money { display:grid;grid-template-columns:auto 1fr;align-items:center;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--input-bg); }
.pricing-money em { padding:0 8px;color:var(--muted);font-size:11px;font-style:normal; }
.pricing-money input { width:100%;height:38px;border:0;border-left:1px solid var(--line);padding:0 9px;outline:0; }
.pricing-field { display:grid;gap:5px;color:var(--muted);font-size:12px;font-weight:700; }
.pricing-field input,.pricing-field select { width:100%;height:40px;border:1px solid var(--line);border-radius:9px;padding:0 10px;outline:0; }
.pricing-pair { display:grid;grid-template-columns:1fr 1fr;gap:10px; }
.pricing-help { color:var(--muted);font-size:11px; }

/* Settings */
.settings-workspace { display:grid;grid-template-columns:245px minmax(0,1fr);gap:18px;align-items:start; }
.settings-section-nav { position:sticky;top:82px;display:grid;gap:4px;padding:8px;overflow:hidden; }
.settings-section-nav-head { padding:10px 11px 12px;border-bottom:1px solid var(--line);margin-bottom:3px; }
.settings-section-nav-head strong,.settings-section-nav-head span { display:block; }
.settings-section-nav-head strong { font:700 13px Manrope,sans-serif; }
.settings-section-nav-head span { margin-top:3px;color:var(--muted);font-size:11px; }
.settings-section-button { width:100%;display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;align-items:center;padding:10px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--ink);text-align:left;cursor:pointer;transition:border-color .16s,background .16s,color .16s; }
.settings-section-button:hover { background:var(--surface-soft); }
.settings-section-button.active { border-color:color-mix(in srgb,var(--green) 45%,var(--line));background:var(--green-soft);color:var(--green); }
.settings-section-button:focus-visible { outline:2px solid var(--green);outline-offset:2px; }
.settings-section-button>span:last-child,.settings-section-button strong,.settings-section-button small { display:block;min-width:0; }
.settings-section-button strong { font-size:12px;line-height:1.3; }
.settings-section-button small { margin-top:3px;color:var(--muted);font-size:10px;line-height:1.3; }
.settings-section-button.active small { color:color-mix(in srgb,var(--green) 65%,var(--muted)); }
.settings-section-icon { width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:var(--surface-soft);color:var(--muted); }
.settings-section-icon svg { width:16px;height:16px; }
.settings-section-button.active .settings-section-icon { background:var(--panel);color:var(--green);box-shadow:var(--shadow); }
.settings-grid { min-width:0; }
.settings-panel { min-width:0;overflow:hidden;animation:settings-panel-in .18s ease; }
@keyframes settings-panel-in { from { opacity:.55;transform:translateY(3px); } to { opacity:1;transform:none; } }
.settings-rate-list,.settings-shipping-list { display:grid;padding:0 18px 18px; }
.settings-rate-row,.settings-shipping-row { display:grid;grid-template-columns:1fr 140px 84px;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line); }
.settings-rate-row:first-child,.settings-shipping-row:first-child { border-top:0; }
.settings-rate-row div strong,.settings-rate-row div span,.settings-shipping-row div strong,.settings-shipping-row div span { display:block; }
.settings-rate-row div span,.settings-shipping-row div span { color:var(--muted);font-size:12px;margin-top:2px; }
.settings-rate-row label { display:grid;grid-template-columns:1fr 28px;align-items:center;border:1px solid var(--line);border-radius:8px;background:var(--input-bg);overflow:hidden; }
.settings-rate-row input { width:100%;height:36px;border:0;background:transparent;color:var(--ink);padding:0 8px;outline:0; }
.settings-rate-row label span { color:var(--muted); }
.settings-shipping-row { grid-template-columns:1fr auto auto; }
.settings-shipping-row b { font-size:13px; }
.role-permission-panel{width:100%}.superadmin-note{align-self:center;padding:6px 10px;border-radius:999px;background:var(--green-soft);color:var(--green);font-size:11px;font-weight:800}.role-permission-layout{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:400px;border-top:1px solid var(--line)}.role-tabs{padding:14px;border-right:1px solid var(--line);background:var(--surface-soft)}.role-tab{display:grid;width:100%;grid-template-columns:1fr auto;gap:3px 10px;padding:12px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--ink);text-align:left;cursor:pointer}.role-tab strong{font-size:13px}.role-tab span{grid-column:1/-1;color:var(--muted);font-size:11px}.role-tab b{display:grid;min-width:24px;height:24px;place-items:center;border-radius:12px;background:var(--surface);color:var(--muted);font-size:10px}.role-tab.active{border-color:var(--green);background:var(--surface);box-shadow:0 3px 12px color-mix(in srgb,var(--green) 9%,transparent)}.role-tab.active strong{color:var(--green)}.permission-groups{display:grid;gap:14px;padding:18px}.permission-role-head h3{margin:0;font-size:18px}.permission-role-head p{margin:4px 0 0;color:var(--muted);font-size:12px}.permission-group{border:1px solid var(--line);border-radius:12px;overflow:hidden}.permission-group h4{margin:0;padding:11px 13px;border-bottom:1px solid var(--line);background:var(--surface-soft);font-size:12px}.permission-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 13px;border-top:1px solid var(--line)}.permission-row:first-of-type{border-top:0}.permission-row strong,.permission-row span{display:block}.permission-row strong{font-size:13px}.permission-row span{margin-top:2px;color:var(--muted);font-size:11px;line-height:1.4}.permission-switch{position:relative;display:block;width:42px;height:24px}.permission-switch input{position:absolute;opacity:0;pointer-events:none}.permission-switch i{display:block;width:42px;height:24px;border:1px solid var(--line-strong);border-radius:20px;background:var(--input-bg);transition:.16s}.permission-switch i:after{content:"";display:block;width:18px;height:18px;margin:2px;border-radius:50%;background:var(--muted);transition:.16s}.permission-switch input:checked+i{border-color:var(--green);background:var(--green)}.permission-switch input:checked+i:after{transform:translateX(18px);background:#fff}.permission-switch input:disabled+i{opacity:.6;cursor:not-allowed}.permission-empty{padding:28px;color:var(--muted);text-align:center;font-size:13px}
@media(max-width:1050px){.settings-workspace{grid-template-columns:210px minmax(0,1fr)}.pricing-line{grid-template-columns:1fr}.settings-rate-row{grid-template-columns:1fr 130px 80px}}
@media(max-width:760px){.settings-workspace{grid-template-columns:1fr}.settings-section-nav{position:static;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.settings-section-nav-head{grid-column:1/-1}.settings-section-button{padding:9px;grid-template-columns:30px minmax(0,1fr)}.settings-section-icon{width:30px;height:30px}.settings-section-button small{display:none}.role-permission-layout{grid-template-columns:1fr}.role-tabs{display:flex;gap:7px;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line)}.role-tab{flex:0 0 180px}.permission-groups{padding:12px}.superadmin-note{display:none}}
@media(max-width:480px){.settings-section-nav{grid-template-columns:1fr}.settings-section-nav-head{grid-column:auto}.settings-rate-row{grid-template-columns:1fr}.settings-rate-row .button{justify-self:start}.settings-shipping-row{grid-template-columns:1fr auto}.settings-shipping-row b:last-child{grid-column:2}}

/* Personal appearance preferences, available to every signed-in role. */
.appearance-theme-options { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px; }
.appearance-theme-option { position:relative;display:grid;grid-template-columns:76px minmax(0,1fr) 20px;gap:13px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--surface-soft);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .16s,background .16s,box-shadow .16s; }
.appearance-theme-option:hover { border-color:color-mix(in srgb,var(--green) 48%,var(--line)); }
.appearance-theme-option.active { border-color:var(--green);background:var(--surface-selected);box-shadow:0 0 0 2px color-mix(in srgb,var(--green) 13%,transparent); }
.appearance-theme-option strong,.appearance-theme-option small { display:block; }
.appearance-theme-option strong { font-size:13px; }
.appearance-theme-option small { margin-top:3px;color:var(--muted);font-size:11px; }
.appearance-theme-preview { height:48px;padding:7px;display:grid;grid-template-columns:17px 1fr;grid-template-rows:1fr 1fr;gap:4px;border:1px solid var(--line);border-radius:7px;overflow:hidden; }
.appearance-theme-preview i { display:block;border-radius:2px; }
.appearance-theme-preview i:first-child { grid-row:1 / 3; }
.light-preview { background:#f3f6f3; }.light-preview i:first-child { background:#153b34; }.light-preview i:not(:first-child) { background:#fff;border:1px solid #dfe6e1; }
.dark-preview { background:#14201c; }.dark-preview i:first-child { background:#0b2522; }.dark-preview i:not(:first-child) { background:#293b34;border:1px solid #40564d; }
.appearance-theme-check { display:none;width:18px;height:18px;color:var(--green); }
.appearance-theme-check svg { width:18px;height:18px; }
.appearance-theme-option.active .appearance-theme-check { display:block; }

/* Tablet portrait uses the same off-canvas navigation pattern as phones. */
@media (min-width:761px) and (max-width:1024px) and (orientation:portrait) {
  body.mobile-nav-open { overflow:hidden; }
  .sidebar { transform:translateX(-100%);transition:transform .25s ease;z-index:30; }
  .sidebar.open { transform:none; }
  .main { width:100%;margin-left:0; }
  .mobile-menu { display:grid;flex:none; }
  .sidebar-backdrop { display:block;position:fixed;inset:65px 0 0;z-index:25;opacity:0;pointer-events:none;transition:opacity .2s ease; }
  .sidebar-backdrop.open { opacity:1;pointer-events:auto; }
  .sidebar-close { display:grid;place-items:center;position:absolute;top:14px;right:14px;z-index:2;width:36px;height:36px;padding:0;border:1px solid rgba(255,255,255,.16);border-radius:9px;background:rgba(255,255,255,.08);color:var(--sidebar-text);cursor:pointer; }
  .sidebar-close:hover { background:rgba(255,255,255,.14); }
  .rep-authenticated .data-state,.rep-preview .data-state { display:none; }
  .global-search { width:min(280px,36vw); }
}
.product-art.has-image{background:var(--surface-soft);border:1px solid var(--line)}.product-art.has-image img{width:100%;height:100%;display:block;object-fit:cover}
.cart-price-row{margin-top:10px}.cart-price-row label{display:grid;grid-template-columns:1fr auto;gap:4px 8px;color:var(--muted);font-size:11px;font-weight:700}.cart-price-row label>span{font-size:10px}.cart-price-row input{grid-column:1/-1;width:100%;height:34px;border:1px solid var(--line);border-radius:7px;background:var(--input-bg);color:var(--ink);padding:0 9px;font:700 13px DM Sans,sans-serif}.cart-price-row small{grid-column:1/-1;color:var(--muted);font-size:10px}

/* Compact order builder: searchable pickers and denser line entry. */
.order-create-modal { height:min(830px,94vh); }
.order-create-modal .create-order-body { min-height:0;flex:1; }
.product-order-page .order-product-layout { grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr); }
.product-order-page .product-picker-tools { flex-direction:column;align-items:stretch; }
.product-order-page .product-picker-tools > label { flex:none;width:100%; }
.product-order-page .product-type-tabs { width:100%;max-width:none;align-self:stretch;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto; }
.product-order-page .product-type-tabs button { flex:0 0 auto;white-space:nowrap; }
.product-order-page .order-product-card { padding:8px;grid-template-columns:38px minmax(110px,.82fr) minmax(145px,1.18fr) 82px 52px;gap:7px; }
.product-order-page .order-product-card .product-art { width:36px;height:36px;background:var(--product-image-bg);border:1px solid var(--line); }
.product-order-page .order-product-card .product-art.has-image img { object-fit:contain;padding:3px; }
.product-order-page .order-variant-select > button { height:34px;font-size:11px; }
.product-order-page .order-cart-item { padding:8px; }
@media (max-width:900px) {
  .order-customer-form,.order-customer-context { grid-template-columns:1fr; }
  .product-order-page .order-product-layout { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .product-order-page .order-product-card { grid-template-columns:36px 1fr 66px 48px; }
  .product-order-page .order-variant-select { grid-column:2/-1;grid-row:2; }
  .cart-line-values { grid-template-columns:1fr auto; }
  .cart-selling-price { grid-column:1/-1; }
  .cart-line-total { grid-column:2; }
}

/* The order workflow becomes an edge-to-edge screen on phones. */
@media (max-width:760px) {
  html,body { max-width:100%;overflow-x:hidden; }
  .order-create-backdrop {
    padding:0;
    place-items:stretch;
    overflow:hidden;
  }
  .order-create-modal,
  .order-create-backdrop.open .order-create-modal {
    width:100vw;
    max-width:100vw;
    height:100vh;
    height:100dvh;
    max-height:none;
    border-radius:0;
    box-shadow:none;
    transform:none;
  }
  .order-create-modal .create-order-body {
    width:100%;
    max-width:100%;
    min-width:0;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .create-order-page,
  .order-product-layout,
  .product-picker,
  .order-cart,
  .order-review-grid,
  .review-main,
  .review-sidebar,
  .selected-customer-strip {
    width:100%;
    max-width:100%;
    min-width:0;
  }
  .selected-customer-strip { overflow:hidden; }
  .selected-customer-strip > div { min-width:0; }
  .selected-customer-strip em { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  .order-currency { width:auto;max-width:100%;margin-left:auto; }
  .product-order-page .product-type-tabs {
    overflow:hidden;
    gap:0;
  }
  .product-order-page .product-type-tabs button {
    min-width:0;
    padding:5px 4px;
    font-size:9px;
  }
  .order-product-card,
  .order-cart-item,
  .review-card { min-width:0; }
  .order-product-info,
  .order-variant-select,
  .order-product-price,
  .cart-item-identity,
  .review-customer-content > div { min-width:0; }
  .review-customer-content span,
  .review-customer-content small { overflow-wrap:anywhere; }
  .create-order-footer { width:100%;max-width:100%; }
}

/* Mobile navigation and list records */
@media (max-width:760px) {
  body.mobile-nav-open { overflow:hidden; }
  .rep-authenticated .data-state,.rep-preview .data-state { display:none; }
  .sidebar { z-index:30; }
  .sidebar-backdrop {
    display:block;
    position:fixed;
    inset:65px 0 0;
    z-index:25;
    opacity:0;
    pointer-events:none;
    transition:opacity .2s ease;
  }
  .sidebar-backdrop.open { opacity:1;pointer-events:auto; }
  .sidebar-close {
    display:grid;
    place-items:center;
    position:absolute;
    top:14px;
    right:14px;
    z-index:2;
    width:36px;
    height:36px;
    padding:0;
    border:1px solid rgba(255,255,255,.16);
    border-radius:9px;
    background:rgba(255,255,255,.08);
    color:var(--sidebar-text);
    cursor:pointer;
  }
  .sidebar-close:hover { background:rgba(255,255,255,.14); }
  .top-actions { margin-left:auto; }
  .global-search-shell { position:static; }
  .global-search-results { position:fixed; top:61px; left:8px; right:8px; width:auto; max-height:calc(100vh - 70px); }

  #ordersView,.order-queue,.order-table { width:100%;max-width:100%;min-width:0; }
  .stage-tabs { flex-wrap:wrap;overflow:visible;gap:2px 4px; }
  .stage-tabs button { flex:1 0 auto;padding:9px 8px; }
  .order-tools { flex-wrap:wrap;align-items:stretch; }
  .order-tools .table-search { flex:1 0 100%;width:100%; }
  .order-tools .tool-menu-wrap { flex:1 1 auto;min-width:0; }
  .order-tools .tool-menu-wrap > .filter-button { width:100%;justify-content:center; }
  .order-tools > #orderExportButton { flex:1 1 auto;justify-content:center; }
  .order-tools .toolbar-result { flex:1 0 100%;margin-left:0;text-align:left; }

  .order-table { overflow:visible; }
  .order-table table,.order-table tbody { display:block;width:100%;min-width:0;white-space:normal; }
  .order-table thead { display:none; }
  .order-table tbody { display:grid;gap:10px;padding:10px; }
  .order-table .order-clickable {
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:12px 16px;
    width:100%;
    padding:14px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--surface-raised);
    box-shadow:none;
  }
  .order-table .order-clickable:hover { background:var(--surface-soft) !important;box-shadow:inset 3px 0 0 var(--green); }
  .order-table .order-clickable > td {
    display:block;
    width:auto;
    min-width:0;
    height:auto;
    padding:0;
    border:0;
    font-size:13px;
    white-space:normal;
    background:transparent !important;
  }
  .order-table .order-clickable > td[data-label]::before {
    content:attr(data-label);
    display:block;
    margin-bottom:3px;
    color:var(--muted);
    font-size:9px;
    font-weight:800;
    letter-spacing:.7px;
    text-transform:uppercase;
  }
  .order-table .order-clickable td strong { overflow-wrap:anywhere;font-size:13px; }
  .order-table .order-clickable td > span:not(.status) { margin-top:3px;font-size:11px; }
  .order-table .order-select-cell { display:none !important; }
  .order-table .order-id-cell { grid-column:1;grid-row:1; }
  .order-table .order-status-cell { grid-column:2;grid-row:1;align-self:start;text-align:right; }
  .order-table .order-status-cell::before { display:none !important; }
  .order-table .order-status-cell .status { font-size:10px !important; }
  .order-table .order-customer-cell { grid-column:1 / -1; }
  .order-table .order-source-cell,.order-table .order-payment-cell { grid-column:auto; }
  .order-table .order-total-cell { grid-column:1 / -1;padding-right:38px; }
  .order-table .order-total-cell strong { font-size:15px; }
  .order-table .order-action-cell { position:absolute;right:9px;bottom:9px; }
  .order-table .order-action-cell .row-more { width:30px;height:30px;border:1px solid var(--line);border-radius:8px;background:var(--control-bg);color:var(--green); }
}

@media (max-width:430px) {
  .global-search { width:min(48vw,180px); }
  .help-button { display:none; }
  .content { padding-left:12px;padding-right:12px; }
}

@media (max-width:600px) {
  .payment-method-picker { grid-template-columns:1fr; }
  .payment-method-picker button { min-height:58px; }
}
.product-language-heading{margin:7px 0 0;padding-top:15px;border-top:1px solid var(--line);color:var(--ink);font-size:13px;line-height:1.3}.product-copy-fields>.product-language-heading:first-child{padding-top:0;border-top:0}