/* Scoped to the approved shipment-document surfaces; Customer Cart remains untouched. */
.sdx-overview,.sdx-approval,.sdx-dialog{font-family:Inter,Arial,sans-serif;color:#102033;box-sizing:border-box}
.sdx-overview *,.sdx-approval *,.sdx-dialog *{box-sizing:border-box}
.sdx-overview{background:linear-gradient(125deg,#f9fcff,#eef5fa);border:1px solid #cfdae4;border-radius:18px;padding:16px;margin:20px 0 12px;overflow:hidden}
.sdx-overview svg,.sdx-dialog svg,.sdx-approval svg{display:block;width:24px;height:24px;flex-shrink:0}
.sdx-heading{display:flex;gap:12px;align-items:center}.sdx-heading h3{font-size:18px!important;font-weight:750;margin:0!important;flex:1;min-width:0;line-height:1.3;color:#102033!important;letter-spacing:-.4px}
.sdx-heading-icon{display:grid;place-items:center;background:#f4b622;color:white;width:43px;height:48px;border-radius:13px;flex-shrink:0}.sdx-heading-icon svg{width:27px;height:30px}
.sdx-count{flex-shrink:0;border-radius:30px;background:#dcecff;color:#0063eb;font-size:14px;padding:8px 11px;white-space:nowrap}
.sdx-caption{font-size:13px;line-height:1.5;color:#526985;margin:14px 0 18px!important}.sdx-stack{padding:0 2px;max-height:530px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.sdx-layer{display:flex!important;position:relative;isolation:isolate;align-items:flex-start;gap:12px;text-align:left!important;width:100%;min-height:112px;margin:0;padding:16px 14px 28px!important;border:1px solid #cbd7e1!important;border-radius:14px!important;background:linear-gradient(130deg,#fff,#eaf1f6)!important;box-shadow:0 -3px 15px #15385520!important;color:#102033!important;cursor:pointer;overflow:hidden}
.sdx-layer+.sdx-layer{margin-top:-23px}.sdx-layer:last-child{padding-bottom:14px!important}.sdx-file-icon{display:grid;place-items:center;width:30px;height:38px;margin-top:3px;border-radius:5px;background:#e62035;color:white;flex-shrink:0}.sdx-file-icon svg{width:23px;height:27px}
.sdx-layer-copy{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0;z-index:1}.sdx-layer-copy b{font-size:13px;line-height:1.35;font-weight:750;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.sdx-layer-copy small{font-size:12px;color:#526985}
.sdx-thumb{width:88px;height:106px;border:1px solid #d1dce4;border-radius:9px;overflow:hidden;background:white;flex-shrink:0;display:grid;place-items:center}.sdx-layer .sdx-thumb{width:102px;height:95px;margin-top:-4px;margin-bottom:-22px;align-self:flex-start;transform:rotate(1deg)}
.sdx-thumb img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}.sdx-file-placeholder{display:flex;flex-direction:column;align-items:center;gap:8px;color:#648099}.sdx-file-placeholder svg{width:29px;height:34px}.sdx-file-placeholder small{font-size:10px;font-weight:800;letter-spacing:.6px}
.sdx-primary{display:flex!important;align-items:center;justify-content:center;gap:10px;background:#0065eb!important;border:0!important;border-radius:10px!important;color:#fff!important;width:100%;min-height:50px;font-size:15px!important;font-weight:700!important;padding:13px!important;margin-top:12px;cursor:pointer}.sdx-primary svg:last-child{width:18px;margin-left:auto}.sdx-primary svg:first-child{margin-left:auto}.sdx-primary:disabled{opacity:.55;cursor:wait}
.sdx-approval{display:flex;gap:13px;border:1px solid #d5e0ea;background:linear-gradient(120deg,#fff,#eef5fa);border-radius:17px;padding:17px 14px;margin:0 0 16px}.sdx-approval-icon{background:#0065eb;color:white;padding:10px;border-radius:13px;height:44px}.sdx-approval>div{flex:1;min-width:0}.sdx-approval button{padding:0!important;background:none!important;border:0!important;font-size:15px;font-weight:750;color:#102033!important;text-align:left;cursor:pointer;min-height:34px}.sdx-optional{display:inline-block;padding:5px 8px;border-radius:20px;background:#d8f3e1;color:#078834;font-size:11px;font-weight:750;margin-left:8px}.sdx-approval p{font-size:13px;line-height:1.55;color:#526985;margin:5px 0 0!important}
.sdx-dialog{inset:0;border:0;padding:0;margin:auto;width:min(700px,100%);height:100dvh;max-height:100dvh;max-width:100%;background:#0c1a28;overflow:auto;border-radius:0}.sdx-dialog::backdrop{background:#0b1825}.sdx-top{display:flex;align-items:center;gap:12px;padding:22px 18px 17px;color:white;background:#0c1a28;position:sticky;top:0;z-index:2}.sdx-top>div{flex:1;text-align:center;padding-right:44px;min-width:0}.sdx-top h2{font-size:19px;margin:0;color:white}.sdx-top p{margin:5px 0 0;font-size:14px;color:#b7c9da;overflow-wrap:anywhere}.sdx-top button{width:44px;height:44px;background:transparent;color:white;border:0;border-radius:10px;display:grid;place-items:center;cursor:pointer}
.sdx-sheet{background:#f8fbff;border-radius:16px 16px 0 0;min-height:calc(100dvh - 104px);padding:20px 16px max(24px,env(safe-area-inset-bottom))}.sdx-list-heading{display:flex;align-items:center;gap:12px;margin-bottom:20px}.sdx-list-icon{display:grid;place-items:center;border:1px solid #d2e0ee;background:#0065eb;box-shadow:0 0 0 7px #fff inset;color:white;border-radius:14px;width:52px;height:57px;flex-shrink:0}.sdx-list-heading>div{flex:1;min-width:0}.sdx-list-heading h2{font-size:18px;line-height:1.25;margin:0 0 5px;color:#102033}.sdx-list-heading p{font-size:12px;line-height:1.4;margin:0;color:#526985}.sdx-list-heading .sdx-count{font-size:12px;padding:7px 9px;align-self:flex-start}
.sdx-row{display:grid;grid-template-columns:83px minmax(0,1fr) 96px;gap:12px;padding:18px 0;border-bottom:1px solid #dfe8f0;align-items:start}.sdx-row .sdx-thumb{width:83px;height:110px}.sdx-info{min-width:0}.sdx-info h3{font-size:14px;font-weight:750;line-height:1.35;margin:4px 0 10px;overflow-wrap:anywhere;color:#102033}.sdx-info p,.sdx-info small{font-size:12px;line-height:1.5;margin:0 0 4px;color:#526985}.sdx-status{display:block;text-align:center;background:#e0efff;color:#0063dc;font-size:11px;font-weight:650;padding:6px 7px;border-radius:20px;line-height:1.3;overflow-wrap:anywhere}.sdx-status[data-status=approved],.sdx-status[data-status=supplier_accepted]{color:#087b4a;background:#dff3e9}.sdx-status[data-status=rejected],.sdx-status[data-status=correction_required],.sdx-status[data-status=replacement_required]{color:#a62d32;background:#fce7e8}.sdx-row-actions>div{display:flex;gap:7px;margin-top:13px}.sdx-row-actions button{flex:1;min-width:0;min-height:48px;padding:0;background:none;color:#112134;border:0;cursor:pointer}.sdx-row-actions button svg{border-radius:9px;background:#e7eef5;width:43px;height:34px;padding:7px 10px;margin:0 auto 4px}.sdx-row-actions small{display:block;color:#526985;font-size:10px}.sdx-dialog [data-sdx-add]{display:flex;align-items:center;justify-content:center;gap:12px;background:transparent!important;color:#0065eb!important;border:1px solid #0065eb!important;border-radius:10px;width:100%;margin-top:20px;min-height:50px;font-size:15px;font-weight:700}.sdx-retry{display:block;margin-top:8px;border:1px solid #bbccde;border-radius:8px;padding:8px 12px;color:#005bce;background:white}.sdx-overview button:focus-visible,.sdx-dialog button:focus-visible{outline:3px solid #2287f5;outline-offset:2px}
@media(max-width:359px){.sdx-overview{padding:12px}.sdx-heading h3{font-size:16px!important}.sdx-layer{gap:8px;padding-left:10px!important;padding-right:10px!important}.sdx-layer .sdx-thumb{width:75px}.sdx-sheet{padding:17px 12px}.sdx-row{grid-template-columns:63px minmax(0,1fr) 88px;gap:8px}.sdx-row .sdx-thumb{width:63px;height:90px}.sdx-list-heading{gap:8px}.sdx-list-heading h2{font-size:16px}.sdx-list-icon{width:43px}.sdx-info h3{font-size:13px}}
@media(min-width:700px){.sdx-stack{max-height:600px}.sdx-layer{min-height:125px}.sdx-layer-copy b{font-size:16px}.sdx-layer .sdx-thumb{width:135px;height:120px}.sdx-row{grid-template-columns:100px minmax(0,1fr) 140px}.sdx-row .sdx-thumb{width:100px;height:130px}.sdx-info h3{font-size:17px}.sdx-status{font-size:13px}.sdx-row-actions small{font-size:12px}}
.sdx-row-actions button svg{width:min(43px,100%)}
@media(max-width:359px){.sdx-row{grid-template-columns:63px minmax(0,1fr) 102px}.sdx-row-actions>div{gap:4px}}

/* Reference folder preview: real documents overlap behind a front pocket. */
.sdx-overview{background:#202528;border-color:#30363a;color:#f7f7f4}
.sdx-overview .sdx-heading h3{color:#f7f7f4!important}.sdx-overview .sdx-caption{color:#c7ccd2;margin:9px 0 10px!important}
.sdx-overview .sdx-stack{position:relative;isolation:isolate;height:106px;max-height:106px;overflow:hidden;padding:0;background:transparent;border-radius:12px}
.sdx-overview .sdx-stack:empty{display:none}
.sdx-overview .sdx-stack::before{content:'';position:absolute;inset:0;background:#3e4653;border-radius:12px;clip-path:polygon(0 0,54% 0,57% 12%,100% 12%,100% 100%,0 100%)}
.sdx-overview .sdx-stack::after{content:'';position:absolute;inset:76px 0 0;background:#7c848c;border-radius:10px 10px 12px 12px;clip-path:polygon(0 18%,39% 18%,42% 0,100% 0,100% 100%,0 100%);z-index:100;pointer-events:none;box-shadow:0 -2px 8px #10182035}
.sdx-overview .sdx-layer{display:flex!important;position:absolute;top:var(--sdx-offset,22px);left:10px;right:10px;width:calc(100% - 20px);height:100px;min-height:100px;margin:0!important;padding:3px 8px!important;gap:5px;align-items:flex-start;border-radius:8px!important;background:#f4f5f6!important;box-shadow:0 -2px 5px #1118!important;z-index:var(--sdx-order,1);overflow:hidden}
.sdx-overview .sdx-layer-copy{position:relative;z-index:2;display:block}.sdx-overview .sdx-layer-copy b{font-size:9px;line-height:10px;white-space:nowrap;display:block;overflow:hidden;text-overflow:ellipsis;color:#132c42;background:#ffffffe6;border-radius:2px}
.sdx-overview .sdx-layer-copy small{display:none}.sdx-overview .sdx-file-icon{width:9px;height:10px;margin:0;z-index:2;border-radius:2px}.sdx-overview .sdx-file-icon svg{width:8px;height:9px}
.sdx-overview .sdx-layer .sdx-thumb{display:block;position:absolute;inset:16px 0 0;width:100%;height:130px;margin:0;border:0;border-radius:0;transform:none;opacity:.9}.sdx-overview .sdx-thumb img{object-fit:cover;object-position:top}
.sdx-overview .sdx-layer:focus-visible{z-index:101;outline-offset:-3px}

/* Keep saved-document actions separate and reachable on narrow screens. */
.fm-shipment-document-dialog .fm-stage-body section {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}
.fm-shipment-document-dialog .fm-stage-body h3 { margin: 0 0 4px; }
.fm-shipment-document-dialog .fm-stage-body .btn {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  min-height: 48px;
  box-sizing: border-box;
  margin: 0;
  padding: 12px 16px;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: left;
  line-height: 1.4;
  box-shadow: 0 2px 6px rgba(16, 43, 59, .08);
}
.fm-shipment-document-dialog .fm-stage-body .btn:focus-visible {
  outline-offset: 3px;
}
.fm-shipment-document-dialog .fm-stage-body .fsj-docs {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}
/* Document controls must stay stationary while focused or tapped. */
.fm-shipment-document-dialog .btn,
.fm-shipment-document-dialog .btn:hover,
.fm-shipment-document-dialog .btn:focus,
.fm-shipment-document-dialog .btn:active {
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: background-color .15s ease, border-color .15s ease;
}
