/* SON pocket end-service. Scoped to this dialog; existing stock views stay intact. */
.mep-pockets {
    --mp-bg:#f3f5f7; --mp-paper:#fff; --mp-raised:#f2f2f7; --mp-ink:#1c1c1e;
    --mp-dim:#637078; --mp-line:#dce5e9; --mp-green:#147553; --mp-blue:#0875cf;
    --mp-action:#007aff; --mp-orange:#95601c; --mp-red:#bf3029;
    color:var(--mp-ink) !important; background:var(--mp-bg) !important;
}
[data-theme="dark"] .mep-pockets {
    --mp-bg:#111113; --mp-paper:#1c1c1e; --mp-raised:#2c2c2e; --mp-ink:#fff;
    --mp-dim:#aeaeb2; --mp-line:#3a3a3c; --mp-green:#5bd675; --mp-blue:#4fb5ff;
    --mp-orange:#ffb340; --mp-red:#ff6961;
}
.mep-pockets .mep-end-service-workspace { max-height:none; padding:0; overflow:visible; }
.mep-pockets .mp-general,.mep-pockets .mp-item { background:var(--mp-paper); border:0; border-radius:16px; padding:13px; min-width:0; box-shadow:0 2px 5px #0000000a; }
.mep-pockets .mp-general { margin-bottom:18px; }
.mep-pockets .mp-general h4 { margin:0; font-size:17px; color:var(--mp-ink); }
.mep-pockets .mp-general p,.mep-pockets .mp-caption { font-size:11px; color:var(--mp-dim); margin:4px 0 0; }
.mep-pockets .mp-list-heading { display:flex; justify-content:space-between; align-items:center; gap:8px; margin:0 2px 10px; font-size:13px; }
.mep-pockets .mp-list-heading span { font-size:11px; color:var(--mp-dim); }
.mep-pockets .mep-end-service-items { gap:10px; }
.mep-pockets button { touch-action:manipulation; }
.mep-pockets .mp-item button,.mep-pockets .mp-general button { min-height:44px; border:1px solid var(--mp-line); border-radius:10px; background:var(--mp-raised); color:var(--mp-ink); padding:8px 10px; font-size:12px; }
.mep-pockets .mp-item button:disabled,.mep-pockets .mp-general button:disabled { opacity:.4; cursor:default; }
.mep-pockets .mp-item-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.mep-pockets .mp-item .mp-name { background:transparent; border:0; padding:0; text-align:left; font-size:14px; font-weight:700; min-width:0; }
.mep-pockets .mp-name>span { color:var(--mp-dim); margin-left:5px; }
.mep-pockets .mep-end-service-toggle { flex-shrink:0; min-width:44px; min-height:44px; display:flex; justify-content:flex-end; gap:4px; padding:0; background:transparent; border:0; }
.mep-pockets .mep-end-service-toggle>span { display:none; }
.mep-pockets .mep-end-service-toggle>input { position:static; opacity:1; appearance:auto; width:20px !important; height:20px !important; accent-color:var(--mp-action); clip:auto; margin:0; }
.mep-pockets .mep-end-service-toggle>small { font-size:11px; color:var(--mp-dim); font-weight:400; }
.mep-pockets .mp-stocks { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.mep-pockets .mp-stocks>span { display:flex; align-items:center; gap:6px; font-size:11px; color:var(--mp-dim); min-width:0; }
.mep-pockets .mp-pockets { display:inline-flex; vertical-align:middle; flex-shrink:0; color:var(--mp-green); }
.mep-pockets .mp-pockets.frozen { color:var(--mp-blue); }
.mep-pockets .mp-pockets>span { display:inline-flex; align-items:center; gap:4px; }
.mep-pockets .mp-pockets small { font-size:11px; color:var(--mp-dim); font-weight:400; }
.mep-pockets .mp-bag { display:inline-block; flex-shrink:0; position:relative; width:21px; height:30px; background:color-mix(in srgb,currentColor 10%,var(--mp-paper)); border-radius:3px 3px 6px 6px; overflow:hidden; }
.mep-pockets .mp-bag:after { content:""; position:absolute; top:4px; left:4px; right:4px; height:3px; border-top:1px solid currentColor; border-bottom:1px solid currentColor; opacity:.55; }
.mep-pockets .mp-bag>i { position:absolute; left:2px; right:2px; bottom:2px; border-radius:2px 2px 4px 4px; background:linear-gradient(145deg,color-mix(in srgb,currentColor 58%,var(--mp-paper)),currentColor); }
.mep-pockets .mp-pockets.hero .mp-bag { width:34px; height:48px; border-radius:5px 5px 10px 10px; }
.mep-pockets .mp-pockets.hero .mp-bag:after { top:6px; left:6px; right:6px; height:4px; }
.mep-pockets .mp-pockets.hero .mp-bag>i { left:3px; right:3px; bottom:3px; border-radius:3px 3px 8px 8px; }
.mep-pockets .mp-pockets.mini .mp-bag { width:15px; height:23px; }
.mep-pockets .mp-pockets.mini .mp-bag:after { left:3px; right:3px; top:3px; height:2px; }
.mep-pockets .mp-stack { position:relative; display:inline-flex; padding-left:8px; }
.mep-pockets .mp-stack:before,.mep-pockets .mp-stack:after { content:""; position:absolute; left:0; top:3px; width:17px; height:26px; border-radius:3px 3px 6px 6px; background:color-mix(in srgb,currentColor 18%,var(--mp-paper)); transform:rotate(-12deg); }
.mep-pockets .mp-stack:after { left:4px; top:1px; transform:rotate(-5deg); background:color-mix(in srgb,currentColor 28%,var(--mp-paper)); }
.mep-pockets .mp-stack>.mp-bag { z-index:1; }
.mep-pockets .mp-gauge { margin-top:11px; }
.mep-pockets .mp-gauge-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.mep-pockets .mp-gauge-head output { min-width:0; }
.mep-pockets .mp-whole { flex-shrink:0; text-align:center; }
.mep-pockets .mp-whole small { font-size:11px; color:var(--mp-dim); }
.mep-pockets .mp-whole>div { display:flex; gap:4px; margin-top:5px; }
.mep-pockets .mp-whole button { width:36px; padding:0; font-size:21px; }
.mep-pockets .mp-whole button:last-child { color:var(--mp-blue); background:color-mix(in srgb,var(--mp-blue) 9%,var(--mp-paper)); border-color:transparent; }
.mep-pockets input.mp-range { appearance:none; display:block; width:100%; height:44px; padding:0; margin:8px 0 0; border:0 !important; background:transparent !important; box-shadow:none; touch-action:pan-y; --mp-track:var(--mp-green); }
.mep-pockets [data-pocket-scope="switch"] .mp-range { --mp-track:var(--mp-blue); }
.mep-pockets .mp-range::-webkit-slider-runnable-track { height:11px; border-radius:11px; background:linear-gradient(to right,var(--mp-track) 0 var(--mp-level),var(--mp-raised) var(--mp-level) 100%); }
.mep-pockets .mp-range::-webkit-slider-thumb { appearance:none; width:28px; height:28px; margin-top:-8.5px; border:5px solid var(--mp-paper); border-radius:50%; background:var(--mp-track); box-shadow:0 0 0 1px var(--mp-line); }
.mep-pockets .mp-range::-moz-range-track { height:11px; background:var(--mp-raised); border-radius:11px; }
.mep-pockets .mp-range::-moz-range-progress { height:11px; background:var(--mp-track); border-radius:11px; }
.mep-pockets .mp-range::-moz-range-thumb { width:20px; height:20px; border:4px solid var(--mp-paper); background:var(--mp-track); border-radius:50%; }
.mep-pockets .mp-range-labels { display:flex; justify-content:space-between; color:var(--mp-dim); font-size:11px; }
.mep-pockets .mp-inline { border-top:1px solid var(--mp-line); margin-top:11px; padding-top:10px; }
.mep-pockets .mp-shortage { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.mep-pockets .mp-shortage strong { color:var(--mp-orange); font-size:12px; display:block; }
.mep-pockets .mp-shortage small { font-size:11px; color:var(--mp-dim); display:block; margin-top:3px; }
.mep-pockets .mp-shortage>small { text-align:right; max-width:100px; }
.mep-pockets .mp-transfer,.mep-pockets .mp-resolution { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; }
.mep-pockets .mp-transfer { margin-top:7px; }
.mep-pockets .mp-transfer>span { display:flex; align-items:center; gap:7px; }
.mep-pockets .mp-transfer button,.mep-pockets .mp-resolution button,.mep-pockets .mp-item .mp-quiet { border:0; background:transparent; color:var(--mp-blue); font-size:11px; padding:5px 0; }
.mep-pockets .mp-after { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin:8px 0; font-size:11px; color:var(--mp-dim); }
.mep-pockets .mp-after>span { display:inline-flex; align-items:center; gap:5px; }
.mep-pockets .mp-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:10px; }
.mep-pockets .mp-actions .mp-primary { background:var(--mp-action); color:#fff; border-color:var(--mp-action); font-weight:700; }
.mep-pockets .mp-warning { font-size:11px; color:var(--mp-orange); margin:7px 0; }
.mep-pockets .mp-detail-title { font-size:12px; font-weight:650; }
.mep-pockets .mp-quantity { background:color-mix(in srgb,var(--mp-orange) 7%,var(--mp-paper)); border:0; border-radius:12px; padding:12px; }
.mep-pockets .mp-quantity-title { display:flex; align-items:center; gap:9px; }
.mep-pockets .mp-quantity-title>span { display:grid; place-items:center; width:33px; height:33px; border-radius:10px; color:var(--mp-orange); background:color-mix(in srgb,var(--mp-orange) 14%,var(--mp-paper)); font-size:23px; }
.mep-pockets .mp-quantity-title strong { display:block; font-size:14px; color:var(--mp-ink); }
.mep-pockets .mp-quantity-title small { display:block; color:var(--mp-dim); font-size:11px; margin-top:3px; }
.mep-pockets .mp-gauge-dose { display:grid; gap:5px; }
.mep-pockets .mp-gauge-dose>small { font-size:10px; letter-spacing:.08em; color:var(--mp-orange); font-weight:700; }
.mep-pockets [data-pocket-scope="item"] .mp-pockets,.mep-pockets .mp-used-summary .mp-pockets { color:var(--mp-orange); }
.mep-pockets [data-pocket-scope="item"] .mp-range { --mp-track:var(--mp-orange); }
.mep-pockets .mp-quantity-rest,.mep-pockets .mp-used-summary { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:12px; font-size:11px; }
.mep-pockets .mp-quantity-rest { padding:9px 0 0; border-top:1px solid var(--mp-line); color:var(--mp-dim); }
.mep-pockets .mp-used-summary>span { display:flex; align-items:center; gap:7px; }
.mep-pockets .mp-transfer-route { display:grid; grid-template-columns:56px minmax(0,1fr) 56px; align-items:center; gap:7px; min-height:82px; margin-top:9px; padding:8px; border-radius:13px; background:linear-gradient(110deg,color-mix(in srgb,var(--mp-blue) 10%,var(--mp-paper)),color-mix(in srgb,var(--mp-green) 8%,var(--mp-paper))); }
.mep-pockets .mp-route-end { display:grid; place-items:center; gap:6px; color:var(--mp-blue); }
.mep-pockets .mp-route-end.fresh { color:var(--mp-green); }
.mep-pockets .mp-route-end>span { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; background:color-mix(in srgb,currentColor 12%,var(--mp-paper)); font-size:24px; }
.mep-pockets .mp-route-end strong { font-size:10px; letter-spacing:.06em; }
.mep-pockets .mp-route-track { position:relative; height:54px; min-width:0; overflow:hidden; }
.mep-pockets .mp-route-arrow { position:absolute; inset:12px 0 0; text-align:center; letter-spacing:7px; font-size:22px; color:var(--mp-dim); opacity:.3; }
.mep-pockets .mp-travelling-pocket { position:absolute; top:6px; left:0; animation:mp-pocket-travel 3.4s ease-in-out infinite; }
.mep-pockets .mp-travelling-pocket .mp-pockets { animation:mp-pocket-thaw 3.4s ease-in-out infinite; }
.mep-pockets .mp-travelling-pocket .mp-bag { width:30px; height:42px; }
.mep-pockets .mp-transfer small { color:var(--mp-dim); font-size:11px; }
@keyframes mp-pocket-travel { 0%,12% { left:0; transform:translateX(0) rotate(-5deg); opacity:.5; } 22% { opacity:1; } 70%,88% { left:100%; transform:translateX(-100%) rotate(0); opacity:1; } 100% { left:100%; transform:translateX(-100%); opacity:.5; } }
@keyframes mp-pocket-thaw { 0%,30% { color:var(--mp-blue); } 70%,100% { color:var(--mp-green); } }
@media(prefers-reduced-motion:reduce) { .mep-pockets .mp-travelling-pocket { animation:none; left:50%; transform:translateX(-50%); } .mep-pockets .mp-travelling-pocket .mp-pockets { animation:none; color:var(--mp-blue); } }
.mep-pockets .mp-empty { display:grid; gap:10px; }
.mep-pockets .mp-empty strong { font-size:12px; color:var(--mp-red); }
.mep-pockets .mp-lots>div { display:flex; justify-content:space-between; gap:8px; font-size:11px; border-top:1px solid var(--mp-line); padding:8px 0; }
.mep-pockets .mp-lots small { display:block; color:var(--mp-dim); font-size:11px; }
.mep-pockets .mp-lots label { font-size:11px; color:var(--mp-dim); }
.mep-pockets .mp-lots select { width:100%; min-height:44px; font-size:16px; margin:5px 0 10px; }
.mep-pockets .mep-end-service-required-banner { border:0; background:transparent; color:var(--mp-dim); padding:0 2px 12px; font-size:11px; }
.mep-pockets .mep-end-service-required-banner strong { color:var(--mp-orange); font-size:12px; }
.mep-pockets .etiquette-actions .print { background:var(--mp-action); color:#fff; }
.mep-pockets .etiquette-actions .skip { background:var(--mp-raised); color:var(--mp-ink); }
.mep-pockets [hidden] { display:none !important; }
@media(max-width:400px) {
    .mep-pockets.etiquette-popup { padding:12px; }
    .mep-pockets .mp-general,.mep-pockets .mp-item { padding:11px; }
    .mep-pockets .mp-bag { width:18px; height:27px; }
    .mep-pockets .mp-pockets>span { gap:3px; }
    .mep-pockets .mp-pockets.hero .mp-bag { width:27px; height:40px; }
    .mep-pockets .mp-stocks { gap:5px; }
    .mep-pockets .mep-end-service-toggle>small { display:none; }
}