/* CTR SUITE Dashboard - equal card widths like Latest Transactions / Best Sellers */
@media (min-width: 981px) {
  html body.ctr-mobile-v23 .app .main .dash-grid > .dash-row.dash-row--revenue {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 18px !important;
    align-items: stretch !important;
  }
  html body.ctr-mobile-v23 .app .main .dash-grid > .dash-row.dash-row--revenue > .card {
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
  /* Five or more payment methods: content fits naturally inside half-width card. */
  html body.ctr-mobile-v23 .app .main .dash-row--revenue .payment-composition-body {
    grid-template-columns: minmax(0, 0.93fr) minmax(0, 1.07fr) !important;
    gap: 12px !important;
  }
  html body.ctr-mobile-v23 .app .main .dash-row--revenue .donut-wrap {
    width: min(100%, 205px) !important;
    max-width: 205px !important;
    aspect-ratio: 1 / 1 !important;
  }
  html body.ctr-mobile-v23 .app .main .dash-row--revenue .donut-total strong {
    font-size: clamp(12px, 1vw, 16px) !important;
  }
}
/* When dashboard content area becomes narrow, keep card widths equal but stack chart content safely. */
@media (min-width: 981px) and (max-width: 1350px) {
  html body.ctr-mobile-v23 .app .main .dash-row--revenue .payment-composition-body {
    grid-template-columns: minmax(0,1fr) !important;
    justify-items: center !important;
    gap: 12px !important;
  }
  html body.ctr-mobile-v23 .app .main .dash-row--revenue .legend {
    grid-column: 1 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    width:100% !important;
  }
  html body.ctr-mobile-v23 .app .main .dash-row--revenue .donut-wrap { grid-column:1 !important; }
}
@media (max-width: 980px) {
  html body.ctr-mobile-v23 .app .main .dash-grid > .dash-row.dash-row--revenue {
    grid-template-columns: minmax(0,1fr) !important;
  }
}