

/* v6.0 visual refresh */
.modern-filter-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px;
    border: 1px solid #d8dee8;
    border-radius: 14px;
    background: #f6f8fb;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.65);
}

.modern-filter-search {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 310px;
    flex: 1 1 320px;
    height: 44px;
    padding: 0 14px;
    border: 1px solid #cfd8e3;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
}
.modern-filter-search > span {
    color: #7f8b9c;
    font-size: 15px;
}
.modern-filter-search input,
.modern-filter-input {
    width: 100%;
    min-width: 0;
    min-height: auto !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    font-size: 12px;
    color: #243446;
}
.modern-filter-select {
    height: 44px !important;
    min-width: 190px;
    padding: 0 38px 0 14px !important;
    border: 1px solid #cfd8e3 !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: #243446 !important;
    font-size: 12px !important;
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
}
.modern-filter-actions {
    display: flex;
    gap: 8px;
}
.modern-filter-btn {
    min-width: 76px;
    height: 44px;
    padding: 0 14px !important;
    border-radius: 12px !important;
    font-size: 11px !important;
    font-weight: 700;
    text-decoration: none;
}
.modern-filter-btn.primary {
    background: #1f4fd1 !important;
    border-color: #1f4fd1 !important;
    color: #fff !important;
}
.modern-filter-btn:not(.primary) {
    background: #fff !important;
    border: 1px solid #cfd8e3 !important;
    color: #3d4a5d !important;
}
.modern-filter-btn:hover {
    transform: translateY(-1px);
}

.modern-scope-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 4px;
}
.modern-scope-grid label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 14px;
    border: 1px solid #dfe5ed;
    border-radius: 14px;
    background: linear-gradient(180deg, #fbfcfe 0%, #f5f8fc 100%);
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
}
.modern-scope-grid label > span {
    font-size: 10px;
    font-weight: 800;
    color: #6b7789;
}
.modern-scope-grid input,
.modern-scope-grid select,
.modern-scope-grid textarea {
    min-height: 42px;
    border: 1px solid #cfd8e3;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
}

