.packing-panel {
    min-height: calc(100vh - 120px);
    overflow: hidden;
}

.packing-filter-band {
    display: grid;
	grid-template-columns: minmax(190px, 1.1fr) minmax(260px, 1.5fr);
    align-items: end;
    gap: 10px;
    border-bottom: 1px solid var(--line);
    background: #f8f9fa;
    padding: 12px 16px;
}

.packing-order-search-panel {
    display: flex;
	min-height: calc(100vh - 82px);
    flex-direction: column;
    overflow: hidden;
}

.packing-order-search-header {
	display: flex;
	min-height: 54px;
	align-items: center;
	gap: 9px;
	border-bottom: 1px solid var(--line);
	padding: 10px 16px;
}

.packing-order-search-header i { color: #59636e; }
.packing-order-search-header h2 { margin: 0; font-size: 14px; }

.packing-order-search-panel .packing-order-search-results {
	min-height: 0;
	flex: 1 1 auto;
}

.packing-order-search-form {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto;
    gap: 10px;
    border-bottom: 1px solid var(--line);
    background: #f7f8f9;
    padding: 14px 16px;
}

.packing-order-search-form label {
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
}

.packing-order-search-form label > i {
    position: absolute;
    left: 12px;
    color: #68717c;
    pointer-events: none;
}

.packing-order-search-form input {
    width: 100%;
    height: 38px;
    border: 1px solid #7d8792;
    border-radius: 5px;
    background: #fff;
    padding: 0 12px 0 36px;
    color: #171b1f;
    font-size: 13px;
}

.packing-order-search-summary {
    min-height: 34px;
    border-bottom: 1px solid var(--line);
    padding: 9px 16px;
    color: #5c6570;
    font-size: 11px;
}

.packing-order-search-results {
    min-height: 250px;
    overflow: auto;
}

.packing-order-search-results table {
    width: 100%;
    min-width: 900px;
    border-collapse: collapse;
    font-size: 12px;
}

.packing-order-search-results th,
.packing-order-search-results td {
    border-bottom: 1px solid #e0e4e8;
    padding: 10px 12px;
    vertical-align: middle;
    text-align: left;
}

.packing-order-search-results th {
    position: sticky;
    z-index: 1;
    top: 0;
    background: #f3f5f6;
    color: #4e5761;
    font-size: 10px;
}

.packing-order-search-results tbody tr:hover { background: #f8fafb; }
.packing-order-search-empty { height: 180px; color: #7b838c; text-align: center !important; }
.packing-order-search-customer { display: grid; gap: 2px; }
.packing-order-search-customer small { color: #bd2931; }
.packing-order-search-store { display: inline-flex; align-items: center; gap: 7px; color: inherit; text-decoration: none; }
.packing-order-search-store img { width: 24px; height: 24px; object-fit: contain; }
.packing-order-search-region { display: grid; gap: 2px; }
.packing-order-search-region small { color: #68717c; }
.packing-order-search-payment { display: grid; gap: 4px; }

.packing-order-search-pagination {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-top: 1px solid var(--line);
    background: #f7f8f9;
    padding: 8px 14px;
}

.packing-order-search-pagination button {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid var(--line-dark);
    border-radius: 5px;
    background: #fff;
    color: #303841;
    cursor: pointer;
}

.packing-order-search-pagination button:disabled { opacity: .4; cursor: default; }
.packing-order-search-pagination span { color: #4f5862; font-size: 11px; }

.packing-filter-field {
    display: grid;
    gap: 5px;
}

.packing-filter-field > span {
    color: var(--text-soft);
    font-size: 9px;
    font-weight: 700;
}

.packing-filter-field select,
.packing-selection-actions select,
.packing-print-actions select {
    height: 36px;
    min-width: 0;
    border: 1px solid var(--line-dark);
    border-radius: 5px;
    background: #fff;
    padding: 0 28px 0 10px;
    color: var(--text);
    font-size: 11px;
}

.packing-search-field {
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
}

.packing-search-field > i {
    position: absolute;
    left: 11px;
    color: #808894;
    pointer-events: none;
}

.packing-search-field input {
    width: 100%;
    height: 36px;
    border: 1px solid var(--line-dark);
    border-radius: 5px;
    background: #fff;
    padding: 0 36px 0 34px;
    color: var(--text);
    font-size: 11px;
}

.packing-search-field button {
    position: absolute;
    right: 3px;
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 0;
    background: transparent;
    color: #7b838e;
    cursor: pointer;
}

.packing-size-mode {
    display: grid;
    height: 30px;
    flex: 0 0 auto;
    grid-template-columns: repeat(2, 1fr);
    margin-left: 14px;
    border: 1px solid var(--line-dark);
    border-radius: 5px;
    background: #fff;
    padding: 2px;
}

.packing-size-mode button {
    min-width: 52px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #656d78;
    cursor: pointer;
    font-size: 10px;
    font-weight: 700;
}

.packing-size-mode button.active {
    background: #20242a;
    color: #fff;
}

.packing-toggle {
    position: relative;
    display: block;
}

.packing-toggle input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.packing-toggle span {
    display: inline-flex;
    height: 36px;
    align-items: center;
    gap: 7px;
    border: 1px solid var(--line-dark);
    border-radius: 5px;
    background: #fff;
    padding: 0 11px;
    color: #555e68;
    cursor: pointer;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}

.packing-toggle input:checked + span {
    border-color: #4f5964;
    background: #e8ebee;
    color: #16191d;
}

.packing-status-filters {
    display: flex;
    min-height: 48px;
    align-items: center;
    gap: 5px;
    overflow-x: auto;
    border-bottom: 1px solid var(--line);
    padding: 6px 16px;
    scrollbar-width: thin;
}

.packing-status-filters > button {
    display: inline-flex;
    min-height: 32px;
    flex: 0 0 auto;
    align-items: center;
    gap: 6px;
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    padding: 0 9px;
    color: #626b76;
    cursor: pointer;
    font-size: 10px;
    font-weight: 700;
}

.packing-status-filters > button:hover { background: #f3f5f7; }
.packing-status-filters > button.active { border-color: #c8ced5; background: #e9edf0; color: #171a1f; }
.packing-status-filters b { min-width: 18px; border-radius: 9px; background: #e2e6ea; padding: 2px 5px; font-size: 8px; text-align: center; }
.packing-status-filters button[data-status="1"] i { color: #55a96b; }
.packing-status-filters button[data-status="2"] i { color: #83c9d7; }
.packing-status-filters button[data-status="3"] i { color: #111; }
.packing-status-filters #packing-photo-only i { color: #2462a8; }
.packing-status-filters button[data-status="4"] i { color: #df9296; }
.packing-status-filters button[data-status="7"] i { color: #C3C3C3; }

.packing-status-filters #packing-merged {
    margin-left: auto;
    border-color: #a9bfd2;
    background: #f5f9fc;
    color: #315f82;
}

.packing-status-filters #packing-merged:hover { border-color: #354f65; background: #354f65; color: #fff; }
.packing-status-filters #packing-merged.active,
.packing-status-filters #packing-merged.active:hover { border-color: #1f3445; background: #1f3445; color: #fff; }
.packing-status-filters #packing-merged:hover i,
.packing-status-filters #packing-merged.active i { color: #fff; }

.packing-action-bar {
    position: sticky;
    z-index: 8;
    top: 74px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #cdd3d9;
    background: rgba(255, 255, 255, 0.97);
    padding: 8px 16px;
    box-shadow: 0 2px 7px rgba(20, 25, 30, 0.05);
}

.packing-selection-actions,
.packing-print-actions {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 7px;
}

.packing-selection-actions { flex: 1 1 auto; }
.packing-print-actions { flex: 0 1 auto; overflow-x: auto; }
.packing-selection-actions > strong { min-width: 82px; color: #3f4750; font-size: 10px; white-space: nowrap; }
.packing-print-actions > strong { min-width: 82px; color: #3f4750; font-size: 10px; white-space: nowrap; }
.packing-selection-actions select { width: 82px; }
.packing-selection-actions #packing-status-setter {
    height: 38px;
    border-width: 1px;
    padding-right: 28px;
    font-weight: 700;
    outline: none;
    transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease, box-shadow 140ms ease;
}
.packing-selection-actions #packing-status-setter:focus { box-shadow: 0 0 0 3px rgba(24, 27, 32, 0.07); }
.packing-selection-actions #packing-status-setter.status-unplaced { border-color: #aeb5bd; background: #f1f3f5; color: #505862; }
.packing-selection-actions #packing-status-setter.status-ordered { border-color: #55a96b; background: #e7f5eb; color: #196c35; }
.packing-selection-actions #packing-status-setter.status-frozen { border-color: #83c9d7; background: #e4f7fb; color: #08758e; }
.packing-selection-actions #packing-status-setter.status-received { border-color: #111; background: #1f2328; color: #fff; }
.packing-selection-actions #packing-status-setter.status-out { border-color: #df9296; background: #fde7e8; color: #a81e24; }
.packing-selection-actions #packing-status-setter.status-shipped { border-color: #C3C3C3; background: #f1f1d6; color: #C3C3C3; }
.packing-selection-actions #packing-toggle-details.active { border-color: #798793; background: #e8ecef; color: #20262c; }
.packing-print-actions select { width: 108px; flex: 0 0 108px; }
.packing-print-actions .button { flex: 0 0 auto; min-height: 34px; padding-inline: 9px; white-space: nowrap; }

.packing-companion-bar {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid #b9d8c8;
    background: #edf8f2;
    padding: 9px 16px;
    color: #174f35;
}
.packing-companion-bar[hidden] { display: none; }
.packing-companion-bar > i { color: #18754b; }
.packing-companion-bar strong { font-size: 12px; }
.packing-companion-bar .icon-button { width: 30px; height: 30px; }

.packing-select-all {
    position: relative;
    display: block;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
}

.packing-select-all input { position: absolute; opacity: 0; }
.packing-select-all span { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid var(--line-dark); border-radius: 5px; background: #fff; color: transparent; cursor: pointer; }
.packing-select-all input:checked + span,.packing-select-all input:indeterminate + span { border-color: #20242a; background: #20242a; color: #fff; }
.packing-select-all input:disabled + span { border-color: var(--line); background: #f1f3f5; color: transparent; cursor: not-allowed; opacity: .58; }

.packing-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    align-items: start;
    gap: 14px;
    min-height: 420px;
    padding: 14px;
}

.packing-grid > .table-loading,
.packing-grid-empty { grid-column: 1 / -1; align-self: center; justify-self: center; }

.packing-grid-empty {
    display: flex;
    min-height: 240px;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    color: var(--text-soft);
}

.packing-grid-empty i { font-size: 28px; }
.packing-item {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 0;
    align-self: start;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    overflow: hidden;
    transition: border-color 140ms ease, box-shadow 140ms ease;
}

.packing-item:hover { border-color: #aeb6bf; box-shadow: 0 5px 16px rgba(20, 25, 30, 0.09); }
.packing-item.selected { border-color: #30363d; box-shadow: 0 0 0 2px rgba(32, 36, 42, 0.13); }
.packing-item.print-selected .packing-item-image { box-shadow: inset 0 0 0 2px #20242a; }

.packing-item-select {
    position: absolute;
    z-index: 3;
    top: 6px;
    left: 6px;
    width: 22px;
    height: 22px;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-3px);
    transition: opacity 140ms ease, transform 140ms ease;
}

.packing-item-select input { position: absolute; opacity: 0; }
.packing-item-select span { display: grid; width: 22px; height: 22px; place-items: center; border: 1px solid rgba(70, 78, 87, 0.28); border-radius: 4px; background: rgba(255,255,255,.94); color: transparent; cursor: pointer; font-size: 8px; box-shadow: 0 1px 4px rgba(20,25,30,.08); }
.packing-item-select input:checked + span { border-color: #20242a; background: #20242a; color: #fff; }
.packing-item:hover .packing-item-select,
.packing-item:focus-within .packing-item-select,
.packing-item.selected .packing-item-select,
.packing-grid.show-item-details .packing-item-select { opacity: 1; pointer-events: auto; transform: none; }

.packing-item-badges {
    position: absolute;
    z-index: 3;
    top: 7px;
    right: 7px;
    display: flex;
    max-width: calc(100% - 46px);
    align-items: flex-end;
    flex-direction: column;
    gap: 4px;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-3px);
    transition: none;
}

.packing-item:hover .packing-item-badges,
.packing-item:focus-within .packing-item-badges,
.packing-grid.show-item-details .packing-item-badges { visibility: visible; opacity: 1; pointer-events: auto; transform: none; }

.packing-option-warning-badge {
    position: absolute;
    z-index: 5;
    top: 7px;
    right: 7px;
    display: inline-flex;
    min-height: 23px;
    max-width: calc(100% - 46px);
    align-items: center;
    gap: 5px;
    border-radius: 4px;
    background: #a51f27;
    padding: 0 7px;
    color: #fff;
    font-size: 8px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.packing-item.has-option-warning .packing-item-badges { top: 36px; }
.packing-merge-requirement-badge {
    position: absolute;
    z-index: 5;
    top: 7px;
    right: 7px;
    display: inline-flex;
    min-height: 23px;
    max-width: calc(100% - 46px);
    align-items: center;
    gap: 5px;
    overflow: hidden;
    border-radius: 4px;
    background: #8a5b00;
    padding: 0 7px;
    color: #fff;
    font-size: 8px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transform: translateY(-3px);
	transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease;
}
.packing-item:hover .packing-merge-requirement-badge,
.packing-item:focus-within .packing-merge-requirement-badge,
.packing-grid.show-item-details .packing-merge-requirement-badge,
.packing-grid.photo-filter-active .packing-merge-requirement-badge { visibility: visible; opacity: 1; pointer-events: auto; transform: none; }
.packing-item.has-merge-requirement .packing-option-warning-badge { top: 36px; }
.packing-item.has-merge-requirement .packing-item-badges { top: 36px; }
.packing-item.has-merge-requirement.has-option-warning .packing-item-badges { top: 65px; }

.packing-status-badge,
.packing-photo-badge,
.packing-lock-badge {
    display: inline-flex;
    min-height: 23px;
    max-width: 100%;
    align-items: center;
    gap: 5px;
    border-radius: 4px;
    padding: 0 7px;
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.packing-status-badge.unplaced { border: 1px solid #aeb5bd; background: #f1f3f5; color: #505862; }
.packing-status-badge.ordered { border: 1px solid #55a96b; background: #e7f5eb; color: #196c35; }
.packing-status-badge.frozen { border: 1px solid #83c9d7; background: #e4f7fb; color: #08758e; }
.packing-status-badge.received { border: 1px solid #111; background: #1f2328; color: #fff; }
.packing-status-badge.out { border: 1px solid #df9296; background: #fde7e8; color: #a81e24; }
.packing-status-badge.shipped { border: 1px solid #C3C3C3; background: #f1f1d6; color: #C3C3C3; }
.packing-status-badge.mixed { border: 1px solid #7a658e; background: #eee9f2; color: #674d7d; }
.packing-lock-badge { position: absolute; z-index: 4; right: 7px; bottom: 7px; max-width: calc(100% - 45px); flex: 0 0 auto; background: #c62828; color: #fff; box-shadow: 0 3px 10px rgba(24,27,32,.12); transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease; }
.packing-lock-badge.is-label-lock { background: #111; }
.packing-grid.hide-unplaced-locks .packing-lock-badge { visibility: hidden; opacity: 0; pointer-events: none; transform: translateY(3px); }
.packing-grid.hide-unplaced-locks .packing-item:hover .packing-lock-badge,
.packing-grid.hide-unplaced-locks .packing-item:focus-within .packing-lock-badge,
.packing-grid.hide-unplaced-locks.show-item-details .packing-lock-badge { visibility: visible; opacity: 1; pointer-events: auto; transform: none; }
.packing-photo-badge { border: 0; background: #e9f1fb; color: #2462a8; }
button.packing-photo-badge { cursor: pointer; }
.packing-photo-badge.has-photos { border: 1px solid #8a6700; background: #b8860b; color: #fff; }
.packing-photo-badge.has-photos:hover,.packing-photo-badge.has-photos:focus-visible { background: #8f6805; color: #fff; outline: none; }

.packing-item-image {
    position: relative;
    display: grid;
    width: 100%;
    aspect-ratio: 1 / 1;
    min-height: 0;
    place-items: center;
    border: 2px solid transparent;
    border-radius: 6px;
    background: #fafbfc;
    padding: 7px;
    overflow: hidden;
}

.packing-item.status-unplaced .packing-item-image { border-color: transparent; }
.packing-item.status-ordered .packing-item-image { border-color: #55a96b; }
.packing-item.status-frozen .packing-item-image { border-color: #83c9d7; }
.packing-item.status-received .packing-item-image { border-color: #111; }
.packing-item.status-out .packing-item-image { border-color: #df9296; }
.packing-item.status-shipped .packing-item-image { border-color: #C3C3C3; }
.packing-item.status-mixed .packing-item-image { border-color: #7a658e; }
.packing-item.selected.preview-status-unplaced .packing-item-image { border-color: transparent; }
.packing-item.selected.preview-status-ordered .packing-item-image { border-color: #55a96b; }
.packing-item.selected.preview-status-frozen .packing-item-image { border-color: #83c9d7; }
.packing-item.selected.preview-status-received .packing-item-image { border-color: #111; }
.packing-item.selected.preview-status-out .packing-item-image { border-color: #df9296; }
.packing-item.selected.preview-status-shipped .packing-item-image { border-color: #C3C3C3; }

.packing-item-select-trigger { position: relative; display: grid; width: 100%; height: 100%; place-items: center; border: 0; background: transparent; padding: 0; cursor: pointer; }
.packing-item-select-trigger:focus-visible { outline: 2px solid #20242a; outline-offset: -3px; }
.packing-item-select-trigger:disabled { cursor: not-allowed; }
.packing-print-selection-indicator { position: absolute; z-index: 2; top: 50%; right: 7px; display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid #111; border-radius: 4px; background: #20242a; color: #fff; font-size: 10px; visibility: hidden; opacity: 0; pointer-events: none; transform: translateY(-50%); box-shadow: 0 3px 10px rgba(24,27,32,.16); }
.packing-item.print-selected .packing-print-selection-indicator { visibility: visible; opacity: 1; }
.packing-item-image img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.packing-image-open { position: absolute; z-index: 4; bottom: 7px; left: 7px; display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid rgba(70,78,87,.32); border-radius: 4px; background: rgba(255,255,255,.95); padding: 0; color: #343b43; cursor: zoom-in; font-size: 9px; visibility: hidden; opacity: 0; pointer-events: none; transform: translateY(3px); transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease; }
.packing-image-open:hover,.packing-image-open:focus-visible { border-color: #111; color: #111; outline: none; }
.packing-item:hover .packing-image-open,
.packing-item:focus-within .packing-image-open,
.packing-grid.show-item-details .packing-image-open { visibility: visible; opacity: 1; pointer-events: auto; transform: none; }
.packing-grid.photo-filter-active .packing-item-badges,
.packing-grid.photo-filter-active .packing-image-open { visibility: visible; opacity: 1; pointer-events: auto; transform: none; }
.packing-grid.photo-filter-active:not(.show-item-details) .packing-item:not(:hover):not(:focus-within) .packing-item-badges > :not(.packing-photo-badge) { display: none; }
.packing-item-product-id { position: absolute; z-index: 4; bottom: 8px; left: 50%; display: block; width: auto; min-width: 0; min-height: 22px; max-width: calc(100% - 82px); overflow: hidden; border: 1px solid #7e8791; border-radius: 4px; background: rgba(255,255,255,.94); padding: 3px 6px; color: #303840; cursor: text; font-family: inherit; font-size: 9px; font-weight: 700; line-height: 1; text-align: center; text-overflow: ellipsis; white-space: nowrap; visibility: hidden; opacity: 0; pointer-events: none; user-select: text; transform: translate(-50%, 3px); box-shadow: 0 3px 10px rgba(24,27,32,.1); transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease; }
.packing-item-product-id:hover { border-color: #303840; background: #fff; }
.packing-item:hover .packing-item-product-id,
.packing-item:focus-within .packing-item-product-id,
.packing-grid.show-item-details .packing-item-product-id { visibility: visible; opacity: 1; pointer-events: auto; transform: translate(-50%, 0); }
.packing-item-copy { display: flex; min-width: 0; flex: 0 0 auto; flex-direction: column; gap: 3px; padding: 6px 7px 7px; }
.packing-model { color: #4f5862; font-size: 8px; line-height: 1.35; overflow-wrap: anywhere; }
.packing-options { color: #c1252d; font-size: 11px; line-height: 1.35; overflow-wrap: anywhere; }
.packing-size-list { display: grid; gap: 2px; margin-top: 1px; }
.packing-size-row { display: flex; min-width: 0; align-items: baseline; gap: 5px; color: #c1252d; font-size: 11px; line-height: 1.35; }
.packing-size-value { min-width: 0; overflow-wrap: anywhere; }
.packing-size-quantity { flex: 0 0 auto; color: #c1252d; font-size: 13px; font-weight: 800; }
.packing-quantity { color: transparent; font-size: 12px; font-weight: 800; line-height: 1.25; }
.packing-quantity.has-quantity { color: #c1252d; }
.packing-item-notes {
    display: none;
    min-width: 0;
    max-height: 72px;
    overflow-x: hidden;
    overflow-y: auto;
    align-items: flex-start;
    gap: 5px;
    border: 1px solid #efd9a0;
    border-radius: 4px;
    background: #fff9df;
    padding: 5px 6px;
    color: #c1252d;
    font-size: 9px;
    line-height: 1.4;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}
.packing-item-notes i { flex: 0 0 auto; margin-top: 2px; }
.packing-item-notes span { min-width: 0; }
.packing-grid.show-item-details .packing-item-notes { display: flex; }
.packing-item-footer { display: flex; width: 100%; min-width: 0; height: 24px; min-height: 24px; align-items: center; margin-top: 4px; }
.packing-item-meta { display: flex; width: 100%; min-width: 0; height: 100%; flex: 1 1 auto; align-items: center; border: 0; visibility: hidden; opacity: 0; pointer-events: none; }
.packing-order-links { display: flex; width: 100%; min-width: 0; height: 100%; align-items: center; gap: 5px; overflow: hidden; }
.packing-order-link { border: 0; background: transparent; padding: 0; color: #32669d; cursor: pointer; font-size: 9px; font-weight: 700; white-space: nowrap; }
.packing-order-link:hover,.packing-order-link:focus-visible { color: #174d84; text-decoration: underline; outline: none; }
.packing-order-position { flex: 0 0 auto; color: #7a838d; font-size: 8px; font-variant-numeric: tabular-nums; }
.packing-order-stepper { display: grid; width: 17px; height: 22px; flex: 0 0 auto; grid-template-rows: repeat(2, 11px); overflow: hidden; border: 1px solid #cfd5db; border-radius: 3px; background: #fff; }
.packing-order-cycle { display: grid; width: 15px; height: 10px; place-items: center; border: 0; background: transparent; padding: 0; color: #68727c; cursor: pointer; font-size: 6px; line-height: 1; }
.packing-order-cycle + .packing-order-cycle { border-top: 1px solid #e1e5e9; }
.packing-order-cycle:hover,.packing-order-cycle:focus-visible { background: #edf1f4; color: #20262c; outline: none; }
.packing-item:hover .packing-item-meta,
.packing-item:focus-within .packing-item-meta,
.packing-grid.show-item-details .packing-item-meta { visibility: visible; opacity: 1; pointer-events: auto; }
.packing-status-breakdown { display: flex; flex-wrap: wrap; gap: 3px; }
.packing-status-breakdown span { border-radius: 3px; background: #f0f2f4; padding: 2px 4px; color: #606975; font-size: 7px; }

.packing-pagination {
    display: flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-top: 1px solid var(--line);
    padding: 8px 14px;
}

.packing-pagination button { display: inline-grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line-dark); border-radius: 5px; background: #fff; color: #343b43; cursor: pointer; }
.packing-pagination button:disabled { opacity: .45; cursor: not-allowed; }
.packing-pagination span { min-width: 110px; color: #58616c; font-size: 10px; text-align: center; }

@media (max-width: 1380px) { .packing-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 1220px) {
    .packing-filter-band { grid-template-columns: minmax(180px, 1fr) minmax(210px, 1.4fr); }
    .packing-action-bar { align-items: stretch; flex-direction: column; }
    .packing-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 1050px) {
    .packing-filter-band { grid-template-columns: 1fr 1.3fr; }
    .packing-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
    .packing-panel { border-radius: 0; }
	.packing-filter-band { grid-template-columns: minmax(0, 1fr); }
    .packing-search-field { grid-column: 1 / -1; grid-row: 1; }
    .packing-scope-field { grid-column: 1; grid-row: 2; }
    .packing-action-bar { position: static; }
    .packing-selection-actions,.packing-print-actions { width: 100%; overflow-x: auto; }
    .packing-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 10px; }
}
@media (max-width: 620px) {
    .packing-filter-band { grid-template-columns: 1fr 1fr; padding: 10px; }
    .packing-scope-field { grid-column: 1 / -1; }
    .packing-toggle span { width: 100%; justify-content: center; }
    .packing-status-filters { padding-inline: 10px; }
    .packing-action-bar { padding-inline: 7px; }
    .packing-selection-actions { gap: 4px; }
    .packing-selection-actions > strong { min-width: 44px; }
    .packing-selection-actions select { width: 76px; }
    .packing-selection-actions .button { flex: 0 0 auto; padding-inline: 7px; white-space: nowrap; }
    .packing-companion-bar { grid-template-columns: auto minmax(0, 1fr) auto; padding-inline: 10px; }
    .packing-companion-bar #packing-companion-run { grid-column: 2; justify-self: start; }
    .packing-companion-bar #packing-companion-dismiss { grid-column: 3; grid-row: 1 / span 2; }
    .packing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.packing-order-search-panel { min-height: calc(100dvh - 68px); border-radius: 0; }
    .packing-order-search-form { grid-template-columns: minmax(0, 1fr) auto; padding: 10px; }
    .packing-order-search-form input { font-size: 12px; }
}