/* Detail page only. Preserve plan content and all purchase controls. */
#app .html-content[data-v-14e4b6df] > div:has(> .beup-intro-summary-v2) {
  padding: 18px 20px !important;
}
#app .html-content[data-v-14e4b6df] > div:has(> .beup-intro-summary-v2) > div[style*="inline-flex"] {
  margin-bottom: 10px !important;
}
#app .html-content[data-v-14e4b6df] .intro-use {
  margin-bottom: 12px;
}
#app .html-content[data-v-14e4b6df] .intro-metrics {
  width: 100%;
  margin: 0 0 14px;
  padding: 12px 0;
}
#app .html-content[data-v-14e4b6df] .intro-group {
  padding-top: 8px;
  margin-top: 8px;
}
#app .html-content[data-v-14e4b6df] .intro-group h3 {
  margin-bottom: 5px;
}
#app .html-content[data-v-14e4b6df] .intro-details {
  gap: 0 10px;
}
#app .html-content[data-v-14e4b6df] .intro-details :is(dt, dd) {
  line-height: 1.6;
}
/* Grid shares the introduction row's height with the payment card.
   The optional coupon stays between the payment options and order button. */
@media (min-width: 960px) {
  #app .v-row[data-v-14e4b6df]:has(> .v-col-lg-7):has(> .v-col-lg-5) {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    align-items: stretch !important;
    gap: 16px 24px;
    margin: 0;
    width: 100%;
  }
  #app .v-row[data-v-14e4b6df]:has(> .v-col-lg-7) > .v-col-12:not(.align-self-start) {
    grid-column: 1 / -1;
    padding: 0;
  }
  #app :is(.v-col-lg-7, .v-col-lg-5)[data-v-14e4b6df] {
    display: contents;
  }
  #app .v-col-lg-7[data-v-14e4b6df] > .v-card:first-child {
    grid-column: 1;
    grid-row: 2;
  }
  #app .v-col-lg-7[data-v-14e4b6df] > .v-card.margin-10 {
    grid-column: 1;
    grid-row: 3;
    margin-top: 0 !important;
  }
  #app .v-col-lg-5[data-v-14e4b6df] > .v-card {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    flex-direction: column;
  }
  #app :is(.v-col-lg-7, .v-col-lg-5)[data-v-14e4b6df] > .v-card > .v-card-text[data-v-14e4b6df] {
    padding: 18px;
  }
  #app .v-col-lg-5[data-v-14e4b6df] :is(.v-card-text, .v-input__control, .v-selection-control-group) {
    display: flex;
    flex: 1;
    min-width: 0;
  }
  #app .v-col-lg-5[data-v-14e4b6df] .v-radio-group {
    display: flex;
    flex: 1;
    min-width: 0;
  }
  #app .v-col-lg-5[data-v-14e4b6df] .v-selection-control-group > .v-row {
    display: flex;
    flex: 1;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 8px;
    margin: 0;
    min-width: 0;
  }
  #app .v-col-lg-5[data-v-14e4b6df] .v-selection-control-group > .v-row > .v-col-12 {
    padding: 0;
    flex: 0 0 auto;
  }
  #app .v-col-lg-5[data-v-14e4b6df] .v-selection-control-group > .v-row > .v-col-12:has(> button) {
    margin-top: auto;
    padding-top: 6px;
  }
  #app .v-col-lg-5[data-v-14e4b6df] .payment-method {
    padding: 6px 12px !important;
  }
  #app .v-col-lg-5[data-v-14e4b6df] .v-selection-control-group > .v-row:has(> .v-col-sm-12:nth-child(4)) > .v-col-sm-12 {
    display: flex;
    flex: 1 1 auto;
  }
  #app .v-col-lg-5[data-v-14e4b6df] .v-selection-control-group > .v-row:has(> .v-col-sm-12:nth-child(4)) .payment-method {
    display: flex;
    align-items: center;
    width: 100%;
  }
  #app .v-col-lg-5[data-v-14e4b6df] button.mt-4 {
    margin-top: 0 !important;
  }
}
@media (min-width: 1920px) {
  #app .v-row[data-v-14e4b6df]:has(> .v-col-lg-7):has(> .v-col-lg-5) {
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  }
}
@media (max-width: 599px) {
  #app .html-content[data-v-14e4b6df] > div:has(> .beup-intro-summary-v2) {
    padding: 16px 14px !important;
  }
  #app .html-content[data-v-14e4b6df] .intro-details {
    column-gap: 8px;
  }
}

/* The existing coupon controls now live inside the checkout card. */
#app .beup-detail-coupon[data-v-14e4b6df] { min-width: 0; }
#app .beup-detail-coupon-card {
  border: 0 !important;
  border-top: 1px solid rgba(89,117,128,.16) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-top: 4px;
  padding-top: 12px;
}
#app .beup-detail-coupon-card > .v-card-item { padding: 0 0 8px; }
#app .beup-detail-coupon-card .v-card-title { font-size: 13px !important; line-height: 1.5; font-weight: 600; }
#app .beup-detail-coupon-card > .v-card-text { display: block; flex: initial; padding: 0 !important; }
#app .beup-detail-coupon-card > .v-divider,
#app .beup-detail-coupon-card .v-card-text > .v-label,
#app .beup-detail-coupon-card .v-input__details { display: none; }
#app .beup-detail-coupon-card .v-card-actions { padding: 6px 0 0; min-height: 36px; }
#app .beup-detail-coupon-card .v-field__input { min-height: 42px; padding-top: 10px; padding-bottom: 10px; }
#app .beup-detail-coupon-card .v-btn { height: 32px; font-size: 12px; }

#app .v-col-lg-5[data-v-14e4b6df] .payment-method > .v-selection-control { width: 100%; flex: 1; }
/* List cards keep every detail visible, without extra gaps between rows. */
#app [data-v-6b196619] div:has(> .beup-intro-summary-v2) { padding: 18px 20px !important; }
#app [data-v-6b196619] div:has(> .beup-intro-summary-v2) > div[style*="inline-flex"] { margin-bottom: 10px !important; }
#app [data-v-6b196619] .intro-use { margin-bottom: 10px; }
#app [data-v-6b196619] .intro-metrics { padding-top: 12px; padding-bottom: 12px; margin-bottom: 12px; }
#app [data-v-6b196619] .intro-group { padding-top: 8px; margin-top: 8px; }
#app [data-v-6b196619] .intro-group h3 { margin-bottom: 5px; }
#app [data-v-6b196619] .intro-details { row-gap: 0; column-gap: 10px; }
#app [data-v-6b196619] .intro-details :is(dt,dd) { line-height: 1.6; margin: 0; padding: 0; }