.modern-request-head {
    margin-top: 18px;
    margin-bottom: 12px;
    padding: 16px 18px;
    border: 1px solid #dfe5ed;
    border-radius: 14px;
    background: linear-gradient(180deg, #fafbfd 0%, #f4f7fb 100%);
}
.modern-request-head h3 {
    margin-bottom: 6px;
}
.modern-request-head p {
    margin: 0;
    color: #667589;
}

.part-combo-control {
    min-height: 46px;
    border: 1px solid #cfd8e3;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16,24,40,.05);
}
.part-combo.open .part-combo-control,
.part-combo-control:focus-within {
    border-color: #7aa2e3;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, .12);
}
.part-combo-input {
    font-size: 12px !important;
}
.part-combo-toggle {
    flex: 0 0 42px;
    color: #516176;
    font-size: 18px;
}
.part-combo-menu {
    margin-top: 2px;
    border-radius: 14px;
    border-color: #d7dfe9;
    box-shadow: 0 14px 30px rgba(23, 35, 58, .14);
}
.part-combo-option {
    padding: 11px 13px;
}
.part-option-main strong {
    font-size: 11.5px;
}
.part-option-main span {
    font-size: 10.5px;
}
.part-option-sub {
    gap: 10px;
}

.searchable-request-table thead th {
    background: #f4f7fb;
    border-bottom-color: #dde5ef;
}
.searchable-request-table tbody tr:hover {
    background: #fbfdff;
}

.request-row-actions {
    margin-top: 12px;
    padding: 10px 0 2px;
}
.request-row-actions .panel-note {
    color: #667589;
    font-weight: 700;
}

.modern-note-box {
    margin-top: 14px;
    padding: 16px 18px;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    background: #f8fbff;
}
.modern-note-box strong {
    display: block;
    margin-bottom: 4px;
    color: #2c3f59;
}
.modern-note-box span {
    color: #667589;
}

@media (max-width: 1100px) {
    .modern-filter-bar {
        align-items: stretch;
    }
    .modern-filter-search {
        min-width: 260px;
    }
}
@media (max-width: 900px) {
    .modern-scope-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .modern-filter-select {
        min-width: 150px;
        flex: 1 1 180px;
    }
}
@media (max-width: 640px) {
    .modern-scope-grid {
        grid-template-columns: 1fr;
    }
    .modern-filter-actions {
        width: 100%;
    }
    .modern-filter-btn {
        flex: 1 1 auto;
    }
}


/* v6.1 connected outbound workflow */
.linked-workflow {
    display: grid;
    grid-template-columns: auto 1fr auto 1fr auto 1fr auto;
    align-items: center;
    gap: 10px;
    margin: 0 0 18px;
    padding: 15px 18px;
    border: 1px solid #dfe5ed;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(15, 27, 45, .04);
}
.linked-workflow.compact {
    margin-bottom: 12px;
}
.linked-step {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 145px;
}
.linked-step > span {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    flex: 0 0 30px;
    border-radius: 50%;
    background: #eef2f7;
    color: #778396;
    font-size: 10px;
    font-weight: 900;
}
.linked-step > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.linked-step strong {
    font-size: 10.5px;
    color: #536176;
}
.linked-step small {
    color: #8a95a5;
    font-size: 8.5px;
}
.linked-step.done > span {
    background: #e7f7ef;
    color: #147a4c;
}
.linked-step.done strong {
    color: #294d3e;
}
.linked-step.current > span {
    background: #245fd3;
    color: #fff;
    box-shadow: 0 0 0 4px rgba(36, 95, 211, .10);
}
.linked-step.current strong {
    color: #1e4d9b;
}
.linked-line {
    height: 2px;
    background: #e5eaf0;
    border-radius: 999px;
}
.linked-line.done {
    background: #84c6a5;
}

.request-detail-summary,
.request-context-strip {
    display: grid;
    grid-template-columns: repeat(6, minmax(0,1fr));
    gap: 1px;
    margin-bottom: 18px;
    overflow: hidden;
    border: 1px solid #dfe5ed;
    border-radius: 14px;
    background: #dfe5ed;
}
.request-detail-summary > div,
.request-context-strip > div {
    min-height: 78px;
    padding: 13px 14px;
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.request-context-strip {
    grid-template-columns: 1.15fr 1.3fr 1fr 1fr 1.1fr;
}
.request-context-strip > div {
    min-height: 67px;
}
.request-detail-summary span,
.request-context-strip span {
    color: #8390a1;
    font-size: 8.5px;
    font-weight: 700;
}
.request-detail-summary strong,
.request-context-strip strong {
    color: #2d3b4f;
    font-size: 11px;
}
.request-detail-summary small,
.request-context-strip small {
    color: #7d8999;
    font-size: 8.5px;
}

.request-progress-panel {
    margin-bottom: 18px;
}
.request-progress-value {
    display: flex;
    align-items: baseline;
    gap: 7px;
}
.request-progress-value strong {
    font-size: 20px;
    color: #245fd3;
}
.request-progress-value span {
    color: #7d8999;
    font-size: 9px;
}
.request-progress-track {
    height: 5px;
    margin: 0 20px 14px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf1f6;
}
.request-progress-track > div {
    height: 100%;
    border-radius: 999px;
    background: #245fd3;
}

.request-no-link {
    color: #1d65bf;
    font-weight: 800;
}
.request-no-link:hover {
    text-decoration: underline;
}
.row-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.request-stock-id {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.request-remark-card {
    margin-top: 18px;
    padding: 15px 17px;
    border: 1px solid #dfe5ed;
    border-radius: 12px;
    background: #fff;
}
.request-remark-card span {
    color: #7e8a9b;
    font-size: 9px;
    font-weight: 800;
}
.request-remark-card p {
    margin: 7px 0 0;
    color: #3f4c5f;
    font-size: 11px;
    line-height: 1.6;
}

@media (max-width: 1100px) {
    .linked-workflow {
        grid-template-columns: 1fr;
    }
    .linked-line {
        width: 2px;
        height: 16px;
        margin-left: 14px;
    }
    .request-detail-summary,
    .request-context-strip {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}
@media (max-width: 640px) {
    .request-detail-summary,
    .request-context-strip {
        grid-template-columns: 1fr;
    }
}


/* v6.2 create -> request overview linkage */
.request-created-alert {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.just-created-request td {
    background: #f4f8ff !important;
}
.just-created-request td:first-child {
    box-shadow: inset 3px 0 0 #2563eb;
}
.new-request-badge {
    display: inline-flex;
    margin-left: 5px;
    padding: 2px 5px;
    border-radius: 999px;
    background: #e7efff;
    color: #1f5dcc;
    font-size: 8px;
    font-weight: 900;
    vertical-align: middle;
}


/* v6.3 request persistence / validation */
.request-validation-summary:empty {
    display: none;
}
.request-validation-summary ul {
    margin: 0;
    padding-left: 18px;
}
.request-validation-summary li + li {
    margin-top: 4px;
}


/* v6.4 - PRF linked Case */
.linked-case-panel {
    margin-top: 14px;
    padding: 18px;
    border: 1px solid #d8e3ee;
    border-radius: 14px;
    background: #f7fbff;
}
.linked-case-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.linked-case-head h3 {
    margin: 2px 0 0;
    font-size: 15px;
}

.linked-case-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid #dfe6ef;
    border-radius: 10px;
    background: #dfe6ef;
}
.linked-case-summary > div {
    min-height: 70px;
    padding: 11px 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: #fff;
}
.linked-case-summary span {
    color: #8390a1;
    font-size: 8.5px;
    font-weight: 700;
}
.linked-case-summary strong {
    color: #2c3a4e;
    font-size: 10.5px;
    overflow-wrap: anywhere;
}
.linked-case-summary small {
    color: #8490a0;
    font-size: 8px;
}

.case-main-description {
    margin-top: 12px;
    overflow: hidden;
    border: 1px solid #dfe6ef;
    border-radius: 10px;
    background: #fff;
}
.case-description-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 13px;
    border-bottom: 1px solid #e4e9ef;
    background: #f7f9fc;
}
.case-description-title span {
    font-size: 10px;
    font-weight: 800;
    color: #34445a;
}
.case-description-title small {
    color: #8b96a5;
    font-size: 8px;
}
.case-description-body {
    max-height: 300px;
    overflow-y: auto;
    padding: 12px 14px;
    color: #3f4d60;
    font-size: 10.5px;
    line-height: 1.65;
}
.case-text-section + .case-text-section {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #edf0f4;
}
.case-text-section > span {
    display: block;
    margin-bottom: 5px;
    color: #718095;
    font-size: 8px;
    font-weight: 800;
}
.case-text-section p {
    margin: 0;
}

.case-description-history {
    margin-top: 12px;
    border: 1px solid #dfe6ef;
    border-radius: 10px;
    background: #fff;
}
.case-description-history summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    cursor: pointer;
    list-style: none;
}
.case-description-history summary::-webkit-details-marker {
    display: none;
}
.case-description-history summary span {
    color: #354459;
    font-size: 10px;
    font-weight: 800;
}
.case-description-history summary strong {
    color: #3467b7;
    font-size: 9px;
}
.case-description-list {
    max-height: 430px;
    overflow-y: auto;
    padding: 0 12px 12px;
}
.case-description-entry {
    margin-top: 8px;
    overflow: hidden;
    border: 1px solid #e0e6ee;
    border-radius: 10px;
    background: #fbfcfe;
}
.case-description-entry-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 11px;
    border-bottom: 1px solid #e8edf3;
    background: #f7f9fb;
}
.case-description-entry-head > div {
    display: flex;
    align-items: center;
    gap: 7px;
}
.case-description-entry-head > div > span {
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #e8f0fc;
    color: #3265af;
    font-size: 8px;
    font-weight: 900;
}
.case-description-entry-head strong {
    color: #3b495d;
    font-size: 9.5px;
}
.case-description-entry-head small {
    color: #8c97a6;
    font-size: 8px;
}
.case-description-entry-body {
    padding: 11px;
    color: #445267;
    font-size: 10px;
    line-height: 1.65;
}
.case-description-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 0 11px 10px;
}
.case-description-tags span {
    padding: 3px 6px;
    border-radius: 999px;
    background: #edf3fa;
    color: #607086;
    font-size: 8px;
}
.case-monitoring-comment {
    margin: 0 11px 11px;
    padding: 9px 10px;
    border-left: 3px solid #83a8dc;
    background: #f3f7fc;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.case-monitoring-comment strong {
    color: #4d6482;
    font-size: 8px;
}
.case-monitoring-comment span {
    color: #58687e;
    font-size: 9px;
    line-height: 1.55;
}
.case-empty-message {
    padding: 14px;
    color: #7e8998;
    font-size: 9.5px;
}

