/* R53: Fix custom-comments grid on the actual order page, including old R48/R52 markup. */
#dynamicFields:has(#fComments){
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  grid-auto-columns:minmax(0,1fr) !important;
  grid-column:1 / -1 !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  justify-self:stretch !important;
  gap:8px !important;
}
#dynamicFields:has(#fComments) > *,
#dynamicFields:has(#fComments) > .r48-comment-field{
  grid-column:1 / -1 !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
}
#dynamicFields:has(#fComments) #fComments{
  display:block !important;
  box-sizing:border-box !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:116px;
  min-height:110px;
  resize:vertical;
}
#dynamicFields:has(#fComments) .r48-comment-heading{
  display:flex !important;
  justify-content:space-between;
  align-items:baseline;
  gap:10px;
  flex-wrap:wrap;
}
#dynamicFields:has(#fComments) .r48-comment-heading label{width:auto !important;margin:0 !important;}



/* 1DG_COMMENT_QUANTITY_RIGHT_FIX */
#dynamicFields:has(#fComments) .r48-comment-heading {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    width: 100% !important;
}

#dynamicFields:has(#fComments) .r48-comment-heading label {
    width: auto !important;
    margin: 0 !important;
}

#dynamicFields:has(#fComments) .r48-comment-heading > :last-child {
    margin-left: auto !important;
    text-align: right !important;
}


/* 1DG_COMMENT_HEADER_ALIGN_V3 */

/* The label containing the comments textarea */
#dynamicFields label:has(#fComments) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    column-gap: 12px !important;
    row-gap: 6px !important;
    width: 100% !important;
    grid-column: 1 / -1 !important;
}

/* Quantity positioned at the far right */
#dynamicFields label:has(#fComments) #commentLineCount {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    text-align: right !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

/* Comments textarea occupies the full width below */
#dynamicFields label:has(#fComments) #fComments {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}