.wms-outgoing-index-card { margin-bottom: 1rem; }
.wms-outgoing-index-header { gap: 1rem; }
.wms-outgoing-index-actions { flex-wrap: wrap; justify-content: flex-end; }
.wms-outgoing-index-filter { border-bottom: 1px solid var(--wms-border-soft, #edf1f4); background: #fbfcfd; }

.wms-outgoing-table { min-width: 1080px; }
.wms-outgoing-index-table { min-width: 1740px; }
.wms-outgoing-entry-table { min-width: 1220px; }

.wms-outgoing-index-scroll {
    max-height: calc(100vh - 330px);
    overflow: auto;
    scrollbar-gutter: stable;
}

.wms-outgoing-index-scroll .wms-outgoing-index-table thead th {
    position: sticky;
    top: 0;
    z-index: 4;
    box-shadow: inset 0 -1px 0 var(--wms-border, #dde5ea);
}

.wms-outgoing-out-time {
    min-width: 104px;
    white-space: nowrap;
}
.wms-outgoing-out-time > span {
    display: block;
    font-weight: 700;
}
.wms-outgoing-out-time > small {
    display: block;
    margin-top: .12rem !important;
    color: #738392 !important;
    font-variant-numeric: tabular-nums;
}

.wms-outgoing-lot-input {
    min-width: 120px !important;
}

.wms-outgoing-index-lot {
    min-width: 110px;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.wms-outgoing-table thead th {
    padding: .72rem .85rem;
    border-bottom: 1px solid var(--wms-border, #dde5ea);
    background: #f8fafb;
    color: #6b7a89;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
    white-space: nowrap;
}

.wms-outgoing-table tbody td {
    padding: .75rem .85rem;
    border-color: var(--wms-border-soft, #edf1f4);
    color: #344354;
    font-size: .74rem;
    vertical-align: middle;
}

.wms-outgoing-table tbody tr:hover { background: #f8fcfd; }
.wms-outgoing-table td small { display: block; margin-top: .15rem; color: #8794a1; font-size: .63rem; line-height: 1.35; }

.wms-outgoing-process,
.wms-outgoing-state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .3rem .56rem;
    border-radius: 999px;
    background: #f1f4f6;
    color: #687787;
    font-size: .64rem;
    font-weight: 800;
    line-height: 1.1;
    white-space: nowrap;
}

.wms-outgoing-state.is-empty { background: #fdf0ef; color: #a84b46; }
.wms-outgoing-state.is-ready { background: #eaf8f1; color: #277853; }
.wms-outgoing-state.is-soft { background: #f1f4f6; color: #687787; }

.wms-outgoing-empty {
    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: .35rem;
    padding: 1.5rem;
    color: #81909d;
    text-align: center;
}
.wms-outgoing-empty i { color: #9fb0bd; font-size: 1.35rem; }
.wms-outgoing-empty strong { color: #536575; font-size: .8rem; }
.wms-outgoing-empty span { font-size: .68rem; }

.wms-outgoing-create-modal .modal-dialog { max-width: 1280px; }
.wms-outgoing-create-modal .modal-content { border: 0; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 70px rgba(29, 55, 74, .22); }
.wms-outgoing-modal-header { padding: 1rem 1.15rem; border-bottom: 1px solid #e7edf1; background: #fbfcfd; }
.wms-outgoing-modal-header h2 { margin: .12rem 0 0; color: #213344; font-size: 1rem; font-weight: 800; }

.wms-outgoing-form-section { padding: 1rem; margin-bottom: .85rem; border: 1px solid #e3ebef; border-radius: 12px; background: #fff; }
.wms-outgoing-section-title { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .9rem; }
.wms-outgoing-section-title span:first-child { display: block; color: #718393; font-size: .62rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.wms-outgoing-section-title strong { display: block; margin-top: .12rem; color: #2c4050; font-size: .78rem; }

.wms-outgoing-modal-alert { margin-bottom: .8rem; padding: .75rem .9rem; border-radius: 10px; font-size: .72rem; }
.wms-outgoing-modal-alert.is-danger { border: 1px solid #f2c9c5; background: #fff4f3; color: #a34a43; }
.wms-outgoing-modal-alert.is-info { border: 1px solid #cde1eb; background: #f4fbfd; color: #406579; }

.wms-outgoing-entry-table .form-control-sm { min-width: 110px; }
.wms-outgoing-location-auto { display: inline-grid; grid-template-columns: auto 1fr; align-items: center; gap: 0 .4rem; color: #2f5e4a; }
.wms-outgoing-location-auto i { grid-row: 1 / 3; color: #3c8c68; }
.wms-outgoing-location-auto strong { font-size: .7rem; }
.wms-outgoing-location-auto small { margin: 0 !important; font-size: .6rem !important; }

.wms-outgoing-modal-footer { display: flex; align-items: center; gap: .6rem; border-top: 1px solid #e7edf1; background: #fbfcfd; }
.wms-outgoing-footer-note { display: flex; flex: 1; align-items: center; gap: .5rem; color: #738392; font-size: .65rem; }
.wms-outgoing-footer-note i { color: var(--wms-primary, #139bb8); }

.wms-outgoing-location-picker { display: grid; gap: .6rem; }
.wms-outgoing-location-option { display: flex; align-items: center; gap: .75rem; padding: .75rem .85rem; border: 1px solid #e0e8ed; border-radius: 10px; cursor: pointer; }
.wms-outgoing-location-option:hover { border-color: #a9d4e0; background: #f8fcfd; }
.wms-outgoing-location-option input { flex: 0 0 auto; }
.wms-outgoing-location-option span { display: block; }
.wms-outgoing-location-option strong { display: block; color: #2d4151; font-size: .78rem; }
.wms-outgoing-location-option small { display: block; margin-top: .12rem; color: #7a8996; font-size: .66rem; }

@media (max-width: 991.98px) {
    .wms-outgoing-index-scroll { max-height: 62vh; }
    .wms-outgoing-index-header,
    .wms-outgoing-section-title,
    .wms-outgoing-modal-footer { align-items: stretch; flex-direction: column; }
    .wms-outgoing-index-actions { width: 100%; justify-content: stretch; }
    .wms-outgoing-index-actions .btn { flex: 1 1 auto; }
    .wms-outgoing-footer-note { width: 100%; }
}

/* 1.8E.011C V2 - Compact index widths + wrapped descriptive columns */
.wms-outgoing-index-table thead th,
.wms-outgoing-index-table tbody td {
    padding-left: .55rem;
    padding-right: .55rem;
}

/* 1.8E.011C V3 - Soft vertical separators between index columns */
.wms-outgoing-index-table thead th:not(:last-child),
.wms-outgoing-index-table tbody td:not(:last-child) {
    border-right: 1px solid #eef2f5;
}

.wms-outgoing-index-table thead th:not(:last-child) {
    border-right-color: #e8edf1;
}

/* WO */
.wms-outgoing-index-table th:nth-child(1),
.wms-outgoing-index-table td:nth-child(1) {
    width: 88px;
    min-width: 88px;
}

/* Tgl WO */
.wms-outgoing-index-table th:nth-child(2),
.wms-outgoing-index-table td:nth-child(2) {
    width: 82px;
    min-width: 82px;
}

/* BOM */
.wms-outgoing-index-table th:nth-child(3),
.wms-outgoing-index-table td:nth-child(3) {
    width: 42px;
    min-width: 42px;
}

/* Part */
.wms-outgoing-index-table th:nth-child(4),
.wms-outgoing-index-table td:nth-child(4) {
    width: 80px;
    min-width: 80px;
}

/* Nama Part */
.wms-outgoing-index-table th:nth-child(5),
.wms-outgoing-index-table td:nth-child(5) {
    width: 170px;
    min-width: 170px;
    max-width: 170px;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
    line-height: 1.32;
}

/* Proses */
.wms-outgoing-index-table th:nth-child(6),
.wms-outgoing-index-table td:nth-child(6) {
    width: 75px;
    min-width: 75px;
}

/* Qty WO */
.wms-outgoing-index-table th:nth-child(7),
.wms-outgoing-index-table td:nth-child(7) {
    width: 70px;
    min-width: 70px;
}

/* Kode Material */
.wms-outgoing-index-table th:nth-child(8),
.wms-outgoing-index-table td:nth-child(8) {
    width: 90px;
    min-width: 90px;
}

/* Material */
.wms-outgoing-index-table th:nth-child(9),
.wms-outgoing-index-table td:nth-child(9) {
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
    line-height: 1.32;
}

/* Unit */
.wms-outgoing-index-table th:nth-child(10),
.wms-outgoing-index-table td:nth-child(10) {
    width: 45px;
    min-width: 45px;
}

/* Out Qty */
.wms-outgoing-index-table th:nth-child(11),
.wms-outgoing-index-table td:nth-child(11) {
    width: 75px;
    min-width: 75px;
}

/* Lot */
.wms-outgoing-index-table th:nth-child(12),
.wms-outgoing-index-table td:nth-child(12) {
    width: 120px;
    min-width: 120px;
}

/* Req Qty */
.wms-outgoing-index-table th:nth-child(13),
.wms-outgoing-index-table td:nth-child(13) {
    width: 70px;
    min-width: 70px;
}

/* Balance */
.wms-outgoing-index-table th:nth-child(14),
.wms-outgoing-index-table td:nth-child(14) {
    width: 78px;
    min-width: 78px;
}

/* From WH */
.wms-outgoing-index-table th:nth-child(15),
.wms-outgoing-index-table td:nth-child(15) {
    width: 60px;
    min-width: 60px;
}

/* No. Outgoing */
.wms-outgoing-index-table th:nth-child(16),
.wms-outgoing-index-table td:nth-child(16) {
    width: 110px;
    min-width: 110px;
}

/* Tgl Out */
.wms-outgoing-index-table th:nth-child(17),
.wms-outgoing-index-table td:nth-child(17) {
    width: 100px;
    min-width: 100px;
}

/* User */
.wms-outgoing-index-table th:nth-child(18),
.wms-outgoing-index-table td:nth-child(18) {
    width: 75px;
    min-width: 75px;
}

/* Aksi */
.wms-outgoing-index-table th:nth-child(19),
.wms-outgoing-index-table td:nth-child(19) {
    width: 78px;
    min-width: 78px;
}

.wms-outgoing-material-cell {
    min-width: 200px;
    max-width: 200px;
}

.wms-outgoing-material-cell > span {
    display: block;
    font-weight: 700;
    color: #33495a;
    white-space: normal;
    overflow-wrap: anywhere;
}

.wms-outgoing-material-cell > small {
    white-space: normal;
    overflow-wrap: anywhere;
}

.js-lot-cell { min-width: 100px; white-space: nowrap; }

/* 1.8E.006C - Actual Material Override preview UI */
.wms-outgoing-override-note {
    display: flex;
    gap: .7rem;
    align-items: flex-start;
    padding: .8rem .9rem;
    border: 1px solid #d8e7ee;
    border-radius: 10px;
    background: #f7fbfd;
    color: #4c6575;
}
.wms-outgoing-override-note > i { margin-top: .1rem; color: var(--wms-primary, #139bb8); }
.wms-outgoing-override-note strong { display: block; color: #304b5b; font-size: .72rem; }
.wms-outgoing-override-note span { display: block; margin-top: .15rem; font-size: .66rem; line-height: 1.45; }

.wms-outgoing-override-context {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .5rem;
    margin-top: .75rem;
}
.wms-outgoing-override-context > div {
    padding: .55rem .65rem;
    border-radius: 9px;
    background: #f6f8fa;
}
.wms-outgoing-override-context span,
.wms-outgoing-override-metric span {
    display: block;
    color: #7c8b98;
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .045em;
    text-transform: uppercase;
}
.wms-outgoing-override-context strong,
.wms-outgoing-override-metric strong {
    display: block;
    margin-top: .1rem;
    color: #304555;
    font-size: .7rem;
}

.wms-outgoing-override-results { display: grid; gap: .55rem; }
.wms-outgoing-override-result {
    display: grid;
    grid-template-columns: minmax(0, 2.2fr) minmax(100px, .65fr) minmax(150px, .9fr) auto;
    gap: .75rem;
    align-items: center;
    padding: .7rem .8rem;
    border: 1px solid #e2e9ed;
    border-radius: 10px;
    background: #fff;
}
.wms-outgoing-override-result:hover { border-color: #b9dbe5; background: #fbfdfe; }
.wms-outgoing-override-material > div { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.wms-outgoing-override-material strong { color: #273f50; font-size: .74rem; }
.wms-outgoing-override-material > span { display: block; margin-top: .12rem; color: #415766; font-size: .7rem; }
.wms-outgoing-override-material > small,
.wms-outgoing-override-metric small { display: block; margin-top: .12rem; color: #8896a1; font-size: .61rem; }

.wms-outgoing-override-badge {
    display: inline-flex;
    align-items: center;
    padding: .2rem .42rem;
    border-radius: 999px;
    font-size: .56rem;
    font-weight: 800;
    line-height: 1.1;
    white-space: nowrap;
}
.wms-outgoing-override-badge.is-in-bom { background: #eaf8f1; color: #277853; }
.wms-outgoing-override-badge.is-outside-bom { background: #fff3df; color: #9a6507; }
.wms-outgoing-override-badge.is-neutral { background: #f0f3f5; color: #667785; }

.wms-outgoing-material-code-line { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.wms-outgoing-override-caption { margin-top: .18rem !important; color: #a26c0a !important; font-weight: 700; }

.wms-outgoing-override-save-note {
    display: flex;
    gap: .5rem;
    align-items: center;
    margin-top: .75rem;
    padding: .65rem .75rem;
    border-radius: 9px;
    background: #fff7e8;
    color: #8b651e;
    font-size: .65rem;
}

@media (max-width: 991.98px) {
    .wms-outgoing-override-context { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .wms-outgoing-override-result { grid-template-columns: 1fr 1fr; }
    .wms-outgoing-override-result .btn { width: 100%; }
}

/* 1.8E.009C - Outgoing Qty Edit */
.wms-outgoing-index-action {
    min-width: 92px;
    white-space: nowrap;
}
.wms-outgoing-edit-modal .modal-content {
    border: 0;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 70px rgba(29, 55, 74, .22);
}
.wms-outgoing-edit-context {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .6rem;
}
.wms-outgoing-edit-context > div {
    min-width: 0;
    padding: .65rem .72rem;
    border-radius: 10px;
    background: #f6f8fa;
}
.wms-outgoing-edit-context span,
.wms-outgoing-edit-location > span {
    display: block;
    color: #7c8b98;
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .045em;
    text-transform: uppercase;
}
.wms-outgoing-edit-context strong {
    display: block;
    margin-top: .12rem;
    overflow-wrap: anywhere;
    color: #304555;
    font-size: .7rem;
}
.wms-outgoing-edit-location > div {
    display: grid;
    gap: .45rem;
    margin-top: .5rem;
}
.wms-outgoing-edit-location-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .55rem .65rem;
    border: 1px solid #e4eaee;
    border-radius: 9px;
    background: #fff;
}
.wms-outgoing-edit-location-row strong {
    display: block;
    color: #304555;
    font-size: .7rem;
}
.wms-outgoing-edit-location-row small {
    display: block;
    margin-top: .12rem;
    color: #8794a1;
    font-size: .61rem;
}
.wms-outgoing-edit-location-row > span {
    color: #304555;
    font-size: .7rem;
    font-weight: 800;
    white-space: nowrap;
}
.wms-outgoing-edit-note {
    display: flex;
    gap: .55rem;
    align-items: flex-start;
    padding: .7rem .8rem;
    border-radius: 9px;
    background: #f7fbfd;
    color: #526c7c;
    font-size: .65rem;
    line-height: 1.45;
}
.wms-outgoing-edit-note i {
    margin-top: .08rem;
    color: var(--wms-primary, #139bb8);
}

@media (max-width: 991.98px) {
    .wms-outgoing-edit-context {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .wms-outgoing-edit-context {
        grid-template-columns: 1fr;
    }
    .wms-outgoing-edit-location-row {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* 1.9.003B - Material Return read-only preview UI */
.wms-return-modal .modal-dialog { max-width: 1320px; }
.wms-return-modal .modal-content {
    border: 0;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 70px rgba(29, 55, 74, .22);
}

.wms-return-readonly-badge,
.wms-return-pool-badge,
.wms-return-preview-status,
.wms-return-state {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .28rem .55rem;
    border-radius: 999px;
    font-size: .6rem;
    font-weight: 800;
    line-height: 1.1;
    white-space: nowrap;
}
.wms-return-readonly-badge { background: #eef6f9; color: #356679; }
.wms-return-pool-badge { background: #eef4ff; color: #3f5f8a; }
.wms-return-preview-status { background: #eaf8f1; color: #277853; }
.wms-return-state.is-ready { background: #eaf8f1; color: #277853; }
.wms-return-state.is-warning { background: #fff4df; color: #91620b; }

.wms-return-empty,
.wms-return-loading {
    padding: .85rem 1rem;
    border: 1px dashed #d7e0e6;
    border-radius: 10px;
    background: #fafcfd;
    color: #738392;
    font-size: .68rem;
    text-align: center;
}

.wms-return-search-table { min-width: 1180px; }
.wms-return-source-table { min-width: 720px; }
.wms-return-search-table thead th,
.wms-return-source-table thead th {
    padding: .55rem .65rem;
    border-bottom: 1px solid #e3eaee;
    background: #f7f9fa;
    color: #738392;
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .045em;
    text-transform: uppercase;
    white-space: nowrap;
}
.wms-return-search-table td,
.wms-return-source-table td {
    padding: .6rem .65rem;
    border-color: #edf1f4;
    color: #344354;
    font-size: .68rem;
    vertical-align: middle;
}
.wms-return-search-table td small,
.wms-return-source-table td small {
    display: block;
    margin-top: .12rem;
    color: #8794a1;
    font-size: .58rem;
}

.wms-return-context-grid,
.wms-return-preview-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .55rem;
}
.wms-return-context-grid > div,
.wms-return-preview-grid > div {
    min-width: 0;
    padding: .62rem .7rem;
    border-radius: 10px;
    background: #f6f8fa;
}
.wms-return-context-grid span,
.wms-return-preview-grid span {
    display: block;
    color: #7c8b98;
    font-size: .55rem;
    font-weight: 800;
    letter-spacing: .045em;
    text-transform: uppercase;
}
.wms-return-context-grid strong,
.wms-return-preview-grid strong {
    display: block;
    margin-top: .12rem;
    overflow-wrap: anywhere;
    color: #304555;
    font-size: .69rem;
}

.wms-return-technical {
    padding: .68rem .75rem;
    border: 1px solid #e3eaee;
    border-radius: 10px;
    background: #fbfcfd;
}
.wms-return-technical summary {
    cursor: pointer;
    color: #516979;
    font-size: .66rem;
    font-weight: 800;
}

.wms-return-warning-list { display: grid; gap: .5rem; }
.wms-return-warning,
.wms-return-ok {
    display: flex;
    align-items: flex-start;
    gap: .55rem;
    padding: .65rem .75rem;
    border-radius: 9px;
    font-size: .64rem;
    line-height: 1.4;
}
.wms-return-warning { border: 1px solid #efd9ae; background: #fff9ee; color: #765b24; }
.wms-return-warning > i { margin-top: .08rem; color: #a97a16; }
.wms-return-warning strong { display: block; font-size: .62rem; }
.wms-return-warning span { display: block; margin-top: .08rem; }
.wms-return-ok { border: 1px solid #cce6d7; background: #f1fbf5; color: #337257; }

@media (max-width: 1199.98px) {
    .wms-return-context-grid,
    .wms-return-preview-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
    .wms-return-context-grid,
    .wms-return-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .wms-return-context-grid,
    .wms-return-preview-grid { grid-template-columns: 1fr; }
}


/* 1.9.005G - Material Return disposition selector */
.wms-return-disposition {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
}
.wms-return-disposition-card {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: .7rem;
    padding: .8rem .85rem;
    border: 1px solid #dce4e9;
    border-radius: 11px;
    background: #fff;
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.wms-return-disposition-card:hover {
    border-color: #b9c9d4;
    box-shadow: 0 4px 14px rgba(38, 58, 73, .06);
}
.wms-return-disposition-card input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.wms-return-disposition-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: #eef3f6;
    color: #587080;
}
.wms-return-disposition-copy { min-width: 0; }
.wms-return-disposition-copy strong {
    display: block;
    color: #304555;
    font-size: .72rem;
}
.wms-return-disposition-copy small {
    display: block;
    margin-top: .18rem;
    color: #7b8995;
    font-size: .61rem;
    line-height: 1.45;
}
.wms-return-disposition-card:has(input:checked) {
    border-color: #7ba4bd;
    background: #f6fafc;
    box-shadow: inset 0 0 0 1px rgba(123, 164, 189, .16);
}
.wms-return-disposition-card.is-ng:has(input:checked) {
    border-color: #d7a75e;
    background: #fffaf1;
    box-shadow: inset 0 0 0 1px rgba(215, 167, 94, .15);
}
.wms-return-disposition-card.is-ng:has(input:checked) .wms-return-disposition-icon {
    background: #fff0d5;
    color: #9a6a19;
}
.wms-return-disposition-card.is-ok:has(input:checked) .wms-return-disposition-icon {
    background: #e8f6ef;
    color: #327356;
}
.wms-return-disposition-note {
    padding: .52rem .65rem;
    border-radius: 8px;
    background: #f7f9fa;
    color: #687b89;
    font-size: .62rem;
    line-height: 1.4;
}
.wms-return-ng-reason {
    padding: .75rem;
    border: 1px solid #ead6b6;
    border-radius: 10px;
    background: #fffaf3;
}
@media (max-width: 767.98px) {
    .wms-return-disposition { grid-template-columns: 1fr; }
}
