/* Style riêng cho nhóm màn vận hành: Vận chuyển, Đối soát COD, Báo cáo ngày, Hiệu suất NV. */

/* ---------- Dùng chung ---------- */
.ops-issues { border-color: #f1c0c0; }
.ops-issue-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; }
.ops-issue {
  display: flex; align-items: center; gap: 12px; text-align: left; cursor: pointer;
  padding: 12px 14px; border-radius: var(--radius-sm); border: 1px solid #f1c0c0; background: var(--danger-bg);
}
.ops-issue:hover { border-color: var(--danger); }
.ops-issue > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.ops-issue-n { font-size: 24px; font-weight: 800; color: var(--danger); min-width: 28px; }
.ops-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 10px; margin-bottom: 12px; }
.ops-pager { justify-content: center; margin: 14px 0; }

/* ---------- Vận chuyển ---------- */
.ship-list { overflow: hidden; }
.ship-row { display: flex; gap: 16px; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--line); border-left: 4px solid transparent; }
.ship-row:last-child { border-bottom: 0; }
.ship-failed { border-left-color: var(--danger); background: #fffafa; }
.ship-returning { border-left-color: #ea580c; }
.ship-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ship-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.02em; }
.ship-note { color: var(--warn); }
.ship-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; text-align: right; }
.ship-actions { justify-content: flex-end; margin-top: 4px; }
.journey { list-style: none; margin: 0; padding: 0 0 0 18px; border-left: 2px solid var(--line); }
.journey li { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 0 0 16px 6px; }
.journey li::before { content: ''; position: absolute; left: -25px; top: 4px; width: 12px; height: 12px; border-radius: 50%; background: var(--line-strong); border: 2px solid var(--surface); }
.journey li.is-latest::before { background: var(--accent-strong); }
.journey li.is-latest > span:last-child { font-weight: 700; }

