/* SOSRAM OPS final layout authority v22. Loaded after styles.css. */
html,
body {
  max-width: 100%;
  overflow-x: hidden !important;
}

#dashboard.shipment-dashboard,
#dashboard.shipment-dashboard .shipment-grid,
#dashboard .shipment-card,
#dashboard .shipment-card *,
.content,
.app-shell,
.topbar,
.sidebar {
  box-sizing: border-box;
  min-width: 0 !important;
}

.content {
  max-width: 100vw !important;
  overflow-x: clip !important;
}

#dashboard.shipment-dashboard {
  margin: 0 !important;
  max-width: none !important;
  width: 100% !important;
}

#dashboard.shipment-dashboard .shipment-grid {
  align-items: start !important;
  display: grid !important;
  gap: clamp(12px, 1.2vw, 18px) !important;
  grid-auto-flow: row !important;
  grid-template-columns: minmax(0, 3fr) minmax(320px, 1fr) !important;
  width: 100% !important;
}

#dashboard .shipment-card {
  display: block !important;
  grid-column: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

#dashboard .shipment-card-main,
#dashboard .ops-guided-card,
#dashboard .package-card,
#dashboard .analytics-card,
#dashboard .alerts-card,
#dashboard .tracking-card,
#dashboard .map-card {
  grid-column: 1 / 2 !important;
}

#dashboard .catalog-validation-card,
#dashboard .dashboard-calendar-panel,
#dashboard .shipment-success-card,
#dashboard .operator-card,
#dashboard .truck-card,
#dashboard .incidents-card {
  grid-column: 2 / 3 !important;
}

#dashboard .shipment-card-main { order: 1 !important; }
#dashboard .ops-guided-card { order: 2 !important; }
#dashboard .package-card { order: 3 !important; }
#dashboard .analytics-card { order: 4 !important; }
#dashboard .alerts-card { order: 5 !important; }
#dashboard .tracking-card { order: 6 !important; }
#dashboard .map-card { order: 7 !important; }
#dashboard .catalog-validation-card { order: 1 !important; }
#dashboard .dashboard-calendar-panel { order: 2 !important; }
#dashboard .shipment-success-card { order: 3 !important; }
#dashboard .operator-card { order: 4 !important; }
#dashboard .truck-card { order: 5 !important; }
#dashboard .incidents-card { order: 6 !important; }

#dashboard .catalog-validation-card,
#dashboard .catalog-validation-card * {
  overflow-wrap: normal !important;
  white-space: normal !important;
  word-break: normal !important;
}

#dashboard .catalog-validation-card .row-actions {
  display: grid !important;
  gap: 8px !important;
  grid-template-columns: 1fr !important;
}

#dashboard .catalog-validation-card .row-actions button {
  min-width: 0 !important;
  width: 100% !important;
}

#dashboard .validation-grid {
  grid-template-columns: 1fr !important;
}

#dashboard .ops-action-grid {
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

#dashboard .ops-action {
  min-height: 86px !important;
  overflow: hidden !important;
  padding: 12px !important;
}

#dashboard .ops-action span,
#dashboard .ops-action strong,
#dashboard .ops-action small,
#dashboard .workflow-step span,
#dashboard .workflow-step strong,
#dashboard .workflow-step small,
#dashboard .process-row,
#dashboard .activity-row,
#dashboard .stack-row {
  min-width: 0 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

#dashboard .command-brief {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)) !important;
}

#dashboard .shipment-success-card .workflow-rail {
  display: grid !important;
  gap: 8px !important;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)) !important;
  overflow: visible !important;
}

#dashboard .shipment-success-card .workflow-step {
  align-items: flex-start !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  min-height: 62px !important;
  padding: 9px !important;
  width: 100% !important;
}

#dashboard .shipment-success-card .workflow-step::before {
  display: none !important;
}

#dashboardMetrics.metrics {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
}

#dashboard .analytics-grid {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
}

#dashboard .ops-chart-card,
#dashboard .bar-list,
#dashboard .donut-row,
#dashboard .bar-list span {
  min-width: 0 !important;
}

#dashboard .alert-grid,
#dashboard .command-activity,
#dashboard .incidents-card .stack,
#dashboard .process-list {
  max-height: min(360px, 48vh) !important;
  overflow: auto !important;
}

@media (max-width: 1380px) {
  #dashboard.shipment-dashboard .shipment-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.42fr) !important;
  }

  #dashboard .ops-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1120px) {
  #dashboard.shipment-dashboard .shipment-grid {
    grid-template-columns: 1fr !important;
  }

  #dashboard .shipment-card-main,
  #dashboard .ops-guided-card,
  #dashboard .package-card,
  #dashboard .analytics-card,
  #dashboard .alerts-card,
  #dashboard .tracking-card,
  #dashboard .map-card,
  #dashboard .catalog-validation-card,
  #dashboard .dashboard-calendar-panel,
  #dashboard .shipment-success-card,
  #dashboard .operator-card,
  #dashboard .truck-card,
  #dashboard .incidents-card {
    grid-column: 1 / -1 !important;
  }

  #dashboard .catalog-validation-card { order: 8 !important; }
  #dashboard .dashboard-calendar-panel { order: 4 !important; }
  #dashboard .shipment-success-card { order: 5 !important; }
  #dashboard .truck-card { order: 6 !important; }
  #dashboard .operator-card { order: 9 !important; }
  #dashboard .incidents-card { order: 10 !important; }
}

@media (max-width: 760px) {
  #dashboard .ops-action-grid,
  #dashboardMetrics.metrics,
  #dashboard .command-brief,
  #dashboard .workflow-rail,
  #dashboard .analytics-grid,
  #dashboard .cards,
  #dashboard .metrics {
    grid-template-columns: 1fr !important;
  }

  #dashboard .shipment-card {
    padding: 12px !important;
  }

  #dashboard .ops-action {
    min-height: 74px !important;
  }
}
