/* SON: lot selection, creation and correction. The bag glyph is shared with end-service. */
.etiquette-popup-overlay[hidden] { display:none !important; }
.etiquette-popup.msa { width:min(430px,calc(100vw - 24px)); max-width:430px; max-height:92dvh; overflow-y:auto; padding:18px 14px 14px; border:1px solid var(--mp-line); border-radius:22px; box-sizing:border-box; text-align:left; box-shadow:0 24px 90px #0005; }
.msa * { box-sizing:border-box; }
.msa [hidden] { display:none !important; }
.msa button,.msa input { font:inherit; }
.msa button { border:1px solid transparent; border-radius:10px; min-height:44px; background:var(--mp-raised); color:var(--mp-ink); padding:8px 12px; cursor:pointer; touch-action:manipulation; font-size:12px; }
.msa button:disabled { opacity:.35; cursor:default; }
.msa button:focus-visible,.msa input:focus-visible,.msa summary:focus-visible,.msa-lot-face:focus-visible { outline:2px solid var(--mp-blue); outline-offset:3px; }
.msa button[aria-pressed="true"] { background:color-mix(in srgb,var(--mp-blue) 13%,var(--mp-paper)); border-color:var(--mp-blue); color:var(--mp-blue); }
.msa .msa-heading { margin:0 0 15px; }
.msa .msa-heading h3 { color:var(--mp-ink); font-size:23px; font-weight:750; margin:0 0 5px; letter-spacing:-.6px; }
.msa .msa-heading p { margin:0; font-size:15px; font-weight:650; color:color-mix(in srgb,var(--apple-purple) 78%,var(--mp-ink)); overflow-wrap:anywhere; }
.msa h4 { color:var(--mp-ink); font-size:14px; margin:17px 0 10px; }
.msa .msa-muted,.msa .msa-meta,.msa .msa-note { font-size:11px; line-height:1.5; color:var(--mp-dim); }
.msa .msa-meta { margin:0 0 12px; }
.msa .msa-kicker { display:block; font-size:10px; font-weight:650; letter-spacing:.07em; color:var(--mp-dim); margin-bottom:7px; }
.msa .msa-existing,.msa .msa-reprint,.msa .msa-purge-recap { background:var(--mp-paper); border-radius:13px; padding:12px; }
.msa .msa-existing>header { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:7px; }
.msa .msa-existing strong { font-size:13px; }
.msa .msa-correct { background:transparent; color:var(--mp-blue); padding:0 5px; }
.msa .msa-balances { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.msa .msa-balances>div { min-width:0; }
.msa .msa-current-stock>small { display:block; margin-top:8px; }
.msa .msa-quantity-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; }
.msa .msa-bin { background:var(--mp-paper); border-radius:13px; padding:12px 10px; min-width:0; --msa-tone:var(--mp-green); }
.msa .msa-bin[data-storage="congel"] { --msa-tone:var(--mp-blue); }
.msa .msa-bin>header { display:flex; justify-content:space-between; align-items:center; gap:4px; margin-bottom:12px; color:var(--msa-tone); }
.msa .msa-bin>header strong { font-size:11px; letter-spacing:.04em; }
.msa .msa-amount { font-size:11px; color:var(--mp-dim); font-variant-numeric:tabular-nums; }
.msa .msa-bag-display { display:flex; align-items:center; justify-content:center; min-height:52px; }
.msa .msa-bag-display .mp-pockets.hero .mp-bag { width:28px; height:42px; }
.msa .msa-step { display:flex; align-items:center; justify-content:space-between; gap:4px; margin-top:10px; }
.msa .msa-step button { width:40px; padding:0; font-size:22px; color:var(--msa-tone); background:color-mix(in srgb,var(--msa-tone) 9%,var(--mp-paper)); flex-shrink:0; }
.msa .msa-step>span { font-size:10px; color:var(--mp-dim); text-align:center; }
.msa .msa-fraction { display:block; margin-top:12px; font-size:10px; color:var(--mp-dim); }
.msa .msa-fraction .mp-range { --mp-track:var(--msa-tone); margin:0; }
.msa .msa-fraction>span { display:flex; justify-content:space-between; font-size:10px; }
.msa .msa-visual-pockets { display:flex; align-items:center; justify-content:center; gap:10px; min-height:74px; }
.msa [data-visual="true"] .msa-bag-display { min-height:0; flex-direction:column; gap:5px; }
.msa [data-visual="true"] .msa-bag-display>small { color:var(--msa-tone); font-size:12px; font-weight:650; }
.msa .msa-fill-pocket { position:relative; display:flex; align-items:center; justify-content:center; width:52px; height:74px; flex-shrink:0; margin:0; border:1px dashed color-mix(in srgb,var(--msa-tone) 40%,transparent); border-radius:10px; background:color-mix(in srgb,var(--msa-tone) 5%,var(--mp-paper)); cursor:ns-resize; }
.msa .msa-fill-pocket input[type="range"] { position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; opacity:0; writing-mode:vertical-lr; direction:rtl; cursor:ns-resize; touch-action:none; }
.msa .msa-fill-pocket:focus-within { outline:2px solid var(--msa-tone); outline-offset:2px; }
.msa .msa-fill-hint { position:absolute; bottom:1px; right:3px; font-size:13px; line-height:1; color:var(--msa-tone); }
.msa .msa-fill-picture .mp-pockets small { display:none; }
.msa .msa-fill-picture .mp-pockets.hero .mp-bag { width:30px; height:45px; }
.msa [data-visual="true"] .msa-step { justify-content:space-around; gap:8px; }
.msa [data-visual="true"] .msa-step button { width:44px; }
.msa.msa-adjust-visual .msa-correction-lot { margin:0; }
.msa.msa-adjust-visual .mep-stock-adjust-list { gap:10px; }
.msa.msa-adjust-visual .msa-actions { position:sticky; bottom:-14px; padding:10px 0; background:var(--mp-bg); z-index:2; }
.msa.msa-adjust-visual>.delete-item { width:100%; margin-top:8px; font-size:11px; }
.msa .msa-printers { margin:15px 0 10px; }
.msa .msa-printer-buttons { display:flex; flex-wrap:wrap; gap:6px; }
.msa .msa-printer-buttons>button { flex:1 1 100px; padding:8px; font-size:11px; }
.msa .msa-printer-buttons>[data-printer=""] { flex:1 0 100%; min-height:36px; background:transparent; }
.msa .msa-label-options { background:var(--mp-paper); padding:0 11px; border-radius:10px; margin:10px 0; }
.msa .msa-label-options summary { cursor:pointer; font-size:12px; padding:13px 0; color:var(--mp-dim); }
.msa .msa-label-summary { float:right; font-size:11px; color:var(--mp-ink); }
.msa .msa-settings { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; margin:12px 0; }
.msa .msa-settings label { display:block; min-width:0; margin:0; }
.msa .msa-settings label>span { display:block; font-size:11px; color:var(--mp-dim); margin-bottom:6px; }
.msa .msa-settings input[type="date"] { width:100%; min-width:0; min-height:44px; border:1px solid var(--mp-line); border-radius:8px; background:var(--mp-paper); color:var(--mp-ink); padding:5px; font-size:14px; color-scheme:light; }
[data-theme="dark"] .msa .msa-settings input[type="date"] { color-scheme:dark; }
.msa .mep-qty-stepper { max-width:100%; }
.msa .msa-actions { display:flex; align-items:stretch; gap:8px; margin-top:15px; }
.msa .msa-actions button { min-height:48px; }
.msa .msa-actions>.msa-primary { flex:1; background:var(--mp-action); color:#fff; font-size:13px; font-weight:650; }
.msa .msa-error { background:color-mix(in srgb,var(--mp-red) 10%,var(--mp-paper)); color:var(--mp-red); padding:11px; border-radius:10px; font-size:12px; line-height:1.5; margin:12px 0 0; }
.msa .msa-state-buttons { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.msa .msa-picker { display:grid; grid-template-columns:30px minmax(0,1fr) 30px; align-items:center; gap:5px; margin-top:12px; }
.msa .msa-picker>button { background:transparent; font-size:30px; padding:0; }
.msa .msa-picker.is-single { grid-template-columns:minmax(0,1fr); }
.msa .msa-lot-face { background:var(--mp-paper); border-radius:15px; padding:12px; touch-action:pan-y; min-width:0; }
.msa .msa-lot-heading { display:flex; align-items:center; justify-content:space-between; gap:6px; }
.msa .msa-lot-heading>strong { min-width:0; font-size:15px; letter-spacing:-.3px; line-height:1.3; }
.msa .msa-age { display:inline-block; flex-shrink:0; max-width:52%; border-radius:9px; padding:4px 6px; background:var(--mp-raised); color:var(--mp-dim); font-size:9px; line-height:1.25; text-align:right; }
.msa .msa-age.latest { color:var(--mp-green); background:color-mix(in srgb,var(--mp-green) 10%,var(--mp-paper)); }
.msa .msa-age.yesterday { color:var(--mp-orange); background:color-mix(in srgb,var(--mp-orange) 10%,var(--mp-paper)); }
.msa .msa-lot-face>small { display:block; color:var(--mp-dim); font-size:10px; margin:4px 0 15px; overflow-wrap:anywhere; }
.msa .msa-lot-face .mp-pockets .mp-bag { width:24px; height:36px; }
.msa .msa-timeline { display:flex; gap:5px; overflow-x:auto; padding:8px 2px 10px; margin:5px 28px 8px; scrollbar-width:thin; }
.msa .msa-lot-position { text-align:center; font-size:10px; color:var(--mp-dim); margin-top:9px; }
.msa-natural-switch .msa-heading { margin-bottom:10px; }
.msa-natural-switch .msa-actions { position:sticky; bottom:-14px; z-index:6; padding:10px 0; background:var(--mp-bg); box-shadow:0 -8px 12px var(--mp-bg); }
.msa-natural-switch .msa-lot-face { padding:9px 10px; }
.msa-natural-switch .msa-lot-face>small { margin-bottom:0; }
.msa-natural-switch .msa-timeline { padding-top:2px; padding-bottom:2px; margin-bottom:2px; }
.msa-natural-switch .msa-timeline button { min-height:42px; padding:4px; gap:3px; }
.msa-natural-switch .msa-timeline .mp-bag { width:12px; height:18px; }
.msa-natural-switch .msa-lot-work { margin:12px 0; }
.msa-natural-switch .msa-transfer-bag .mp-bag { width:27px; height:40px; }
.msa-natural-switch .msa-transfer-bags { gap:2px; }
.msa-natural-switch .msa-transfer-bag { width:40px; min-width:40px; }
.msa-natural-switch[data-mode="switch"] { --msa-label-tone:var(--mp-orange); --msa-label-action:#b5540b; }
.msa-natural-switch[data-mode="switch"] .msa-heading h3 { color:var(--mp-orange); }
.msa .msa-timeline button { display:grid; place-items:center; gap:5px; flex:0 0 55px; padding:7px 5px; background:transparent; touch-action:pan-x; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.msa .msa-timeline button.long-press-active { border-color:var(--mp-red); background:color-mix(in srgb,var(--mp-red) 9%,var(--mp-paper)); }
.msa-lot-delete-layer { position:fixed; inset:0; z-index:20; display:grid; place-items:center; padding:18px; background:#0007; backdrop-filter:blur(3px); }
.msa-lot-delete-dialog { width:min(330px,100%); max-height:90dvh; overflow-y:auto; padding:18px; background:var(--mp-bg); color:var(--mp-ink); border:1px solid var(--mp-line); border-radius:20px; box-shadow:0 20px 65px #0006; }
.msa-lot-delete-dialog .msa-heading h3 { font-size:20px; text-align:left; }
.msa-lot-delete-dialog .msa-balances { padding:12px; background:var(--mp-paper); border-radius:12px; }
.msa .msa-timeline small { font-size:9px; white-space:nowrap; }
.msa .msa-state-buttons button { padding:10px 8px; font-size:11px; }
.msa .msa-state-buttons small { display:block; font-size:10px; margin-top:5px; color:var(--mp-dim); }
.msa [data-label-state="frais"][aria-pressed="true"] { border-color:var(--mp-green); color:var(--mp-green); background:color-mix(in srgb,var(--mp-green) 10%,var(--mp-paper)); }
.msa[data-mode="label"] { --msa-label-tone:var(--mp-green); --msa-label-action:#147553; }
.msa[data-mode="label"][data-label-state="congel"] { --msa-label-tone:var(--mp-blue); --msa-label-action:#0875cf; }
.msa[data-mode="label"] .msa-lot-face { background:color-mix(in srgb,var(--msa-label-tone) 8%,var(--mp-paper)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--msa-label-tone) 45%,var(--mp-line)); }
.msa-natural-switch .msa-settings { padding:10px; border-radius:12px; background:color-mix(in srgb,var(--msa-label-tone) 8%,var(--mp-paper)); border:1px solid color-mix(in srgb,var(--msa-label-tone) 30%,var(--mp-line)); }
.msa-natural-switch .msa-settings label>span { color:var(--msa-label-tone); }
.msa-natural-switch .msa-actions>.msa-submit { background:var(--msa-label-action); }
.msa .msa-transfer-help { font-size:11px; color:var(--mp-dim); margin:14px 0 10px; text-align:center; }
.msa .msa-transfer-board { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.msa .msa-transfer-zone { --msa-tone:var(--mp-green); min-width:0; padding:12px 8px 9px; border:1px solid color-mix(in srgb,var(--msa-tone) 30%,var(--mp-line)); border-radius:15px; background:color-mix(in srgb,var(--msa-tone) 5%,var(--mp-paper)); transition:background .18s,border-color .18s; }
.msa .msa-transfer-zone[data-drop-storage="congel"] { --msa-tone:var(--mp-blue); }
.msa .msa-transfer-zone>header { display:flex; flex-direction:column; gap:5px; padding:0 3px 10px; color:var(--msa-tone); }
.msa .msa-transfer-zone>header>span { font-size:11px; font-weight:750; letter-spacing:.08em; }
.msa .msa-zone-total { font-size:10px; color:var(--mp-dim); font-variant-numeric:tabular-nums; }
.msa .msa-transfer-bags { display:flex; flex-wrap:wrap; gap:4px; align-content:flex-start; min-height:72px; }
.msa .msa-transfer-bag { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:38px; min-height:66px; padding:5px 2px; border:1px solid transparent; background:transparent; touch-action:none; user-select:none; -webkit-user-select:none; cursor:grab; }
.msa .msa-transfer-bag .mp-pockets.hero .mp-bag { width:26px; height:38px; }
.msa .msa-transfer-bag .mp-pockets small { display:none; }
.msa .msa-transfer-bag .mp-stack { color:var(--msa-tone); }
.msa .msa-transfer-bag .mp-stack>.mp-pockets { position:relative; z-index:1; }
.msa .msa-transfer-bag.is-pending .mp-stack { color:var(--mp-orange); }
.msa .msa-transfer-bag>small { font-size:10px; color:var(--mp-dim); }
.msa .msa-transfer-bag:hover:not(:disabled) { border-color:color-mix(in srgb,var(--msa-tone) 35%,transparent); background:color-mix(in srgb,var(--msa-tone) 7%,transparent); }
.msa .msa-transfer-bag.is-pending { border:1px dashed var(--mp-orange); background:color-mix(in srgb,var(--mp-orange) 9%,var(--mp-paper)); animation:msa-pocket-arrive .22s ease-out; }
.msa .msa-transfer-bag.is-pending .mp-pockets,.msa .msa-transfer-bag.is-pending>small { color:var(--mp-orange); }
.msa .msa-pending-mark { position:absolute; top:-5px; right:-3px; width:17px; height:17px; display:grid; place-items:center; border-radius:50%; color:var(--mp-orange); background:var(--mp-paper); font-size:13px; }
.msa .msa-transfer-bag.is-dragging { z-index:5; pointer-events:none; cursor:grabbing; opacity:.85; filter:drop-shadow(0 8px 9px #0005); }
.msa .msa-transfer-zone.is-drop-target { border-color:var(--msa-tone); background:color-mix(in srgb,var(--msa-tone) 16%,var(--mp-paper)); }
.msa .msa-transfer-empty { color:var(--mp-dim); display:grid; align-content:center; justify-items:center; gap:7px; width:100%; font-size:10px; opacity:.45; }
.msa .msa-transfer-empty .mp-bag { width:29px; height:43px; }
.msa .msa-zone-date { display:block; margin-top:9px; font-size:9px; color:var(--mp-dim); line-height:1.4; min-height:13px; }
.msa .msa-transfer-status { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:42px; font-size:10px; color:var(--mp-dim); line-height:1.5; }
.msa .msa-transfer-reset { padding:5px 0 5px 7px; background:transparent; color:var(--mp-orange); font-size:10px; white-space:nowrap; }
.msa .msa-switch-recap { display:grid; grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr); gap:8px; align-items:center; text-align:center; padding:16px 8px; border-radius:14px; background:var(--mp-paper); }
.msa .msa-switch-arrow { font-size:24px; color:var(--mp-orange); }
.msa .msa-switch-count { text-align:center; font-size:20px; font-weight:700; color:var(--mp-orange); margin:17px 0; }
.msa .msa-switch-count>small { display:block; margin-top:5px; color:var(--mp-dim); font-size:11px; font-weight:400; }
@keyframes msa-pocket-arrive { from { transform:scale(.82); opacity:.6; } to { transform:scale(1); opacity:1; } }
.msa .msa-correction-lot { background:var(--mp-paper); border-radius:14px; padding:11px; margin:10px 0; }
.msa .msa-correction-lot>header { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:9px; }
.msa .msa-correction-lot>header strong { font-size:13px; }
.msa .msa-correction-lot>header small { display:block; font-size:10px; line-height:1.4; color:var(--mp-dim); margin-top:4px; }
.msa .msa-correction-lot .msa-bin { background:var(--mp-raised); padding:9px 8px; }
.msa .msa-correction-lot .msa-bin .mp-pockets.hero .mp-bag { width:21px; height:32px; }
.msa .msa-correction-lot .msa-bag-display { min-height:35px; }
.msa .msa-correction-lot .msa-step>span { display:none; }
.msa .msa-danger { color:var(--mp-red); background:transparent; }
.msa .msa-purge-all { width:100%; margin-top:6px; }
.msa .msa-purge-recap>p { font-size:11px; color:var(--mp-dim); line-height:1.6; }
.msa .msa-purge-choices { display:grid; gap:10px; margin:16px 0 10px; }
.msa .msa-purge-choices>button { display:grid; grid-template-columns:30px 1fr; gap:4px 9px; text-align:left; padding:14px; background:var(--mp-paper); }
.msa .msa-purge-choices>button>span { grid-row:1 / 3; font-size:27px; align-self:center; color:var(--mp-blue); }
.msa .msa-purge-choices>button>strong { font-size:14px; }
.msa .msa-purge-choices>button>small { color:var(--mp-dim); font-size:11px; line-height:1.5; }
.msa .msa-purge-choices>.msa-delete-stock>span,.msa .msa-purge-choices>.msa-delete-stock>strong { color:var(--mp-red); }
.msa .msa-actions>.msa-destructive { background:var(--mp-red); }
.msa .msa-empty-pocket { color:var(--mp-dim); text-align:center; padding:14px; }
.msa .msa-empty-pocket>.mp-bag { width:50px; height:70px; }
.msa .msa-empty { text-align:center; padding:18px; color:var(--mp-dim); font-size:12px; }
@media (max-width:350px) { .etiquette-popup.msa { padding:15px 10px 12px; } .msa .msa-bin { padding:10px 7px; } .msa .msa-step { gap:2px; } .msa .msa-step button { width:34px; } .msa .msa-picker { grid-template-columns:25px minmax(0,1fr) 25px; gap:2px; } .msa .msa-lot-face .mp-bag { width:18px; height:27px; } .msa[data-mode="label"] .msa-settings { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:6px; } .msa[data-mode="label"] .msa-settings input[type="date"] { padding:4px; font-size:12px; } }
@media (prefers-reduced-motion:reduce) { .msa .msa-transfer-bag.is-pending { animation:none; } .msa .msa-transfer-zone { transition:none; } }
