/* ============================================================
   Eden Garden Design — Production System
   ============================================================ */
:root {
  --dark:   #0E1A12;
  --cream:  #EDE8DC;
  --gold:   #C9A96E;
  --light:  #FAF8F3;
  --green:  #274E13;
  --red:    #F4CCCC;
  --muted:  #6B7A6F;
  --border: #D9D3C6;
  --white:  #FFFFFF;
  --sidebar-w: 220px;
  --header-h:  56px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px}
body{font-family:'Jost',system-ui,sans-serif;background:var(--light);color:var(--dark);line-height:1.5;-webkit-font-smoothing:antialiased}

/* ── Layout ── */
.app{display:flex;height:100vh;overflow:hidden}
.sidebar{width:var(--sidebar-w);background:var(--dark);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:100;border-right:1px solid rgba(201,169,110,.15)}
.sidebar-logo{padding:20px 20px 16px;border-bottom:1px solid rgba(201,169,110,.15)}
.sidebar-logo-title{font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;font-weight:500;color:var(--gold);letter-spacing:.5px;line-height:1.2}
.sidebar-logo-sub{font-size:10px;color:rgba(201,169,110,.4);letter-spacing:2px;text-transform:uppercase;margin-top:2px}
.sidebar-nav{flex:1;padding:12px 0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(201,169,110,.25) transparent}
.sidebar-nav::-webkit-scrollbar{width:6px}
.sidebar-nav::-webkit-scrollbar-track{background:transparent}
.sidebar-nav::-webkit-scrollbar-thumb{background:rgba(201,169,110,.18);border-radius:3px}
.sidebar-nav:hover::-webkit-scrollbar-thumb{background:rgba(201,169,110,.32)}
.nav-section{padding:8px 12px 4px;font-size:9px;letter-spacing:2px;text-transform:uppercase;color:rgba(201,169,110,.35);margin-top:8px}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 16px;color:rgba(237,232,220,.6);text-decoration:none;font-size:13px;cursor:pointer;transition:all .15s;border:none;background:none;width:100%;text-align:left}
.nav-item:hover{color:var(--cream);background:rgba(201,169,110,.08)}
.nav-item.active{color:var(--gold);background:rgba(201,169,110,.12);border-left:2px solid var(--gold);padding-left:14px}
.nav-item svg{opacity:.7;flex-shrink:0;width:15px;height:15px}
.nav-item.active svg{opacity:1}
.sidebar-footer{padding:12px;border-top:1px solid rgba(201,169,110,.15);font-size:10px;color:rgba(201,169,110,.25);letter-spacing:1px}
.main{margin-left:var(--sidebar-w);flex:1;display:flex;flex-direction:column;height:100vh;overflow:hidden}

/* ── Header ── */
.page-header{background:var(--white);border-bottom:1px solid var(--border);padding:0 28px;height:var(--header-h);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:50}
.page-title{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:500}
.page-subtitle{font-size:11px;color:var(--muted);margin-top:1px}
.header-actions{display:flex;gap:8px;align-items:center}
.page-body{padding:0;flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}

