/* ========================================
   납품실적등록 PWA - 통합 스타일시트
   신규 디자인 (Pretendard, 블루 테마)
   ======================================== */

/* CSS 변수 정의 */
:root {
  --primary: #2172ec;
  --primary-dark: #1a5bbd;
  --primary-light: #d7e6fd;
  --danger: #f6495f;
  --danger-dark: #ba2d0a;
  --info: #2196F3;
  --info-dark: #1976D2;
  --warning: #FF9800;
  --dark: #333333;
  --gray: #666666;
  --gray-light: #999999;
  --light: #f5f5f5;
  --white: #fff;
  --black: #090A10;
  --border: #e0e0e0;
  --shadow: rgba(0, 0, 0, 0.1);
  --shadow-dark: rgba(0, 0, 0, 0.2);
  --radius: 12px;
  --radius-sm: 8px;
  --transition: 0.2s ease;
}

/* 리셋 */
* {margin:0;padding:0; box-sizing:border-box;}

html, body {
  height: 100%;
  font-family:Pretendard;
  font-size: 16px;
  line-height: 1.5;
  color: #333333;
  background: #f5f5f5;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  overscroll-behavior: none;
  overscroll-behavior-y: contain;
}

/* 앱 컨테이너 */
.app-container {
  max-width: 480px;
  margin: 0 auto;
  min-height: 100vh;
  background: #fff;
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 20px var(--shadow);
}

