.mts-charge-summary{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;background:linear-gradient(135deg,#08232d,#12404c);color:#fff;border-radius:22px;padding:18px;margin-bottom:16px}.mts-charge-summary>div{display:grid;gap:4px}.mts-charge-summary>div:last-child{text-align:left}.mts-charge-summary small{color:#c7dde2}.mts-charge-summary strong{font-size:18px}.mts-charge-summary>.dashicons{width:48px;height:48px;border-radius:15px;background:rgba(255,255,255,.12);display:grid;place-items:center;font-size:25px}.mts-charge-list{display:grid;gap:12px}.mts-charge-card{background:#fff;border:1px solid #e3eaed;border-radius:19px;padding:16px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:12px;align-items:center}.mts-charge-card header{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding-bottom:11px;border-bottom:1px solid #edf1f2}.mts-charge-card header small,.mts-charge-card>div span{display:block;color:#7c8b91;font-size:12px}.mts-charge-card header strong,.mts-charge-card>div strong{display:block;margin-top:3px}.mts-charge-card header>span{padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800}.mts-charge-card.is-unpaid header>span{background:#fff4df;color:#9a6000}.mts-charge-card.is-overdue header>span{background:#fff0f0;color:#c72935}.mts-charge-card.is-paid header>span{background:#e9faf0;color:#14804a}.mts-charge-card.is-cancelled{opacity:.65}.mts-charge-card>p{grid-column:1/-1;background:#f7f9fa;border-radius:12px;padding:11px;margin:0;color:#5f6e74}.mts-charge-card>.mts-primary-btn{grid-column:1/-1;text-align:center}.mts-charge-paid{grid-column:1/-1;background:#eafaf0;color:#147b46;border-radius:12px;padding:11px;display:flex;align-items:center;gap:7px}.mts-charge-paid .dashicons{font-size:20px}
@media(max-width:600px){.mts-charge-summary{grid-template-columns:1fr auto 1fr;padding:15px 13px}.mts-charge-summary strong{font-size:15px}.mts-charge-card{grid-template-columns:1fr 1fr;padding:14px}.mts-charge-card .mts-charge-due{grid-column:1/-1}.mts-charge-card>div strong{font-size:14px}}