/* A compact rider view keeps the payment amount and settlement details first. */
#rider{display:flex;flex-direction:column}
#rider>.page-heading{order:1}
#rider>.retention-note{order:2}
#rider>.stats{order:3}
#rider>.payment-status-card{order:4}
#rider>.detail-card{order:5}
#rider>.settlement-settings{order:6}
#rider>.bank-settings{order:7}
#rider>.inquiry-settings{order:8}
.rider-settings{margin:0 0 17px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(29,45,77,.04)}
.rider-settings summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 17px;color:var(--navy);cursor:pointer;list-style:none;font-size:14px;font-weight:850}
.rider-settings summary::-webkit-details-marker{display:none}
.rider-settings summary:after{content:'+';display:grid;place-items:center;width:23px;height:23px;border-radius:8px;background:#edf3ff;color:var(--blue);font-size:20px;font-weight:500;line-height:1}
.rider-settings[open] summary{border-bottom:1px solid var(--line)}
.rider-settings[open] summary:after{content:'−'}
.rider-settings summary small{margin-left:auto;color:#8994a7;font-size:11px;font-weight:650}
.rider-settings .box{margin:10px;border:0;box-shadow:none}
@media(max-width:560px){
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
  .stats article{min-height:83px;padding:14px}
  .stats .pay-card{grid-column:1/-1;min-height:97px;padding:16px}
  .stats .pay-card strong{margin-top:7px;font-size:28px}
  .stats strong{margin-top:7px;font-size:19px}
  .stats small{margin-top:5px;font-size:10px}
  .payment-status-card{margin:-1px 0 12px;padding:12px 14px}
  .detail-card table{margin-top:2px}
  .detail-card th,.detail-card td{padding:12px 4px;font-size:13px}
  .detail-card tfoot th,.detail-card tfoot td{padding-top:16px;font-size:17px}
  .detail-card .section-title{padding-bottom:14px}
  .detail-card .section-icon{width:36px;height:36px;border-radius:11px;font-size:18px}
  .detail-card .section-title h2{font-size:19px}
  .rider-settings{margin-bottom:12px}
  .rider-settings summary{padding:13px 14px}
  .rider-settings .box{margin:5px;padding:16px}
}