/* 小草车主服务 · 移动端 H5 样式 */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;background:#f2f5fa;color:#333;max-width:430px;margin:0 auto;min-height:100vh}
a{text-decoration:none;color:inherit}
ul{list-style:none}
:root{--primary:#0b63e5;--primary-light:#e8f0fe;--secondary:#2f9bff;--accent:#ff9f43;--dark:#0a2540;--gray:#999;--light-gray:#eef1f6;--green:#52c41a;--red:#ff4d4f;--blue:#1890ff}
.header{background:linear-gradient(135deg,#0a4bb5,#0b63e5);color:#fff;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(11,99,229,.3)}
.header .back{font-size:22px;cursor:pointer;width:32px}
.header h1{font-size:17px;font-weight:600;flex:1;text-align:center}
.header .right{width:32px;text-align:right;font-size:14px}
.tabbar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:430px;background:#fff;border-top:1px solid #eee;display:flex;z-index:100;padding-bottom:env(safe-area-inset-bottom)}
.tabbar a{flex:1;text-align:center;padding:8px 0;color:#999;font-size:11px}
.tabbar a.active{color:var(--primary)}
.tabbar a .icon{font-size:22px;display:block;margin-bottom:2px}
.card{background:#fff;border-radius:12px;margin:12px;padding:16px;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.section-title{font-size:16px;font-weight:700;margin:16px 16px 8px;display:flex;justify-content:space-between;align-items:center}
.section-title span{font-size:12px;color:#999;font-weight:400}
.btn{display:block;width:100%;padding:13px;border:none;border-radius:25px;font-size:15px;font-weight:600;cursor:pointer;text-align:center}
.btn-primary{background:linear-gradient(135deg,#0a4bb5,#0b63e5);color:#fff}
.badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600}
.badge-hot{background:#fff1f0;color:var(--red)}
.badge-new{background:#e6f7ff;color:var(--blue)}
.badge-warn{background:#fff7e6;color:var(--accent)}
.tag{display:inline-block;padding:2px 6px;border-radius:4px;font-size:11px;background:var(--light-gray);color:#666;margin:2px 4px 0 0}
/* 首页 */
.car-card{background:linear-gradient(135deg,#0a2540,#0b63e5);margin:12px;border-radius:14px;padding:18px;color:#fff}
.car-card .cc-plate{font-size:22px;font-weight:800;letter-spacing:2px}
.car-card .cc-model{font-size:13px;opacity:.85;margin-top:4px}
.car-card .cc-meta{display:flex;gap:16px;margin-top:14px;font-size:12px}
.car-card .cc-meta b{display:block;font-size:15px}
.car-card .cc-warn{margin-top:12px;background:rgba(255,159,67,.25);border-radius:8px;padding:8px 12px;font-size:12px}
.search-bar{background:#fff;margin:12px;border-radius:25px;padding:10px 16px;display:flex;align-items:center;gap:8px;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.search-bar .sb-icon{font-size:16px}
.search-bar .sb-text{flex:1;color:#999;font-size:14px}
.search-bar .sb-btn{color:var(--primary);font-size:14px;font-weight:600}
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:16px 12px;background:#fff;margin:12px;border-radius:12px}
.quick-grid a{text-align:center;font-size:12px;color:#555}
.quick-grid a .qicon{font-size:28px;display:block;margin-bottom:4px}
.quick-grid a .q-dot{font-size:10px;color:var(--red)}
.welfare-bar{background:linear-gradient(135deg,#ff9f43,#ffb84d);margin:12px;border-radius:12px;padding:14px;color:#fff;display:flex;align-items:center;gap:10px}
.welfare-bar .wb-title{font-size:15px;font-weight:700}
.welfare-bar .wb-desc{font-size:11px;opacity:.9;margin-top:2px}
.welfare-bar .wb-btn{margin-left:auto;background:#fff;color:#ff9f43;border:none;border-radius:18px;padding:8px 18px;font-size:13px;font-weight:700;cursor:pointer}
.svc-card{display:flex;gap:12px;background:#fff;margin:8px 12px;border-radius:12px;padding:14px;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.svc-card .sc-icon{width:48px;height:48px;border-radius:10px;background:var(--primary-light);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}
.svc-card .sc-info{flex:1}
.svc-card .sc-name{font-size:14px;font-weight:600}
.svc-card .sc-desc{font-size:12px;color:#999;margin-top:2px}
.svc-card .sc-price{font-size:15px;color:var(--primary);font-weight:700;margin-top:4px}
.svc-card .sc-price small{font-size:11px;font-weight:400;color:#999}
.svc-card .sc-btn{padding:6px 16px;border-radius:20px;font-size:12px;font-weight:600;color:#fff;background:linear-gradient(135deg,#0a4bb5,#0b63e5);border:none;cursor:pointer;align-self:center}
/* 违章 */
.vin-card{display:flex;align-items:center;gap:12px;background:#fff;margin:12px;border-radius:12px;padding:14px}
.vin-card .vc-edit{flex:1}
.vin-card .vc-plate{font-size:18px;font-weight:700;letter-spacing:1px}
.vin-card .vc-tip{font-size:11px;color:#999;margin-top:2px}
.vin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:0 12px}
.vin-stats .vs-item{background:#fff;border-radius:12px;padding:14px;text-align:center}
.vin-stats .vs-num{font-size:22px;font-weight:800}
.vin-stats .vs-num.red{color:var(--red)}
.vin-stats .vs-num.blue{color:var(--primary)}
.vin-stats .vs-label{font-size:11px;color:#999;margin-top:4px}
.vio-item{background:#fff;border-radius:12px;margin:8px 12px;padding:14px}
.vio-item .vi-top{display:flex;justify-content:space-between;align-items:center}
.vio-item .vi-type{font-size:14px;font-weight:600;flex:1}
.vio-item .vi-point{font-size:12px;font-weight:700;color:var(--red);background:#fff1f0;padding:3px 8px;border-radius:10px}
.vio-item .vi-money{font-size:14px;color:var(--red);font-weight:700}
.vio-item .vi-meta{font-size:12px;color:#999;margin-top:6px;line-height:1.6}
.vio-item .vi-status{font-size:12px;font-weight:600;margin-top:6px}
.vio-item .vi-status.unpay{color:var(--accent)}
.vio-item .vi-status.paid{color:var(--green)}
.vio-item .vi-btn{margin-top:10px;padding:8px;border-radius:20px;font-size:13px;font-weight:600;border:none;cursor:pointer;width:100%}
.vio-item .vi-btn.pay{background:linear-gradient(135deg,#0a4bb5,#0b63e5);color:#fff}
.vio-item .vi-btn.done{background:#f0f2f5;color:#999}
/* 加油 */
.station-item{background:#fff;border-radius:12px;margin:8px 12px;padding:14px}
.station-item .si-top{display:flex;justify-content:space-between;align-items:center}
.station-item .si-name{font-size:15px;font-weight:600}
.station-item .si-brand{font-size:11px;color:var(--primary);background:var(--primary-light);padding:2px 8px;border-radius:10px;margin-left:6px}
.station-item .si-price{font-size:15px;font-weight:700}
.station-item .si-price .sp-now{font-size:20px;color:var(--primary)}
.station-item .si-price .sp-old{font-size:12px;color:#999;text-decoration:line-through;margin-left:4px}
.station-item .si-meta{font-size:12px;color:#999;margin-top:8px;line-height:1.7}
.station-item .si-disc{display:inline-block;margin-top:6px;background:#fff7e6;color:var(--accent);font-size:12px;padding:3px 10px;border-radius:10px}
.station-item .si-btn{margin-top:10px;padding:8px;border-radius:20px;font-size:13px;font-weight:600;border:none;cursor:pointer;width:100%;background:linear-gradient(135deg,#0a4bb5,#0b63e5);color:#fff}
.recharge-row{display:flex;gap:8px;margin:0 12px}
.recharge-row .rc-item{flex:1;text-align:center;background:#fff;border-radius:10px;padding:12px 4px;border:2px solid transparent}
.recharge-row .rc-item.active{border-color:var(--primary)}
.recharge-row .rc-item .rc-amount{font-size:16px;font-weight:700}
.recharge-row .rc-item .rc-bonus{font-size:11px;color:var(--primary)}
/* 洗车 */
.store-item{display:flex;gap:12px;background:#fff;margin:8px 12px;border-radius:12px;padding:14px}
.store-item .st-icon{width:52px;height:52px;border-radius:10px;background:var(--primary-light);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0}
.store-item .st-info{flex:1}
.store-item .st-name{font-size:15px;font-weight:600}
.store-item .st-rating{font-size:12px;color:var(--accent);margin-top:2px}
.store-item .st-meta{font-size:12px;color:#999;margin-top:4px}
.store-item .st-price{font-size:14px;color:var(--primary);font-weight:700;margin-top:4px}
.store-item .st-btn{padding:6px 16px;border-radius:20px;font-size:12px;font-weight:600;color:#fff;background:linear-gradient(135deg,#0a4bb5,#0b63e5);border:none;cursor:pointer;align-self:center}
.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:0 12px}
.service-card{background:#fff;border-radius:12px;padding:14px;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.service-card .srv-icon{font-size:30px}
.service-card .srv-name{font-size:14px;font-weight:600;margin-top:8px}
.service-card .srv-desc{font-size:11px;color:#999;margin-top:2px}
.service-card .srv-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.service-card .srv-price{font-size:16px;color:var(--primary);font-weight:700}
.service-card .srv-price small{font-size:11px;font-weight:400;color:#999}
.service-card .srv-btn{background:var(--primary-light);color:var(--primary);border:none;border-radius:16px;padding:6px 14px;font-size:12px;font-weight:600;cursor:pointer}
/* 停车 */
.park-item{background:#fff;border-radius:12px;margin:8px 12px;padding:14px}
.park-item .pi-top{display:flex;justify-content:space-between;align-items:center}
.park-item .pi-name{font-size:15px;font-weight:600}
.park-item .pi-dist{font-size:11px;color:#999;margin-top:2px}
.park-item .pi-price{font-size:16px;font-weight:700;color:var(--primary)}
.park-item .pi-left{font-size:12px;color:var(--green);background:#f6ffed;padding:3px 10px;border-radius:10px}
.park-item .pi-left.full{color:#999;background:#f5f5f5}
.park-item .pi-meta{font-size:12px;color:#999;margin-top:8px}
.park-item .pi-btn{margin-top:10px;padding:8px;border-radius:20px;font-size:13px;font-weight:600;border:none;cursor:pointer;width:100%;background:linear-gradient(135deg,#0a4bb5,#0b63e5);color:#fff}
.park-item .pi-btn.stop{background:#f0f2f5;color:#666}
/* 我的 */
.profile-header{background:linear-gradient(135deg,#0a2540,#0b63e5);color:#fff;padding:28px 16px;text-align:center}
.profile-avatar{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.25);margin:0 auto 8px;display:flex;align-items:center;justify-content:center;font-size:30px}
.profile-stats{display:grid;grid-template-columns:repeat(3,1fr);text-align:center;margin-top:16px}
.profile-stats .ps-num{font-size:20px;font-weight:700}
.profile-stats .ps-label{font-size:11px;opacity:.8;margin-top:2px}
.order-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;background:#fff;margin:12px;border-radius:12px;padding:16px}
.order-nav a{text-align:center;font-size:12px;color:#555}
.order-nav a .on-icon{font-size:26px;display:block;margin-bottom:4px}
.menu-list{background:#fff;margin:12px;border-radius:12px;padding:0}
.menu-list a{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid #f5f5f5}
.menu-list a:last-child{border-bottom:none}
.menu-list .ml-arrow{color:#ccc}
.empty{text-align:center;padding:60px 20px;color:#999}
.empty .eicon{font-size:48px;margin-bottom:12px}
