/* Style control matrix with a frozen identity and independent task/date actions. */
.matrix-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 12px 18px; border-top: 1px solid #e2e9e4; background: #f7faf7; }
.matrix-toolbar p { flex: 1; margin: 0; min-width: 200px; color: #506457; font-size: 12px; line-height: 1.55; }
.prep-display { position: relative; font-size: 13px; }
.prep-display summary { min-height: 40px; display: flex; align-items: center; padding: 8px 11px; cursor: pointer; font-weight: 600; color: #34583f; border: 1px solid #d8e3db; border-radius: 7px; background: white; }
.prep-display[open] .prep-options { position: absolute; right: 0; top: 45px; width: 220px; padding: 14px; background: white; z-index: 10; box-shadow: 0 8px 24px #22352926; border: 1px solid #d8e3db; border-radius: 8px; }
.prep-options label { display: flex; align-items: center; gap: 10px; min-height: 40px; }
.prep-options input { width: 18px; height: 18px; accent-color: #39654b; }
.prep-options small { display: block; margin-top: 9px; color: #586e60; line-height: 1.5; }
.matrix-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: auto; }
.approval-matrix { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; }
.approval-matrix th { text-align: left; white-space: nowrap; padding: 14px 13px; background: #f0f5f0; border-bottom: 1px solid #dae4dc; color: #4f6558; font-size: 12px; font-weight: 650; }
.approval-matrix td { padding: 17px 13px; border-bottom: 1px solid #e2e9e4; background: white; vertical-align: top; min-width: 115px; max-width: 230px; line-height: 1.5; }
.approval-matrix tbody tr:hover td { background: #fafcf9; }
.approval-matrix .col-style { position: sticky; left: 0; min-width: 210px; max-width: 240px; z-index: 2; border-right: 1px solid #d9e3db; box-shadow: 3px 0 5px #283d2a08; }
.approval-matrix th.col-style { z-index: 3; }
.approval-matrix .col-kit, .approval-matrix .col-due, .approval-matrix .col-final { min-width: 180px; }
.approval-matrix .col-next { min-width: 230px; }
.approval-matrix .col-pis { min-width: 180px; }
.approval-matrix small { display: block; margin-top: 6px; font-size: 12px; color: #566d5e; line-height: 1.5; }
.matrix-style { color: #234d36; display: block; font-size: 14px; font-weight: 650; text-align: left; line-height: 1.45; padding: 0; }
.matrix-style:hover { text-decoration: underline; }
.matrix-status, .matrix-movement { display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; border-radius: 7px; border: 1px solid #d8e4da; padding: 8px 10px; min-height: 40px; font-size: 12px; font-weight: 600; line-height: 1.45; text-align: left; background: #f5f8f4; color: #43654d; min-width: 90px; max-width: 185px; }
.matrix-status.complete { background: #edf7ef; border-color: #cde2d1; color: #2e6741; }
.matrix-status.open { background: #fff7e9; border-color: #ecddbe; color: #805c27; }
.matrix-status.waiting { background: #eff4fb; border-color: #d2deec; color: #456084; }
.matrix-status.late { background: #fff0ed; border-color: #eecdc4; color: #983f31; }
.matrix-status.neutral { background: #f1f3f1; border-color: #dce2dd; color: #5b685f; }
.matrix-date { display: grid; text-align: left; gap: 3px; border: 1px solid #d8e4da; border-radius: 7px; padding: 9px 11px; min-height: 46px; min-width: 125px; color: #2d583c; background: #f7faf6; }
.matrix-date small { display: flex; align-items: center; gap: 6px; margin: 0; color: #43634d; font-size: 12px; }
.matrix-date.missing { background: #fff7e9; border-color: #ead7b6; color: #805c27; }
.matrix-date:hover, .matrix-status:hover, .matrix-movement:hover { box-shadow: inset 0 0 0 1px #6c9676; }
.matrix-risk { font-size: 12px; color: #526258; }
.matrix-risk.red { color: #9c4239; }
.matrix-risk.amber { color: #856024; }
.matrix-risk.green { color: #2f6842; }
.matrix-progress { width: 90px; height: 5px; border-radius: 5px; background: #e1eae2; margin-top: 9px; overflow: hidden; }
.matrix-progress i { height: 100%; background: #6b9877; display: block; }
.key-date-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 14px 0; }
.key-date-grid > div { min-width: 0; }
.key-date-grid label { display: block; font-size: 12px; color: #52675a; margin-bottom: 8px; font-weight: 600; }
.key-date-grid .matrix-date { width: 100%; min-width: 0; }
.prep-list-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.checklist-controls { display: flex; gap: 6px; align-items: center; }
@media(max-width:760px) {
  .matrix-toolbar { padding: 13px 16px; }
  .matrix-toolbar p { flex-basis: 100%; }
  .prep-display summary { min-height: 44px; }
  .approval-matrix, .approval-matrix tbody { display: block; }
  .approval-matrix thead { display: none; }
  .approval-matrix tbody tr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; border-bottom: 7px solid #f2f6f0; padding: 8px 10px 16px; background: white; }
  .approval-matrix td, .approval-matrix .col-style, .approval-matrix .col-kit, .approval-matrix .col-due, .approval-matrix .col-final, .approval-matrix .col-next, .approval-matrix .col-pis { position: static; min-width: 0; max-width: none; padding: 12px 8px; border-bottom: 1px solid #edf1ec; box-shadow: none; border-right: none; }
  .approval-matrix td::before { content: attr(data-label); display: block; font-size: 12px; color: #536c59; margin-bottom: 8px; font-weight: 600; }
  .approval-matrix .col-style { grid-column: 1/-1; }
  .approval-matrix .col-style::before { display: none; }
  .matrix-style { font-size: 16px; }
  .approval-matrix .col-due, .approval-matrix .col-next, .approval-matrix .col-pis { grid-column: 1/-1; }
  .matrix-status, .matrix-movement, .matrix-date { min-height: 44px; min-width: 0; width: 100%; font-size: 13px; }
  .matrix-status { max-width: none; }
  .key-date-grid { grid-template-columns: minmax(0,1fr); }
  .checklist-controls { flex-wrap: wrap; justify-content: end; }
}