.spike-dashboard{display:grid;grid-template-columns:1.05fr 1.8fr 1.05fr;gap:22px}.spike-card{min-height:300px;padding:28px;border-radius:17px}.spike-card h2{font-size:17px;font-weight:650;margin:0 0 4px;letter-spacing:-.02em}.spike-card small{color:#8490a8;font-size:11px}.spike-card-head{display:flex;justify-content:space-between;align-items:flex-start}.metric{font-size:22px;font-weight:750;text-align:right}.metric em{display:block;font-style:normal;font-size:10px;color:#22af88;border:1px solid #8de2c8;border-radius:12px;padding:3px 7px;margin-top:5px}.mini-bars{height:125px;display:flex;align-items:flex-end;justify-content:space-around;gap:10px;margin-top:18px;background:repeating-linear-gradient(to bottom,transparent 0,transparent 30px,#f0f3f8 31px)}.mini-bars i{width:8px;height:60%;background:#e9edf4;border-radius:5px;position:relative}.mini-bars i b{position:absolute;left:0;right:0;bottom:0;height:45%;background:#138ede;border-radius:5px}.days{display:flex;justify-content:space-around;color:#a3adbe;font-size:10px;margin-top:9px}.legend{border-top:1px solid #edf0f6;margin-top:22px;padding-top:15px;display:flex;flex-direction:column;gap:12px;font-size:12px;color:#66738c}.legend b{float:right;color:var(--text);font-weight:600}.welcome-card{grid-column:2;display:flex;justify-content:space-between;overflow:hidden;position:relative;padding-bottom:0}.welcome-card>div{z-index:1}.welcome-card>img{width:240px;height:220px;object-fit:cover;align-self:flex-end;margin-right:-8px;margin-bottom:-1px}.welcome-list{margin-top:24px}.welcome-list p{display:flex;align-items:center;gap:12px;margin:14px 0;font-size:12px}.welcome-list b{font-weight:600}.welcome-list b small{display:block;margin-top:3px;font-weight:400}.welcome-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center}.mint{background:#d9faee;color:#31b68b}.peach{background:#fff0e0;color:#f0a14f}.sky{background:#dff5fc;color:#1eacd7}.deal{grid-column:3;grid-row:1}.deal-number{font-size:32px;font-weight:750;margin-top:45px}.deal-line{height:4px;background:#eef2f6;border-radius:10px;margin:10px 0 12px}.deal-line span{display:block;width:48%;height:100%;background:#148fe0;border-radius:10px}.people{display:flex;align-items:center;margin-top:48px}.people img{width:30px;height:30px;object-fit:cover;border-radius:50%;border:2px solid #fff;margin-right:-7px}.people b{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#8fa3c0;color:#fff;font-size:11px;margin-left:6px}.products{grid-column:1;grid-row:2}.products>p{text-align:center}.products .spike-card-head>strong{font-size:20px}.donut{width:130px;height:130px;border-radius:50%;margin:28px auto 25px;background:conic-gradient(#138ede 0 var(--p),#4cc6db var(--p) calc(var(--p) + var(--q)),#ff937c calc(var(--p) + var(--q)) 100%);display:grid;place-items:center}.donut:after{content:"";position:absolute}.donut>div{width:92px;height:92px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:22px;font-weight:700}.donut small{display:block;font-size:10px;font-weight:400}.card-foot{color:#71809a;font-size:11px}.orders{grid-column:2;grid-row:2;min-height:345px}.date-select{border:1px solid #e1e7f0;background:#fff;border-radius:18px;padding:8px 12px;color:#65718a;font-size:11px}.line-chart{height:220px;margin-top:25px}.line-chart svg{width:100%;height:180px;overflow:visible;background:repeating-linear-gradient(to bottom,transparent 0,transparent 44px,#edf0f6 45px)}.line-chart .gridline{stroke:#e8edf4;stroke-width:1}.line-chart .line{fill:none;stroke-width:3}.line-chart .one{stroke:#138ede}.line-chart .two{stroke:#4cc6db}.chart-labels{display:flex;justify-content:space-between;color:#a0aabe;font-size:10px}.customers{grid-column:3;grid-row:2;min-height:345px}.customer-line{height:150px;margin-top:38px}.customer-line svg{width:100%;height:100%}.customer-line path{fill:none;stroke:#0c8fe2;stroke-width:3}.customer-meta{display:flex;justify-content:space-between;font-size:11px;color:#64718a;margin-top:8px}.customer-meta b{color:var(--text)}
@media(max-width:1100px){.spike-dashboard{grid-template-columns:1fr 1fr}.welcome-card{grid-column:1/-1;grid-row:auto}.deal,.products,.orders,.customers{grid-column:auto;grid-row:auto}}@media(max-width:760px){.spike-dashboard{grid-template-columns:1fr}.welcome-card{grid-column:auto}.welcome-card>img{width:145px;height:150px}.deal,.products,.orders,.customers{grid-column:auto}.spike-card{padding:20px}.chart-labels{font-size:9px}}