css/dashboard.css

Code: DEV-9BB62056 Size: 4.6 KB Lines: 69 Path: /home/prodconfig.wenesthosting.com/dev.solargroup.wenest.se/css/dashboard.css

Task / Comment

Open report form
.page-file-strip{position:fixed;right:20px;bottom:46px;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;max-width:min(900px,calc(100vw - 260px));z-index:1200}
.page-file-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #dbe5ea;border-radius:999px;background:rgba(247,251,252,.96);backdrop-filter:blur(6px);color:#0d6677;font-size:12px;font-weight:700;text-decoration:none;box-shadow:0 10px 24px rgba(10,39,48,.10)}
.page-file-pill:hover{background:#eef8fa;border-color:#bcd3da}
.page-file-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:#69818a}
body:not([data-role="admin"]):not([data-role="systemadmin"]) .page-file-strip{display:none !important}
/* Pris-gömning per roll — body.dataset.kalkylerPrices/produkterPrices sätts i applyRoleSettings() */
body[data-kalkyler-prices="0"] .calc-list-table th:nth-child(4),
body[data-kalkyler-prices="0"] .calc-list-table td:nth-child(4){display:none !important}
body[data-produkter-prices="0"] .product-card-price,
body[data-produkter-prices="0"] .catalog-card-price,
body[data-produkter-prices="0"] .product-price{display:none !important}

.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px}
.stat-card{background:#fff;border-radius:10px;padding:14px 16px;border:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:flex-start;transition:box-shadow .2s}
.stat-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.06)}
.stat-card-info h4{font-size:11px;color:#94a3b8;font-weight:500;margin-bottom:4px;text-transform:uppercase;letter-spacing:.3px}
.stat-card-info .stat-value{font-size:20px;font-weight:700;color:#1a1a1a;letter-spacing:-.5px}
.stat-card-icon{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.stat-card-icon svg{width:16px;height:16px;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;fill:none}
.stat-card-icon.green{background:#ecfdf5}
.stat-card-icon.green svg{stroke:#10b981}
.stat-card-icon.blue{background:#eff6ff}
.stat-card-icon.blue svg{stroke:#3b82f6}
.stat-card-icon.purple{background:#faf5ff}
.stat-card-icon.purple svg{stroke:#a855f7}
.stat-card-icon.teal{background:#f0fdfa}
.stat-card-icon.teal svg{stroke:#14b8a6}

.dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.dash-panel{background:#fff;border-radius:12px;border:1px solid #e5e7eb;overflow:hidden}
.dash-panel-header{padding:12px 16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #f1f5f9}
.dash-panel-header svg{width:18px;height:18px;stroke:#64748b;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.dash-panel-header h3{font-size:14px;font-weight:600;color:#1a1a1a}
.dash-panel-body{padding:0}
.dash-panel-empty{padding:40px 22px;text-align:center;color:#94a3b8;font-size:14px}
.offert-item{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;border-bottom:1px solid #f1f5f9;transition:background .15s}
.offert-item:last-child{border-bottom:none}
.offert-item:hover{background:#fafbfc}
.offert-item-left h4{font-size:14px;font-weight:600;color:#1a1a1a;margin-bottom:2px}
.offert-item-left p{font-size:12px;color:#94a3b8}
.offert-item-right{text-align:right}
.offert-item-right .offert-price{font-size:15px;font-weight:700;color:#10b981}
.offert-item-right .offert-status{font-size:11px;color:#94a3b8;margin-top:2px}

.dash-charts{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}
.dash-chart-panel{background:#fff;border-radius:12px;border:1px solid #e5e7eb;overflow:hidden}
.dash-chart-body{height:260px;padding:16px}
.top-seller-item{display:flex;align-items:center;gap:14px;padding:14px 16px;border-bottom:1px solid #f1f5f9}
.top-seller-item:last-child{border-bottom:none}
.top-seller-medal{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0}
.medal-gold{background:#f59e0b}
.medal-silver{background:#94a3b8}
.medal-bronze{background:#b45309}
.top-seller-info{min-width:0;flex:1}
.top-seller-name{font-size:14px;font-weight:600;color:#1a1a1a}
.top-seller-detail{font-size:12px;color:#94a3b8}
.top-seller-amount{font-size:14px;font-weight:700;color:#10b981;white-space:nowrap}

@media(max-width:1200px){
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .dash-grid,.dash-charts{grid-template-columns:1fr}
}
@media(max-width:720px){
  .stat-grid{grid-template-columns:1fr}
  .page-file-strip{position:fixed;left:12px;right:12px;bottom:70px;max-width:none}
  .page-file-pill{width:auto;max-width:100%;justify-content:center}
}