/* Shared drawer geometry: reference system 80% / 70% viewport widths. */
@media screen {
  :root{--drawer-secondary:81vw;--drawer-tertiary:70vw;--drawer-header:58px;--drawer-footer:68px}
  #modal-root .demo-modal,dialog#drawer[open]{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:auto!important;transform:none!important;width:var(--drawer-secondary)!important;max-width:none!important;height:100dvh!important;max-height:100dvh!important;margin:0!important;border:0!important;border-radius:0!important;display:flex!important;flex-direction:column!important;box-sizing:border-box;overflow:hidden;animation:drawer-enter .18s ease-out!important}
  #modal-root:has(.sda-underlay)>.demo-modal,#modal-root:has(.drawer-parent)>.demo-modal{width:var(--drawer-tertiary)!important}
  #modal-root .demo-modal>.modal-head,#drawer>.drawer-head{box-sizing:border-box;flex:0 0 auto;min-height:var(--drawer-header);height:auto!important;border-radius:0!important;padding:12px 20px!important;background:#fff;border-bottom:1px solid #eee}
  #modal-root .demo-modal>.modal-head h2,#drawer>.drawer-head h2{font-size:20px;font-weight:400;margin:0}
  #modal-root .demo-modal>.modal-content,#drawer>#drawer-body{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain}
  #modal-root .demo-modal>.modal-foot{flex:0 0 auto;min-height:var(--drawer-footer);margin:0!important;padding:14px 20px!important;border-radius:0!important;background:#fff;border-top:1px solid #eee;display:flex;align-items:center;justify-content:center;gap:18px}
  #modal-root .demo-modal>.modal-foot[hidden]{display:none}
  #modal-root .demo-modal>.modal-foot button{min-height:34px}
  #modal-root .modal-shade{position:fixed;inset:0;background:rgba(0,0,0,.45)}
  #modal-root .drawer-parent{position:fixed;top:0;right:0;width:var(--drawer-secondary);height:100dvh;background:#fff;pointer-events:none;overflow:hidden;z-index:1000}
  #modal-root .drawer-parent:after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.4)}
  #modal-root:has(.drawer-parent)>.demo-modal{z-index:1002!important}
  #modal-root .drawer-snapshot{position:relative!important;inset:auto!important;transform:none!important;width:100%!important;max-width:none!important;height:100%!important;max-height:none!important;display:flex;flex-direction:column;border-radius:0;background:#fff;overflow:hidden}
  #modal-root .drawer-snapshot>.modal-head{flex:none;min-height:58px;padding:12px 20px;background:#fff;box-sizing:border-box}
  #modal-root .drawer-snapshot>.modal-content{flex:1;min-height:0;overflow:hidden}
  #modal-root .drawer-snapshot>.modal-foot{flex:none}
  #modal-root .sda-underlay{position:fixed;inset:0 0 0 auto;width:var(--drawer-secondary);height:100dvh;pointer-events:none;z-index:1000;overflow:hidden}
  #modal-root .sda-underlay:after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.4)}
  #modal-root:has(.sda-underlay)>.demo-modal{z-index:1002!important}
  #modal-root .sda-underlay .demo-modal{width:var(--drawer-secondary)!important;animation:none!important}
  .cd-address-drawer .cd-address-create-form{width:76%;max-width:1050px}
  .cd-address-drawer .cd-address-create-form>label{grid-template-columns:110px minmax(0,1fr);margin-bottom:28px;gap:14px}
  .cd-address-drawer .cd-address-create-form input,.cd-address-drawer .cd-address-create-form select{height:30px}
  .cd-address-drawer .cd-address-create-form>label>span{font-size:14px}
  #drawer .actions{position:sticky;bottom:0;background:#fff;border-top:1px solid #eee;padding:14px 20px;min-height:var(--drawer-footer);box-sizing:border-box}
  /* Shipment form proportions measured from the supplied reference. */
  .oc-segments{display:flex;flex-wrap:wrap;align-items:center;gap:0}
  .oc-segments>label{position:relative;display:block;margin:0;cursor:pointer}
  .oc-segments>label>input[type=radio]{position:absolute;inset:0;opacity:0;width:100%;height:100%!important;margin:0;cursor:pointer}
  .oc-segments>label>span{display:flex;align-items:center;justify-content:center;min-width:72px;min-height:30px;box-sizing:border-box;padding:4px 16px;border:1px solid #ddd;background:#fff;color:#80878d;font-size:12px}
  .oc-segments>label+label>span{margin-left:-1px}
  .oc-segments>label>input:checked+span{position:relative;pointer-events:none;border-color:#5db660;color:#388a3a;background:#f1f8f1;z-index:1}
  .oc-segments>label>input:focus-visible+span{outline:2px solid #62b6e5;outline-offset:2px}
  #modal-root .order-drawer>.modal-head h2{font-size:16px}
  #modal-root .si-modal>.modal-foot [data-si-next]{width:38%;min-width:160px;height:34px;border:1px solid #5db660;border-radius:2px;background:#5db660;color:#fff;font-size:12px}
  #modal-root .order-drawer:has(.oc-order-form)>.modal-content{padding:20px 11% 28px 3%}
  .order-drawer .oc-order-form>.oc-columns{grid-template-columns:minmax(0,42fr) minmax(0,42fr);column-gap:16%}
  .order-drawer .oc-order-form .oc-columns .oc-field{grid-template-columns:minmax(0,28fr) minmax(0,72fr);gap:12px;align-items:center;margin-bottom:30px}
  .order-drawer .oc-order-form .oc-columns .oc-label{font-size:12px;line-height:16px}
  .order-drawer .oc-order-form .oc-columns input:not([type=checkbox]):not([type=radio]),.order-drawer .oc-order-form .oc-columns select{height:30px;font-size:12px}
  .order-drawer .oc-order-form .oc-columns .oc-section-title{font-size:18px;margin:34px 0 30px;max-width:none;padding-bottom:8px;font-weight:400}
  .order-drawer .oc-order-form .oc-columns .oc-flags{display:flex;flex-direction:column;gap:6px;padding-top:4px}
  .order-drawer .oc-order-form .oc-columns .oc-flags label{font-size:12px;line-height:20px;height:auto}
  .order-drawer .oc-order-form .oc-columns .oc-select:after{top:11px}
  #modal-root .order-drawer:has(.oc-order-form)>.modal-foot{padding-left:13%!important;padding-right:10%!important;gap:18px}
  #modal-root .order-drawer:has(.oc-order-form)>.modal-foot button{flex:1;width:auto;max-width:none;height:36px;font-size:12px}
  @media(max-width:1000px){#modal-root .order-drawer:has(.oc-order-form)>.modal-content{padding:20px}.order-drawer .oc-order-form>.oc-columns{column-gap:5%}.order-drawer .oc-order-form .oc-columns .oc-field{grid-template-columns:90px minmax(0,1fr);margin-bottom:22px}}
  @media(max-width:760px){.order-drawer .oc-order-form>.oc-columns{grid-template-columns:minmax(0,1fr);gap:20px}#modal-root .order-drawer:has(.oc-order-form)>.modal-foot{padding:12px!important;gap:8px}}
  @keyframes drawer-enter{from{translate:25px 0;opacity:.7}to{translate:0 0;opacity:1}}
  /* Shared single-line controls; tables and multiline/file/choice controls retain their own sizing. */
  :root{--form-control-height:30px}
  :is(main,.demo-modal,#drawer) :is(input:not([type]),input[type=text],input[type=number],input[type=tel],input[type=email],input[type=password],input[type=search],input[type=date],input[type=datetime-local],select):not(table input):not(table select){
    box-sizing:border-box;height:var(--form-control-height)!important;min-height:var(--form-control-height)!important;padding:4px 10px!important;font-size:12px;line-height:20px;border-radius:2px;
  }
  @media(max-width:760px){:root{--drawer-secondary:100vw;--drawer-tertiary:100vw}.cd-address-drawer .cd-address-create-form{width:100%}#modal-root .drawer-parent{display:none}}
  @media(prefers-reduced-motion:reduce){#modal-root .demo-modal,dialog#drawer[open]{animation:none!important}}
}
/* Picking layout matching the supplied warehouse screen. */
.sda-pick .sda-single{display:flex;align-items:center;gap:36px;max-width:none;margin:0 0 26px;flex-wrap:wrap}
.sda-pick .sda-single .nw-field{width:auto;margin:0;display:flex;align-items:center;gap:12px}
.sda-pick .sda-fill{display:flex;gap:0;align-items:center;margin:0 0 24px;width:100%}
.sda-pick .sda-fill input{width:0;flex:1;min-width:60px;height:30px;border:1px solid #ddd;border-radius:0;padding:6px 10px}
.sda-pick .sda-fill button{flex:none;margin-left:20px;background:#5db660;color:white;border:0;padding:8px 14px;border-radius:2px}
.sda-pick .sda-fill [data-sda-clear]{background:#ef4842;margin-left:12px}
.sda-pick .sda-grid table{width:100%;min-width:1000px;table-layout:fixed;border-collapse:collapse}
.sda-pick .sda-grid th,.sda-pick .sda-grid td{border:1px solid #ddd;text-align:center;padding:0;height:32px}
.sda-pick .sda-grid th{background:#f0f0f0;font-weight:400}
.sda-pick .sda-grid th:first-child{width:42px}.sda-pick .sda-grid th:nth-child(2){width:20%}
.sda-pick .sda-grid input{width:100%;min-width:0;border:0;text-align:center;background:transparent;font:inherit;color:inherit;padding:5px}
.sda-pick .sda-grid input[readonly]{color:#84909a}
.sda-pick .sda-total{display:flex;width:75%;margin:0 0 24px}.sda-pick .sda-total input{width:33.333%;min-width:0;border:1px solid #ddd;height:30px;padding:6px 10px;border-radius:0}.sda-pick .sda-total[hidden],.sda-pick .sda-fill[hidden],.sda-pick .nw-field[hidden]{display:none!important}
/* Compact picking footer actions. */
#modal-root .sda-pick>.modal-foot button{flex:0 0 auto;width:140px;max-width:35%;min-width:0}

/* Fee-entry reference: wide nested drawer, compact six-row worksheet. */
@media screen{
#modal-root .demo-modal.so-fee-editor{width:85.5vw!important}
#modal-root .so-fee-underlay{width:97.5vw}
#modal-root .so-fee-editor>.modal-head{min-height:52px;padding:12px 16px!important}
#modal-root .so-fee-editor>.modal-head h2{font-size:20px;line-height:28px}
#modal-root .so-fee-editor>.modal-content{padding:16px!important;background:#fff}
#so-fee-form{margin:0;padding:0}
.so-fee-editor .so-fee-grid table{min-width:1000px;table-layout:fixed}
.so-fee-editor .so-fee-grid th,.so-fee-editor .so-fee-grid td{height:24px;line-height:24px;font-size:12px;color:#657583;font-weight:400}
.so-fee-editor .so-fee-grid thead th{height:28px;line-height:28px;background:#eee}
.so-fee-editor .so-fee-grid th:first-child{width:4.2%}
.so-fee-editor .so-fee-grid th:nth-child(2){width:19%}
.so-fee-editor .so-fee-grid th:nth-child(3){width:10%}
.so-fee-editor .so-fee-grid th:nth-child(4){width:9.8%}
.so-fee-editor .so-fee-grid th:last-child{width:9.2%}
.so-fee-editor .so-fee-grid input,.so-fee-editor .so-fee-grid select{height:24px!important;min-height:0!important;padding:0 5px!important;font-size:12px!important;line-height:24px;text-align:center;border:0!important;border-radius:0!important;box-shadow:none!important}
.so-fee-editor .so-fee-grid select{appearance:none;background:linear-gradient(45deg,transparent 50%,#ddd 50%) calc(100% - 10px) 10px/4px 4px no-repeat,linear-gradient(135deg,#ddd 50%,transparent 50%) calc(100% - 6px) 10px/4px 4px no-repeat;padding-right:17px!important}
}

.so-payable-editor .so-fee-grid th:nth-child(2){width:8%}.so-payable-editor .so-fee-grid th:nth-child(3){width:18%}.so-payable-editor .so-fee-grid th:nth-child(4){width:9%}.so-payable-editor .so-fee-grid th:nth-child(5){width:9%}

.sda-delivery-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(180px,.8fr);gap:22px 50px;padding:0 10px;align-items:start}.sda-delivery-left,.sda-delivery-address{display:grid;gap:20px}.sda-delivery-layout .nw-field{margin:0;font-size:12px}.sda-delivery-layout .nw-field>span{flex:0 0 85px;text-align:right}.sda-delivery-layout input:not([type=checkbox]),.sda-delivery-layout select{height:30px}.sda-delivery-layout textarea{min-height:54px}.sda-delivery-summary{font-size:12px;line-height:1.85;overflow-wrap:anywhere;padding:0 8px}.sda-delivery-summary h3{font-size:16px;font-weight:400;margin:0 0 20px;border-bottom:1px solid #ddd}.sda-delivery-boxes{grid-column:1/3}.sda-delivery-boxes select[multiple]{height:160px!important;padding:4px}.sda-delivery-boxes option{padding:4px 8px}.sda-delivery-boxes em{color:#f55}@container(max-width:650px){.sda-delivery-layout{grid-template-columns:1fr;gap:20px}.sda-delivery-boxes{grid-column:1}}

#modal-root .sda-delivery-modal>.modal-foot{justify-content:center;gap:14px;min-height:56px;padding:12px 20px!important}#modal-root .sda-delivery-modal>.modal-foot button{flex:0 1 258px;width:258px;max-width:38%;min-height:28px;height:28px;font-size:12px;border-radius:0;padding:4px 12px}

.sda-ticket-modal .sda-single{max-width:640px;gap:22px;padding-top:0}.sda-ticket-modal .nw-field>span{width:95px;flex:0 0 95px;text-align:right;font-size:12px}.sda-ticket-modal input[readonly]{background:#f5f5f5;color:#a7adb3}.sda-ticket-modal .nw-field textarea{min-height:54px}.sda-ticket-switch .nw-checkbox{font-size:0;display:inline-flex}.sda-ticket-switch input[type=checkbox]{appearance:none;width:38px!important;height:20px!important;border:0!important;border-radius:12px!important;background:#bfc1c3;position:relative;cursor:pointer;margin:0}.sda-ticket-switch input[type=checkbox]:before{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #999}.sda-ticket-switch input[type=checkbox]:checked{background:#5cb85c}.sda-ticket-switch input[type=checkbox]:checked:before{left:20px}.sda-ticket-switch input[type=checkbox]:focus-visible{outline:2px solid #0086c9;outline-offset:2px}

#modal-root .demo-modal.shipment-stats-modal{left:3vw!important;right:3vw!important;top:4vh!important;bottom:auto!important;width:94vw!important;height:auto!important;max-height:90vh!important;transform:none!important}.shipment-stats-modal .modal-content{padding:14px 20px;background:#eff1f4}.shipment-stats-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:white;padding:0 10px}.shipment-stats-grid>div{text-align:center;padding:20px 8px;min-height:85px;box-sizing:border-box}.shipment-stats-grid strong{display:block;font-size:20px;line-height:28px;color:#78818b}.shipment-stats-grid span{display:block;font-size:12px;line-height:20px;color:#78818b}

/* Route editor matching the shipment reference. */
#modal-root .sda-route-modal .sda-single{width:100%;max-width:640px;gap:22px;padding-top:0}
#modal-root .sda-route-modal .nw-field{display:flex;gap:10px;align-items:flex-start}
#modal-root .sda-route-modal .nw-field>span{width:95px;flex:0 0 95px;text-align:right;font-size:12px;line-height:30px}
#modal-root .sda-route-modal .nw-field input,#modal-root .sda-route-modal .nw-field select{height:30px;min-height:30px;border-radius:0;font-size:12px}
#modal-root .sda-route-modal .sda-route-location{display:flex;gap:0}
#modal-root .sda-route-modal .sda-route-location input{flex:1;min-width:0;width:33.333%}
#modal-root .sda-route-modal .sda-route-location input+input{border-left:0}
#modal-root .sda-route-modal .nw-field textarea{min-height:54px;height:54px;border-radius:0;font-size:12px}
#modal-root .sda-route-modal .nw-field textarea[name=note]{height:225px;min-height:225px}
#modal-root .sda-route-modal>.modal-foot{justify-content:center;gap:14px;min-height:56px;padding:12px 20px!important}
#modal-root .sda-route-modal>.modal-foot button{flex:0 1 258px;width:258px;max-width:38%;min-height:28px;height:28px;font-size:12px;border-radius:0;padding:4px 12px}
.so-route-place,.so-route-note{font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere}

/* Compact supplier editor remains centered above the shipment. */
#modal-root>.demo-modal.sda-supplier-modal{top:7vh!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translateX(-50%)!important;width:min(720px,94vw)!important;height:auto!important;max-height:85vh!important;overflow:visible;animation:none!important}
#modal-root .sda-supplier-modal>.modal-head{min-height:44px;padding:10px 14px!important}
#modal-root .sda-supplier-modal>.modal-head h2{font-size:16px}
#modal-root .sda-supplier-modal>.modal-content{overflow:visible;padding:14px 28px 22px}
.sda-supplier-modal .sda-single{max-width:450px;gap:20px}
.sda-supplier-modal .nw-field{display:flex;gap:10px;align-items:center}
.sda-supplier-modal .nw-field>span{width:95px;flex:0 0 95px;text-align:right;font-size:12px}
.sda-supplier-modal .nw-field>div{flex:1;min-width:0}
.sda-supplier-modal input:not([type=hidden]){width:100%;height:30px;min-height:30px;border-radius:0;font-size:12px}
.sda-supplier-picker{position:relative}
.sda-supplier-menu:not([hidden]){position:absolute;top:32px;left:0;z-index:10;display:grid;grid-template-columns:140px minmax(180px,1fr);width:360px;max-width:65vw;background:white;box-shadow:0 4px 14px #0003;border:1px solid #eee}
.sda-supplier-menu>div{max-height:220px;overflow:auto;border-right:1px solid #eee}
.sda-supplier-menu button{display:block;width:100%;border:0;background:white;padding:8px 10px;text-align:left;font-size:12px;color:#788592}
.sda-supplier-menu button.active,.sda-supplier-menu button:hover{background:#eff7fa;color:#007db5}
.sda-supplier-menu button span{float:right}.sda-supplier-menu p{font-size:12px;padding:8px;color:#999}
#modal-root .sda-supplier-modal>.modal-foot{min-height:54px;padding:12px!important;gap:14px}
#modal-root .sda-supplier-modal>.modal-foot button{width:170px;height:26px;min-height:26px;font-size:12px;border-radius:0;padding:3px 10px}

/* Shared compact dialog actions: equal width, no full-row stretching. */
@media screen {
  #modal-root .demo-modal>.modal-foot, .modal>.modal-foot, .modal .modal-foot, #drawer .actions {
    display:flex!important;justify-content:center!important;align-items:center!important;flex-wrap:wrap!important;
    gap:12px!important;padding:12px 20px!important;min-height:54px!important;box-sizing:border-box;
  }
  #modal-root .demo-modal>.modal-foot button, .modal .modal-foot button, #drawer .actions button {
    flex:0 0 120px!important;width:120px!important;min-width:0!important;max-width:100%!important;
    height:30px!important;min-height:30px!important;margin:0!important;padding:4px 10px!important;
    box-sizing:border-box!important;font-size:12px!important;line-height:20px!important;border-radius:2px!important;
    display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap;
  }
  #modal-root .demo-modal>.modal-foot button svg, .modal .modal-foot button svg, #drawer .actions button svg {width:14px!important;height:14px!important;flex-shrink:0}
}