:root{
  --ce-brand: #06FD62;
  --ce-bg: #ffffff;
  --ce-card: #ffffff;
  --ce-border: rgba(15, 23, 42, .10);
  --ce-text: rgba(15, 23, 42, .95);
  --ce-muted: rgba(15, 23, 42, .70);
  --ce-soft: rgba(15, 23, 42, .04);
  --ce-radius: 18px;
}

.ce-irpf-wrap{
  width: 100%;
  margin: 24px 0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color: var(--ce-text);
}

.ce-irpf-card{
  border: 1px solid var(--ce-border);
  background: var(--ce-card);
  border-radius: var(--ce-radius);
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.10);
}

.ce-irpf-header{
  padding: 22px;
  border-bottom: 1px solid var(--ce-border);
  background:
    radial-gradient(900px 260px at 15% 0%, rgba(6,253,98,.18), transparent 55%),
    radial-gradient(700px 260px at 85% 0%, rgba(0,0,0,.04), transparent 60%);
}

.ce-irpf-badge{
  display: inline-block;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  border: 1px solid rgba(6,253,98,.45);
  background: rgba(6,253,98,.18);
  color: rgba(15, 23, 42, .90);
}

.ce-irpf-title{
  margin: 10px 0 6px 0;
  font-size: 22px;
  line-height: 1.25;
}

.ce-irpf-subtitle{
  margin: 0;
  color: var(--ce-muted);
  font-size: 14px;
  line-height: 1.5;
  max-width: 78ch;
}

.ce-irpf-grid{
  display: grid;
  grid-template-columns: 1.05fr 1.45fr;
}

.ce-irpf-panel{
  padding: 18px 22px 22px 22px;
}

.ce-irpf-panel--form{
  border-right: 1px solid var(--ce-border);
  background: rgba(0,0,0,.01);
}

.ce-irpf-label{
  display: block;
  font-size: 13px;
  color: var(--ce-muted);
  margin: 14px 0 8px 0;
}

.ce-irpf-input,
.ce-irpf-select{
  width: 100%;
  height:auto;	
  border: 1px solid var(--ce-border);
  border-radius: 12px;
  padding: 12px 12px;
  outline: none;
  background: #fff;
  color: var(--ce-text);
  font-size: 15px;
}

.ce-irpf-input:focus,
.ce-irpf-select:focus{
  border-color: rgba(6,253,98,.75);
  box-shadow: 0 0 0 4px rgba(6,253,98,.20);
}

.ce-irpf-hint{
  margin-top: 14px;
  padding: 12px;
  border: 1px solid var(--ce-border);
  background: rgba(0,0,0,.02);
  border-radius: 14px;
  color: var(--ce-muted);
  font-size: 13px;
  line-height: 1.45;
}

.ce-irpf-hint ul{
  margin: 8px 0 6px 18px;
}

.ce-irpf-results{
  margin-top: 16px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.ce-irpf-kpi{
  border: 1px solid var(--ce-border);
  background: rgba(0,0,0,.015);
  border-radius: 14px;
  padding: 12px;
}

.ce-irpf-kpi--muted{
  grid-column: span 2;
  background: rgba(6,253,98,.08);
}

.ce-irpf-kpi__label{
  font-size: 12px;
  color: var(--ce-muted);
}

.ce-irpf-kpi__value{
  margin-top: 6px;
  font-size: 18px;
  font-weight: 800;
}

.ce-irpf-panel--charts{
  background: #fff;
}

.ce-irpf-chartbox{
  border: 1px solid var(--ce-border);
  background: rgba(0,0,0,.015);
  border-radius: 16px;
  padding: 14px;
  margin-bottom: 14px;
}

.ce-irpf-charttitle{
  font-size: 13px;
  color: var(--ce-muted);
  margin-bottom: 10px;
}

.ce-irpf-chartwrap{
  height: 190px; /* clave: Chart.js necesita altura real */
}

.ce-irpf-chartwrap canvas{
  width: 100% !important;
  height: 100% !important;
  display: block;
}

.ce-irpf-table{
  border: 1px solid var(--ce-border);
  background: rgba(0,0,0,.015);
  border-radius: 16px;
  padding: 14px;
}

.ce-irpf-table__title{
  font-size: 13px;
  color: var(--ce-muted);
  margin-bottom: 10px;
}

.ce-irpf-table__grid{
  display: grid;
  grid-template-columns: 70px 1fr 1fr;
  gap: 8px 10px;
  align-items: center;
}

.ce-irpf-th{
  font-size: 12px;
  color: rgba(15,23,42,.75);
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(15,23,42,.08);
}

.ce-irpf-td{
  font-size: 13px;
  color: var(--ce-text);
  padding: 8px 10px;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 12px;
  background: #fff;
}

/* Responsive */
@media (max-width: 980px){
  .ce-irpf-grid{ grid-template-columns: 1fr; }
  .ce-irpf-panel--form{ border-right: none; border-bottom: 1px solid var(--ce-border); }
}
/* Destacado verde para Coste final */
.ce-irpf-kpi--highlight{
  grid-column: span 2;
  background: rgba(6,253,98,.18);
  border-color: rgba(6,253,98,.45);
}

.ce-irpf-kpi__value--xl{
  font-size: 32px;
  line-height: 1.05;
  letter-spacing: -0.4px;
}
.ce-irpf-kpi--highlight{
  box-shadow: 0 10px 30px rgba(6,253,98,.18);
}