/* 헤더 */
.header { color: #090A10; padding:20px 20px 10px 15px; display:flex; align-items:center;justify-content:space-between;position:sticky; top: 0; z-index: 100; background:#fff; }
.header-title {font-size:16px;font-weight:600; display:flex; align-items:center; gap:0px; position:relative}
.header-back {border:none; color:#fff; cursor: pointer; background:none; }
.header-back img{ width:2em; }
.header-action {position:absolute; top:22px; left:130px; background:none; border:none; color: #fff; font-size:13px; cursor:pointer; padding:3px 6px;border-radius:8px;background:#595d7e;font-weight: 500; letter-spacing:-0.5px}
.header-action:active {background: rgba(255,255,255,0.3);}
.menu-home-sub {position:absolute; top:20px;right:55px;width:28px; height:28px; background:#00000010;border: none; cursor: pointer; border-radius:55px; }
.menu-home-sub img{ width:55%}
.menu-logout-sub {position:absolute; top:25px;right:25px; width:18px; background: none;border: none; cursor: pointer;}
.menu-logout-sub img{ width:100%}
/* 페이지 공통 */
.page {height: 100vh; overflow-y:auto; }
/* 콘텐츠 영역 */
.content {padding:0 20px 100px 20px;}
.content > .delivery-section:first-child {margin-top:10px;}
/* 로그인 페이지 */
.login-page {display:flex; flex-direction:column; justify-content:center; min-height:100vh; padding:40px 24px; background-color:#272e47}
.login-logo {text-align:center;margin-bottom:40px;}
.login-logo h1 {color:#fff; font-size:28px; font-weight:700; margin-bottom:8px;}
.login-logo h1 img{width:55%  }
.login-logo p {color:#f2f2f2;font-size:16px;font-weight:400;}
.login-card {background:#fff; border-radius:12px; padding:32px 24px; box-shadow:0 10px 40px var(--shadow-dark);}
/* 입력 필드 */
.input-group {margin-bottom:10px;}
.input-group label {display: block;font-size: 14px;font-weight: 500; letter-spacing: -0.5px;color: #666666;margin-bottom: 8px;}
.input-wrapper {position: relative;display: flex;align-items: center;}
.input-wrapper input {width:100%; padding:18px 44px 18px 16px; border:0px solid #e0e0e0;border-radius: 8px;font-size:16px;color: #333333;transition: border-color var(--transition);background:#f2f2f2;}
.input-wrapper input:focus { outline: none;border-color:#2172EC;}
.input-wrapper .input-icon { position:absolute; left:14px; color:var(--gray-light); font-size:18px;}
.input-wrapper input.has-icon {padding-left:44px;}
.input-clear {position:absolute; right:12px ;background:var(--gray-light); border:none; color:#fff; width:22px; height:22px;border-radius:50%;font-size:14px;cursor:pointer;display:none;align-items:center;justify-content:center;line-height:1;}
.input-wrapper input:not(:placeholder-shown) + .input-clear {display: flex;}
/* 체크박스 */
.checkbox-group {display:flex; align-items:center; gap:8px; margin-bottom:25px;}
.IDsave {display:inline-flex;align-items: center;cursor: pointer;font-size:14px; letter-spacing:-0.5px;font-weight:500;color: #404046;}
.IDsave input[type="checkbox"] {display: none; }
.IDsaveCustom {position: relative;margin-right:8px;width:20px;height:20px;border:1px solid #d7d7d7;border-radius:50px;transition: all 0.2s ease;background-color: #fff;}
.IDsave input[type="checkbox"]:checked + .IDsaveCustom {background-color: #2172EC;border-color: #2172EC;}
.IDsave input[type="checkbox"]:checked + .IDsaveCustom::after {content: '';position:absolute;top:50%;left:50%;transform: translate(-50%, -50%);width:20px;height:20px;
background-image: url('../imgs/Check_white.png');background-size: contain;background-repeat: no-repeat;}

/* 버튼 */
.btn {display:flex;align-items: center;justify-content: center;gap:8px;width:100%;padding:0.5em 1em;border: none;border-radius:8px;font-size:16px;font-weight: 600;cursor: pointer;transition: all var(--transition);min-height:2.8em;}
.btn:active {transform: scale(0.98);}
.btn-login {color:#fff; background:linear-gradient(85.36deg, #7552f9 -42.41%, #1f88fe 111.92%);}
.btn-login:active { background: #1a5bbd;}
.btn-primary {color:#fff;background-color:#2b80fd;}
.btn-primary:active { background: #1a5bbd;}
.btn-danger {background: #f6495f;color: #fff;}
.btn-danger:active {background: var(--danger-dark);}
.btn-info {background: var(--info);color: #fff;}
.btn-info:active {background: var(--info-dark);}
.btn-outline {background: #fff;color: #666666;border:1px solid #e0e0e0;}
.btn-outline:active {background: #f5f5f5;}
.btn-sm {padding: 10px 16px;font-size: 13px;min-height: 40px;}
.btn-lg {padding: 18px 32px;font-size: 18px;min-height: 60px;}
.btnSmall {display:flex;align-items: center;justify-content: center;gap:8px;width:100%;padding:10px 1em;border:1px solid #e0e0e0;border-radius:6px;font-size:13px;font-weight:500;color:#333;cursor: pointer;transition: all var(--transition); }
.btnSmall:active {transform: scale(0.98);}

/* 메인 메뉴 */
.menu-header {text-align: center;padding-top:15px; color:#000; background-color:#FFF }
.menu-header h2 {font-size:0px;}
.menu-top{ position:relative; height:28px; border-bottom:1px solid #f5f5f5; }
.menu-top .logo-home {position:absolute; top:0px;left:20px; width:35px; border:none; cursor: pointer; background-color:#FFF }
.menu-top .logo-home img{ width:100%}
.menu-top .home {position:absolute; top:0px; left:20px; width:18px; background: none;border: none; cursor: pointer;}
.menu-top .home img{ width:100%}
.menu-top .user-name{position:absolute; top:0px; right:50px; line-height:21px; font-size:15px; font-weight:400; color:#000; border-radius:8px; text-align:right }
.menu-top .logout {position:absolute; top:0px; right:20px; width:18px; background: none;border: none; cursor: pointer;}
.menu-top .logout img{ width:100%}

.menu-grid {font-size:0; text-align:left; display:flex;align-items: center;justify-content: center; gap:15px; padding:0px 20px; margin-bottom:5px; border-bottom:1px solid #ececec;background-color:#fff}
.sticky-tab {position:sticky; top:0; z-index:100;}
.menu-grid .menu01 {height:45px; line-height:45px; width:45%; font-size:15px; font-weight:400; color:#434343; text-align:center; border:0px; border-bottom:0px solid #000; cursor: pointer; letter-spacing:-0.2px }
.menu-grid .menu01-on {height:45px; line-height:45px; width:45%; font-size:15px; font-weight:600; color:#000; text-align:center; border:0px; border-bottom:1px solid #000; cursor: pointer; letter-spacing:-0.2px }
.menu-grid .menu02 {height:45px; line-height:45px; width:55%; font-size:15px; font-weight:400; color:#434343; text-align:center; border:0px; border-bottom:0px solid #000; cursor: pointer; letter-spacing:-0.2px }
.menu-grid .menu02-on {height:45px; line-height:45px; width:55%; font-size:15px; font-weight:600; color:#000; text-align:center; border:0px; border-bottom:1px solid #000; cursor: pointer; letter-spacing:-0.2px }
.menu-grid .menu02 img{ width:9%; vertical-align:middle; margin-right:3px}
.menu-grid .menu02-on img{ width:9%; vertical-align:middle; margin-right:3px}
.menu-grid .Br{ color:#CCC; font-size:10px}
.Important-txt{ font-size:13px; font-weight:400; color:#ff5252; text-align:left; letter-spacing:-0.5px; margin-bottom:5px}
/* 배송 확정 페이지 */
.delivery-section {background: #fff;border-radius: 12px;padding:20px 20px;margin-bottom:20px;border-top:1px solid #eee; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); }
.delivery-section-noshadow {background: #fff;  margin-bottom:20px; }
/* 배송 정보 - 스크롤 시 상단 고정 */
#delivery-info {position: sticky;top: 0;z-index: 50;margin-left: -20px;margin-right:-20px;padding-left: 20px;padding-right: 20px;border-radius: 0;border-left: none;border-right: none;box-shadow: 0 2px 8px var(--shadow);}
.section-title { margin-bottom:10px; display: flex;align-items: center;gap: 8px;font-size:16px; font-weight:600; color:#090A10;}
/* QR 입력 영역 */
.qr-input-group {display:flex; gap:0px;}
.qr-input-group input {flex:1; padding:14px 16px; font-size:15px; font-weight:500; border:0px; background:#f2f2f2; border-top-left-radius: 8px; border-bottom-left-radius:8px; }
.qr-input-group input:focus {outline: none; }
.qr-scan-btn {color:#fff; border:none; border-top-right-radius:8px; border-bottom-right-radius:8px;  padding:0 15px; text-align:center;cursor: pointer;background:linear-gradient(85.36deg, #7552f9 -42.41%, #1f88fe 111.92%);}
.qr-scan-btn img{ width:1.7em}
.iv-num-btn {color:#fff;border:none;padding:0 15px; text-align:center;cursor: pointer; background:#f2f2f2; color:#666666;border:0px;border-top-right-radius:8px; border-bottom-right-radius:8px; }
.iv-num-btn img{ width:1.5em;  }
/* 정보 표시 */
.info-row {display: flex;padding: 10px 0;border-bottom: 1px solid #f5f5f5;}
.info-row:last-child {border-bottom: none;}
.info-label {width: 80px;font-size: 14px;color: #666666;flex-shrink: 0;}
.info-value {flex: 1;font-size: 14px;color: #333333;font-weight: 500;}
.info-code {color:#333333;font-size: 13px;margin-left: 6px;}
/* 박스 수량 */
.quantity-control {display: flex;align-items: center;gap: 12px;}

.quantity-btn {
  width: 44px;
  height: 44px;
  border: 2px solid #e0e0e0;
  border-radius: 8px;
  background: #fff;
  font-size: 24px;
  color: #333333;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.quantity-btn:active {
  background: #f5f5f5;
}

.quantity-value {
  font-size: 24px;
  font-weight: 700;
  min-width: 50px;
  text-align: center;
}

.quantity-print-btn {
  margin-left: auto;
}

/* 배송 리스트 */
.delivery-list {display:flex;flex-direction: column; gap:12px;}
.delivery-item {padding:8px 16px;  display:flex;align-items:center;gap:0px;cursor:pointer;transition:all var(--transition);border:1px solid transparent; position:relative;overflow:visible;background:#f5f5f5;border-radius:8px;}
.delivery-item.selected {border-color:#2172ec; background-color:#ecf2fd}
.delivery-item:active {transform: scale(0.98);}

/* 배송목록 항목 삭제 버튼 */
.delivery-remove-btn {position:absolute;top:5px;right:5px;width:20px;height:20px;color:#666;border:0px;font-size:19px;font-weight:500;cursor:pointer;
display:flex;align-items:center;justify-content:center;line-height:1;background-color:transparent;border-radius:50px;}
.delivery-remove-btn:hover {background-color:transparent;color:#666;}
.delivery-remove-btn:active {}

/* .delivery-seq {width:22px;height:22px;margin-left:5px; vertical-align:top;font-weight:400;font-size:12px; color:#666666; background-color:#fff; border-radius:50px; display:flex;align-items:center;justify-content:center;flex-shrink:0;  }*/
.delivery-info { flex:1;min-width:0;}
.delivery-row {display: flex;justify-content: space-between;align-items: center;margin-bottom:0px;}
.delivery-customer {font-size: 15px;font-weight: 600;color: #333333;display: block;max-width: 100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.delivery-iv {font-size: 13px;color: var(--info);font-weight: 500;}
.delivery-iv.clickable {cursor: pointer;text-decoration: underline;}
.delivery-iv.clickable:hover {color: var(--info-dark, #1565C0);}
.delivery-items-row {display: flex;justify-content: space-between;align-items: center;}
.delivery-items {font-size: 12px;color: #666666;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;flex: 1;}
.delivery-qty {font-size: 12px;color: var(--info);font-weight: 500;margin-left: 8px;white-space: nowrap;}
.delivery-special-actions {display: flex;gap: 8px;margin-top: 8px;}
.delivery-special-btn {flex: 1;display: flex;align-items: center;justify-content: center;gap:6px;padding:12px 12px;font-size:13px;font-weight: 600;color: #666666;background: #fff;border: 1px solid #e0e0e0;border-radius: 8px;cursor: pointer;transition: var(--transition);}

.delivery-special-btn:active {transform: scale(0.98);}
.delivery-special-btn.completed {color: #fff;background: #2172ec;border-color: #2172ec;}

/* 특수고객사 버튼 그룹 */
.special-actions {display: grid;grid-template-columns: 1fr 1fr;gap: 12px;margin-bottom: 16px;}
.special-btn {padding:16px;border:1px solid #e0e0e0;border-radius:8px;background: #fff;text-align: center;cursor: pointer;transition: all var(--transition);}
.special-btn.completed {border-color: #2172ec;background: #d7e6fd;}
.special-btn:active {transform: scale(0.98);}
.special-btn-icon {font-size: 28px;margin-bottom: 8px;}
.special-btn-icon img{ width:40%}
.special-btn-text {font-size: 14px;font-weight: 600;color: #333;}
/* 하단 고정 버튼 */
.bottom-actions {padding: 16px 20px;background: #fff;border-top: 1px solid #e0e0e0;display: flex;gap: 12px;position: fixed;bottom: 0;left: 0;right: 0;max-width: 480px;margin: 0 auto;z-index: 100;box-shadow: 0 -4px 12px var(--shadow);}
.bottom-actions .btn { flex: 1;}

/* 메뉴 화면 하단 버튼 */
.menu-bottom-actions {background: transparent;border-top: none;box-shadow: none;}

/* 모달 */
.modal-txt {padding:0px 20px 0px 20px; font-size:13px; font-weight:400; color:#ff5252; text-align:left; letter-spacing:-0.1px; line-height:15px; margin-bottom:5px}
.modal-overlay {position:fixed;top:0;left:0;right:0;bottom: 0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;transition:all var(--transition);}
.modal-overlay.active {opacity: 1;visibility: visible;}
.modal {width:90%;max-width:400px;max-height:80vh;display: flex;flex-direction: column;transform: scale(0.9);transition: transform var(--transition);background: #fff;border-radius:12px;}
.modal-overlay.active .modal {transform: scale(1);}
.modal-header {padding:30px 20px 0px 20px; display: flex;align-items: center;justify-content: space-between;}
.modal-title {font-size:16px; font-weight:600; color:#090A10;}
.modal-close {background: none;border: none;font-size: 24px;color: #666666;cursor: pointer;}
.modal-body {padding:10px 20px 0px 20px;overflow-y: auto;flex: 1;}
.modal-footer {padding:15px 20px 20px 20px;border-top: 0px solid #e0e0e0;display: flex;gap: 12px;}
.modal-footer .btn {flex: 1;}

/* 서명 캔버스 */
.signature-area {
  background: #f5f5f5;
  border: 2px dashed #e0e0e0;
  border-radius: 8px;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  position: relative;
  overflow: hidden;
}

.signature-area canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.signature-placeholder {
  color: var(--gray-light);
  font-size: 14px;
  pointer-events: none;
}

/* 토스트 */
.toast {
  position: fixed;
  bottom: 140px;
  left: 50%;
  transform: translateX(-50%) translateY(100px);
  background: #333333;
  color: #fff;
  padding: 14px 24px;
  border-radius: 50px;
  font-size: 14px;
  font-weight: 500;
  z-index: 2000;
  opacity: 0;
  transition: all 0.3s ease;
  white-space: nowrap;
  pointer-events: none;
}

.toast.show {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}

.toast.success {
  background: #2172ec;
}

.toast.error {
  background: #f6495f;
}

/* 업데이트 알림 배너 */
.update-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: var(--info);
  color: #fff;
  padding: 12px 20px;
  display: none;
  align-items: center;
  justify-content: space-between;
  z-index: 2000;
  box-shadow: 0 2px 8px var(--shadow);
}

.update-banner.show {display: flex;}

.update-banner span {
  font-size: 14px;
  font-weight: 500;
}

.update-banner button {
  background: #fff;
  color: var(--info);
  border: none;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

/* 로딩 */
.loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255,255,255,0.9);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 3000;
  opacity: 0;
  visibility: hidden;
  transition: all var(--transition);
}

.loading-overlay.active {
  opacity: 1;
  visibility: visible;
}

.loading-spinner {
  width: 48px;
  height: 48px;
  border: 4px solid #e0e0e0;
  border-top-color: #2172ec;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.loading-text {
  margin-top: 16px;
  font-size: 14px;
  color: #666666;
}

/* 증빙자료 - 파일 버튼 */
.file-btn-wrapper {position: relative;padding: 16px;border:1px solid #e0e0e0;border-radius: 8px;background: #fff;text-align: center;cursor: pointer;transition: all var(--transition);overflow: hidden;}
.file-btn-wrapper:active {transform: scale(0.98);background: #f5f5f5;}

.file-btn-wrapper input[type="file"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  font-size: 200px; /* 클릭 영역 확대 */
}

.evidence-preview {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.evidence-item {
  width: 80px;
  height: 80px;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  background: #f5f5f5;
}

.evidence-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.evidence-remove {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 24px;
  height: 24px;
  background: #f6495f;
  color: #fff;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
}

/* 조회 결과 리스트 */
.search-result-list {display:flex;flex-direction:column;gap:8px;max-height: 300px;overflow-y:auto;}
.search-result-item {padding:10px 14px; border-radius: 8px;cursor: pointer;border:1px solid transparent; transition: all var(--transition);background: #ecf2fd;}
.search-result-item.selected {border-color:#2172ec;background:#fff}
.search-result-item:active { transform: scale(0.98);}
/* IV 조회 전용 (선택 불가) */
.search-result-item.iv-view-only {cursor: default;}
.search-result-item.iv-view-only:active {transform: none;}
/* IV 조회 품목별 로우 */
.iv-item-row {display: flex;justify-content: space-between;align-items: center;margin-bottom: 0px;}
.iv-item-customer {font-size: 14px;font-weight: 600;color: #333333;}
.iv-item-iv {font-size: 12px;color: var(--info);font-weight: 500;}
.iv-item-detail {display: flex;justify-content: space-between;align-items: center;}
.iv-item-name{font-size: 13px;color: #333333;flex: 1;}
.iv-item-qty{font-size: 12px;color: #666666;font-weight:500;margin-left:8px;}

/* 유틸리티 */
.text-center { text-align: center; }
.text-primary { color: #2172ec; }
.text-danger { color: #f6495f; }
.text-gray { color: #666666; }
.mt-8 { margin-top: 8px; }
.mt-16 { margin-top: 16px; }
.mt-24 { margin-top: 24px; }
.mb-8 { margin-bottom: 8px; }
.mb-16 { margin-bottom: 16px; }
.mb-24 { margin-bottom: 24px; }
.hidden { display: none !important; }
.bg-ecf2fd{ background-color:#ecf2fd}
/* 애니메이션 */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideUp {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.fade-in {animation: fadeIn 0.3s ease;}
.slide-up {animation: slideUp 0.3s ease;}

/* ========================================
   배송조회 페이지 스타일
   ======================================== */

/* 배송조회 콘텐츠 */
.history-content {padding:16px;padding-bottom:100px; padding-top:0px; }
/* 검색 조건 바 */
.history-search-bar {display: flex;align-items: center;gap:5px;margin-bottom:5px;flex-shrink: 0;}
.history-search-barBtn {display: flex;align-items: center;margin-bottom:5px;}
.date-range-group {display: flex;align-items: center;gap: 6px;flex: 1;min-width: 0;}
.date-input {flex: 1;padding:10px 8px;border:1px solid #e0e0e0;border-radius:6px;font-size:13px;color:#333;min-width: 0;max-width: 130px;text-align:left;
background:url(../imgs/Icon_month.png) no-repeat;background-position:center right 8%;background-size:17%;}
.date-input:focus {outline: none;  border-color: #2172ec;}
.date-separator {color: #666666;font-weight: 500;flex-shrink: 0;}
.date-input-hidden {position: absolute;opacity: 0;width: 0;height: 0;pointer-events: none;}
.date-display {cursor: pointer;text-align:left;}
/* 상태 필터 콤보박스 */
.status-filter {flex-shrink:0;padding:9px 8px;border:1px solid #e0e0e0;border-radius:6px;font-size: 13px;color: #333333;background: #fff;min-width: 70px;cursor: pointer;}
.status-filter:focus {outline: none;border-color: #2172ec;}

/* 테이블 래퍼 - 스크롤 영역 */
.history-table-wrapper {border-radius:0px;background: #fff;width: 100%;}
/* 테이블 스타일 */
.history-table {width:100%;border-collapse:collapse;font-size:13px;border:0px;table-layout:fixed;border-radius:12px;background-color:#f5f5f5;margin-bottom:5px;}
.history-table td {text-align:center;vertical-align:middle;word-break:break-all;border:0px;}
.history-table tr {border:1px solid #fff;}
.history-table td:nth-child(1) {width:72%;text-align:left;padding:10px 10px;}
.history-table td:nth-child(2) {width:28%;padding:10px 0px;}
.history-table tr {cursor:pointer;}
.history-table tr.selected {background:#e2edfe !important;}
.history-table tr.selected td {color:#1a5bbd;font-weight:500;}
.history-table tr.selected td:nth-child(1) {border-top-left-radius:12px;border-bottom-left-radius:12px;}
.history-table tr.selected td:nth-child(2) {border-top-right-radius:12px;border-bottom-right-radius:12px;}
.history-table tr.disabled {cursor:not-allowed;opacity:0.8;}
.history-table tr.disabled:hover {background:transparent;}
.history-table tr.disabled p.col-iv.clickable {color:#666;font-weight:400;}
.history-table tr.disabled p.col-date {color:#666;font-weight:400;}
.history-table tr.disabled td:nth-child(1) {border-top-left-radius:12px;border-bottom-left-radius:12px;}
.history-table tr.disabled td:nth-child(2) {border-top-right-radius:12px;border-bottom-right-radius:12px;}
.history-table td p.col-iv.clickable {color:#2196F3;cursor:pointer;font-weight:500;width:85px;text-decoration:underline;}
.history-table td p.col-iv.clickable:hover {color:var(--info-dark);}
.history-table td p.col-customer {font-size:14px;font-weight:600;color:#333;}
.history-table td p.col-date {font-size:12px;color:#666;}

/* 상태 뱃지 */
.status-completed {display:inline-block;padding:3px 0px;width:55px;text-align:center;background:#e1e1e1;color:#666;border-radius:4px;font-size:12px;font-weight:400;margin-bottom:1px;}
.status-pending {display:inline-block;padding:3px 0px;width:55px;text-align:center;background:#f6495f;color:#fde4e8;border-radius:4px;font-size:12px;font-weight:500;}

/* 데이터 없음 */
.no-data {padding:40px 16px;color:var(--gray-light);font-size:14px;text-align:center;}
.no-data td {text-align:center;}

/* 배송조회 하단 버튼 */
.history-bottom-actions {position:fixed;bottom:0;left:0;right:0;max-width:480px;margin:0 auto;}

/* ========================================
   품목 상세 팝업 스타일
   ======================================== */

/* 품목 상세 모달 */
.modal-item-detail {
  max-width: 450px;
  max-height: 85vh;
}

.item-detail-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: #f5f5f5;
  border-radius: 8px;
  margin-bottom: 16px;
}

.item-detail-iv {
  font-size: 15px;
  font-weight: 600;
  color: var(--info);
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.item-detail-customer {
  font-size: 14px;
  font-weight: 500;
  color: #333333;
}

/* 품목 상세 - 배송정보 영역 */
.item-detail-delivery {
  background: #fff;
  border-radius: 8px;
  padding: 0px;
  margin-bottom: 20px;
}

.item-detail-row {
  display: flex;
  padding: 0px;
}

.item-detail-row:last-child {
  border-top: 1px solid #e0e0e0;
  margin-top: 5px;
  padding-top: 5px;
}

.item-detail-label {
  font-size: 14px;
  color: #333;
  font-weight: 500;
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.item-detail-code {
  font-size: 14px;
  color: #666;
  font-weight: 400;
  margin-left: 6px;
  flex-shrink: 0;
}

.item-detail-value {
  font-size: 13px;
  color: #666;
  display: block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 품목 상세 테이블 래퍼 */
.item-detail-table-wrapper {
  max-height: 350px;
  overflow-y: auto;
  border: 1px solid #e0e0e0;
  border-top: 1px solid #c5d1e2;
  border-radius: 0px;
}

/* 품목 상세 테이블 */
.item-detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  table-layout: fixed;
}

.item-detail-table thead {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #f2f7ff;
}

.item-detail-table th {
  padding: 6px 6px;
  color: #090A10;
  font-weight: 500;
  text-align: center;
}

.item-detail-table tbody tr {
  border-bottom: 1px solid #e0e0e0;
}

.item-detail-table tbody tr:last-child {
  border-bottom: none;
}

.item-detail-table tbody tr:nth-child(even) {
  background: #f5f5f5;
}

.item-detail-table td {
  padding: 5px 6px;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 품목 테이블 컬럼 너비 (2컬럼: 품목명, 수량) */
.item-detail-table th:nth-child(1),
.item-detail-table td:nth-child(1) {
  width: 75%;
}

.item-detail-table th:nth-child(2),
.item-detail-table td:nth-child(2) {
  width: 27%;
  padding-left: 8px;
}

.item-detail-table th:nth-child(2) {
  border-left: 1px solid #e0e0e0;
}

.item-detail-table td:nth-child(2) {
  text-align: right;
  border-left: 1px solid #e0e0e0;
}

/* ========================================
   QR 스캐너 모달 스타일
   ======================================== */

.modal-qr-scanner {
  max-width: 380px;
  width: 95%;
}

.modal-qr-scanner .modal-body {
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

#qr-reader {
  width: 100%;
  border-radius: 0;
}

#qr-reader video {
  width: 100% !important;
  border-radius: 0;
}

#qr-reader__scan_region {
  background: #000;
  min-height: 300px;
}

#qr-reader__scan_region video {
  object-fit: cover;
}

/* html5-qrcode 기본 스타일 오버라이드 */
#qr-reader__dashboard_section {
  display: none !important;
}

#qr-reader__header_message {
  display: none !important;
}

#qr-reader__camera_selection {
  display: none !important;
}

.qr-scanner-hint {
  width: 100%;
  text-align: center;
  padding: 16px;
  color: #666666;
  font-size: 14px;
  background: #f5f5f5;
  margin: 0;
}

/* QR 스캔 영역 테두리 애니메이션 */
#qr-shaded-region {border-color: #f2f7ff !important;}
/* QR reader 로딩 스타일 */
#qr-reader__status_span {color: #666666;font-size: 14px;}

/* ========================================
   서명 모달 추가 스타일
   ======================================== */

.signature-actions {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.signature-actions .btn {
  flex: 1;
}

.signature-remember {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 10px;
  background: #f5f5f5;
  border-radius: 8px;
}

.signature-remember input[type="checkbox"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.signature-remember label {
  font-size: 14px;
  color: #333333;
  cursor: pointer;
}

/* ========================================
   Pretendard 폰트
   ======================================== */

@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url(./woff2/Pretendard-Black.woff2) format('woff2'), url(./woff/Pretendard-Black.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url(./woff2/Pretendard-ExtraBold.woff2) format('woff2'), url(./woff/Pretendard-ExtraBold.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url(./woff2/Pretendard-Bold.woff2) format('woff2'), url(./woff/Pretendard-Bold.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url(./woff2/Pretendard-SemiBold.woff2) format('woff2'), url(./woff/Pretendard-SemiBold.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url(./woff2/Pretendard-Medium.woff2) format('woff2'), url(./woff/Pretendard-Medium.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url(./woff2/Pretendard-Regular.woff2) format('woff2'), url(./woff/Pretendard-Regular.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url(./woff2/Pretendard-Light.woff2) format('woff2'), url(./woff/Pretendard-Light.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url(./woff2/Pretendard-ExtraLight.woff2) format('woff2'), url(./woff/Pretendard-ExtraLight.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url(./woff2/Pretendard-Thin.woff2) format('woff2'), url(./woff/Pretendard-Thin.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url(./woff2-subset/Pretendard-Black.subset.woff2) format('woff2'), url(./woff-subset/Pretendard-Black.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url(./woff2-subset/Pretendard-ExtraBold.subset.woff2) format('woff2'), url(./woff-subset/Pretendard-ExtraBold.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url(./woff2-subset/Pretendard-Bold.subset.woff2) format('woff2'), url(./woff-subset/Pretendard-Bold.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url(./woff2-subset/Pretendard-SemiBold.subset.woff2) format('woff2'), url(./woff-subset/Pretendard-SemiBold.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url(./woff2-subset/Pretendard-Medium.subset.woff2) format('woff2'), url(./woff-subset/Pretendard-Medium.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url(./woff2-subset/Pretendard-Regular.subset.woff2) format('woff2'), url(./woff-subset/Pretendard-Regular.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url(./woff2-subset/Pretendard-Light.subset.woff2) format('woff2'), url(./woff-subset/Pretendard-Light.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url(./woff2-subset/Pretendard-ExtraLight.subset.woff2) format('woff2'), url(./woff-subset/Pretendard-ExtraLight.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url(./woff2-subset/Pretendard-Thin.subset.woff2) format('woff2'), url(./woff-subset/Pretendard-Thin.subset.woff) format('woff');
}