/* (2026-11-01 카드 1618) «넣을 후가공» 줄 — 명함·카드·의뢰·청첩장 후가공 창 공용(common/postproc-lines.js).
   글씨는 공용 단계만 쓴다. 입력 칸은 폰에서 16px(화면 확대 막기 · --bj-type-control 폰 값). */
.bj-pp-lines { display: grid; gap: .5rem; margin: 0 0 .875rem; text-align: left; width: 100%; }
.bj-pp-lines__head, .bj-pp-lines__add { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem .75rem; }
.bj-pp-lines__add { justify-content: flex-start; margin-top: .375rem; }
.bj-pp-lines__head strong, .bj-pp-lines__add strong { font-size: var(--bj-type-control, 1rem); font-weight: 700; }
.bj-pp-lines__head span, .bj-pp-lines__add span, .bj-pp-lines__empty, .bj-pp-lines__hint { font-size: var(--bj-type-caption, .875rem); color: var(--bj-muted, #5f5a55); margin: 0; }
.bj-pp-lines__hint { color: var(--bj-danger, #b3261e); }
/* (2026-11-04 대표님) 줄 칸은 높이·폭·글자가 하나 — 면 칸은 공용 고르기 칸(.bj-form-select), 숫자 칸도 같은 크기. 폰 입력은 16px(화면 확대 막기) */
.bj-pp-line { --bj-pp-control-h: var(--bj-control-height, 48px); --bj-pp-control-w: calc(var(--bj-space-1, 8px) * 8); --bj-pp-control-font: var(--bj-type-control, 1rem); }
.bj-pp-line { display: flex; align-items: center; gap: .625rem; width: 100%; box-sizing: border-box; padding: .625rem .75rem; background: #fff; border: 1px solid var(--bj-line, #e3e0da); border-radius: .625rem; }
.bj-pp-line.is-bad { border-color: var(--bj-danger, #b3261e); }
.bj-pp-line__media { flex: none; width: 2.75rem; height: 2.75rem; overflow: hidden; border-radius: .5rem; background: var(--bj-surface, #f5f6f8); }
.bj-pp-line__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bj-pp-line__name { flex: none; min-width: 4.5em; font-size: var(--bj-type-control, 1rem); font-weight: 700; }
.bj-pp-line__size { display: flex; align-items: center; flex-wrap: wrap; gap: .375rem; min-width: 0; font-size: var(--bj-type-caption, .875rem); }
.bj-pp-line__num { box-sizing: border-box; width: var(--bj-pp-control-w); height: var(--bj-pp-control-h); padding: 0 var(--bj-space-1, 8px); text-align: center; border: 1px solid var(--bj-line-strong, #938d86); border-radius: var(--bj-control-radius, 8px); background: #fff; font: inherit; font-size: var(--bj-pp-control-font); font-weight: 600; color: inherit; -moz-appearance: textfield; }
.bj-pp-line__num::-webkit-outer-spin-button, .bj-pp-line__num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.bj-pp-line .bj-pp-line__side { flex: none; width: var(--bj-pp-control-w); }
.bj-pp-line .bj-pp-line__side::after { right: var(--bj-space-1, 8px); width: 1em; height: 1em; }
.bj-pp-line .bj-pp-line__side > select { box-sizing: border-box; min-height: var(--bj-pp-control-h); height: var(--bj-pp-control-h); padding: 0 calc(var(--bj-space-1, 8px) * 3) 0 var(--bj-space-1, 8px); border: 1px solid var(--bj-line-strong, #938d86); border-radius: var(--bj-control-radius, 8px); background-color: #fff; font: inherit; font-size: var(--bj-pp-control-font); font-weight: 600; color: inherit; }
.bj-pp-line__unit, .bj-pp-line__word { color: var(--bj-muted, #5f5a55); }
/* 옛 전역 * {12px} 가 자식 글자에 바로 붙는 화면(디자인 의뢰) — 공용 안내 글 단계로 적어 둔다 */
.bj-pp-line__x, .bj-pp-line__unit, .bj-pp-line__word, .bj-pp-line__fixed, .bj-pp-lines-sum > span { font-size: var(--bj-type-caption, .875rem); }
.bj-pp-line__fixed { color: var(--bj-muted, #5f5a55); }
.bj-pp-line__amount { margin-left: auto; font-size: var(--bj-type-control, 1rem); font-weight: 700; white-space: nowrap; }
.bj-pp-line__del { flex: none; width: 2.25rem; height: 2.25rem; border: 0; background: none; color: var(--bj-muted, #5f5a55); font-size: var(--bj-type-subsection, 1.25rem); line-height: 1; cursor: pointer; }
.bj-pp-line__act { flex: none; height: var(--bj-pp-control-h); padding: 0 .625rem; border: 1px solid var(--bj-line-strong, #938d86); border-radius: .5rem; background: #fff; color: inherit; font: inherit; font-size: var(--bj-type-caption, .875rem); cursor: pointer; white-space: nowrap; }
.bj-pp-count { display: inline-block; margin-left: .375rem; padding: 0 .4375rem; border-radius: .625rem; background: var(--bj-charcoal, #1a1a18); color: #fff; font-size: var(--bj-type-caption, .875rem); font-weight: 700; line-height: 1.4; vertical-align: .0625rem; }
.bj-pp-lines-sum { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; box-sizing: border-box; width: 100%; padding: .75rem 1rem; background: var(--bj-surface, #f5f6f8); border-radius: .625rem; font-size: var(--bj-type-caption, .875rem); text-align: left; }
.bj-pp-lines-sum b { font-size: var(--bj-type-control, 1rem); font-weight: 700; }
.bj-pp-lines-sum__total { display: grid; justify-items: end; text-align: right; }
.bj-pp-lines-sum__total b { font-size: var(--bj-type-subsection, 1.125rem); }
.bj-pp-lines-sum__total small { font-size: var(--bj-type-caption, .875rem); color: var(--bj-muted, #5f5a55); }
.bj-pp-lines-sum__note { flex: 0 0 100%; margin: 0; color: var(--bj-muted, #5f5a55); font-size: var(--bj-type-caption, .875rem); }
.bj-pp-sum-slot { flex: none; padding: .625rem 1.25rem 0; background: #fff; border-top: 1px solid var(--bj-line, #e3e0da); }
@media (max-width: 767px) {
  .bj-pp-line { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr) auto auto; gap: .5rem .625rem; --bj-pp-control-font: var(--bj-type-body, 1rem); }
  .bj-pp-line__size { grid-column: 1 / -1; grid-row: 2; }
  .bj-pp-line__amount { grid-column: 3; grid-row: 1; justify-self: end; align-self: center; margin: 0; }
  .bj-pp-line__del { grid-column: 4; grid-row: 1; }
  .bj-pp-line__act { grid-column: 1 / -1; grid-row: 3; justify-self: end; }
}