/*
 * Deposit payment review, compact
 * ===============================
 * assets/platform/js/deposit-review.js puts the payment's facts on one line and moves
 * the decision card to follow the Payment proof card. Laid out here so both stay
 * short: the decision as a strip — remarks beside the buttons — and the Member
 * profile card's rows in columns instead of one long list.
 */

/* ---- the payment band: amount, plan chips and reference on one line ---- */
.deposit-payment-summary.dpr--compact {
  padding: .8rem 1rem;
}

.deposit-payment-summary.dpr--compact > .dpr__facts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem 1rem;
  min-width: 0;
}

.deposit-payment-summary.dpr--compact > .dpr__facts > .deposit-payment-summary__amount,
.deposit-payment-summary.dpr--compact > .dpr__facts > .deposit-payment-summary__chips,
.deposit-payment-summary.dpr--compact > .dpr__facts > .deposit-payment-summary__ref {
  margin: 0;
}

/* ---- the decision: a strip after the proof, remarks beside the buttons ---- */
.deposit-decision-panel.dpr-strip {
  border-color: rgba(201, 168, 76, .45);
  background: linear-gradient(135deg, rgba(201, 168, 76, .08), var(--white));
  padding: .7rem .9rem .8rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "head head"
    "form actions";
  gap: .3rem .75rem;
  align-items: end;
}

.deposit-decision-panel.dpr-strip > .amd-detail-card__head {
  grid-area: head;
  margin-bottom: .1rem;
  align-items: baseline;
}

/* Title and its hint on one line. */
.deposit-decision-panel.dpr-strip > .amd-detail-card__head > div {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .1rem .5rem;
}

.deposit-decision-panel.dpr-strip .amd-detail-card__title {
  margin: 0;
}

.deposit-decision-panel.dpr-strip > .form-group {
  grid-area: form;
  margin: 0 !important;
  min-width: 0;
}

.deposit-decision-panel.dpr-strip > .form-group > label {
  margin-bottom: .2rem;
}

.deposit-decision-panel.dpr-strip textarea {
  width: 100%;
  box-sizing: border-box;
  height: 56px;
  min-height: 56px;
  resize: vertical;
}

.deposit-decision-panel.dpr-strip > .amd-detail-action-row {
  grid-area: actions;
  flex-wrap: nowrap;
  align-items: flex-end;
}

@media (max-width: 699px) {
  .deposit-decision-panel.dpr-strip {
    grid-template-columns: 1fr;
    grid-template-areas:
      "head"
      "form"
      "actions";
  }

  .deposit-decision-panel.dpr-strip > .amd-detail-action-row {
    flex-wrap: wrap;
  }
}

/* ---- Member profile: rows in columns, label over value ---- */
@media (min-width: 700px) {
  .deposit-detail-page .amd-detail-main .amd-detail-card .amd-detail-summary-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .15rem 1.25rem;
    align-items: start;
  }

  .deposit-detail-page .amd-detail-main .amd-detail-card .amd-detail-summary-list > .mr-detail-row {
    grid-template-columns: 1fr;
    gap: .05rem;
    padding: .4rem 0;
    border-bottom: 1px dashed rgba(15, 61, 122, .08);
  }

  .deposit-detail-page .amd-detail-main .amd-detail-card .amd-detail-summary-list > .mr-detail-row:first-of-type {
    padding-top: .4rem;
  }

  .deposit-detail-page .amd-detail-main .amd-detail-card .amd-detail-summary-list > .mr-detail-row:last-child {
    padding-bottom: .4rem;
  }
}