/* ==========================================================
   PLANNING BUDGET V1
   ========================================================== */

.bpv1-shell{
  margin:0 0 16px;
  padding:15px;

  border:1px solid rgba(148,163,184,.18);
  border-radius:17px;

  background:#fff;
}


.bpv1-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}


.bpv1-head>div>small{
  display:block;

  color:#2563eb;

  font-size:9px;
  font-weight:800;
  letter-spacing:.08em;
}


.bpv1-head h3{
  margin:3px 0 0;

  font-size:19px;

  color:#111827;
}


.bpv1-head p{
  max-width:720px;

  margin:5px 0 0;

  color:#64748b;

  font-size:10px;
  line-height:1.45;
}


#bpv1Refresh{
  padding:7px 10px;

  border:1px solid #dbeafe;
  border-radius:10px;

  background:#eff6ff;

  color:#2563eb;

  font:inherit;
  font-size:10px;
  font-weight:700;

  cursor:pointer;
}


.bpv1-metrics{
  display:grid;

  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:8px;

  margin-top:13px;
}


.bpv1-metrics article{
  padding:11px;

  border:1px solid #e5e7eb;
  border-radius:13px;

  background:#fafafa;
}


.bpv1-metrics span{
  display:block;

  color:#64748b;

  font-size:9px;
}


.bpv1-metrics strong{
  display:block;

  margin-top:3px;

  color:#111827;

  font-size:18px;
}


.bpv1-metrics small{
  display:block;

  margin-top:3px;

  color:#64748b;

  font-size:9px;
}


.bpv1-note{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:12px;

  margin-top:9px;
  padding:10px 11px;

  border-radius:11px;

  background:#f8fafc;
}


.bpv1-note strong{
  color:#111827;

  font-size:10px;
}


.bpv1-note span{
  color:#64748b;

  font-size:9px;

  text-align:right;
}


.bpv1-groups{
  display:grid;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:10px;

  margin-top:14px;
}


.bpv1-group{
  min-width:0;

  padding:11px;

  border:1px solid #e5e7eb;
  border-radius:13px;

  background:#fff;
}


.bpv1-group-head{
  display:flex;
  justify-content:space-between;

  gap:9px;

  padding-bottom:8px;
}


.bpv1-group-head h4{
  margin:0;

  color:#111827;

  font-size:12px;
}


.bpv1-group-head p{
  margin:3px 0 0;

  color:#64748b;

  font-size:8px;
  line-height:1.35;
}


.bpv1-group-head>span{
  display:flex;
  align-items:center;
  justify-content:center;

  min-width:25px;
  height:25px;

  padding:0 7px;

  border-radius:9px;

  background:#f1f5f9;

  color:#334155;

  font-size:9px;
  font-weight:800;
}


.bpv1-row{
  display:grid;

  grid-template-columns:
    28px
    minmax(0,1fr)
    auto;

  align-items:center;

  gap:7px;

  padding:8px 0;

  border-top:
    1px solid rgba(148,163,184,.13);
}


.bpv1-rank{
  display:flex;
  align-items:center;
  justify-content:center;

  width:27px;
  height:27px;

  border-radius:8px;

  background:#eff6ff;

  color:#2563eb;

  font-size:8px;
  font-weight:800;
}


.bpv1-product{
  min-width:0;
}


.bpv1-product strong{
  display:block;

  overflow:hidden;

  color:#111827;

  font-size:9px;

  text-overflow:ellipsis;
  white-space:nowrap;
}


.bpv1-product small{
  display:block;

  margin-top:2px;

  color:#64748b;

  font-size:7px;
}


.bpv1-action{
  text-align:right;
}


.bpv1-action b{
  display:block;

  color:#111827;

  font-size:9px;
}


.bpv1-action small{
  display:block;

  margin-top:2px;

  color:#64748b;

  font-size:7px;
}


.bpv1-empty,
.bpv1-more{
  padding:12px 2px;

  border-top:
    1px solid rgba(148,163,184,.13);

  color:#64748b;

  font-size:8px;
}


@media(max-width:950px){

  .bpv1-groups{
    grid-template-columns:1fr;
  }

}


@media(max-width:700px){

  .bpv1-metrics{
    grid-template-columns:
      1fr 1fr;
  }


  .bpv1-note{
    align-items:flex-start;

    flex-direction:column;
  }


  .bpv1-note span{
    text-align:left;
  }

}



/* ==========================================================
   PRESUPUESTO DARK V1
   ========================================================== */

#ppv1PlanningOverlay .bpv1-shell{
  background:#172235 !important;
  border-color:#334155 !important;
  color:#f8fafc !important;
}


#ppv1PlanningOverlay .bpv1-head h3,
#ppv1PlanningOverlay .bpv1-group-head h4{
  color:#f8fafc !important;
  -webkit-text-fill-color:#f8fafc !important;
}


#ppv1PlanningOverlay .bpv1-head p,
#ppv1PlanningOverlay .bpv1-metrics span,
#ppv1PlanningOverlay .bpv1-metrics small,
#ppv1PlanningOverlay .bpv1-note span,
#ppv1PlanningOverlay .bpv1-group-head p,
#ppv1PlanningOverlay .bpv1-row small,
#ppv1PlanningOverlay .bpv1-action small,
#ppv1PlanningOverlay .bpv1-empty,
#ppv1PlanningOverlay .bpv1-more{
  color:#94a3b8 !important;
  -webkit-text-fill-color:#94a3b8 !important;
}


#ppv1PlanningOverlay .bpv1-metrics article,
#ppv1PlanningOverlay .bpv1-note,
#ppv1PlanningOverlay .bpv1-group,
#ppv1PlanningOverlay .bpv1-row{
  background:#1b2738 !important;
  border-color:#334155 !important;
}


#ppv1PlanningOverlay .bpv1-metrics strong,
#ppv1PlanningOverlay .bpv1-note strong,
#ppv1PlanningOverlay .bpv1-row strong,
#ppv1PlanningOverlay .bpv1-action b{
  color:#f8fafc !important;
  -webkit-text-fill-color:#f8fafc !important;
}


#ppv1PlanningOverlay #bpv1Refresh{
  background:#1b2738 !important;
  border-color:#334155 !important;
  color:#e2e8f0 !important;
}


/* ==========================================================
   /PRESUPUESTO DARK V1
   ========================================================== */