/* Production detail panels respond to their own width, not the viewport. */
.content:has(.production-workspace) {
  container: production-shell / inline-size;
}

.production-workspace > .ops-panel {
  container: production-panel / inline-size;
}

.production-workspace .mini-panel {
  container: production-subpanel / inline-size;
}

.production-workspace :is(form, fieldset, label, .ops-section, .mini-panel,
  .production-main-layout, .production-main-layout__primary,
  .production-main-layout__secondary, .inline-field, .pretty-date-shell) {
  min-width: 0;
}

.production-workspace :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  min-width: 0;
  max-width: 100%;
}

.production-workspace :is(.panel-header, .section-header-inline, .production-status-line,
  .production-usage-summary, .filter-pills) {
  flex-wrap: wrap;
}

.production-workspace :is(.panel-header, .section-header-inline) > div {
  min-width: 0;
}

.production-workspace :is(h2, h3, h4, .stack-row__title, .queue-row-main,
  .queue-row-meta, .connectivity-picker__title, .connectivity-option__label,
  .connectivity-option__meta, .po-items-picker__label, .po-items-picker__meta,
  .connectivity-total-grid > div) {
  overflow-wrap: anywhere;
  min-width: 0;
}

.production-workspace .panel-header .production-usage-summary {
  flex: 1 1 12rem;
}

/* Native date controls retain usable space; duration moves below when needed. */
.production-workspace .production-date-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  justify-content: stretch;
}

.production-workspace .production-date-field {
  width: 100%;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "label" "date" "countdown";
  justify-items: stretch;
  padding: 0.5rem;
}

.production-workspace .production-date-field:first-child {
  grid-column: auto;
  grid-row: auto;
  order: 1;
}

.production-workspace .production-date-field:last-child {
  grid-column: auto;
  grid-row: auto;
  order: 2;
}

.production-workspace .production-date-range {
  min-width: 0;
  overflow-wrap: anywhere;
  grid-column: 1 / -1;
  grid-row: auto;
  order: 3;
}

.production-workspace .production-date-field > :is(input, .pretty-date-shell) {
  grid-area: date;
  width: 100%;
  min-width: 0;
}

.production-workspace .production-date-field__label { grid-area: label; }
.production-workspace .production-date-field__countdown { grid-area: countdown; }

/* Pickers keep vertical scrolling, but each option uses the full available width. */
.production-workspace .connectivity-picker__toolbar {
  grid-template-columns: minmax(0, 1fr);
}

.production-workspace .connectivity-picker__lists {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
}

.production-workspace .connectivity-picker__options {
  scrollbar-gutter: stable;
}

.production-workspace .connectivity-option {
  display: grid;
  grid-template-columns: 1.1rem minmax(0, 1fr);
  min-width: 0;
  max-width: 100%;
}

.production-workspace .connectivity-option > input {
  width: 1.1rem;
  margin-top: 0.15rem;
}

.production-workspace .connectivity-total-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr));
}

/* PO, studio and contact actions wrap without shrinking fields into slivers. */
.production-workspace .production-po-entry__top {
  display: flex;
  flex-wrap: wrap;
}

.production-workspace .production-po-entry__top > .production-po-field {
  flex: 1 1 6rem;
}

.production-workspace .production-po-entry__top > .production-po-field--status {
  flex-basis: 7rem;
}

.production-workspace .production-po-entry__delete {
  flex: 0 0 auto;
  margin-left: auto;
}

.production-workspace .inline-add-row {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
}

.production-workspace .inline-add-row > :is(select, .production-contact-picker) {
  flex: 1 1 12rem;
  min-width: 0;
}

.production-workspace .inline-add-row > button,
.production-workspace .stack-row > button {
  flex: 0 0 auto;
}

.production-workspace .stack-row__title {
  flex: 1 1 auto;
}

.production-workspace .po-items-picker {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}

.production-workspace .po-items-picker__row {
  display: grid;
  grid-template-columns: 1.1rem minmax(0, 1fr);
  min-width: 0;
}

.production-workspace .po-items-picker__meta {
  grid-column: 2;
}

/* Date, author and delete stay available even in a narrow communication column. */
.production-workspace .communications-entry__meta {
  display: flex;
  flex-wrap: wrap;
}

.production-workspace .communications-entry__meta > :is(.pretty-date-shell, input[type="date"]) {
  flex: 0 1 10rem;
  width: 10rem;
  max-width: 100%;
  min-width: 0;
}

.production-workspace .communications-entry__author {
  flex: 1 1 7rem;
  min-width: 0;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}

.production-workspace .communications-entry__delete {
  flex: 0 0 auto;
}

