/* Shipment list workspace.
   Keep the operational list, kanban and calendar independent from shipment edit screens. */

.shipment-list-page{
  gap:14px;
}

.shipment-list-page #shipment-status-filter{
  min-width:220px;
}

.shipment-list-page .ops-list-toolbar{
  min-width:0;
}

.shipment-list-summary{
  display:grid;
  gap:8px;
  min-width:0;
  margin-top:10px;
  padding:10px 12px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:8px;
  background:rgba(2,6,23,.18);
}

.shipment-list-summary__main{
  min-width:0;
  color:var(--text);
  font-weight:850;
  overflow-wrap:anywhere;
}

.shipment-list-summary__meta,
.shipment-list-summary__pills{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  min-width:0;
}

.shipment-list-summary__meta{
  color:var(--muted);
  font-size:12px;
}

.shipment-list-summary__pill{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:3px 8px;
  border:1px solid rgba(148,163,184,.28);
  border-radius:999px;
  background:rgba(30,41,59,.42);
  color:rgba(226,232,240,.92);
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}

.shipment-list-summary__pill.is-danger{
  border-color:rgba(239,68,68,.48);
  background:rgba(239,68,68,.16);
  color:#fecaca;
}

.shipment-list-summary__pill.is-blue{
  border-color:rgba(96,165,250,.48);
  background:rgba(59,130,246,.16);
  color:#bfdbfe;
}

.shipment-list-summary__pill.is-green{
  border-color:rgba(34,197,94,.44);
  background:rgba(34,197,94,.14);
  color:#bbf7d0;
}

.ship-view-switch,
.ship-cal-scale-switch{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:0;
  padding:4px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;
  background:rgba(15,23,42,.28);
}

.ship-view-switch__btn,
.ship-cal-scale-switch__btn{
  justify-content:center;
}

.ship-view-host{
  min-width:0;
  padding:12px;
}

.ship-kanban-board{
  display:grid;
  grid-template-columns:repeat(4, minmax(250px, 1fr));
  gap:12px;
  align-items:start;
}

.ship-kanban-col{
  min-width:0;
  min-height:180px;
  border:1px solid rgba(148,163,184,.20);
  border-radius:8px;
  background:rgba(2,6,23,.20);
  overflow:hidden;
}

.ship-kanban-col__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:9px 10px;
  border-bottom:1px solid rgba(148,163,184,.16);
  background:rgba(15,23,42,.24);
}

.ship-kanban-col__title{
  min-width:0;
  color:var(--text);
  font-size:13px;
  font-weight:850;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ship-kanban-col__count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  height:24px;
  padding:0 7px;
  border:1px solid rgba(148,163,184,.26);
  border-radius:999px;
  color:rgba(226,232,240,.92);
  font-size:12px;
  font-weight:850;
}

.ship-kanban-col__body{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:8px;
}

.ship-kanban-col__empty,
.ship-cal-week-col__empty,
.ship-cal-day-list__empty,
.shipments-state{
  min-width:0;
  padding:12px;
  border:1px dashed rgba(148,163,184,.26);
  border-radius:8px;
  color:var(--muted);
  line-height:1.35;
  overflow-wrap:anywhere;
}

.shipments-state{
  margin:12px;
}

.shipments-state strong{
  display:block;
  margin-bottom:3px;
  color:var(--text);
}

.shipments-state--error{
  border-color:rgba(239,68,68,.48);
  background:rgba(127,29,29,.14);
  color:#fecaca;
}

.ship-card{
  display:grid;
  gap:9px;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
  padding:10px;
  border:1px solid rgba(148,163,184,.22);
  border-left:3px solid rgba(96,165,250,.52);
  border-radius:8px;
  background:rgba(15,23,42,.48);
  cursor:pointer;
}

.ship-card:hover{
  border-color:rgba(96,165,250,.52);
  background:rgba(15,23,42,.72);
}

.ship-card.is-status-cancelled,
.ship-card.has-blocked{
  border-left-color:rgba(239,68,68,.72);
}

