
/* QUINCA+ v37 — compléments v34 dans le design v36 */

.dashboard-v37-heading>div:first-child{
  min-width:0;
}
.dashboard-v37-actions{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:10px;
}
.dashboard-v37-action{
  height:31px;
  padding:0 11px;
  border:1px solid #d9e5f1;
  border-radius:8px;
  background:#fff;
  color:#355371;
  font-size:9.5px;
  font-weight:760;
  cursor:pointer;
  transition:.15s ease;
}
.dashboard-v37-action:hover{
  border-color:#bcd7f4;
  background:#f5faff;
  color:#086ed8;
  transform:translateY(-1px);
}
.dashboard-v37-action.primary{
  border-color:#0b79ed;
  background:linear-gradient(135deg,#1186ff,#0870df);
  color:#fff;
  box-shadow:0 5px 14px rgba(8,112,223,.18);
}
.dashboard-v37-action.primary:hover{
  color:#fff;
  background:linear-gradient(135deg,#1a8cff,#0976e8);
}

.dashboard-v37-section-title{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:14px;
  margin:18px 2px 9px;
}
.dashboard-v37-section-title h2{
  margin:0;
  color:#13264f;
  font-size:13px;
  font-weight:880;
  letter-spacing:-.015em;
}
.dashboard-v37-section-title span{
  color:#8190a4;
  font-size:9px;
}

.dashboard-v37-extra-kpis{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
}
.dashboard-v37-extra-kpis .dashboard-v36-kpi{
  min-height:104px;
  grid-template-columns:48px minmax(0,1fr);
  gap:12px;
  padding:14px;
}
.dashboard-v37-extra-kpis .dashboard-v36-kpi-icon{
  width:44px;
  height:44px;
  border-radius:10px;
}
.dashboard-v37-extra-kpis .dashboard-v36-kpi-icon svg{
  width:24px;
  height:24px;
}
.dashboard-v37-extra-kpis .dashboard-v36-kpi-copy>span{
  font-size:9px;
}
.dashboard-v37-extra-kpis .dashboard-v36-kpi-copy>strong{
  font-size:15.5px;
  margin-top:6px;
}
.dashboard-v37-extra-kpis .dashboard-v36-kpi-copy>small{
  font-size:8px;
  line-height:1.3;
}

.dashboard-v37-insights-grid{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr);
  gap:14px;
  margin-top:14px;
}
.dashboard-v37-subtitle{
  display:block;
  margin-top:3px;
  color:#8293a8;
  font-size:9px;
}
.dashboard-v37-panel-total{
  color:#172f50;
  font-size:15px;
  font-weight:900;
  white-space:nowrap;
}

.dashboard-v37-payments-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  padding:0 14px 13px;
}
.dashboard-v37-payment-item{
  min-width:0;
  display:grid;
  grid-template-columns:32px minmax(0,1fr);
  grid-template-areas:
    "icon copy"
    "amount amount";
  gap:6px 9px;
  padding:10px;
  border:1px solid #e2e9f1;
  border-radius:10px;
  background:#fbfdff;
}
.dashboard-v37-payment-icon{
  grid-area:icon;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#edf4fc;
  color:#1a70c8;
  font-size:10px;
  font-weight:900;
}
.dashboard-v37-payment-copy{
  grid-area:copy;
  min-width:0;
}
.dashboard-v37-payment-copy span{
  display:block;
  color:#36516e;
  font-size:8.5px;
  font-weight:800;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.dashboard-v37-payment-copy small{
  display:block;
  margin-top:2px;
  color:#8a99aa;
  font-size:7.5px;
}
.dashboard-v37-payment-item>strong{
  grid-area:amount;
  color:#183450;
  font-size:11px;
  font-weight:900;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.dashboard-v37-payment-item.cash .dashboard-v37-payment-icon{background:#e5f8ee;color:#099a4f}
.dashboard-v37-payment-item.wave .dashboard-v37-payment-icon{background:#e8f6ff;color:#0d82cd}
.dashboard-v37-payment-item.orange .dashboard-v37-payment-icon{background:#fff1df;color:#ee7c00}
.dashboard-v37-payment-item.mtn .dashboard-v37-payment-icon{background:#fff7d8;color:#b78a00}
.dashboard-v37-payment-item.card .dashboard-v37-payment-icon{background:#f0eaff;color:#7439dc}
.dashboard-v37-payment-item.transfer .dashboard-v37-payment-icon{background:#eaf1ff;color:#355fd0}
.dashboard-v37-payment-item.credit .dashboard-v37-payment-icon{background:#fff0f2;color:#d64655}

.dashboard-v37-payment-check{
  display:grid;
  grid-template-columns:1fr auto auto;
  align-items:center;
  gap:12px;
  margin:0 14px 14px;
  padding:10px 12px;
  border-radius:9px;
  background:#f2f8ff;
  border:1px solid #dceafb;
}
.dashboard-v37-payment-check span{
  color:#5d728a;
  font-size:8.5px;
}
.dashboard-v37-payment-check strong{
  color:#174979;
  font-size:11px;
}
.dashboard-v37-payment-check b{
  color:#0a9b55;
  font-size:8.5px;
}

.dashboard-v37-category-body{
  display:grid;
  grid-template-columns:148px minmax(0,1fr);
  gap:14px;
  align-items:center;
  padding:2px 16px 17px;
}
.dashboard-v37-donut{
  width:132px;
  height:132px;
  margin:auto;
  border-radius:50%;
  background:var(--dash-donut);
  position:relative;
}
.dashboard-v37-donut:after{
  content:"";
  position:absolute;
  inset:28px;
  border-radius:50%;
  background:#fff;
}
.dashboard-v37-donut-center{
  position:absolute;
  inset:0;
  z-index:2;
  display:grid;
  place-content:center;
  text-align:center;
}
.dashboard-v37-donut-center strong{
  display:block;
  color:#122b4b;
  font-size:15px;
  font-weight:900;
}
.dashboard-v37-donut-center span{
  display:block;
  margin-top:2px;
  color:#8392a5;
  font-size:7.5px;
  font-weight:700;
}
.dashboard-v37-category-legend{
  display:grid;
  gap:8px;
}
.dashboard-v37-category-row{
  display:grid;
  grid-template-columns:8px minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  min-width:0;
}
.dashboard-v37-category-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--dot);
}
.dashboard-v37-category-name{
  min-width:0;
  color:#536b85;
  font-size:8.5px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.dashboard-v37-category-row strong{
  color:#233e5c;
  font-size:8.5px;
}

/* garde le bloc graphique + dernières ventes de la v36 intact dans son esprit */
.dashboard-v37 .dashboard-v36-main-grid{
  margin-top:14px;
}

/* sombre */
body.dark-ui .dashboard-v37-action{
  background:#132338;
  border-color:#2a3f57;
  color:#b7c9dc;
}
body.dark-ui .dashboard-v37-action:hover{
  background:#182b42;
  border-color:#355777;
  color:#90c5fa;
}
body.dark-ui .dashboard-v37-action.primary{
  color:#fff;
  border-color:#187ddd;
  background:linear-gradient(135deg,#1684ef,#0b63bc);
}
body.dark-ui .dashboard-v37-section-title h2{
  color:#eef5ff;
}
body.dark-ui .dashboard-v37-section-title span,
body.dark-ui .dashboard-v37-subtitle{
  color:#92a5ba;
}
body.dark-ui .dashboard-v37-panel-total{
  color:#edf5ff;
}
body.dark-ui .dashboard-v37-payment-item{
  background:#14253a;
  border-color:#283d55;
}
body.dark-ui .dashboard-v37-payment-copy span{
  color:#b7c9db;
}
body.dark-ui .dashboard-v37-payment-copy small{
  color:#8498ad;
}
body.dark-ui .dashboard-v37-payment-item>strong{
  color:#edf5ff;
}
body.dark-ui .dashboard-v37-payment-check{
  background:#152a42;
  border-color:#294764;
}
body.dark-ui .dashboard-v37-payment-check span{
  color:#9eb2c7;
}
body.dark-ui .dashboard-v37-payment-check strong{
  color:#d8ecff;
}
body.dark-ui .dashboard-v37-donut:after{
  background:#101d2f;
}
body.dark-ui .dashboard-v37-donut-center strong{
  color:#eef5ff;
}
body.dark-ui .dashboard-v37-donut-center span{
  color:#8fa4ba;
}
body.dark-ui .dashboard-v37-category-name{
  color:#b0c2d6;
}
body.dark-ui .dashboard-v37-category-row strong{
  color:#eef5ff;
}

@media(max-width:1400px){
  .dashboard-v37-extra-kpis{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .dashboard-v37-payments-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:1050px){
  .dashboard-v37-insights-grid{
    grid-template-columns:1fr;
  }
  .dashboard-v37-extra-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:700px){
  .dashboard-v37-heading{
    align-items:flex-start;
  }
  .dashboard-v37-heading time{
    margin-top:2px;
  }
  .dashboard-v37-section-title{
    align-items:flex-start;
    flex-direction:column;
    gap:3px;
  }
  .dashboard-v37-extra-kpis{
    grid-template-columns:1fr;
  }
  .dashboard-v37-payments-grid{
    grid-template-columns:1fr;
  }
  .dashboard-v37-payment-check{
    grid-template-columns:1fr;
    gap:4px;
  }
  .dashboard-v37-category-body{
    grid-template-columns:1fr;
  }
}