/* ---------- Đối soát COD ---------- */
.cod-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .cod-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cod-alert { border-color: #f1c0c0; background: var(--danger-bg); }
.cod-alert .kpi-value { color: var(--danger); }
.cod-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; margin-bottom: 10px; border-radius: var(--radius-sm); background: var(--good-bg); }
.cod-bar > span { flex: 1; }
.table tr.is-selected td { background: #f4faef; }
.cod-batches { display: flex; flex-direction: column; }
.cod-batch {
  display: grid; grid-template-columns: minmax(0, 1.4fr) 1fr 1fr auto; gap: 12px; align-items: center; width: 100%;
  padding: 12px 4px; border: 0; border-bottom: 1px solid var(--line); background: none; cursor: pointer; text-align: left;
}
.cod-batch:hover, .cod-batch.is-open { background: var(--surface-2); }
.cod-batch > span:first-child { display: flex; flex-direction: column; gap: 2px; }
.cod-batch-detail { background: var(--surface-2); margin-bottom: 6px; }

/* ---------- Báo cáo ngày ---------- */
.daily-nav input[type=date] { width: auto; padding: 5px 8px; }
.daily-report { font-family: inherit; line-height: 1.6; background: var(--surface-2); resize: vertical; }
.daily-bar-row .bar { flex: 1; }
.daily-label { flex: 0 1 200px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.daily-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.daily-sub { margin: 16px 0 4px; font-size: 13px; color: var(--ink-2); }

/* ---------- Hiệu suất NV ---------- */
.perf-table td:first-child { min-width: 230px; }
.perf-table td.is-best { background: #fdf3dc; font-weight: 700; }
.perf-ai td { background: #faf7ff; }
.perf-source { gap: 10px; }
.perf-name { flex: 0 0 110px; font-weight: 600; }
.perf-track { flex: 1; min-width: 60px; }
.perf-stack { display: flex; height: 12px; border-radius: 99px; overflow: hidden; min-width: 4px; background: #eeeae1; }
.heat { border-collapse: separate; border-spacing: 3px; font-size: 11px; }
.heat th { font-weight: 600; color: var(--muted); white-space: nowrap; padding: 2px 4px; }
.heat th[scope=row] { text-align: left; color: var(--ink); font-size: 12px; }
.heat td { width: 30px; height: 26px; text-align: center; border-radius: 6px; font-weight: 700; }
.heat-0 { background: #f1eee7; }
.heat-1 { background: #dcefcf; }
.heat-2 { background: #b6dd96; }
.heat-3 { background: #7fbf5c; color: #fff; }
.heat-4 { background: #3f8f3a; color: #fff; }
.chart-legend i.heat-1, .chart-legend i.heat-2, .chart-legend i.heat-3, .chart-legend i.heat-4 { width: 14px; height: 14px; }

/* ---------- Mobile ---------- */
@media (max-width: 860px) {
  .ship-row { flex-direction: column; gap: 8px; }
  .ship-side { align-items: flex-start; text-align: left; }
  .ship-actions { justify-content: flex-start; }
  .ops-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cod-batch { grid-template-columns: minmax(0, 1fr) auto; }
  .cod-batch > span:nth-child(2) { display: none; }
  .perf-name { flex-basis: 84px; }
}

/* ---------- In phiếu chờ lấy hàng ---------- */
@media print {
  body { background: #fff; }
  .demo-bar, .layout, .bottom-nav, #toast-root, .modal-head .icon-btn, .modal .form-actions { display: none !important; }
  .modal-backdrop { position: static; background: none; padding: 0; display: block; }
  .modal { width: 100%; max-height: none; box-shadow: none; }
}

/* Tài chính: xem css/finance.css. */

/* ---------- Đợt 7: Vận chuyển, Đối soát COD, Báo cáo ngày ---------- */
.toast-warn { background: var(--warn); }
.back-link { margin: 0 0 6px; }
.ops-summary-3 { grid-template-columns: repeat(3, minmax(0, 220px)); }
.ops-stat-cod .stat-value { color: var(--warn); }
.ops-issue.is-warn { border-color: #ecd49a; background: var(--warn-bg); }
.ops-issue.is-warn .ops-issue-n { color: var(--warn); }
.ship-activity { color: var(--ink-2); }
.ship-receiver { word-break: break-word; }

/* Phiếu gửi (nhãn dán kiện) */
.ship-label-preview { max-height: 360px; overflow: auto; border: 1px dashed var(--line-strong); border-radius: var(--radius-sm); padding: 10px; background: var(--surface-2); margin-bottom: 10px; }
.ship-labels { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
.ship-label { background: #fff; color: #000; border: 1.5px solid #000; border-radius: 6px; padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; break-inside: avoid; page-break-inside: avoid; }
.ship-label-head, .ship-label-foot { display: flex; justify-content: space-between; gap: 8px; }
.ship-label-code { text-align: center; }
.ship-label-code .barcode { max-width: 100%; height: 46px; }
.ship-label-to { display: flex; flex-direction: column; gap: 2px; border-top: 1px dashed #000; padding-top: 6px; }
.ship-label-foot { border-top: 1px dashed #000; padding-top: 6px; }
@media print {
  body.printing-slips .ship-labels { grid-template-columns: repeat(2, 1fr); gap: 6mm; }
}

/* Đối soát COD */
.cod-ledger td:first-child { min-width: 180px; }
.cod-dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; margin: 0; }
.cod-dl dt { font-size: 12px; color: var(--muted); }
.cod-dl dd { margin: 2px 0 0; font-weight: 500; }
.cod-result-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cod-verdict { font-weight: 600; margin: 10px 0 0; }
.cod-verdict.is-ok { color: var(--good); }
.cod-verdict.is-bad { color: var(--danger); }
.cod-rows tr.cod-row-bad td { background: #fff7f5; }
.cod-confirm { border-left: 4px solid var(--accent-strong); }
.cod-confirm p { margin: 0 0 8px; }
.cod-confirmed { color: var(--good); font-weight: 600; }
.cod-csv-text { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; }
.cod-manual-head, .cod-manual-row { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.cod-manual-rows { display: flex; flex-direction: column; gap: 6px; margin: 4px 0 8px; }

/* Báo cáo ngày */
.daily-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.daily-hero { border-left: 4px solid #e3a82b; }
.daily-alert { border-left: 4px solid var(--danger); }
.daily-alert .kpi-value { color: var(--danger); }

@media (max-width: 860px) {
  .ops-hide-sm { display: none; }
  .ops-summary-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cod-dl { grid-template-columns: minmax(0, 1fr); }
  .daily-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ship-labels { grid-template-columns: minmax(0, 1fr); }
}