.ship-card.is-status-shipped{
  border-left-color:rgba(34,197,94,.68);
}

.ship-card--compact{
  padding:8px;
  gap:7px;
}

.ship-card__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
  min-width:0;
}

.ship-card__code{
  min-width:0;
  color:var(--text);
  font-weight:900;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ship-cal-week-col .ship-card__head{
  flex-wrap:wrap;
}

.ship-cal-week-col .ship-card__code{
  flex:0 0 auto;
  max-width:100%;
  overflow:visible;
  text-overflow:clip;
}

.ship-cal-week-col .ship-card__head-badges{
  flex:1 1 100%;
  justify-content:flex-start;
}

.ship-card__head-badges,
.ship-card__tasks,
.ship-card__actions,
.ship-card__progress-grid{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  min-width:0;
}

.ship-card__badge,
.ship-card__badge .badge,
.ship-card__head-badges > *,
.ship-task-badge,
.shipment-list-summary__pill{
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

.ship-card__head-badges{
  justify-content:flex-end;
}

.ship-card__meta-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:4px 8px;
  min-width:0;
  color:rgba(203,213,225,.92);
  font-size:12px;
}

.ship-card--compact .ship-card__meta-grid{
  grid-template-columns:1fr;
}

.ship-card__meta-grid div{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ship-card__meta-grid span{
  margin-right:4px;
  color:var(--muted);
}

.ship-card__progress-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}

.ship-card--compact .ship-card__progress-grid{
  grid-template-columns:1fr;
}

.ship-progress{
  min-width:0;
}

.ship-progress__label{
  display:flex;
  justify-content:space-between;
  gap:8px;
  margin-bottom:4px;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}

.ship-progress__label span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ship-progress__track{
  height:6px;
  border-radius:999px;
  background:rgba(148,163,184,.18);
  overflow:hidden;
}

.ship-progress__bar{
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:#60a5fa;
}

.ship-progress__bar.is-green{
  background:#22c55e;
}

.ship-card__comment{
  min-width:0;
  padding-top:7px;
  border-top:1px dashed rgba(148,163,184,.22);
  color:rgba(203,213,225,.86);
  font-size:12px;
  overflow-wrap:anywhere;
}

.ship-task-badge{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:2px 8px;
  border:1px solid rgba(148,163,184,.30);
  border-radius:999px;
  background:rgba(30,41,59,.45);
  color:rgba(226,232,240,.95);
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}

.ship-task-badge.is-danger{
  border-color:rgba(239,68,68,.48);
  background:rgba(239,68,68,.16);
  color:#fecaca;
}

.ship-task-badge.is-blue{
  border-color:rgba(96,165,250,.45);
  background:rgba(59,130,246,.16);
  color:#bfdbfe;
}

.ship-cal-controls{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  min-width:0;
  padding:10px 12px;
  border-bottom:1px solid rgba(148,163,184,.14);
}

.ship-cal-title{
  min-width:0;
  color:var(--text);
  font-weight:850;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ship-calendar-grid{
  min-width:0;
  border:1px solid rgba(148,163,184,.18);
  border-radius:8px;
  overflow:hidden;
}

.ship-cal-grid-head,
.ship-cal-grid-body{
  display:grid;
  grid-template-columns:repeat(7, minmax(0, 1fr));
}

.ship-cal-head-cell{
  padding:8px 10px;
  border-right:1px solid rgba(148,163,184,.12);
  border-bottom:1px solid rgba(148,163,184,.18);
  color:var(--muted);
  font-size:11px;
  font-weight:850;
  text-transform:uppercase;
}

.ship-cal-head-cell:last-child{
  border-right:0;
}

.ship-cal-day{
  min-width:0;
  min-height:126px;
  padding:8px;
  border-right:1px solid rgba(148,163,184,.11);
  border-bottom:1px solid rgba(148,163,184,.11);
  background:rgba(2,6,23,.16);
}

.ship-cal-day.is-empty{
  background:rgba(2,6,23,.08);
}

.ship-cal-day:nth-child(7n){
  border-right:0;
}

.ship-cal-day__num{
  margin-bottom:5px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

.ship-cal-day__items,
.ship-cal-day-list{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.ship-cal-day__add-wrap{
  display:flex;
  justify-content:flex-end;
  margin-top:8px;
}

.ship-cal-day__add-btn{
  white-space:nowrap;
}

.ship-cal-item{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  padding:6px 7px;
  border:1px solid rgba(148,163,184,.22);
  border-left:3px solid rgba(96,165,250,.52);
  border-radius:7px;
  background:rgba(15,23,42,.48);
  cursor:pointer;
}

.ship-cal-item.is-status-shipped{
  border-left-color:rgba(34,197,94,.68);
}

.ship-cal-item.is-status-cancelled{
  border-left-color:rgba(239,68,68,.72);
}

.ship-cal-item:hover{
  border-color:rgba(96,165,250,.50);
}

.ship-cal-item__time{
  flex:0 0 auto;
  min-width:34px;
  color:var(--muted);
  font-size:11px;
}

.ship-cal-item__code{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  font-weight:850;
}

.ship-calendar-unscheduled{
  margin-top:12px;
}

.ship-unscheduled-box{
  border:1px solid rgba(148,163,184,.18);
  border-radius:8px;
  background:rgba(2,6,23,.18);
  overflow:hidden;
}

.ship-unscheduled-box__title{
  padding:9px 10px;
  border-bottom:1px solid rgba(148,163,184,.16);
  color:var(--text);
  font-weight:850;
}

.ship-unscheduled-box__list{
  display:grid;
}

.ship-unscheduled-item{
  display:grid;
  grid-template-columns:140px minmax(0, 1fr) auto;
  gap:10px;
  align-items:center;
  min-width:0;
  padding:8px 10px;
  border-top:1px solid rgba(148,163,184,.10);
  cursor:pointer;
}

.ship-unscheduled-item:first-child{
  border-top:0;
}

.ship-unscheduled-item:hover{
  background:rgba(59,130,246,.08);
}

.ship-unscheduled-item__code{
  font-weight:900;
}

.ship-unscheduled-item__meta{
  min-width:0;
  color:var(--muted);
  font-size:12px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ship-cal-week-grid{
  display:grid;
  grid-template-columns:repeat(7, minmax(220px, 1fr));
  gap:10px;
  overflow-x:auto;
  padding-bottom:4px;
}

.ship-cal-week-col{
  min-width:0;
  min-height:260px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:8px;
  background:rgba(2,6,23,.18);
  overflow:hidden;
}

.ship-cal-week-col__head{
  padding:9px 10px;
  border-bottom:1px solid rgba(148,163,184,.16);
  font-weight:850;
  text-transform:capitalize;
}

.ship-cal-week-col__body{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:8px;
}

.ship-cal-week-col > .ship-cal-day__add-wrap{
  margin-top:0;
  padding:0 8px 8px;
}

html[data-theme="light"] .shipment-list-summary,
html[data-theme="light"] .ship-view-switch,
html[data-theme="light"] .ship-cal-scale-switch,
html[data-theme="light"] .ship-kanban-col,
html[data-theme="light"] .ship-calendar-grid,
html[data-theme="light"] .ship-cal-week-col,
html[data-theme="light"] .ship-unscheduled-box{
  background:#ffffff;
  border-color:#cbd5e1;
}

html[data-theme="light"] .ship-card,
html[data-theme="light"] .ship-cal-item,
html[data-theme="light"] .ship-cal-day,
html[data-theme="light"] .ship-kanban-col__head,
html[data-theme="light"] .ship-cal-controls{
  background:#f8fafc;
  border-color:#d0d5dd;
  color:#101828;
}

html[data-theme="light"] .ship-card:hover,
html[data-theme="light"] .ship-cal-item:hover,
html[data-theme="light"] .ship-unscheduled-item:hover{
  background:#eff6ff;
  border-color:#93c5fd;
}

html[data-theme="light"] .ship-card__code,
html[data-theme="light"] .ship-kanban-col__title,
html[data-theme="light"] .ship-cal-title,
html[data-theme="light"] .ship-unscheduled-box__title,
html[data-theme="light"] .shipment-list-summary__main{
  color:#101828;
}

html[data-theme="light"] .ship-card__meta-grid,
html[data-theme="light"] .ship-card__comment,
html[data-theme="light"] .shipment-list-summary__meta{
  color:#344054;
}

html[data-theme="light"] .ship-task-badge,
html[data-theme="light"] .shipment-list-summary__pill{
  background:#f2f6fb;
  border-color:#b9c4d4;
  color:#1d2735;
}

html[data-theme="light"] .shipment-list-summary__pill.is-blue,
html[data-theme="light"] .ship-task-badge.is-blue{
  background:#dbeafe;
  border-color:#60a5fa;
  color:#1849a9;
}

html[data-theme="light"] .shipment-list-summary__pill.is-green{
  background:#ecfdf3;
  border-color:#17b26a;
  color:#074d31;
}

html[data-theme="light"] .shipment-list-summary__pill.is-danger,
html[data-theme="light"] .ship-task-badge.is-danger,
html[data-theme="light"] .shipments-state--error{
  background:#fef3f2;
  border-color:#fda29b;
  color:#b42318;
}

@media (max-width: 1400px){
  .ship-kanban-board{
    grid-template-columns:repeat(3, minmax(230px, 1fr));
  }

  .ship-cal-week-grid{
    grid-template-columns:repeat(4, minmax(220px, 1fr));
  }
}

@media (max-width: 1100px){
  .ship-kanban-board{
    grid-template-columns:repeat(2, minmax(220px, 1fr));
  }

  .ship-card__meta-grid,
  .ship-card__progress-grid{
    grid-template-columns:1fr;
  }

  .ship-cal-week-grid{
    grid-template-columns:repeat(2, minmax(220px, 1fr));
  }

  .ship-unscheduled-item{
    grid-template-columns:120px minmax(0, 1fr);
  }

  .ship-unscheduled-item__status{
    grid-column:1 / -1;
  }
}

@media (max-width: 980px){
  .shipment-list-page .page-header,
  .shipment-list-page .toolbar{
    flex-direction:column;
    align-items:stretch;
  }

  .shipment-list-page .page-header__actions,
  .shipment-list-page .toolbar__left,
  .shipment-list-page .toolbar__right{
    width:100%;
  }

  .shipment-list-page .page-header__actions .btn,
  .shipment-list-page #shipment-status-filter,
  .shipment-list-page #shipments-view-switch{
    width:100%;
  }

  .shipment-list-page #shipments-view-switch{
    justify-content:stretch;
  }

  .shipment-list-page #shipments-view-switch .ship-view-switch__btn{
    flex:1 1 0;
  }
}

@media (max-width: 760px){
  .ship-view-switch,
  .ship-cal-scale-switch{
    width:100%;
    justify-content:stretch;
  }

  .ship-view-switch__btn,
  .ship-cal-scale-switch__btn{
    flex:1 1 0;
  }

  .ship-kanban-board{
    grid-template-columns:1fr;
  }

  .ship-cal-title{
    width:100%;
  }

  .ship-cal-grid-head,
  .ship-cal-grid-body{
    grid-template-columns:1fr;
  }

  .ship-cal-head-cell,
  .ship-cal-day.is-empty{
    display:none;
  }

  .ship-cal-day{
    min-height:auto;
  }

  .ship-cal-week-grid{
    grid-template-columns:1fr;
  }

  .ship-unscheduled-item{
    grid-template-columns:1fr;
  }

  .ship-unscheduled-item__status{
    grid-column:auto;
  }
}

@media (max-width: 520px){
  .ship-view-switch{
    display:grid;
    grid-template-columns:1fr;
  }

  .ship-cal-controls{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .ship-cal-scale-switch,
  .ship-cal-title{
    grid-column:1 / -1;
  }
}
