/**
 * 재고현황 — 모듈 전용.
 */

/* 셀 구분선 — 세로 칸 분리 (가로 행 라인과 동일 톤) */
#invTable thead th,
#invTable tbody td {
    border-right: 1px solid rgb(255 255 255 / 0.07);
}
#invTable thead th:last-child,
#invTable tbody td:last-child {
    border-right: 0;
}

/* 위험 표시 — 그라데이션 대신 좌측 컬러 라인 (얇은 인디케이터) */
#invTable tbody tr.row-low-stock   td:first-child { box-shadow: inset 3px 0 0 var(--bad-400, #ff5f67); }
#invTable tbody tr.row-expiry-warn td:first-child { box-shadow: inset 3px 0 0 #ffa73e; }
#invTable tbody tr.row-expired     td:first-child { box-shadow: inset 3px 0 0 rgb(255 95 103 / 0.6); }
#invTable tbody tr.row-expired td { color: var(--ink-500); }

/* 클릭 가능한 본행 */
#invTable tbody tr.inv-row {
    cursor: pointer;
    transition: background var(--t-fast) var(--ease);
}
#invTable tbody tr.inv-row:hover td {
    background: rgb(255 255 255 / 0.025);
}
#invTable tbody tr.inv-row[data-expanded="1"] td {
    background: rgb(139 149 255 / 0.06);
}