.production-workspace .connectivity-replace-form {
  display: flex;
  flex-wrap: wrap;
}

.production-workspace .connectivity-replace-form__title { flex: 1 1 100%; }
.production-workspace .connectivity-replace-form__field { flex: 1 1 12rem; min-width: 0; }
.production-workspace .connectivity-replace-form__action { flex: 0 0 auto; }

.production-workspace :is(.connectivity-table__replacement-label, .studio-picker__choice) {
  min-width: 0;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}

.production-workspace .connectivity-table__sort-caption {
  display: none;
}

.production-workspace .connectivity-table:not(:has([data-connectivity-assignment-row])) :is(thead, caption) {
  display: none;
}

/* Reserve a useful 38.5rem attachment panel only when all four rails fit.
   The 94rem threshold includes the other panel minimums and three 1rem gaps. */
@container production-shell (min-width: 94rem) {
  .production-workspace:not(.single-column):not(.split-two) {
    grid-template-columns: minmax(14rem, 0.65fr) minmax(20rem, 0.9fr) minmax(16rem, 0.92fr) minmax(38.5rem, 1.48fr);
  }
  .production-workspace > .device-rail { grid-column: auto; }
}

/* Reflow attachments to a full row before adjacent panels would be squeezed. */
@container production-shell (min-width: 64rem) and (width < 94rem) {
  .production-workspace:not(.single-column):not(.split-two) {
    grid-template-columns: minmax(14rem, 0.65fr) minmax(20rem, 0.9fr) minmax(16rem, 0.85fr);
  }
  .production-workspace > .device-rail { grid-column: 1 / -1; }
}

@container production-shell (max-width: 64rem) {
  .production-workspace:not(.single-column):not(.split-two) { grid-template-columns: minmax(0, 1fr); }
  .production-workspace > .device-rail { grid-column: auto; }
}

@container production-panel (min-width: 34rem) {
  .production-workspace .production-date-row {
    grid-template-columns: minmax(11rem, 1fr) minmax(0, 0.8fr) minmax(11rem, 1fr);
  }
  .production-workspace .production-date-range { grid-column: auto; order: 2; }
  .production-workspace .production-date-field:last-child { order: 3; }
}

@container production-panel (max-width: 24rem) {
  .production-workspace .production-date-row { grid-template-columns: minmax(0, 1fr); }
}

/* Attached items stay compact tables; narrow panels scroll inside this wrapper. */
.production-workspace .device-rail .connectivity-table-wrap {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  max-height: 62vh;
  margin-left: 0;
  margin-right: 0;
  overflow: auto;
}
.production-workspace .connectivity-table {
  display: table;
  width: 100%;
  min-width: 0;
  max-width: none;
  table-layout: auto;
}
.production-workspace .connectivity-table:not(:has([data-connectivity-assignment-row])) { min-width: 0; }
.production-workspace .connectivity-table thead { display: table-header-group; }
.production-workspace .connectivity-table tbody { display: table-row-group; }
.production-workspace .connectivity-table tr { display: table-row; }
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] {
  display: table-row;
  position: static;
  padding: 0;
  border-radius: 0;
}
.production-workspace .connectivity-table :is(th, td),
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] > td {
  display: table-cell;
  padding: 0.4rem clamp(0.2rem, 0.7cqi, 0.45rem);
  font-size: 0.85rem;
  vertical-align: middle;
}
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] > td[data-mobile-label]::before { display: none; content: none; }
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] .connectivity-table__select-cell {
  position: static;
  width: 1%;
  text-align: center;
}
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] .cell-action {
  position: static;
  width: 1%;
}
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] .connectivity-table__item {
  min-width: 6.5rem;
  min-height: 0;
  padding: 0.4rem clamp(0.2rem, 0.7cqi, 0.45rem);
  font-size: 1rem;
}
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] .connectivity-table__item--replacement {
  padding-left: 0;
}
/* Intrinsic table sizing keeps short columns tight and gives Item the spare space.
   Only the content's readable minimums trigger scrolling, not a fixed table width. */
