/* ---------- Envasado (modules/packaging.js) ---------- */
.pack-new { position: relative; margin-bottom: 18px; padding: 22px 20px 16px; }
.pack-form { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
.pack-form .field { flex: 1 1 140px; }
.pack-form .pack-product { flex: 2 1 240px; }
.pack-form .pack-small { flex: 0 1 120px; }
.pack-form select { height: 38px; width: 100%; }
.pack-form input[type=number], .pack-form input.num-input { font-variant-numeric: tabular-nums; }
.pack-sources { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.pack-sources:empty { display: none; }
.pack-sources-h { font-size: 12.5px; color: var(--text3); margin-bottom: 2px; }
.pack-source { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 9px 12px; border: 1px solid var(--border); border-radius: var(--r-md); cursor: pointer; transition: background .12s, border-color .12s; }
.pack-source:hover { background: var(--hover); }
.pack-source:has(input:checked) { border-color: var(--border-strong); background: var(--accent-soft); }
.pack-source input { width: 16px; height: 16px; accent-color: var(--accent); }
.pack-source.is-blocked { opacity: .6; cursor: not-allowed; }
.pack-source-main { min-width: 0; display: flex; flex-direction: column; }
.pack-source-main b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pack-source-main span { color: var(--text3); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pack-source-kg { font-size: 13px; color: var(--text2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pack-hint { color: var(--text3); font-size: 13px; padding: 4px 2px; }
.pack-summary { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 12px; font-size: 13px; color: var(--text2); font-variant-numeric: tabular-nums; }
.pack-summary:empty { display: none; }
.pack-summary b { color: var(--text); font-weight: 600; }
.pack-warn, .pack-warn b { color: var(--red) !important; }
.pack-tabs { margin-bottom: 14px; }
.pack-settings { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; align-items: end; }
.pack-settings .field-hint { display: block; color: var(--text3); font-size: 12px; margin-top: 4px; font-weight: 400; }
.pack-check { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; cursor: pointer; padding-bottom: 10px; }
.pack-check input { width: 16px; height: 16px; accent-color: var(--accent); }
.pack-save { display: flex; justify-content: flex-end; margin-top: 16px; }

.pack-modal .modal-card { width: min(760px, 100%); }
.pack-sizes { margin-bottom: 16px; flex-wrap: wrap; }
.pack-preview { display: grid; place-items: center; padding: 24px; border-radius: var(--r-lg); background: var(--surface-3); min-height: 220px; }
.pack-preview svg { display: block; width: 100%; height: auto; max-height: 52vh; background: #fff; border-radius: 4px; box-shadow: 0 0 0 1px rgba(0,0,0,.06), 0 8px 24px -10px rgba(0,0,0,.25); }
.pack-preview[data-size="100x50"] svg { max-width: 520px; }
.pack-preview[data-size="100x150"] svg { max-width: 260px; }
.pack-preview[data-size="62x100"] svg { max-width: 230px; }
.pack-copies { width: 110px; margin: 0; }
.pack-out { display: flex; gap: 8px; flex-wrap: wrap; }
.pack-out a { text-decoration: none; }
@media (max-width: 640px) {
  .pack-source { grid-template-columns: 18px minmax(0, 1fr) auto; }
  .pack-source .chip { grid-column: 2; justify-self: start; }
  .pack-form .pack-small { flex: 1 1 30%; }
  .pack-form button { flex: 1 1 100%; }
  .modal-footer { flex-direction: column; align-items: stretch; }
}
.pack-nowrap { white-space: nowrap; }