@media (max-width: 1000px) {
    .linked-case-summary {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}
@media (max-width: 600px) {
    .linked-case-summary {
        grid-template-columns: 1fr;
    }
}


/* v6.5 Salesforce Case rich-text readability */
.case-description-body {
    font-size: 11px;
    line-height: 1.75;
}
.case-text-section > span {
    text-transform: none;
    letter-spacing: 0;
}
.case-text-section p {
    margin: 0;
    white-space: normal;
}
.case-description-entry-body {
    font-size: 10.5px;
    line-height: 1.75;
}
.case-description-entry-head strong {
    color: #314158;
    font-weight: 800;
}


/* v7.0 quantity / part-code outbound */
.barcode-part-panel {
    margin-bottom: 16px;
}
.part-barcode-row {
    display: grid;
    grid-template-columns: minmax(420px, 1fr) minmax(280px, .8fr);
    gap: 12px;
    align-items: center;
}
.part-barcode-input-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 0 8px 0 14px;
    border: 1px solid #cfd8e4;
    border-radius: 12px;
    background: #fff;
}
.barcode-prefix {
    color: #587397;
    font-size: 17px;
}
.part-barcode-input-wrap input {
    flex: 1;
    min-width: 0;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}
.barcode-inline-result {
    min-height: 48px;
    padding: 11px 13px;
    display: flex;
    align-items: center;
    border: 1px solid #dfe5ed;
    border-radius: 12px;
    background: #f8fafc;
    color: #6e7a8c;
    font-size: 10px;
}
.barcode-inline-result.success {
    border-color: #b9dfca;
    background: #f1fbf5;
    color: #2c6b49;
}
.barcode-inline-result.error {
    border-color: #efc2c2;
    background: #fff6f6;
    color: #a84646;
}
.part-code-camera {
    margin-top: 12px;
}

