/* BBM_KLARIN_MONITORING_LAYOUT_FIX_V37
   Layout-only guard for Monitoring Klaim/Retur.
   Keeps all primary fields before Attachment/Keterangan and prevents the
   Status field from colliding with neighbouring labels on desktop widths. */

body .claim-form:has(.monitoring-document-row) {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: end;
}

body .claim-form:has(.monitoring-document-row) > label,
body .claim-form:has(.monitoring-document-row) > .monitoring-other-type-field {
  min-width: 0;
  order: 0;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

body .claim-form:has(.monitoring-document-row) > label > input,
body .claim-form:has(.monitoring-document-row) > label > select,
body .claim-form:has(.monitoring-document-row) > .monitoring-other-type-field > input,
body .claim-form:has(.monitoring-document-row) > .monitoring-other-type-field > select {
  min-width: 0;
  width: 100%;
}

/* Attachment and Keterangan must always render after every primary field. */
body .claim-form:has(.monitoring-document-row) > .monitoring-document-row {
  grid-column: 1 / -1;
  order: 50;
  margin-top: 2px;
  width: 100%;
}

body .claim-form:has(.monitoring-document-row) > .monitoring-document-row > label {
  min-width: 0;
}

body .claim-form:has(.monitoring-document-row) > .monitoring-document-row input,
body .claim-form:has(.monitoring-document-row) > .monitoring-document-row select,
body .claim-form:has(.monitoring-document-row) > .monitoring-document-row .attachment-picker-box {
  min-width: 0;
  width: 100%;
}

body .claim-form:has(.monitoring-document-row) > .attachment-delete-action-v14 {
  order: 60;
}

body .claim-form:has(.monitoring-document-row) > .primary-button {
  order: 61;
}

@media (max-width: 1100px) {
  body .claim-form:has(.monitoring-document-row) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  body .claim-form:has(.monitoring-document-row) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body .claim-form:has(.monitoring-document-row) > .monitoring-document-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  body .claim-form:has(.monitoring-document-row) {
    grid-template-columns: 1fr;
  }
}