.delivery-list-layer { z-index: 1200; display: flex; align-items: center; justify-content: center; }
.delivery-list-dialog { position: absolute; inset: 24px 26px 22px; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #7896b1; border-radius: 6px; background: #fff; color: #1d2b3a;
  box-shadow: 0 34px 86px rgba(12, 28, 46, .4), 0 14px 30px rgba(12, 28, 46, .2), 0 0 0 4px rgba(255, 255, 255, .66); }
.delivery-list-dialog .modal-head { flex: none; height: auto; min-height: 70px; padding-top: 10px; padding-bottom: 10px; }
.delivery-list-dialog .modal-head button { cursor: pointer; flex: none; }
/* Summary tiles: counts derived from the loaded list only. */
.delivery-list-kpis { display: flex; gap: 10px; margin-left: 18px; margin-right: auto; flex-wrap: wrap; }
.delivery-kpi { min-width: 92px; padding: 6px 14px; border: 1px solid #dbe4ee; border-radius: 8px; background: #fff; }
.delivery-kpi span { display: block; color: #6b7c90; font-size: 11px; font-weight: 600; white-space: nowrap; }
.delivery-kpi b { display: block; margin-top: 1px; font-size: 18px; line-height: 1.2; }
.delivery-kpi.warn b { color: #a46200; }
.delivery-list-toolbar { display: flex; align-items: center; gap: 12px; padding: 12px 22px; flex-wrap: wrap; flex: none; }
.delivery-list-tabs { display: inline-flex; padding: 3px; border-radius: 9px; background: #eef3f8; }
.delivery-list-tabs button { border: 0; background: transparent; padding: 6px 16px; border-radius: 7px; color: #4b5d72; cursor: pointer; font-size: 13px; }
.delivery-list-tabs button[aria-pressed="true"] { background: #fff; color: #215b96; font-weight: 600; box-shadow: 0 1px 3px #162c4426; }
.delivery-list-controls { display: flex; flex: 0 1 380px; min-width: 240px; gap: 8px; }
.delivery-list-controls input { flex: 1; min-width: 0; height: 34px; padding: 0 12px; border: 1px solid #ccd7e3; border-radius: 8px; font-size: 13px; }
.delivery-list-controls input:focus { outline: none; border-color: #215b96; box-shadow: 0 0 0 3px #215b9624; }
.delivery-list-controls button { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border: 1px solid #ccd7e3; border-radius: 8px; background: #fff; color: #215b96; cursor: pointer; }
.delivery-list-controls button:hover { background: #f1f6fc; }
.delivery-list-controls svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.delivery-list-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.delivery-list-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid #dbe3ec; border-radius: 999px; background: #fff; color: #4b5d72; cursor: pointer; font-size: 12px; }
.delivery-list-chip b { color: #1d2b3a; font-weight: 600; }
.delivery-list-chip[aria-pressed="true"] { border-color: #215b96; background: #eaf2fb; box-shadow: inset 0 0 0 1px #215b96; }
.delivery-list-chip .delivery-box { min-width: 0; width: 12px; padding: 0; height: 10px; }
.delivery-list-sort { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; color: #6b7c90; font-size: 12px; }
.delivery-list-sort select { height: 30px; border: 1px solid #ccd7e3; border-radius: 6px; background: #fff; padding: 0 6px; font-size: 12px; color: #1d2b3a; }
/* Order rows; containers fold into a card row underneath. */
.delivery-list-scroll { flex: 1; overflow: auto; min-height: 140px; border-top: 1px solid #e3e9f0; }
.delivery-list-scroll table { border-collapse: collapse; width: 100%; min-width: 1240px; table-layout: fixed; font-size: 13px; }
/* 航路/本船 takes the remaining width so ports, vessel and voyage are shown in full. */
.delivery-list-scroll col.c-caret { width: 30px; }
.delivery-list-scroll col.c-bill { width: 175px; }
.delivery-list-scroll col.c-shipper { width: 180px; }
.delivery-list-scroll col.c-day { width: 118px; }
.delivery-list-scroll col.c-free { width: 90px; }
.delivery-list-scroll col.c-agent { width: 100px; }
.delivery-list-scroll col.c-boxes { width: 230px; }
.delivery-list-scroll col.c-open { width: 64px; }
.delivery-list-scroll th, .delivery-list-scroll td { text-align: left; padding: 10px 10px; border-bottom: 1px solid #edf1f5; overflow-wrap: anywhere; vertical-align: middle; }
.delivery-list-scroll th { background: #f6f9fc; color: #64758a; font-size: 12px; font-weight: 600; position: sticky; top: 0; z-index: 1; white-space: nowrap; }
.delivery-list-order { cursor: pointer; }
.delivery-list-order:hover td { background: #f9fbfd; }
.delivery-list-order.is-open td { background: #f4f8fc; border-bottom-color: transparent; }
.delivery-list-caret { display: inline-block; color: #97a6b6; font-size: 10px; transition: transform .15s; }
.delivery-list-order.is-open .delivery-list-caret { transform: rotate(90deg); color: #215b96; }
.delivery-list-bill { color: #215b96; font-weight: 700; white-space: nowrap; }
.delivery-list-nowrap { white-space: nowrap; }
.delivery-list-day { white-space: nowrap; }
.delivery-list-day.is-complete { color: #c45252; font-weight: 600; }
.delivery-list-scroll small { display: block; color: #6b7c90; margin-top: 3px; font-size: 12px; }
.delivery-list-scroll small.delivery-list-warn, .delivery-list-warn { color: #a46200; font-weight: 600; }
.delivery-list-empty { color: #a3afbd; }
.delivery-list-message { text-align: center !important; color: #64758a; padding: 36px 14px !important; }
.delivery-list-shipper .factory-summary { display: flex; align-items: flex-start; gap: 6px; flex-wrap: wrap; min-width: 0; }
/* Long shipper names wrap onto several lines instead of being cut. */
.delivery-list-shipper .factory-primary { display: block; min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere; font-size: 13px; }
.delivery-list-shipper .factory-more { flex: none; }
.delivery-list-route small { white-space: normal; }
/* 配送日時 stands out on its own line; 依頼 / 確認 stay plain and on one line. */
.delivery-card-when { margin: 2px 0 8px; padding: 6px 10px; border-radius: 6px; background: #eaf2fb; }
.delivery-card-when span { display: block; color: #64758a; font-size: 11px; font-weight: 600; }
.delivery-card-when b { display: block; color: #1c4f80; font-size: 18px; white-space: nowrap; }
.delivery-card-when em { margin-left: 8px; font-style: normal; font-weight: 700; }
.delivery-card-when.is-empty { background: #f6f7f9; }
.delivery-card-when.is-empty b { color: #a3afbd; font-size: 14px; }
.delivery-card-times { white-space: nowrap; }
/* The order-list popover must float above this modal layer. */
body:has(.delivery-list-layer:not(.hidden)) .factory-popover { z-index: 1300; }
.delivery-list-open { display: inline-block; padding: 4px 10px; border: 1px solid #c8d4e2; border-radius: 6px; background: #fff; color: #215b96; font-size: 12px; text-decoration: none; white-space: nowrap; }
.delivery-list-open:hover { background: #f1f6fc; }
/* One box per container, coloured by its own request status. */
.delivery-boxes { display: flex; flex-wrap: wrap; gap: 3px; }
.delivery-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.delivery-tags .delivery-status { padding: 1px 7px; font-size: 11px; font-style: normal; }
.delivery-box { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; padding: 0 3px; height: 19px; border-radius: 4px; font-size: 10px; font-style: normal; font-weight: 700; line-height: 1; vertical-align: middle; }
.delivery-box.is-none { background: #fff; color: #7a8fa1; border: 1px dashed #b8c7d3; }
.delivery-box.is-pending { background: #fff3d6; color: #8a5a00; }
.delivery-box.is-changed { background: #e3efff; color: #1f5c99; }
.delivery-box.is-confirmed { background: #dff2e4; color: #23683a; }
.delivery-box.is-cancelled { background: #fff3f3; color: #9b4545; text-decoration: line-through; }
.delivery-list-detail td { background: #f4f8fc; padding: 2px 16px 16px 44px; border-bottom: 1px solid #dfe7f0; }
.delivery-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.delivery-card { border: 1px solid #dbe4ee; border-left: 4px solid #b4bcc6; border-radius: 8px; background: #fff; padding: 10px 12px; cursor: default; }
.delivery-card.is-pending { border-left-color: #c48a12; }
.delivery-card.is-changed { border-left-color: #1f5c99; }
.delivery-card.is-confirmed { border-left-color: #23683a; }
.delivery-card.is-cancelled { border-left-color: #9b4545; }
.delivery-card.is-none { border-left-style: dashed; border-left-color: #b8c7d3; }
.delivery-card header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.delivery-card header b { font-size: 14px; }
.delivery-card dl { display: grid; grid-template-columns: 72px 1fr; gap: 3px 8px; margin: 0; font-size: 12px; }
.delivery-card dt { color: #7b8a9b; }
.delivery-card dd { margin: 0; overflow-wrap: anywhere; }
.delivery-status { display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 600; white-space: nowrap; line-height: 1.4; }
.delivery-status.is-none { border: 1px dashed #b8c7d3; background: #fff; color: #7a8fa1; }
.delivery-status.is-pending { background: #fff3d6; color: #8a5a00; }
.delivery-status.is-changed { background: #e3efff; color: #1f5c99; }
.delivery-status.is-confirmed { background: #dff2e4; color: #23683a; }
.delivery-status.is-cancelled { background: #fff3f3; color: #9b4545; text-decoration: line-through; }
.delivery-list-dialog footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 22px; border-top: 1px solid #e3e9f0; color: #64758a; font-size: 12px; background: #fbfcfe; flex: none; }
.delivery-list-legend { display: inline-flex; gap: 14px; flex-wrap: wrap; }
.delivery-list-legend .delivery-box { min-width: 0; width: 14px; padding: 0; height: 11px; margin-right: 5px; }
@media (max-width: 900px) {
  .delivery-list-kpis { order: 3; width: 100%; margin: 6px 0 0; }
  .delivery-list-dialog .modal-head { flex-wrap: wrap; }
  .delivery-list-sort { margin-left: 0; }
}
@media (max-width: 600px) {
  .delivery-list-dialog { inset: 8px; border-radius: 12px; }
  .delivery-list-toolbar, .delivery-list-dialog footer { padding-left: 12px; padding-right: 12px; }
  .delivery-list-controls { min-width: 100%; }
  .delivery-kpi { min-width: 0; flex: 1 1 40%; }
}
/* Operations reuse the order detail dialogs, which must sit above this list. */
body:has(.delivery-list-layer:not(.hidden)) .client-delivery-backdrop { z-index: 1260; }
.delivery-detail-bar { display: flex; align-items: center; gap: 12px; margin: 2px 0 10px; color: #64758a; font-size: 12px; }
.delivery-card-actions { display: flex; gap: 6px; margin-top: 9px; padding-top: 8px; border-top: 1px dashed #dfe7f0; }
.delivery-op { border: 1px solid #c8d4e2; border-radius: 6px; background: #fff; color: #215b96; padding: 3px 12px; font-size: 12px; cursor: pointer; white-space: nowrap; }
.delivery-op:hover { background: #f1f6fc; }
.delivery-op.primary { border-color: #215b96; background: #215b96; color: #fff; }
.delivery-op.primary:hover { background: #1b4d80; }
.delivery-op.danger { border-color: #e3b9b6; color: #b2443f; }
.delivery-op.edit { margin-left: 6px; padding: 0 6px; font-size: 11px; border-radius: 4px; }
/* Calendar view: month grid on the left, the selected day's containers on the right. */
.delivery-calendar { flex: 1; display: flex; min-height: 0; border-top: 1px solid #e3e9f0; }
.delivery-calendar[hidden], .delivery-list-scroll[hidden], .delivery-list-sort[hidden] { display: none; }
.delivery-cal-main { flex: 1; display: flex; flex-direction: column; min-width: 0; padding: 12px 18px; overflow: auto; }
.delivery-cal-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.delivery-cal-head b { font-size: 18px; color: #1c4f80; min-width: 110px; text-align: center; }
.delivery-cal-head button { border: 1px solid #ccd7e3; border-radius: 6px; background: #fff; color: #215b96; padding: 4px 10px; cursor: pointer; }
.delivery-cal-head .delivery-cal-unrequested { margin-left: auto; border-color: #f0d9a5; background: #fff3d6; color: #8a5a00; font-size: 12px; }
.delivery-cal-dow { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); color: #64758a; font-size: 12px; font-weight: 600; padding-bottom: 4px; }
.delivery-cal-dow span { padding-left: 8px; }
/* Each week is as tall as its own content, so one busy day no longer stretches the whole month. */
.delivery-cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-rows: minmax(72px, auto); border-left: 1px solid #e3e9f0; border-top: 1px solid #e3e9f0; }
.delivery-cal-day { display: flex; flex-direction: column; align-items: stretch; gap: 3px; min-width: 0; padding: 6px 8px; border: 0; border-right: 1px solid #e3e9f0; border-bottom: 1px solid #e3e9f0; background: #fff; text-align: left; font: inherit; font-size: 12px; color: #1d2b3a; cursor: pointer; overflow: hidden; }
.delivery-cal-day:hover { background: #f6faff; }
.delivery-cal-day.is-weekend { background: #fbfcfe; }
.delivery-cal-day.is-out { background: #fafbfc; color: #b8c2cd; }
.delivery-cal-day.is-selected { background: #f1f6fc; box-shadow: inset 0 0 0 2px #215b96; }
.delivery-cal-date { display: flex; justify-content: space-between; align-items: center; }
.delivery-cal-date b { font-weight: 600; }
/* Today: navy (not a status colour) top bar, outline and "N 今日" label, so status tags keep their meaning. */
.delivery-cal-day.is-today { box-shadow: inset 0 4px 0 #1c4f80, inset 0 0 0 1px #1c4f80; }
.delivery-cal-day.is-today.is-selected { box-shadow: inset 0 4px 0 #1c4f80, inset 0 0 0 2px #215b96; }
.delivery-cal-day.is-today .delivery-cal-date b { background: #1c4f80; color: #fff; border-radius: 4px; padding: 0 8px; font-size: 13px; }
.delivery-cal-day.is-today .delivery-cal-date b::after { content: " 今日"; font-weight: 700; }
.delivery-cal-date em { font-style: normal; font-weight: 800; font-size: 12px; line-height: 16px; padding: 0 7px; border: 1.5px solid #4b5d72; border-radius: 999px; background: #fff; color: #1d2b3a; }
/* Count is an outlined pill so it never reads like the solid navy 今日 label. */
.delivery-cal-day.is-out .delivery-cal-date em { border-color: #c8d2dc; color: #b8c2cd; }
.delivery-cal-boxes { display: flex; flex-wrap: wrap; gap: 3px; }
.delivery-cal-boxes .delivery-box { min-width: 0; padding: 0 5px; }
.delivery-cal-day small { display: block; color: #4b5d72; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.delivery-cal-day.is-out small { color: #b8c2cd; }
.delivery-cal-side { width: 380px; flex: none; overflow: auto; padding: 14px 16px; border-left: 1px solid #dfe7f0; background: #f8fbfd; }
.delivery-cal-side h3 { margin: 0 0 10px; font-size: 16px; color: #1c4f80; }
.delivery-cal-side .delivery-card { margin-bottom: 8px; }
.delivery-cal-bill { margin: 0 0 4px; font-size: 12px; }
.delivery-cal-bill b { color: #215b96; }
.delivery-cal-side .delivery-list-open { margin-left: auto; }
@media (max-width: 900px) {
  .delivery-calendar { flex-direction: column; overflow: auto; }
  .delivery-cal-side { width: auto; border-left: 0; border-top: 1px solid #dfe7f0; }
  .delivery-cal-grid { grid-auto-rows: minmax(72px, auto); }
}
/* Counterpart filter: 海外代理店 for customers, 委託人 for delivery agents. */
.delivery-list-partner, .delivery-list-warehouse { display: inline-flex; align-items: center; gap: 6px; color: #4b5d72; font-size: 12px; font-weight: 600; }
.delivery-list-partner[hidden], .delivery-list-warehouse[hidden] { display: none; }
.delivery-list-partner select, .delivery-list-warehouse select { height: 34px; min-width: 180px; max-width: 280px; border: 1px solid #215b96; border-radius: 8px; background: #fff; padding: 0 8px; font-size: 13px; color: #1d2b3a; }
/* Calendar day: one line per container — status-coloured "1*40GP", then the full warehouse name. */
.delivery-cal-line { display: block; margin-top: 3px; min-width: 0; line-height: 1.3; }
.delivery-cal-line .delivery-box { min-width: 0; height: 16px; padding: 0 5px; margin-right: 4px; vertical-align: 1px; }
/* The warehouse follows the box and wraps underneath it, so full names fit in fewer lines. */
.delivery-cal-day .delivery-cal-line small { display: inline; white-space: normal; overflow: visible; font-size: 11px; }
.delivery-cal-day .delivery-cal-more { display: block; margin-top: 3px; color: #215b96; font-weight: 700; }
.delivery-cal-bill { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.delivery-cal-bill a { color: #215b96; font-weight: 700; text-decoration: underline; }
.delivery-cal-bill .factory-summary { display: inline-flex; align-items: baseline; gap: 6px; }
/* Shipper as quiet text next to the bill number, not a chip. */
.delivery-cal-bill .factory-primary { border: 0; background: none; box-shadow: none; padding: 0; min-height: 0; font-size: 12px; font-weight: 400; color: #4b5d72; }
.delivery-cal-bill .factory-primary::before { content: "荷送人："; color: #8494a6; }
.delivery-cal-bill .factory-more { font-size: 11px; }
.delivery-list-subtitle { display: block; margin-top: 2px; color: #64758a; font-size: 12px; font-weight: 600; }
button.delivery-kpi { cursor: pointer; text-align: left; font: inherit; }
button.delivery-kpi:hover { border-color: #215b96; background: #f1f6fc; }

/* Four status filters in the header: one row of pills "colour box + label + N本"; the colour boxes double as the legend. */
.delivery-list-head .delivery-list-kpis { margin-left: 28px; margin-right: auto; gap: 8px; flex-wrap: nowrap; align-items: center; }
.delivery-list-head .delivery-status-filter { width: auto; height: 34px; min-width: 0; display: inline-flex; align-items: center; gap: 8px; padding: 0 14px; border: 1px solid #d3dde8; border-radius: 999px; background: #fff; color: #33475c; font-size: 13px; font-weight: 600; line-height: 1; white-space: nowrap; }
.delivery-list-head .delivery-status-filter span { display: inline-flex; align-items: center; gap: 7px; color: inherit; font-size: 13px; font-weight: 600; }
.delivery-list-head .delivery-status-filter .delivery-box { width: 14px; height: 11px; min-width: 0; padding: 0; margin: 0; }
.delivery-list-head .delivery-status-filter b { margin: 0; font-size: 15px; font-weight: 800; color: #1d2b3a; }
.delivery-list-head .delivery-status-filter:hover { border-color: #215b96; background: #f4f8fc; }
.delivery-list-head .delivery-status-filter[aria-pressed="true"] { border-color: #1c4f80; background: #eaf2fb; box-shadow: inset 0 0 0 1px #1c4f80; color: #1c4f80; }
.delivery-list-toolbar .delivery-list-controls { flex: 1 1 300px; max-width: 380px; min-width: 220px; }
@media (max-width: 900px) {
  .delivery-list-head .delivery-list-kpis { order: 3; width: 100%; margin: 6px 0 0; flex-wrap: wrap; }
}

/* Current view must be obvious: the active tab is solid navy, the others plain text on the track. */
.delivery-list-toolbar .delivery-list-tabs { gap: 2px; padding: 3px; border: 1px solid #d3dde8; border-radius: 9px; background: #edf2f7; }
.delivery-list-toolbar .delivery-list-tabs button { height: auto; min-width: 0; padding: 7px 18px; border: 0; border-radius: 7px; background: transparent; box-shadow: none; color: #5b6b7d; font-size: 13px; font-weight: 600; line-height: 1.2; }
.delivery-list-toolbar .delivery-list-tabs button:hover { background: #dfe8f1; color: #1c4f80; }
.delivery-list-toolbar .delivery-list-tabs button[aria-pressed="true"] { background: #1c4f80; color: #fff; box-shadow: 0 1px 3px #162c4440; }
/* 依頼 / 確認 times are secondary everywhere (list cards and calendar side): plain grey, no emphasis. */
.delivery-card dd.delivery-card-times, .delivery-card dd.delivery-card-times * { color: #98a4b2; font-weight: 400; }

/* Day count: small soft-grey tag (soft blue on today); "＋ 他N本を表示" is a dashed full-width row under the container lines. */
.delivery-cal-day .delivery-cal-date em { padding: 1px 7px; border: 0; border-radius: 4px; background: #eef3f8; color: #33475c; font-size: 11px; font-weight: 700; line-height: 16px; }
.delivery-cal-day.is-today .delivery-cal-date em { background: #dce8f5; color: #1c4f80; }
.delivery-cal-day.is-out .delivery-cal-date em { background: #f3f5f8; color: #b8c2cd; }
.delivery-cal-day .delivery-cal-more { display: flex; align-items: center; gap: 4px; margin-top: 2px; padding: 1px 6px; border: 1px dashed #8fb0d1; border-radius: 4px; background: #f5f9fd; color: #1c4f80; font-size: 11px; font-weight: 700; }
.delivery-cal-day:hover .delivery-cal-more { border-style: solid; background: #eaf2fb; }
.delivery-cal-day.is-out .delivery-cal-more { border-color: #d3dbe4; background: #fafbfc; color: #b8c2cd; }