/* ── Cards ── */
.card{background:var(--white);border:1px solid var(--border);border-radius:8px;overflow:hidden;margin-bottom:16px}
.card-header{padding:13px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.card-title{font-size:13px;font-weight:600;letter-spacing:.3px}
.card-body{padding:20px}

/* ── Stats ── */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:20px}
.stat-card{background:var(--white);border:1px solid var(--border);border-radius:8px;padding:14px 18px}
.stat-card.accent{border-left:3px solid var(--gold)}
.stat-card.urgent{border-left:3px solid #D85A30}
.stat-card.success{border-left:3px solid #3B6D11}
.stat-label{font-size:10px;font-weight:600;color:var(--muted);letter-spacing:.8px;text-transform:uppercase;margin-bottom:5px}
.stat-value{font-size:24px;font-weight:500;line-height:1.2}
.stat-sub{font-size:11px;color:var(--muted);margin-top:2px}

/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:6px;font-family:'Jost',sans-serif;font-size:13px;font-weight:500;cursor:pointer;transition:all .15s;border:1px solid transparent;white-space:nowrap;text-decoration:none}
.btn-primary{background:var(--dark);color:var(--cream);border-color:var(--dark)}
.btn-primary:hover{background:#1e3022}
.btn-gold{background:var(--gold);color:var(--dark);border-color:var(--gold)}
.btn-gold:hover{background:#b8954f}
.btn-outline{background:transparent;color:var(--dark);border-color:var(--border)}
.btn-outline:hover{background:var(--light);border-color:#bbb}
.btn-ghost{background:transparent;color:var(--muted);border-color:transparent}
.btn-ghost:hover{color:var(--dark);background:var(--light)}
.btn-danger{background:transparent;color:#D85A30;border-color:#D85A30}
.btn-danger:hover{background:#fff0ec}
.btn-sm{padding:4px 10px;font-size:12px}
.btn:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}

/* ── Table ── */
.table-wrap{overflow-x:auto;border-radius:8px;border:1px solid var(--border)}
table{width:100%;border-collapse:collapse;font-size:13px}
thead{background:var(--dark);color:#fff}
thead th{padding:10px 12px;font-size:10px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;text-align:left;white-space:nowrap;cursor:pointer;user-select:none}
thead th:hover{color:var(--gold)}
tbody tr{border-bottom:1px solid var(--border);transition:background .1s}
tbody tr:last-child{border-bottom:none}
tbody tr:hover{background:rgba(14,26,18,.03)}
tbody td{padding:9px 12px;vertical-align:middle}
.row-urgent{background:#fff5f2!important}
.row-done{background:#f5faf5!important;color:var(--muted)}

/* ── Column Filter Dropdown ── */
.col-filter-btn{background:none;border:none;color:rgba(255,255,255,.5);cursor:pointer;font-size:11px;padding:0 2px;margin-left:3px;vertical-align:middle;line-height:1;border-radius:2px;transition:color .15s}
.col-filter-btn:hover{color:#fff}
.col-filter-btn.active{color:var(--gold);font-weight:700}
.col-filter-drop{position:fixed;z-index:9999;background:#fff;border:1px solid var(--border);border-radius:6px;box-shadow:0 4px 20px rgba(0,0,0,.18);min-width:180px;max-width:260px;padding:4px 0;color:var(--dark);font-size:11px;font-weight:400;text-transform:none;letter-spacing:0}
.col-filter-drop .cf-search{display:block;width:calc(100% - 14px);margin:5px 7px 3px;padding:3px 7px;font-size:11px;border:1px solid var(--border);border-radius:4px;font-family:inherit;box-sizing:border-box;outline:none}
.col-filter-drop .cf-search:focus{border-color:var(--dark)}
.col-filter-drop .cf-all-row{display:flex;align-items:center;gap:5px;padding:3px 8px;cursor:pointer;font-weight:600;color:var(--dark);border-radius:3px}
.col-filter-drop .cf-all-row:hover{background:var(--light)}
.col-filter-drop .cf-divider{height:1px;background:var(--border);margin:3px 0}
.col-filter-drop .cf-items{max-height:240px;overflow-y:auto}
.col-filter-drop .cf-items label{display:flex;align-items:center;gap:5px;padding:3px 8px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}
.col-filter-drop .cf-items label:hover{background:var(--light)}
.col-filter-drop input[type=checkbox]{accent-color:var(--dark);cursor:pointer;width:12px;height:12px;flex-shrink:0}

/* ── Badge ── */
.badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;letter-spacing:.3px;white-space:nowrap}

/* ── Forms ── */
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;align-items:end}
.form-group{display:flex;flex-direction:column;gap:4px}
.form-group.span2{grid-column:span 2}
.form-group.span3{grid-column:span 3}
.form-group.full{grid-column:1/-1}
label{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.5px;text-transform:uppercase}
/* ── Form fields ───────────────────────────────────────────── */
input[type=text], input[type=number], input[type=date],
input[type=email], input[type=search], input[type=password],
select {
  display: block;
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  color: var(--dark);
  background: var(--white);
  border: 1.5px solid var(--border);
  border-radius: 6px;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  color-scheme: light;
}
textarea {
  display: block;
  width: 100%;
  padding: 9px 10px;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  color: var(--dark);
  background: var(--white);
  border: 1.5px solid var(--border);
  border-radius: 6px;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  min-height: 70px;
  resize: vertical;
  line-height: 1.5;
}
select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236B7A6F' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: 28px;
  cursor: pointer;
}
/* Kill browser green/blue autofill */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px var(--white) inset !important;
  -webkit-text-fill-color: var(--dark) !important;
}


.check-row{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--dark);font-weight:400;letter-spacing:0;text-transform:none;cursor:pointer}
.check-row input[type=checkbox]{width:15px;height:15px;accent-color:var(--gold);cursor:pointer}

/* ── Toolbar ── */
.toolbar{display:flex;align-items:center;gap:10px;padding:10px 0;flex-wrap:wrap}
.toolbar-search{position:relative;flex:1;min-width:180px;max-width:320px}
.toolbar-search input{padding-left:32px}
.toolbar-search .icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.toolbar-right{display:flex;align-items:center;gap:8px;margin-left:auto}

/* ── Modal ── */
.modal-backdrop{position:fixed;inset:0;background:rgba(14,26,18,.5);z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}
.modal{background:var(--white);border-radius:10px;width:100%;max-width:720px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 8px 32px rgba(14,26,18,.15)}
.modal.lg{max-width:960px}
.modal.xl{max-width:1240px;width:96vw}
.modal.calc{max-width:1100px}
.modal.sm{max-width:440px}
.modal-header{padding:18px 24px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.modal-title{font-family:'Cormorant Garamond',serif;font-size:19px;font-weight:500}
.modal-body{padding:20px 24px;overflow-y:auto;flex:1;min-height:0}
.modal-footer{padding:14px 24px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:10px;flex-shrink:0}

/* ── Tabs ── */
.tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:20px;gap:2px}
.tab{padding:9px 16px;font-size:13px;font-weight:500;color:var(--muted);cursor:pointer;border:none;background:none;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .15s;font-family:'Jost',sans-serif}
.tab:hover{color:var(--dark)}
.tab.active{color:var(--dark);border-bottom-color:var(--gold)}

/* ── Filter tags ── */
.filter-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.filter-tag{padding:3px 10px;border-radius:20px;font-size:11px;font-weight:500;border:1px solid var(--border);background:var(--white);cursor:pointer;transition:all .15s;color:var(--muted);font-family:'Jost',sans-serif}
.filter-tag:hover{border-color:var(--gold);color:var(--dark)}
.filter-tag.active{background:var(--dark);color:var(--cream);border-color:var(--dark)}

/* ── Progress bar ── */
.progress-bar{height:4px;background:var(--border);border-radius:2px;overflow:hidden;margin-top:4px}
.progress-fill{height:100%;background:var(--gold);border-radius:2px;transition:width .3s}

/* ── Upload zone ── */
.upload-zone{border:2px dashed var(--border);border-radius:8px;padding:36px 20px;text-align:center;cursor:pointer;transition:all .15s;background:var(--light)}
.upload-zone:hover,.upload-zone.over{border-color:var(--gold);background:rgba(201,169,110,.05)}
.upload-zone h3{font-size:14px;color:var(--dark);margin-bottom:5px;font-weight:500}
.upload-zone p{font-size:12px;color:var(--muted)}

/* ── Toast ── */
#toasts{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:8px}
.toast{background:var(--dark);color:var(--cream);padding:11px 18px;border-radius:8px;font-size:13px;max-width:300px;animation:slideIn .2s ease;border-left:3px solid var(--gold)}
.toast.success{border-left-color:#3B6D11}
.toast.error{border-left-color:#D85A30}
.toast.warn{border-left-color:#E8A800;max-width:420px}
@keyframes slideIn{from{transform:translateX(120%);opacity:0}to{transform:translateX(0);opacity:1}}

/* ── Login page ── */
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--dark)}
.login-box{background:var(--white);border-radius:12px;padding:40px;width:340px;box-shadow:0 8px 40px rgba(0,0,0,.3)}
.login-logo{text-align:center;margin-bottom:28px}
.login-logo-title{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:500;color:var(--dark)}
.login-logo-sub{font-size:11px;color:var(--muted);letter-spacing:2px;text-transform:uppercase;margin-top:3px}
.login-box .form-group{margin-bottom:14px}
.login-box label{display:block;margin-bottom:5px}
.login-error{color:#D85A30;font-size:12px;margin-top:8px;text-align:center}

/* ── Misc ── */
.divider{border:none;border-top:1px solid var(--border);margin:14px 0}
.text-muted{color:var(--muted)}
.text-gold{color:var(--gold)}
.text-danger{color:#D85A30}
.text-success{color:#274E13}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
.mb2{margin-bottom:8px}
.mb3{margin-bottom:12px}
.mb4{margin-bottom:16px}
.section-title{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.spinner{width:20px;height:20px;border:2px solid var(--border);border-top-color:var(--gold);border-radius:50%;animation:spin .7s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
.empty{text-align:center;padding:50px 20px;color:var(--muted)}
.empty svg{margin:0 auto 10px;opacity:.25;display:block}
.flex{display:flex}
.items-center{align-items:center}
.gap2{gap:8px}
.gap3{gap:12px}
.mono{font-family:monospace}
.pagination{display:flex;align-items:center;gap:8px;justify-content:flex-end;padding:10px 0;font-size:12px;color:var(--muted)}

/* Responsive */
@media(max-width:768px){
  .sidebar{width:0;overflow:hidden}
  .main{margin-left:0}
  .stats-grid{grid-template-columns:1fr 1fr}
  .form-grid{grid-template-columns:1fr}
  .form-group.span2,.form-group.span3,.form-group.full{grid-column:1}
  .grid2,.grid3{grid-template-columns:1fr}
}




/* ── Page layout ─────────────────────────────────────────────── */
#page-content {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 24px 28px;
}
/* Orders & Production pages override padding via their own layout */
#page-content:has(> .page-header) {
  padding: 0;
  overflow: hidden;
}
.page-header {
  flex-shrink: 0;
  padding: 16px 28px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--white);
}

/* ── Shopify context panel in the order card ── */
.modal.sp-wide{max-width:1180px}
.sp-split{display:grid;grid-template-columns:1fr 320px;gap:18px;align-items:start}
.sp-main{min-width:0}
.sp-side{position:sticky;top:0;border:1px solid #CFE0C6;border-radius:8px;overflow:hidden;background:var(--white)}
.sp-head{background:#F2F6F0;border-bottom:1px solid #CFE0C6;padding:8px 11px;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#5E8E3E;font-weight:600;display:flex;align-items:center;gap:7px}
.sp-dot{width:7px;height:7px;border-radius:50%;background:#5E8E3E;display:inline-block}
.sp-num{margin-left:auto;font-size:11px;letter-spacing:0}
.sp-body{padding:11px}
.sp-grp{margin-bottom:12px;padding-bottom:12px;border-bottom:1px dashed var(--border)}
.sp-grp:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}
.sp-lbl{font-size:9px;letter-spacing:.9px;text-transform:uppercase;color:var(--muted);margin-bottom:5px;display:flex;justify-content:space-between}
.sp-lbl a{color:#5E8E3E;text-decoration:none;text-transform:none;letter-spacing:0;font-size:10px}
.sp-row{font-size:12.5px;margin-bottom:2px;word-break:break-word}
.sp-muted{color:var(--muted)}
.sp-empty{background:var(--light);border:1px dashed var(--border);border-radius:6px;padding:9px;font-size:12px;color:var(--muted);margin-bottom:12px}
.sp-locked{background:repeating-linear-gradient(45deg,#F6F3EC,#F6F3EC 6px,#F1EDE4 6px,#F1EDE4 12px);border:1px dashed var(--border);border-radius:6px;padding:9px;text-align:center;color:var(--muted);font-size:12px}
.sp-locked-sub{font-size:10px;margin-top:2px}
.sp-chip{display:inline-block;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:2px 7px;border-radius:12px;margin-left:4px}
.sp-green{background:#E4EFE7;color:#1f5130}
.sp-amber{background:#FBF3E3;color:#8a6d24}
.sp-red{background:#FBEDEA;color:#8b2f2f}
.sp-green-txt{color:#1f5130}.sp-amber-txt{color:#8a6d24}.sp-red-txt{color:#8b2f2f}
.sp-bar{height:6px;background:var(--cream);border-radius:4px;overflow:hidden;margin:6px 0}
.sp-bar-fill{display:block;height:100%}
.sp-bar-green{background:#4b7a52}.sp-bar-amber{background:#C9A96E}.sp-bar-red{background:#b05a4a}
.sp-warn{font-size:11px;color:#8b2f2f;background:#FBEDEA;border-radius:4px;padding:4px 6px;margin-top:4px}
.sp-pay-list{margin-top:6px;font-size:11.5px}
.sp-pay-row{display:grid;grid-template-columns:36px 1fr auto;gap:6px;padding:2px 0;border-bottom:1px dotted var(--border)}
.sp-pos,.sp-pos-self{font-size:12px;display:flex;gap:6px;padding:2px 0}
.sp-pos-self{color:var(--muted)}
.sp-pos a{color:var(--gold);font-weight:600;text-decoration:none}
.sp-tag{display:inline-block;font-size:11px;background:var(--cream);border-radius:12px;padding:2px 8px;margin:2px 3px 2px 0}
.sp-note{font-size:11.5px;background:var(--light);border-radius:4px;padding:5px 7px;margin-top:5px}
.sp-btn{font-family:inherit;font-size:11.5px;padding:5px 10px;border:1px solid #CFE0C6;background:var(--white);border-radius:6px;cursor:pointer;color:#5E8E3E;margin-top:6px}
.sp-kv{display:grid;grid-template-columns:130px 1fr;gap:5px 12px;font-size:13px}
.sp-kv>div:nth-child(odd){color:var(--muted);font-size:12px}
.sp-hist{display:grid;grid-template-columns:80px 1fr 190px 90px;gap:8px;font-size:12.5px;padding:5px 0;border-bottom:1px solid var(--border)}
.sp-diff{width:100%;border-collapse:collapse;font-size:12.5px;margin:8px 0}
.sp-diff th,.sp-diff td{padding:6px 8px;border-bottom:1px solid var(--border);text-align:left}
.sp-diff th{background:var(--light);font-size:10px;letter-spacing:.7px;text-transform:uppercase;color:var(--muted)}
.sp-old{color:#8b2f2f}.sp-new{color:#5E8E3E}
.sp-manual{font-size:8px;font-weight:700;background:#FBF3E3;color:#8a6d24;border:1px solid #E8D6AE;border-radius:3px;padding:0 3px}
.sp-ck{display:flex;gap:7px;align-items:center;font-size:12.5px;margin:6px 0}
@media(max-width:1100px){.sp-split{grid-template-columns:1fr}.sp-side{position:static}}

/* ── Shopify ↔ models mapping screen ── */
.pm-chip{display:inline-block;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;padding:2px 7px;border-radius:12px;white-space:nowrap}
.pm-ok{background:#E4EFE7;color:#1f5130}
.pm-auto{background:#EDF3EE;color:#5E8E3E}
.pm-todo{background:#FBF3E3;color:#8a6d24}
.pm-svc{background:#EFEAE2;color:#6B7A6F}
.sp-img{margin-bottom:10px;border:1px solid var(--border);border-radius:6px;overflow:hidden;background:var(--light);height:150px;display:flex;align-items:center;justify-content:center}
.sp-img img{max-width:100%;max-height:150px;object-fit:contain;display:block}
.sp-links{display:flex;gap:10px;margin-bottom:10px;font-size:11.5px}
.sp-links a{color:#5E8E3E;text-decoration:none}

/* ── card tabs and Shopify panes ── */
.sp-tabs{display:flex;gap:2px;border-bottom:1px solid var(--border);margin-bottom:14px;overflow-x:auto;white-space:nowrap}
.sp-tabs button{font-family:inherit;font-size:13px;padding:8px 13px;border:none;background:none;cursor:pointer;color:var(--muted);border-bottom:2px solid transparent}
.sp-tabs button.on{color:var(--dark);border-bottom-color:var(--gold);font-weight:500}
.sp-raw{font-size:12.5px}
.sp-kv-row{display:grid;grid-template-columns:190px 1fr;gap:8px;padding:5px 0;border-bottom:1px solid var(--border)}
.sp-kv-row>span:first-child{color:var(--muted);font-size:12px}
.sp-tl{border-left:2px solid var(--border);padding-left:12px;margin-left:4px}
.sp-ev{margin-bottom:9px;font-size:12.5px}
.sp-ev-t{color:var(--muted);font-size:11px}
.sp-img{align-items:center}

/* ── layout A: stage accordions inside the order card ── */
.sp-acc{border:1px solid var(--border);border-radius:8px;margin-bottom:8px;overflow:hidden;background:var(--white)}
.sp-acc>summary{list-style:none;cursor:pointer;padding:9px 12px;background:var(--light);font-size:11.5px;font-weight:600;letter-spacing:.7px;text-transform:uppercase;display:flex;justify-content:space-between;align-items:center}
.sp-acc>summary::-webkit-details-marker{display:none}
.sp-acc>summary:hover{background:#F4F1E9}
.sp-acc[open]>summary{border-bottom:1px solid var(--border)}
.sp-acc-note{font-size:10px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--muted)}
.sp-acc-empty{color:#b9b2a4}
.sp-acc-full{color:#1f5130}
.sp-acc-body{padding:12px}
.sp-acc-body .section-title{display:none}

/* ── Shipping page (agent-tracking two-leg chip) ── */
.legs{display:flex;flex-direction:column;gap:3px}
.leg-row{display:flex;align-items:center;gap:5px;font-size:11px}
.leg-dot{width:6px;height:6px;border-radius:50%;flex:0 0 auto}
.leg-dot.done{background:var(--green)}
.leg-dot.active{background:var(--gold)}
.leg-dot.pending{background:var(--border)}
.leg-label{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;width:36px;flex:0 0 auto}
.leg-track.pending{color:var(--muted);font-style:italic}
.flag{font-size:8.5px;font-weight:700;letter-spacing:.3px;border-radius:3px;padding:1.5px 5px;white-space:nowrap}
.flag-us{background:#e7edff;color:#1a3a7a}
.flag-uk{background:#f5e9d6;color:#6b4a10}

.sp-ev-comment{background:#F2F6F0;border-left:3px solid #5E8E3E;padding:6px 8px;border-radius:0 4px 4px 0;margin-left:-14px}

/* ── Order card v2 (2026-10-10): header = the window title, working blocks, central stone card, linked orders ── */
.modal.sp-wide .sp-split{grid-template-columns:minmax(0,1fr) 300px}
.oc-head{padding:12px 24px;gap:8px 16px;flex-wrap:wrap}
.oc-head-l{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;min-width:0}
.oc-head-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.oc-word{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:500;color:var(--muted)}
.oc-numtxt{padding:0 2px;font:600 38px/1.1 'Cormorant Garamond',serif;color:var(--dark)}
.oc-head input.oc-num{width:150px}
.oc-meta{display:inline-flex;align-items:center;gap:8px;font-size:18px;flex-wrap:wrap;color:var(--dark)}
.oc-meta .oc-mut{color:var(--muted);font-size:15px}
.oc-mv{border:0;background:none;padding:0 3px;border-radius:3px;cursor:pointer;font:500 18px 'Jost',sans-serif;color:var(--dark)}
.oc-mv:hover{background:#FBF3DF}
.oc-head .oc-mv-in{width:auto;min-height:32px;padding:2px 8px;font-size:15px}
.oc-badges{display:inline-flex;flex-wrap:wrap;gap:5px}
.oc-bdg{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;background:var(--cream);color:var(--dark)}
.oc-bdg.urgent{background:#F7D6D1;color:#8E1B10}.oc-bdg.resize{background:#FBE7C0;color:#7A4B00}.oc-bdg.igi{background:#DCEADA;color:#1F4D23}
.oc-bdg.payplan{background:#FAF0C4;color:#6E5600}.oc-bdg.repair{background:#F0DADA;color:#6B2A2A}.oc-bdg.exchange{background:#DBE7F3;color:#0E3A5C}
.oc-chip{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--border);background:var(--white);border-radius:6px;padding:0 4px 0 9px;min-height:34px;text-transform:none;letter-spacing:0;font-size:12px;font-weight:400;color:var(--muted)}
.oc-chip select{border:0;background-color:transparent;min-height:30px;padding:0 24px 0 4px;width:auto;font-weight:600;color:var(--dark)}
.oc{font-size:13px}
.oc .oc-blk,.oc #order-prod-block{margin-top:18px}
.oc #oc-blk-order{margin-top:0}
.oc #order-prod-block>.oc-blk:first-child{margin-top:0}
.oc #order-prod-block>.oc-blk+.oc-blk{margin-top:18px}
.oc #order-prod-section .section-title,.oc #order-prod-section+hr{display:none}
.oc-blk-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-bottom:8px}
.oc-t{font-weight:600;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dark)}
.oc-hint{font-size:12px;color:var(--muted);text-transform:none;letter-spacing:0;font-weight:400}
.oc .sp{flex:1}
.oc-fld{display:flex;flex-direction:column;gap:4px;min-width:0}
.oc-fld>label,.oc label.oc-l{font-size:10px;letter-spacing:.09em}
.oc-fld em,.oc em.oc-tag{font-style:normal;margin-left:6px;padding:0 6px;border-radius:999px;background:var(--cream);letter-spacing:.03em;text-transform:none;font-size:10.5px;font-weight:500}
.oc-fld em.manual{background:#FBE7C0;color:#7A4B00}
.oc input[type=text],.oc input[type=number],.oc input[type=date],.oc select{min-height:34px;padding:6px 9px;border-width:1px}
.oc select{padding-right:26px}
.oc-g-order{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 12px}
.oc-pv{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.oc-pfx{display:flex;align-items:stretch;border:1px solid var(--border);border-radius:6px;overflow:hidden;background:var(--white);min-height:34px}
.oc-pfx>span{padding:0 8px;font-size:12px;color:var(--muted);background:var(--light);border-right:1px solid var(--border);display:flex;align-items:center}
.oc .oc-pfx input{border:0!important;border-radius:0!important;min-height:0;flex:1;min-width:0}
.oc-hints{display:flex;flex-wrap:wrap;gap:3px 18px;margin-top:8px;font-size:12px;color:var(--muted)}
.oc-hints b{color:var(--dark);font-weight:600}.oc-hints .hot{color:#B3261E;font-weight:600}
.oc-g-model{display:grid;grid-template-columns:136px minmax(0,1fr);gap:16px;align-items:start}
.oc-pic{display:grid;gap:6px;justify-items:start}
.oc-photo{position:relative;width:136px;aspect-ratio:1;border:1px solid var(--border);border-radius:8px;background:var(--light);display:grid;place-items:center;overflow:hidden;font-size:11px;color:var(--muted);text-align:center}
.oc-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:4px}
.oc-pic-actions{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:12px}
.oc-mf{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:10px 12px}
.oc-mf>.c6{grid-column:span 6}.oc-mf>.c3{grid-column:span 3}
.oc-warn{display:flex;gap:10px;align-items:flex-start;border:1px solid #E5ABA5;background:#FDF0EE;color:#7A1C14;border-radius:8px;padding:8px 12px;margin-bottom:10px;font-size:12.5px;line-height:1.45}
.oc-warn .ic{flex:none;width:18px;height:18px;border-radius:50%;background:#B3261E;color:#fff;font-weight:700;font-size:12px;display:grid;place-items:center;margin-top:1px}
.oc-attn{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;border:1px solid #E5ABA5;background:#FDF0EE;color:#7A1C14;border-radius:8px;padding:8px 12px;margin-bottom:14px;font-size:12.5px}
.oc-attn .ic{flex:none;width:18px;height:18px;border-radius:50%;background:#B3261E;color:#fff;font-weight:700;font-size:12px;display:grid;place-items:center}
.oc-link{border:0;background:none;padding:0;text-decoration:underline;cursor:pointer;font-family:'Jost',sans-serif;font-weight:600;font-size:inherit;color:inherit}
.oc-cs-h .oc-link{font-size:12px;font-weight:500;color:var(--muted)}
.oc-ghost{border:1px dashed #BDB6A5;background:transparent;border-radius:999px;padding:2px 10px;font:inherit;font-size:12px;color:var(--muted);cursor:pointer;display:inline-block}
.oc-ghost:hover{border-color:var(--gold);color:var(--dark)}
.oc-mini{border:1px solid var(--border);background:var(--white);border-radius:5px;padding:1px 9px;font:inherit;font-size:12px;cursor:pointer;color:var(--dark)}
.oc-mini:hover{border-color:var(--gold)}
.oc-btn{border:1px solid var(--border);background:var(--white);border-radius:6px;padding:5px 12px;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap;color:var(--dark)}
.oc-btn:hover{border-color:var(--gold)}
.oc :focus-visible,.oc-head :focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* central stone card */
.oc-cs{border:1px solid var(--border);border-radius:10px;background:var(--light);padding:12px 14px;margin-bottom:10px}
.oc-cs-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.oc-cs-r1{display:grid;grid-template-columns:minmax(0,300px) 96px 112px auto;gap:10px 12px;align-items:start}
.oc-boxes{display:flex;gap:8px;flex-wrap:nowrap}
.oc-imgpop{position:fixed;inset:0;z-index:1300;background:rgba(20,18,14,.45);display:flex;align-items:center;justify-content:center;cursor:zoom-out}
.oc-imgpop-b{background:var(--white,#fff);border-radius:10px;padding:8px;box-shadow:0 18px 40px -12px rgba(0,0,0,.55);max-width:min(440px,calc(100vw - 32px))}
.oc-imgpop-b img{display:block;width:100%;max-height:min(420px,calc(100vh - 120px));object-fit:contain;border-radius:6px}
.oc-imgpop-c{font:11.5px/1.3 ui-monospace,Menlo,monospace;color:var(--muted,#777);margin-top:6px;text-align:center}
.oc-pill-prio:has(input:checked){background:#FDE7D2;border-color:#F0C9A4;color:#A24A0B}
.oc-igibox{display:flex;align-items:center;gap:8px;min-height:34px;border:1px solid var(--border);border-radius:6px;background:var(--white);padding:5px 10px;cursor:pointer;white-space:nowrap;font-size:13px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--dark)}
.oc-igibox:hover{border-color:#C7BFAB}
.oc-igibox:has(input:checked){background:#EAF3EC;border-color:#BFE0C8;color:#1F5A34}
.oc-igibox input{width:15px;height:15px;accent-color:#B8913F;margin:0;cursor:pointer}
.oc .cs-real-hint{font-size:11.5px;line-height:1.35}
.cs-real-hint.y{color:#7D5A00}.cs-real-hint.r{color:#B3261E;font-weight:600}
.oc-cs-r2{display:grid;grid-template-columns:150px auto minmax(0,1fr);gap:10px 12px;align-items:end;margin-top:10px}
.oc .cs-sku{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.01em}
.oc-invis{visibility:hidden}
.cs-status{min-width:0}
.oc-st{display:flex;flex-wrap:wrap;align-items:center;gap:5px 10px;border-radius:8px;padding:6px 11px;font-size:12.5px;line-height:1.4;border:1px solid transparent;min-height:34px}
.oc-st.ok{background:#EAF3EC;border-color:#BFE0C8;color:#1F5A34}.oc-st.warn{background:#FFF2CC;border-color:#E8D080;color:#6B4600}
.oc-st.bad{background:#FDEEEC;border-color:#E9B3AD;color:#8E1B10}.oc-st.idle{background:var(--white);border-color:var(--border);color:var(--muted)}
.oc-st .btns{display:inline-flex;gap:6px;flex-wrap:wrap}
.oc-st .chipn{background:#CFE2F3;color:#0D3B45;padding:1px 9px;border-radius:999px;font-size:11px;font-weight:500}
.oc-st .oc-btn{background:var(--white)}
.oc-cs .cs-desc{font-size:11.5px;color:var(--muted);margin-top:6px;line-height:1.4}
.oc-cs .cs-warn{margin-top:6px}
.oc-pk{margin-top:10px;border:1px solid var(--border);border-radius:8px;background:var(--white);overflow:hidden}
.oc-pk-h{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;padding:8px 12px;background:var(--cream);font-size:12px}
.oc-pk-g{padding:8px 12px 3px;font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.oc-pk-r{display:grid;grid-template-columns:86px 44px minmax(0,1fr) auto auto;gap:4px 12px;align-items:center;padding:7px 12px;border-top:1px solid #EEE9DD}
.oc-pk-r.cur{background:#F2F7F0}
.oc-desc-r{display:flex;gap:10px;align-items:center;padding:2px 0 4px}
.oc-desc-r .t{min-width:0}
.oc-desc-r .oc-pk-img{flex:0 0 auto;width:48px;height:48px}
.filter-tag.rts-red{border-color:#C0392B;color:#B91C1C;background:#FDECEA}
.filter-tag.rts-red .c{background:#C0392B;color:#fff}
.filter-tag.rts-red.active{background:#C0392B;color:#fff}
.oc-pk-img{display:block;width:40px;height:40px;border-radius:6px;overflow:hidden;background:var(--light);border:1px solid var(--border)}
.oc-pk-img.none{background:transparent;border-color:transparent}
.oc-pk-img img{width:100%;height:100%;object-fit:cover;display:block}
.oc-pk-r .n{font-size:12px}.oc-pk-r .n span{color:var(--muted)}
.oc-pk-f{padding:7px 12px;border-top:1px solid #EEE9DD;font-size:11.5px;color:var(--muted);background:var(--light)}
.oc-igirow{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 16px;margin-top:12px;padding-top:12px;border-top:1px dashed #D5CDB9}
.oc-igirow .oc-fld{width:min(320px,100%)}
.oc-igirow.need input{border-color:#E0A030;background:#FFFAEA}
.oc-igi-note{font-size:11.5px;color:var(--muted);align-self:center}
.oc-igi-note.need{color:#7D5A00;font-weight:500}
.oc-sd{margin-top:12px;border:1px solid var(--border);border-radius:10px;padding:12px 14px}
.oc-sd-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.oc .order-side-row{display:grid;grid-template-columns:30px minmax(0,1fr) 110px 70px 28px;gap:8px;margin-bottom:4px;align-items:center}
.oc-sd-cols{display:grid;grid-template-columns:30px minmax(0,1fr) 110px 70px 28px;gap:8px;margin-bottom:2px}
.ss-thumb{width:30px;height:30px;border-radius:6px;background:var(--light,#f3f1ec);overflow:hidden;display:block}
.ss-thumb .oc-pk-img{width:30px;height:30px;border:0;border-radius:6px}
.ss-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ss-namebox{position:relative;min-width:0}
.ss-namebox .ss-sku{position:absolute;right:10px;top:50%;transform:translateY(-50%);font:11px/1 'Courier New',monospace;color:#a7a39a;pointer-events:none;background:var(--white,#fff);padding-left:4px}
.ss-namebox .ss-sku.bad{color:#B3261E;font-weight:600}
.ss-namebox.has-sku .ss-name{padding-right:84px}
.oc-x{border:0;background:none;color:#C4502B;cursor:pointer;font-size:15px;line-height:1;padding:4px 6px}

/* notes + flags */
.oc-two{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:18px}
.oc-nt{display:grid;border:1px solid var(--border);border-radius:8px;overflow:hidden}
.oc-nt-r{display:grid;grid-template-columns:150px minmax(0,1fr);gap:10px;padding:6px 12px;border-top:1px solid var(--border);align-items:start}
.oc-nt-r:first-child{border-top:0}
.oc-nt-r.auto{background:#E8F2E6;padding-block:8px;align-items:center}
.oc-nt-r>label{padding-top:8px}
.oc-nt-r.auto>label,.oc-nt-r.oc-empty>label{padding-top:0}
.oc-nt-r.oc-empty{align-items:center}
.oc-nt-r textarea{min-height:34px;padding:6px 9px;border-width:1px;resize:vertical}
.oc-flags{display:flex;flex-wrap:wrap;gap:6px}
.oc-pill{position:relative;border:1px solid var(--border);background:var(--white);border-radius:999px;padding:3px 11px;cursor:pointer;display:inline-flex;align-items:center;font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--dark)}
.oc-pill input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;width:100%;height:100%}
.oc-pill:has(input:checked){background:var(--dark);color:#fff;border-color:var(--dark)}
.oc-pill:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:2px}
.oc-rts{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-top:10px;font-size:12px;color:var(--muted)}
.oc-rts select{width:auto;min-width:110px}
.oc-rts input{width:110px}

/* linked orders */
.oc-lk{border:1px solid var(--border);border-radius:8px;overflow:hidden}
.oc-lk-r{display:grid;grid-template-columns:104px minmax(0,1fr) auto;gap:4px 12px;align-items:center;padding:7px 12px;border-top:1px solid var(--border)}
.oc-lk-r:first-child{border-top:0}
.oc-lk-r.here{background:var(--cream)}
.oc-lk-r .who{min-width:0}.oc-lk-r .who .s{color:var(--muted)}
.oc-lk-r .acts{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.oc-lk-empty{padding:9px 12px;color:var(--muted);font-size:12.5px}
.oc-kind{display:inline-block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;padding:1px 9px;border-radius:999px;justify-self:start;background:var(--cream);white-space:nowrap;color:var(--dark)}
.oc-kind.recast{background:#E6E0F3;color:#3D2A6B}.oc-bdg.recast{background:#E6E0F3;color:#3D2A6B}
.oc-kind.payment{background:#FAF0C4;color:#6E5600}.oc-kind.service{background:#DBE7F3;color:#0E3A5C}.oc-kind.repair{background:#F0DADA;color:#6B2A2A}.oc-kind.exchange{background:#DBE7F3;color:#0E3A5C}
.oc-chp{display:inline-block;padding:0 8px;border-radius:999px;font-size:10.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.oc-chp.green{background:#DCEADA;color:#1F4D23}.oc-chp.amber{background:#FFF2CC;color:#7D4E00}.oc-chp.cur{background:var(--dark);color:#fff}
.oc-mark{margin-top:8px;font-size:12px}
.oc-mark>summary{cursor:pointer;color:var(--muted);list-style:none}
.oc-mark>summary::-webkit-details-marker{display:none}
.oc-mark>summary::before{content:"▸ ";font-size:9px}
.oc-mark[open]>summary::before{content:"▾ "}
.oc-mark .mk{margin-top:6px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}

/* Production list: families (2026-10-11) - a main order with its parts, recast parts and extras under it */
.pf-ex{display:inline-block;width:16px;color:var(--muted);font-size:11px;cursor:pointer;user-select:none}
.pf-ex:hover{color:var(--gold)}
.pf-kt{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:3px;font-size:9px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;vertical-align:1px}
.pf-chip{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;font-size:10.5px;color:#7A5010;background:#FBF0D4;white-space:nowrap}
.pf-sel{margin-left:10px;font-size:10.5px;color:var(--gold);cursor:pointer;text-decoration:underline;white-space:nowrap}
.pf-em{color:#B8B2A4}
tr.pf-kid>td:first-child{box-shadow:inset 3px 0 0 var(--gold)}
tr.pf-dim>td{opacity:.5}
td.pf-hl{background:#F3DFA4 !important;font-weight:600}

/* recast parts: new / attach form in Linked orders, stones fields on the recast card, family expense line */
.oc-rcf{border:1px solid var(--border);border-radius:8px;background:var(--cream);padding:10px 12px;margin-bottom:10px}
.oc-rcf-h{font-weight:600;font-size:12.5px;margin-bottom:6px}
.oc-rcf-g{display:grid;grid-template-columns:minmax(0,2fr) 90px minmax(0,1.4fr);gap:8px 12px}
.oc-rcf-ck{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:12px;margin-top:5px;text-transform:none;letter-spacing:0;font-weight:400}
.oc-rcf-b{display:flex;gap:10px;align-items:center;margin-top:8px}
.oc-rcs{border:1px solid var(--border);border-radius:8px;background:var(--cream);padding:8px 12px;margin:8px 0}
.oc-rcs-ck{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:12.5px;text-transform:none;letter-spacing:0;font-weight:400}
.oc-rcs-n{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:12.5px;margin-top:6px}
.oc-rcs-n input[type=number]{width:64px}
.oc-fam{margin-top:8px;font-size:12.5px;color:var(--muted)}.oc-fam b{color:var(--dark)}
@media(max-width:700px){.oc-rcf-g{grid-template-columns:1fr}}

/* scrap a weight (card, More → Metal Loss) */
.oc-scr-l{margin-bottom:6px}
.oc-scr-r{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12.5px;padding:3px 0}
.oc-scr-f{display:grid;gap:4px;margin-top:6px}
.oc-scr-f label{font-size:11px;color:var(--muted);margin:4px 0 0}
.oc-scr-f input[type=number],.oc-scr-f input[type=text],.oc-scr-f select{width:100%}
.oc-scr-f .oc-scr-ck{display:flex;gap:6px;align-items:flex-start;font-size:12px;color:var(--dark);margin-top:6px;text-transform:none;letter-spacing:0;font-weight:400}
.oc-scr-f .oc-scr-ck input{margin-top:3px;flex:none}
.oc-scr-rc{border-left:3px solid var(--border);padding:2px 0 2px 10px;margin:2px 0 0}
.oc-scr-rep{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:4px}
.oc-scr-f .oc-scr-rep label{text-transform:none;letter-spacing:0;font-weight:400;font-size:12px;margin:0}
.oc-scr-rep input[type=number]{width:64px}
.oc-scr-prev{font-size:12px;line-height:1.5;background:var(--cream);border-radius:6px;padding:7px 9px;margin-top:6px}
.oc-scr-warn{font-size:12px;color:#8A3B12;margin-top:4px}

/* production row */
.oc-acc{border:1px solid var(--border);border-radius:8px;margin-top:18px;overflow:hidden}
.oc-acc>summary{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;padding:10px 14px;background:var(--light)}
.oc-acc>summary::-webkit-details-marker{display:none}
.oc-acc>summary::before{content:"▸";font-size:10px;color:var(--muted)}
.oc-acc[open]>summary::before{content:"▾"}
.oc-acc-t{font-weight:600}
.oc-acc-in{padding:14px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:18px}
.oc-acc-in .full{grid-column:1 / -1}
.oc-mini-rt{display:inline-grid;grid-template-columns:repeat(12,7px);gap:2px}
.oc-seg{display:block;height:7px;border-radius:2px;background:#E6E2D7}
.oc-seg.done{background:#25588A}.oc-seg.now{background:var(--gold);outline:2px solid rgba(201,169,110,.5);outline-offset:1px}
.oc-seg.skip{background:repeating-linear-gradient(45deg,#D9D3C6 0 3px,#fff 3px 6px)}
.oc-ld-r{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;align-items:baseline;padding:5px 0;border-top:1px solid #EEE9DD}
.oc-ld-r:first-child{border-top:0}
.oc-ld-n{display:flex;align-items:center;color:var(--muted)}
.oc-ld-r b{font-variant-numeric:tabular-nums;text-align:right}
.oc-ld-d{grid-column:2;text-align:right;font-size:11.5px;font-variant-numeric:tabular-nums}
.oc-ld-d.neg{color:#9A5B00}.oc-ld-d.pos{color:#2F6B34}
.oc-nil{color:#A7AEA7}
.oc-bt{display:grid;gap:7px}.oc-bt-r{display:grid;gap:1px;font-size:12.5px}
.oc-lbl{font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);display:inline-flex;align-items:center}
.oc-hist{max-height:380px;overflow:auto;border:1px solid var(--border);border-radius:8px}
.oc-hist-r{display:grid;grid-template-columns:100px 150px minmax(0,1fr);gap:4px 12px;padding:6px 12px;border-top:1px solid #EEE9DD;font-size:12.5px;align-items:baseline}
.oc-hist-r:first-child{border-top:0}
.oc-hist-r .t{color:var(--muted);font-variant-numeric:tabular-nums;font-size:11.5px}
.oc-hist-r .w{color:var(--muted)}
.oc-hist-r .ring{color:var(--muted);font-size:11px}
.oc-hist-r.erp .w{color:#25588A}
.oc-hist-r.comment{background:#FBF6E6}
.oc-hist-r.comment .w{color:#8A5A00}
.oc-hist-r.shopify .w{color:#5E8E3E}
.oc-hist-f{display:flex;gap:6px;flex-wrap:wrap;padding:8px 10px;border-bottom:1px solid #EEE9DD;position:sticky;top:0;background:var(--white);z-index:1}
.oc-hist-f button{border:1px solid var(--border);background:var(--white);border-radius:12px;padding:1px 10px;font:inherit;font-size:11.5px;cursor:pointer;color:var(--muted)}
.oc-hist-f button.on{background:var(--dark);color:#fff;border-color:var(--dark)}
.oc-hist-f button i{font-style:normal;opacity:.7;margin-left:3px}
.oc-hist-r.qc .x1{font-weight:600}
.oc-hist-e{padding:10px 12px;color:var(--muted);font-size:12.5px}

/* right column */
.oc-links{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;margin-bottom:10px}
.oc-links a{color:#2F6B34;text-decoration:none;font-weight:500}
.oc-links a:hover{text-decoration:underline}
.oc-cust-name{display:inline-flex;align-items:center;gap:4px;border:0;border-bottom:1.5px dashed #B5AE9E;background:none;padding:0;cursor:pointer;font:600 14px 'Jost',sans-serif;text-align:left;color:var(--dark)}
.oc-cust-name:hover,.oc-cust-name[aria-expanded="true"]{background:#FBF3DF}
.oc-cust-sum{font-size:12px;margin-top:6px;color:var(--muted)}
.oc-pop{position:fixed;z-index:1100;width:min(480px,calc(100vw - 24px));background:var(--white);border:1px solid var(--border);border-radius:10px;box-shadow:0 18px 36px -12px rgba(0,0,0,.5);padding:12px 14px;max-height:min(460px,calc(100vh - 40px));overflow:auto;font-size:13px}
.oc-pop-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:4px}
.oc-pop-g{margin:10px 0 4px;font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.oc-pop-r{display:grid;grid-template-columns:60px minmax(0,1fr) auto;gap:2px 10px;align-items:center;padding:6px 0;border-top:1px solid #EEE9DD;font-size:12.5px}
.oc-pop-g+.oc-pop-r{border-top:0}
.oc-pop-r.here{background:var(--cream);margin-inline:-6px;padding-inline:6px;border-radius:5px}
.oc-pop-r .d{grid-column:2;color:var(--muted);font-size:11.5px}
.oc-pop-r .why{grid-column:2 / -1;font-size:11.5px;color:#7D4E00}
.oc-pop-r .oc-mini{grid-row:1;grid-column:3}
.oc-pop-old{font-size:12px;color:var(--muted)}
.oc-pop-lnk{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.oc-pop-lnk a{border:1px solid var(--border);background:var(--white);border-radius:6px;padding:3px 9px;font-size:12px;text-decoration:none;color:var(--dark)}
.oc-pop-lnk a.oc-lnk-main{background:#E8F2E6;border-color:#BFD9BE;color:#1F4D23;font-weight:500}
.oc-pop-lnk a:hover{border-color:var(--gold)}
.oc-pop-f{margin-top:10px;padding-top:8px;border-top:1px solid #EEE9DD}
.oc-total{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.oc .oc-total input,.sp-side .oc-total input{width:110px;min-height:30px;padding:3px 8px;font-weight:600}
.oc-money{font:600 17px/1.2 'Jost',sans-serif;color:var(--dark);font-variant-numeric:tabular-nums}
.oc-money-eur{font-size:11px;margin-top:2px;font-variant-numeric:tabular-nums}
.oc-foot{justify-content:flex-start}
.oc-msg{margin-left:auto;font-size:12.5px;color:var(--muted)}
.oc-msg.dirty{color:var(--dark);font-weight:600}
.oc-toast-inline{font-size:12px;color:#7D4E00}
@media(max-width:900px){
  .oc-g-order{grid-template-columns:repeat(2,minmax(0,1fr))}
  .oc-cs-r1{grid-template-columns:1fr 1fr}.oc-cs-r1>:first-child{grid-column:1 / -1}
  .oc-cs-r2{grid-template-columns:150px minmax(0,1fr)}.oc-cs-r2>.cs-status{grid-column:1 / -1}
  .oc-two{grid-template-columns:1fr}
  .oc-g-model{grid-template-columns:1fr}
  .oc-mf>.c3{grid-column:span 6}.oc-mf>.c6{grid-column:span 12}
  .oc-acc-in{grid-template-columns:1fr}
  .oc-hist-r{grid-template-columns:1fr}
}
@media(max-width:560px){
  .oc-nt-r{grid-template-columns:1fr;gap:2px}
  .oc .order-side-row,.oc-sd-cols{grid-template-columns:minmax(0,1fr) 72px 28px}
  .oc .order-side-row>.ss-namebox{grid-column:1 / -1}.ss-thumb{display:none}.oc-sd-cols{display:none}
  .oc-lk-r{grid-template-columns:1fr auto}.oc-lk-r>.oc-kind{grid-column:1 / -1}
}

/* Return tracking / Received back (repair addon and exchange): same field look as the rest of the order card, labels on one line */
.oc-ret{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 12px;align-items:start;margin-bottom:10px}
.oc-ret .form-group{gap:5px;min-width:0}
.oc-ret label{font-size:10px!important;letter-spacing:.09em!important;font-weight:600;text-transform:uppercase;color:var(--muted);line-height:1.3}
.oc-ret input{width:100%;min-height:34px;padding:6px 9px;border-width:1px;box-sizing:border-box}

/* ── Units block of the order card (server/units-api.js, public/js/order-units.js; owner 2026-11-07) ── */
.ou-unit{border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--white);margin-bottom:12px}
.ou-unit.closed{opacity:.75}
.ou-uh{background:var(--dark);color:var(--cream);padding:10px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.ou-unit.closed .ou-uh{background:#6B7A6F}
.ou-uh .t{font:500 18px 'Cormorant Garamond',serif;color:var(--gold)}
.ou-unit.closed .ou-uh .t{color:var(--cream)}
.ou-uh .sp{flex:1}
.ou-mk{display:inline-block;font:500 12px ui-monospace,Menlo,monospace;background:var(--cream);color:var(--dark);border-radius:4px;padding:1px 7px;white-space:nowrap}
.ou-uh .ou-mk{background:rgba(237,232,220,.16);color:var(--gold)}
.ou-ch{display:inline-flex;align-items:center;padding:2px 10px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.04em;white-space:nowrap}
.ou-ok{background:#DCEADA;color:#1F4D23}.ou-work{background:#FBE7C0;color:#7A4B00}.ou-bad{background:#F7D6D1;color:#8E1B10}.ou-info{background:#DBE7F3;color:#0E3A5C}.ou-grey{background:var(--cream);color:var(--muted)}
.ou-ub{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:8px 14px;border-bottom:1px solid var(--border);background:var(--light)}
.ou-ub .sp{flex:1}
.ou-lab{padding:10px 14px 2px;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.ou-lad{list-style:none;margin:0;padding:4px 14px 12px}
.ou-at{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr);gap:0 10px;padding-bottom:8px}
.ou-at:before{content:"";position:absolute;left:14px;top:28px;bottom:-2px;width:2px;background:var(--border)}
.ou-at:last-child:before{display:none}
.ou-nd{width:30px;height:30px;border-radius:50%;background:var(--cream);border:2px solid var(--border);display:grid;place-items:center;font:600 12px 'Jost',sans-serif;color:var(--muted);z-index:1}
.ou-at.cur .ou-nd{background:var(--gold);border-color:var(--gold);color:var(--dark)}
.ou-ac{border:1px solid var(--border);border-radius:8px;background:var(--cream);padding:7px 11px;min-width:0}
.ou-at.cur .ou-ac{background:var(--white);border:1.5px solid var(--gold)}
.ou-at.here .ou-ac{box-shadow:0 0 0 2px rgba(201,169,110,.35)}
.ou-ar{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:13px}
.ou-ar .k{font-weight:600}.ou-ar .m{color:var(--muted);font-size:12px}.ou-ar .sp{flex:1}
.ou-ad{margin-top:4px;font-size:12px;color:var(--muted)}
.ou-aa{margin-top:6px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ou-form{padding:10px 14px;border-bottom:1px solid var(--border);background:#FFFDF6;display:none}
.ou-form.open{display:block}
.ou-fg{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px 12px;align-items:end;margin-bottom:8px}
.ou-note{font-size:12px;color:var(--muted)}
.ou-sum{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:13px;color:var(--muted);margin-bottom:10px}
.ou-sum b{color:var(--dark);font-weight:600}
.ou-frz{border:1px solid var(--border);border-radius:8px;background:var(--light);padding:8px 14px}
.ou-frz.open{background:#FFF7E3;border-color:#E8D49A}
.ou-frz-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}.ou-frz-h .sp{flex:1}
.ou-frz-t{border-collapse:collapse;font-size:12px;margin:6px 0}.ou-frz-t th,.ou-frz-t td{padding:3px 12px 3px 0;text-align:left}