.select-request-item.selected {
    border-color: #245fd3 !important;
    background: #eef4ff !important;
    color: #1e56bd !important;
}
.selected-request-item small {
    display: block;
    margin-top: 4px;
    color: #7d8998;
    font-size: 8px;
}

.prf-candidate.candidate-warning {
    border-color: #e5c98f;
    background: #fffaf0;
}
.candidate-alert {
    padding: 2px 6px;
    border-radius: 999px;
    background: #fff0cf;
    color: #a66a00;
    font-size: 8px;
    font-weight: 800;
}

.close-action-note {
    border-color: #e7c47c;
    background: #fff9ec;
}
.close-action-note strong {
    color: #8b5a00;
}

@media (max-width: 900px) {
    .part-barcode-row {
        grid-template-columns: 1fr;
    }
}


/* v7.0 final workflow polish */
.sf-flow-summary {
    display: grid;
    grid-template-columns: auto 28px auto 28px auto 28px auto 28px auto;
    align-items: center;
    gap: 8px;
    padding: 18px;
}
.sf-flow-summary > div:not(:nth-child(even)) {
    min-height: 84px;
    padding: 14px;
    border: 1px solid #dde5ef;
    border-radius: 12px;
    background: #f8fafc;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.sf-flow-summary > div:nth-child(even) {
    text-align: center;
    color: #8a96a7;
}
.sf-flow-summary span {
    color: #2864c7;
    font-size: 9px;
    font-weight: 900;
}
.sf-flow-summary strong {
    color: #304055;
    font-size: 11px;
}
.sf-flow-summary small {
    color: #7f8b9c;
    font-size: 8.5px;
}
.sf-write-rule {
    padding: 18px 20px;
    line-height: 1.8;
    font-size: 10.5px;
}
.sf-write-rule strong {
    display: block;
    margin-top: 10px;
    color: #304158;
}
.sf-write-rule strong:first-child {
    margin-top: 0;
}
.sf-write-rule p {
    margin: 4px 0 0;
    color: #5d6b7e;
}
@media (max-width: 1000px) {
    .sf-flow-summary {
        grid-template-columns: 1fr;
    }
    .sf-flow-summary > div:nth-child(even) {
        transform: rotate(90deg);
    }
}