/* 펼친 Lot 영역 — 카드 컨테이너 */
.lot-panel {
    background: rgb(255 255 255 / 0.012);
    border-top: 1px solid rgb(255 255 255 / 0.04);
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.lot-panel-cell { padding: 0 !important; }
.lot-empty { padding: 24px; text-align: center; font-size: 12px; color: var(--ink-500); }

/* Lot 카드 */
.lot-card {
    padding: 14px 16px;
    border-radius: 10px;
    background: rgb(255 255 255 / 0.02);
    border: 1px solid rgb(255 255 255 / 0.05);
    transition: border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.lot-card:hover { border-color: rgb(255 255 255 / 0.10); }
.lot-card.is-focus {
    background: linear-gradient(105deg, rgb(139 149 255 / 0.12), rgb(139 149 255 / 0.02));
    border-color: var(--brand);
    box-shadow: 0 0 0 1px var(--brand), 0 8px 26px rgb(139 149 255 / 0.12);
    animation: lotPulse 1.2s ease-out;
}
@keyframes lotPulse {
    0%   { box-shadow: 0 0 0 1px var(--brand-400, #8b95ff), 0 0 30px rgb(139 149 255 / 0.5); }
    100% { box-shadow: 0 0 0 1px var(--brand), 0 8px 26px rgb(139 149 255 / 0.12); }
}

/* 헤더: lot 번호 · 만료 · 잔량 */
.lot-card__head {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.lot-card__no {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 600;
    color: var(--good-300);
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
.lot-card__no i { font-size: 12px; color: var(--good-400, #4ec77f); opacity: 0.85; }

.lot-qty {
    margin-left: auto;
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
}
.lot-qty__num { font-size: 20px; font-weight: 700; color: var(--ink-50, #fff); line-height: 1; }
.lot-qty__cap { font-size: 11px; color: var(--ink-500); }
.lot-qty__sep { width: 1px; height: 14px; background: rgb(255 255 255 / 0.14); align-self: center; }
.lot-qty__sub { font-size: 11px; color: var(--ink-500); }
.lot-qty__sub b { color: var(--ink-200); font-weight: 600; }

/* 잔량 진행 바 */
.lot-bar {
    margin-top: 11px;
    height: 5px;
    border-radius: 3px;
    background: rgb(255 255 255 / 0.06);
    overflow: hidden;
}
.lot-bar > span {
    display: block;
    height: 100%;
    border-radius: 3px;
    background: linear-gradient(90deg, #3fb96b, #5fd98a);
    transition: width 0.35s var(--ease);
}
.lot-bar.is-mid > span { background: linear-gradient(90deg, #d9a13f, #f0c14e); }
.lot-bar.is-low > span { background: linear-gradient(90deg, #d84a52, #ff7b82); }

/* 메타 그리드 — 라벨/값 pill */
.lot-meta {
    margin-top: 12px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 6px;
}
.lot-meta__item {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 7px 11px;
    background: rgb(255 255 255 / 0.022);
    border: 1px solid rgb(255 255 255 / 0.045);
    border-radius: 8px;
    min-width: 0;
}
.lot-meta__item .lbl {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ink-500);
    flex-shrink: 0;
    min-width: 34px;
}
.lot-meta__item .val {
    margin-left: auto;
    font-size: 12px;
    color: var(--ink-100);
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.lot-link { color: var(--info-300, #6fb3ff); }
.lot-link:hover { text-decoration: underline; }
.lot-dash { color: var(--ink-600); }

/* 만료 chip */
.chip-expiry-warn { background: rgb(255 167 62 / 0.16); color: #ffb567; border: 1px solid rgb(255 167 62 / 0.30); padding: 2px 8px; border-radius: 6px; font-size: 11px; display: inline-flex; gap: 5px; align-items: center; }
.chip-expiry-bad  { background: rgb(255 95 103 / 0.16); color: #ff8088; border: 1px solid rgb(255 95 103 / 0.30); padding: 2px 8px; border-radius: 6px; font-size: 11px; display: inline-flex; gap: 5px; align-items: center; }
.lot-expiry-ok    { font-size: 11px; color: var(--ink-400); display: inline-flex; gap: 5px; align-items: center; }
.lot-expiry-ok i  { opacity: 0.7; }

/* 거래 이력 */
.lot-tx-wrap {
    margin-top: 12px;
    border: 1px solid rgb(255 255 255 / 0.05);
    border-radius: 8px;
    overflow: hidden;
}
.lot-tx-title {
    padding: 7px 11px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ink-400);
    background: rgb(255 255 255 / 0.025);
    border-bottom: 1px solid rgb(255 255 255 / 0.05);
    display: flex;
    gap: 6px;
    align-items: center;
}
.lot-tx-table {
    width: 100%;
    font-size: 11.5px;
    border-collapse: collapse;
}
.lot-tx-table th, .lot-tx-table td {
    padding: 6px 11px;
    border-bottom: 1px solid rgb(255 255 255 / 0.04);
}
.lot-tx-table tbody tr:last-child td { border-bottom: 0; }
.lot-tx-table th {
    color: var(--ink-500);
    font-weight: 600;
    text-align: left;
    background: rgb(255 255 255 / 0.02);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.lot-tx-table td { color: var(--ink-300); }
.lot-tx-table tbody tr:hover td { background: rgb(255 255 255 / 0.02); }
.lot-tx-table .tx-pos { color: #69d685; font-weight: 600; }
.lot-tx-table .tx-neg { color: #ff8088; font-weight: 600; }

/* 모바일 카드 */
.inv-card {
    padding: 12px 14px;
    border-radius: 10px;
    background: rgb(255 255 255 / 0.025);
    border: 1px solid rgb(255 255 255 / 0.05);
    cursor: pointer;
    transition: all var(--t-fast) var(--ease);
}
.inv-card:hover { background: rgb(255 255 255 / 0.045); border-color: var(--border-brand); }
.inv-card.row-low-stock   { border-color: rgb(255 95 103 / 0.30); }
.inv-card.row-expiry-warn { border-color: rgb(255 167 62 / 0.30); }
.inv-card.row-expired     { opacity: 0.6; }

/* 모달 (재사용 가능 — 입고 모듈 css 와 동일 패턴) */
.c-modal-overlay {
    position: fixed; inset: 0;
    background: rgb(11 14 22 / 0.55);
    backdrop-filter: blur(4px);
    z-index: 90;
}
.c-modal {
    position: fixed; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    z-index: 91;
    width: min(480px, 92vw);
    max-height: 80vh;
    display: flex; flex-direction: column;
    background: var(--surface-2, #15192a);
    border: 1px solid var(--border, rgb(255 255 255 / 0.08));
    border-radius: 14px;
    box-shadow: 0 30px 80px rgb(0 0 0 / 0.5);
    overflow: hidden;
}
.c-modal__head {
    display: flex; align-items: center;
    padding: 14px 18px;
    font-size: 14px; font-weight: 600;
    color: var(--ink-100);
    border-bottom: 1px solid rgb(255 255 255 / 0.06);
}
.c-modal__close {
    margin-left: auto;
    background: transparent; border: 0;
    color: var(--ink-400); cursor: pointer;
    padding: 6px 8px; border-radius: 6px;
}
.c-modal__close:hover { background: rgb(255 255 255 / 0.05); color: var(--ink-100); }
.c-modal__body { padding: 16px 18px; overflow-y: auto; flex: 1; }
.c-modal__foot {
    padding: 12px 18px;
    border-top: 1px solid rgb(255 255 255 / 0.06);
    display: flex; gap: 8px; justify-content: flex-end;
    background: rgb(255 255 255 / 0.012);
}

/* ── 기준일(시점 재고) 컨트롤 — c-dropdown__toggle 과 동일 스펙(h-10·그라디언트·inset 보더) ── */
.inv-asof {
    display: inline-flex; align-items: center; gap: 8px;
    height: 40px; padding: 0 10px 0 14px;
    border-radius: 8px;
    color: var(--ink-200);
    background: linear-gradient(180deg, #161924, #11141c);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.06), inset 0 0 0 1px var(--border);
    transition: all var(--t-base, .2s) var(--ease, ease);
}
.inv-asof:hover {
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.08), inset 0 0 0 1px var(--border-strong);
}
.inv-asof.is-active {
    background: linear-gradient(180deg, rgb(111 122 255 / 0.14), rgb(111 122 255 / 0.06));
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.06), inset 0 0 0 1px var(--brand-line, rgb(111 122 255 / 0.5));
}
/* #asofInput 로 특이도를 올려 전역 폼 규칙(input[type=text]:not(.unstyled) = 0,2,1)을 확실히 제압.
   bg-white·ring(box-shadow)·h-10·w-full·rounded·px 를 모두 무효화한다. (unstyled 유무·캐시와 무관하게) */
#asofInput.inv-asof__input {
    width: 108px; height: auto; padding: 0; border: 0; border-radius: 0;
    background: transparent; box-shadow: none; outline: 0;
    color: var(--ink-200); font-size: 14px; font-weight: 500; cursor: pointer;
}
.inv-asof.is-active #asofInput.inv-asof__input { color: #c9cdff; font-variant-numeric: tabular-nums; }
#asofInput.inv-asof__input::placeholder { color: var(--ink-500); opacity: 1; }
.inv-asof__reset {
    flex-shrink: 0;
    background: transparent; border: 0; cursor: pointer;
    color: var(--ink-400); padding: 2px 5px; border-radius: 5px; font-size: 11px; line-height: 1;
}
.inv-asof__reset:hover { background: rgb(255 255 255 / 0.10); color: var(--ink-100); }

/* ── 시점 재고 배너 ── */
.inv-asof-banner {
    display: flex; align-items: center; gap: 10px;
    margin-bottom: 12px; padding: 9px 14px;
    border-radius: 10px;
    background: rgb(111 122 255 / 0.10);
    border: 1px solid rgb(111 122 255 / 0.28);
    font-size: 13px; color: var(--ink-100);
}
.inv-asof-banner > i { color: #a3acff; }
.inv-asof-banner b { color: #c9cdff; font-variant-numeric: tabular-nums; }
.inv-asof-banner__reset {
    margin-left: auto; white-space: nowrap;
    background: rgb(111 122 255 / 0.16); border: 1px solid rgb(111 122 255 / 0.35);
    color: #c9cdff; border-radius: 7px; padding: 4px 10px; font-size: 12px; cursor: pointer;
}
.inv-asof-banner__reset:hover { background: rgb(111 122 255 / 0.28); }

/* 시점 모드에서 의미 없는 필터 흐리게 */
.inv-asof-off { opacity: 0.4; pointer-events: none; }

/* 시점(과거) 뷰 — 행 드릴다운 셰브론 숨김 + 클릭 커서 해제 */
.inv-asof-mode .inv-row .fa-chevron-right { visibility: hidden; }
.inv-asof-mode .inv-row,
.inv-asof-mode .inv-card { cursor: default; }
