
/* QUINCA+ v17 — superbe carte CA du jour avec ventilation des paiements */

.daily-ca-card{
  grid-column:span 2;
  position:relative;
  overflow:hidden;
  padding:16px 16px 14px;
  background:
    linear-gradient(135deg,rgba(8,120,249,.055),rgba(255,255,255,0) 52%),
    #fff;
  border-color:#d7e7f8;
}
.daily-ca-card:before{
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  border-radius:50%;
  right:-70px;
  top:-105px;
  background:radial-gradient(circle,rgba(8,120,249,.13),rgba(8,120,249,0) 70%);
  pointer-events:none;
}
.daily-ca-card .metric-top,
.daily-ca-card .metric-value,
.daily-ca-card .metric-foot,
.daily-ca-breakdown{
  position:relative;
  z-index:1;
}
.daily-ca-card .metric-top small{
  font-size:10px;
  font-weight:850;
  color:#49647f;
}
.daily-ca-card .metric-icon{
  background:linear-gradient(135deg,#e5f2ff,#d8ebff);
  color:#0878f9;
  box-shadow:inset 0 0 0 1px rgba(8,120,249,.08);
}
.daily-ca-value{
  font-size:28px!important;
  color:#0b2f5d;
  margin-top:6px!important;
}
.daily-ca-card .metric-foot{
  margin-top:3px;
  margin-bottom:12px;
}
.daily-ca-summary{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:9px;
}
.daily-ca-summary>div{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border:1px solid #e0eaf4;
  border-radius:9px;
  background:rgba(248,251,255,.88);
}
.daily-ca-summary span{
  color:#70849b;
  font-size:8.5px;
}
.daily-ca-summary strong{
  color:#193b60;
  font-size:9.5px;
  text-align:right;
}
.daily-pay-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}
.daily-pay-item{
  --pay:#5e7895;
  --pay-soft:#f3f6f9;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:47px;
  padding:8px 10px;
  border:1px solid #e2eaf2;
  border-radius:10px;
  background:linear-gradient(180deg,#fff,#fbfdff);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.daily-pay-item:hover{
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--pay) 28%,#e2eaf2);
  box-shadow:0 7px 16px rgba(29,68,111,.08);
}
.daily-pay-left{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.daily-pay-icon{
  width:27px;
  height:27px;
  flex:0 0 27px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:var(--pay-soft);
  color:var(--pay);
  font-size:10px;
  font-weight:950;
}
.daily-pay-left strong{
  display:block;
  color:#203b58;
  font-size:9px;
  line-height:1.15;
}
.daily-pay-left small{
  display:block;
  margin-top:2px;
  color:#8a9aab;
  font-size:7.5px;
}
.daily-pay-item>b{
  color:var(--pay);
  font-size:10px;
  white-space:nowrap;
}
.daily-pay-item.cash{--pay:#159767;--pay-soft:#e7f8f0}
.daily-pay-item.wave{--pay:#099ac7;--pay-soft:#e8f8fd}
.daily-pay-item.orange{--pay:#e87917;--pay-soft:#fff1e5}
.daily-pay-item.mtn{--pay:#a78500;--pay-soft:#fff8d8}
.daily-pay-item.card{--pay:#3f75d9;--pay-soft:#edf3ff}
.daily-pay-item.transfer{--pay:#7055c8;--pay-soft:#f1edff}
.daily-pay-item.credit{--pay:#d34c59;--pay-soft:#fff0f2}
.daily-pay-item.other{--pay:#64748b;--pay-soft:#f1f5f9}

.daily-ca-check{
  display:grid;
  grid-template-columns:1fr auto auto;
  align-items:center;
  gap:9px;
  margin-top:9px;
  padding:9px 10px;
  border-radius:9px;
  background:linear-gradient(135deg,#0d2f59,#123d70);
  color:#fff;
}
.daily-ca-check>span:first-child{
  color:#cbd9e8;
  font-size:8px;
}
.daily-ca-check>strong{
  font-size:11px;
}
.daily-ca-ok{
  padding:4px 7px;
  border-radius:999px;
  background:rgba(91,218,163,.15);
  color:#8ce1bd;
  font-size:7.5px;
  font-weight:850;
  white-space:nowrap;
}

body.dark-ui .daily-ca-card{
  background:
    linear-gradient(135deg,rgba(46,137,238,.10),rgba(16,29,47,0) 55%),
    #101d2f;
  border-color:#27415f;
}
body.dark-ui .daily-ca-value{color:#eef6ff}
body.dark-ui .daily-ca-card .metric-top small{color:#a9bdd2}
body.dark-ui .daily-ca-summary>div,
body.dark-ui .daily-pay-item{
  background:#132338;
  border-color:#273950;
}
body.dark-ui .daily-ca-summary strong,
body.dark-ui .daily-pay-left strong{color:#eef6ff}
body.dark-ui .daily-ca-summary span,
body.dark-ui .daily-pay-left small{color:#91a5bb}
body.dark-ui .daily-ca-check{
  background:linear-gradient(135deg,#0b2748,#0d355e);
}

@media(max-width:1180px){
  .daily-ca-card{grid-column:span 2}
}
@media(max-width:760px){
  .daily-ca-card{grid-column:1/-1}
}
@media(max-width:560px){
  .daily-pay-grid{grid-template-columns:1fr}
  .daily-ca-summary{grid-template-columns:1fr}
  .daily-ca-check{
    grid-template-columns:1fr auto;
  }
  .daily-ca-ok{
    grid-column:1/-1;
    justify-self:start;
  }
}