.production-workspace .connectivity-table thead th:not(:nth-child(2)),
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] > td:not(:nth-child(2)) {
  width: 1%;
}
.production-workspace .connectivity-table thead th {
  white-space: normal;
}
.production-workspace .connectivity-table .table-sort-button {
  max-width: 100%;
  white-space: normal;
  text-align: left;
  gap: 0.2rem;
}
.production-workspace .connectivity-table .table-sort-button::after { flex: 0 0 auto; }
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] > td:nth-child(n+4):nth-child(-n+7) {
  white-space: nowrap;
}
.production-workspace .connectivity-table .connectivity-table__item,
.production-workspace .connectivity-table .assignment-po-label {
  overflow-wrap: anywhere;
  white-space: normal;
}
.production-workspace .connectivity-table .assignment-po-label { width: max-content; min-width: 6ch; max-width: 12ch; }
.production-workspace .connectivity-table .connectivity-table__actions { flex-wrap: nowrap; }
/* Replacement history is cell content, not a tooltip anchored to the row. */
.production-workspace .connectivity-table__replacement-history {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem 0.25rem;
  margin-top: 0.18rem;
}
.production-workspace .connectivity-table__replacement-linkage {
  position: static;
  max-width: 100%;
  min-width: 0;
  padding: 0.12rem 0.32rem;
  gap: 0.15rem;
  font-size: 0.65rem;
  line-height: 1.15;
  white-space: normal;
}
.production-workspace .connectivity-table__replacement-label {
  min-width: 0;
  overflow-wrap: anywhere;
}
.production-workspace .connectivity-table .connectivity-table__replace-row { display: table-row; }
.production-workspace .connectivity-table .connectivity-table__replace-row > td { display: table-cell; width: auto; }
@container production-panel (max-width: 58rem) {
  .production-workspace .connectivity-total-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@container production-subpanel (max-width: 30rem) {
  .production-workspace .table-responsive:has(> .contacts-table) { overflow: visible; }
  .production-workspace .contacts-table,
  .production-workspace .contacts-table tbody { display: block; width: 100%; }
  .production-workspace .contacts-table thead { display: none; }
  .production-workspace .contacts-table tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--co-border);
  }
  .production-workspace .contacts-table tbody td { display: block; width: auto; min-width: 0; border: 0; }
  .production-workspace .contacts-table__name { grid-row: 1; grid-column: 1; }
  .production-workspace .contacts-table__role { grid-row: 2; grid-column: 1; }
  .production-workspace .contacts-table__role::before { content: "Role"; display: block; font-size: 0.7rem; color: var(--co-muted); }
  .production-workspace .contacts-table .cell-action { grid-row: 1 / span 2; grid-column: 2; }
}

/* Production and communication notes grow with content; retain empty minimums. */
.production-workspace :is(textarea[data-production-field="address"], textarea[data-production-field="notes"], textarea[data-communication-field="communication_note"], textarea[data-communication-create-note]) {
  overflow-y: hidden;
  max-height: none;
  resize: none;
}

/* Keep the editable production title prominent and fully visible at any width. */
.production-workspace textarea[data-production-name-input] {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 2.7rem;
  max-height: none;
  overflow: hidden;
  resize: none;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* Keep the PO workflow in the same rail, immediately after attached items/totals. */
.production-workspace .device-rail .production-po-section {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--co-border);
}
.production-workspace .production-meta-row { grid-template-columns: minmax(0, 1fr); }
.production-workspace .production-company-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}
.production-workspace .production-company-actions > input { flex: 1 1 9rem; width: 0; min-width: 9rem; }
.production-workspace .production-delete-form { flex: 0 0 auto; margin: 0; }
.production-workspace .production-status-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}
.production-workspace .production-status-controls .production-booking-control { flex: 0 0 auto; width: auto; gap: 0.3rem; padding-inline: 0.3rem; }
.production-workspace .production-status-controls .production-finished-toggle { flex: 0 0 auto; margin: 0; padding-inline: 0.3rem; gap: 0.35rem; }
.production-workspace .production-email-row {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  min-width: 0;
}
@container production-panel (max-width: 18rem) {
  .production-workspace .production-email-row { grid-template-columns: minmax(0, 1fr); }
}
.production-workspace .production-date-field .pretty-date-display { justify-content: center; }
.production-workspace .production-date-field input[type="date"] { position: relative; text-align: center; }
.production-workspace .production-date-field input[type="date"]::-webkit-datetime-edit { display: block; width: 100%; text-align: center; }
.production-workspace .production-date-field input[type="date"]::-webkit-date-and-time-value { text-align: center; }
.production-workspace .production-date-field input[type="date"]::-webkit-calendar-picker-indicator { position: absolute; right: 0.3rem; }
.production-workspace .connectivity-table tbody tr[data-connectivity-assignment-row] .connectivity-table__item { padding-left: 0; }


.production-workspace .production-status-controls .production-booking-control .inline-edit-select { width: 5rem; min-width: 0; font-size: 0.82rem; padding-inline: 0.2rem; }

.production-workspace .production-status-controls .production-booking-control > span { text-transform: none; letter-spacing: normal; }