/* v7.1 optional outbound serial + requester Change Parts inbox */
.optional-new-sn-field { padding:14px; border:1px dashed #cbd7e5; border-radius:12px; background:#f8fbff; }
.optional-new-sn-field > span b { margin-left:5px; padding:2px 6px; border-radius:999px; background:#e9eef5; color:#68778b; font-size:8px; }
.optional-sn-capture-row { display:flex; gap:8px; margin-bottom:8px; }
.optional-sn-capture-row input { flex:1; }
.captured-sn { display:inline-flex; padding:4px 7px; border-radius:7px; background:#eef6ff; color:#225da7; font-weight:800; }
.change-part-serial-pair { display:grid; grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr); gap:10px; align-items:center; margin-bottom:16px; }
.serial-pair-card { padding:15px; border:1px solid #dce4ee; border-radius:13px; background:#f8fafc; }
.serial-pair-card > span { display:block; margin-bottom:8px; color:#607086; font-size:9px; font-weight:900; }
.serial-pair-card input { width:100%; }
.serial-pair-card small { display:block; margin-top:6px; color:#8390a1; font-size:8.5px; }
.serial-pair-card.new-part { background:#f6faff; }
.serial-pair-card.fail-part.required { border-color:#e6b9b9; background:#fff8f8; }
.serial-pair-arrow { text-align:center; color:#76869a; font-size:20px; }
@media (max-width:700px) {
  .change-part-serial-pair { grid-template-columns:1fr; }
  .serial-pair-arrow { transform:rotate(90deg); }
  .optional-sn-capture-row { flex-direction:column; }
}


/* v7.2 Admin tracking master / workflow split */
.tracking-master-edit {
    display: flex;
    align-items: center;
    gap: 7px;
}
.tracking-master-edit select {
    min-width: 170px;
}
.tracking-workflow-card {
    padding: 12px 14px;
    border: 1px solid #dfe6ef;
    border-radius: 11px;
    background: #f8fafc;
    display: grid;
    grid-template-columns: 110px 90px 1fr;
    gap: 10px;
    align-items: center;
}
.tracking-workflow-card > span {
    color: #7b8798;
    font-size: 9px;
    font-weight: 800;
}
.tracking-workflow-card > strong {
    font-size: 11px;
}
.tracking-workflow-card > small {
    font-size: 9px;
    line-height: 1.5;
}
.tracking-workflow-card.serial {
    border-color: #b9dfca;
    background: #f2fbf6;
}
.tracking-workflow-card.serial > strong {
    color: #26734a;
}
.tracking-workflow-card.qty {
    border-color: #cbd9ea;
    background: #f4f8fd;
}
.tracking-workflow-card.qty > strong {
    color: #37689f;
}
.tracking-workflow-card.unset {
    border-color: #ead19e;
    background: #fff9ee;
}
.tracking-workflow-card.unset > strong {
    color: #9a6700;
}
@media (max-width: 760px) {
    .tracking-workflow-card {
        grid-template-columns: 1fr;
    }
}



/* Work queue and keyboard accessibility */
.skip-link { position:fixed; top:8px; left:12px; transform:translateY(-160%); z-index:10000; background:#fff; color:#172c64; padding:12px 18px; border:2px solid #4058bb; border-radius:8px; }
.skip-link:focus { transform:translateY(0); }
:where(a, button, input, select, textarea, summary):focus-visible { outline:3px solid #365bd6; outline-offset:3px; }
.workspace-tools { display:flex; justify-content:flex-end; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:12px; }
#connection-status { color:#9b2c15; font-size:13px; }
.operations-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:20px 0; }
.operations-summary a { display:flex; flex-direction:column; gap:10px; padding:24px; border:1px solid #dce2ec; border-radius:14px; background:#fff; color:#27344b; text-decoration:none; }
.operations-summary a:hover { border-color:#4058bb; background:#f8faff; }
.operations-summary strong { font-size:32px; color:#273f90; }
.operations-summary strong span { font-size:14px; margin-left:6px; font-weight:400; }
.pagination-bar { display:flex; flex-wrap:wrap; gap:12px; align-items:center; padding:16px; border-top:1px solid #e5e9f0; }
.cancellation-record { padding:20px; margin:20px 0; }
.cancellation-record summary { cursor:pointer; font-weight:700; }
.cancellation-record form { display:grid; gap:12px; max-width:720px; }
.cancellation-record textarea { width:100%; padding:12px; border:1px solid #bdc6d7; border-radius:8px; font:inherit; }
.cancellation-record button { justify-self:start; }
.preserve-lines { white-space:pre-wrap; overflow-wrap:anywhere; }
.status-pill.취소 { background:#edf0f4; color:#4a5568; }
.response-page { max-width:740px; margin:12vh auto; padding:32px; background:#fff; border:1px solid #dce2ec; border-radius:16px; }
.response-page p { line-height:1.8; margin:20px 0; }
.response-page code { overflow-wrap:anywhere; }
.request-case-fields { min-width:0; margin:24px 0; padding:20px; border:1px solid #dce3ed; border-radius:12px; }
.request-case-fields legend { padding:0 8px; font-weight:700; }
.request-case-fields > p { margin:0 0 16px; color:#526174; line-height:1.6; }
.request-case-fields .standalone-label { margin-top:16px; }
.case-entry-section { min-width:0; margin:24px 0; padding:0 0 20px; border:1px solid #dce3ed; border-radius:12px; }
.case-entry-section > h2 { margin:0 0 20px; padding:14px 20px; background:#f3f5f8; border-radius:12px 12px 0 0; font-size:18px; font-weight:600; }
.case-information-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:22px 32px; padding:0 20px; }
.case-information-grid > * { min-width:0; }
.case-information-grid label, .case-reference { display:flex; flex-direction:column; gap:8px; }
.case-information-grid input, .case-information-grid select, .case-information-grid textarea { width:100%; min-width:0; box-sizing:border-box; padding:11px 12px; border:1px solid #cbd5e3; border-radius:8px; background:#fff; color:#243448; font:inherit; }
.case-information-grid input[type=search] { appearance:none; }
.case-information-grid input:focus, .case-information-grid select:focus, .case-information-grid textarea:focus { outline:2px solid #326ac3; outline-offset:2px; }
.prf-note { min-width:160px; width:100%; box-sizing:border-box; }
.prf-fixed-reason { display:block; min-width:120px; font-size:12px; color:#465a73; }
.case-occurrence-time { display:flex; flex-wrap:wrap; gap:10px; margin-top:8px; }
.case-occurrence-time > label { flex:1 1 120px; }
.case-information-grid .case-checkbox { flex-direction:row; align-items:center; }
.cell-number-field { display:flex; min-width:0; flex-direction:column; gap:8px; }
.cell-number-options { display:grid; grid-template-columns:repeat(7,minmax(72px,1fr)); gap:6px; width:100%; max-width:none; padding:8px; border:1px solid #cbd5e3; border-radius:8px; background:#fff; }
.cell-number-options label { position:relative; display:flex; min-height:42px; flex-direction:row !important; align-items:center; justify-content:center; gap:0 !important; padding:4px; border:1px solid #dbe3ef; border-radius:7px; background:#f8fafc; cursor:pointer; font-weight:600; }
.cell-number-options label:has(input:checked) { border-color:#2563eb; background:#e8f0ff; color:#1d4ed8; box-shadow:inset 0 0 0 1px #2563eb; }
.cell-number-options input { position:absolute; width:1px !important; height:1px; overflow:hidden; clip:rect(0 0 0 0); padding:0 !important; }
.cell-number-field small { color:#64748b; }
@media(max-width:700px) { .cell-number-options { grid-template-columns:repeat(4,minmax(0,1fr)); } }
.case-checkbox input { width:18px; height:18px; }
.case-reference-results { display:flex; flex-direction:column; gap:4px; max-height:220px; overflow:auto; font-size:13px; }
.case-reference-results button { text-align:left; padding:10px; background:#f5f8fc; border:1px solid #dce3ed; border-radius:6px; cursor:pointer; }

/* 데스크톱 출고 등록은 고정 1,240px 패널 대신 콘텐츠 영역을 채운다. */
@media (min-width:821px) {
    .form-panel.wide.outbound-request-create-panel {
        width:100%;
        max-width:none;
    }
}

.case-entry-section > .request-remark { margin:0 20px; }
.request-validation-summary.validation-summary-valid { display:none; }
@media(max-width:700px) { .case-information-grid { grid-template-columns:minmax(0,1fr); padding:0 14px; } }
@media(max-width:600px) { .request-case-fields { padding:14px; } }
@media(max-width:600px) {
    .operations-summary { gap:8px; }
    .operations-summary a { padding:12px 10px; font-size:12px; }
    .operations-summary strong { font-size:26px; }
    .response-page { margin:24px 12px; padding:24px; }
}
@media(prefers-reduced-motion:reduce) {
    *, *::before, *::after { scroll-behavior:auto !important; animation-duration:0.01ms !important; transition-duration:0.01ms !important; }
}
