/**
 * 즉시입출고 — 모듈 전용.
 */

/* 모바일(≤640px)에서는 유형 필터 칩(유형 전체/AS교체/…) 숨김 — 공간 절약 */
@media (max-width: 640px) {
    #typeChips { display: none; }
}

/* 비활성 c-dropdown (창고 등 — 조건 충족 전 클릭 차단) */
.c-dropdown.is-disabled {
    opacity: 0.5;
    pointer-events: none;
}

.c-drawer.c-drawer--wide {
    width: min(1100px, 96vw);
}
.c-drawer.c-drawer--wide[aria-hidden="false"] { right: 0; }
.c-drawer.c-drawer--wide[aria-hidden="true"]  { right: calc(-1 * min(1100px, 96vw)); }

#tbl thead th,
#tbl tbody td {
    border-right: 1px solid rgb(255 255 255 / 0.07);
}
#tbl thead th:last-child,
#tbl tbody td:last-child {
    border-right: 0;
}
#tbl tbody tr {
    cursor: pointer;
    transition: background var(--t-fast) var(--ease);
}
#tbl tbody tr:hover td { background: rgb(255 255 255 / 0.025); }
#tbl tbody tr.row-canceled { opacity: 0.55; }

.iio-line-add {
    padding: 12px 14px;
    background: rgb(255 255 255 / 0.012);
    border: 1px solid rgb(255 255 255 / 0.04);
    border-radius: 10px;
}

#linesTable.table-compact th,
#linesTable.table-compact td {
    padding: 6px 8px;
    font-size: 12px;
}
#linesTable thead th { background: transparent; }
#linesTable tbody td { border-bottom: 1px solid rgb(255 255 255 / 0.04); }

.line-remove {
    background: transparent; border: 0;
    color: var(--ink-500); cursor: pointer;
    padding: 4px; border-radius: 4px;
}
.line-remove:hover { color: var(--bad-300); background: var(--red-soft); }

/* 방향 토글 */
.dir-toggle {
    display: flex;
    gap: 4px;
}
.dir-btn {
    flex: 1;
    background: rgb(255 255 255 / 0.04);
    border: 1px solid rgb(255 255 255 / 0.08);
    color: var(--ink-400);
    padding: 8px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--t-fast) var(--ease);
}
.dir-btn:hover:not([disabled]) { color: var(--ink-100); }
.dir-btn[disabled] { opacity: 0.4; cursor: not-allowed; }
.dir-btn[aria-pressed="true"][data-dir="IN"] {
    background: linear-gradient(180deg, rgb(92 194 141 / 0.18), rgb(92 194 141 / 0.06));
    border-color: rgb(92 194 141 / 0.4);
    color: var(--green);
}
.dir-btn[aria-pressed="true"][data-dir="OUT"] {
    background: linear-gradient(180deg, rgb(240 183 90 / 0.18), rgb(240 183 90 / 0.06));
    border-color: rgb(240 183 90 / 0.4);
    color: var(--amber);
}

/* 라인 방향 chip (드로어 등 인라인용) */
.chip-dir-IN  { background: var(--green-soft); color: var(--green); padding: 2px 6px; border-radius: 4px; font-size: 12px; font-weight: 600; }
.chip-dir-OUT { background: var(--amber-soft); color: var(--amber); padding: 2px 6px; border-radius: 4px; font-size: 12px; font-weight: 600; }

/* 목록 라인 방향 배지 — IN/OUT 알약 쌍 */
.iio-dir { display: inline-flex; align-items: center; gap: 6px; }
.iio-dir__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: 80px;
    justify-content: space-between;
    padding: 3px 11px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
    border: 1px solid transparent;
    white-space: nowrap;
}
.iio-dir__lbl { display: inline-flex; align-items: center; gap: 5px; }
.iio-dir__val { font-weight: 800; }
.iio-dir__badge i { font-size: 9px; opacity: 0.85; }
.iio-dir__badge--in {
    background: rgb(92 194 141 / 0.14);
    color: var(--green);
    border-color: rgb(92 194 141 / 0.32);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.06);
}
.iio-dir__badge--out {
    background: rgb(240 183 90 / 0.14);
    color: var(--amber);
    border-color: rgb(240 183 90 / 0.34);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.06);
}
/* 0건 — 흐리게 처리해 활성 방향과 구분 */
.iio-dir__badge.is-zero {
    background: rgb(255 255 255 / 0.035);
    color: var(--text-dim);
    border-color: rgb(255 255 255 / 0.07);
    box-shadow: none;
}
.iio-dir__badge.is-zero i { opacity: 0.4; }

/* 유형 chip */
.chip-type {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    background: var(--blue-soft);
    color: var(--blue);
    border: 1px solid rgb(111 169 224 / 0.20);
}