.pcc{
  --pcc-bg:#fff;
  --pcc-border:#e5e7eb;
  --pcc-muted:#6b7280;
  --pcc-text:#111827;
  --pcc-primary:#2563eb;
  --pcc-danger:#dc2626;
  background:var(--pcc-bg);
  border:1px solid var(--pcc-border);
  border-radius:12px;
  padding:16px;
  color:var(--pcc-text);
}

.pcc *{box-sizing:border-box;}

.pcc-header{
  display:flex;
  gap:12px;
  align-items:flex-start;
  justify-content:space-between;
  flex-wrap:wrap;
}

.pcc-title h3{margin:0 0 6px; font-size:18px;}
.pcc-title p{margin:0; color:var(--pcc-muted); font-size:13px;}

.pcc-toolbar,
.pcc-add-row{
  margin-top:14px;
  display:flex;
  gap:12px;
  align-items:flex-end;
  flex-wrap:wrap;
}

.pcc-field{display:flex; flex-direction:column; gap:6px; min-width: 160px;}
.pcc-field span{font-size:12px; color:var(--pcc-muted);}

.pcc-field input,
.pcc-field select{
  border:1px solid var(--pcc-border);
  border-radius:10px;
  padding:10px 12px;
  font-size:14px;
  background:#fff;
  min-height: 40px;
}

.pcc-actions{display:flex; gap:8px; align-items:center;}

.pcc-btn{
  border:1px solid var(--pcc-primary);
  background:var(--pcc-primary);
  color:#fff;
  padding:10px 12px;
  border-radius:10px;
  cursor:pointer;
  font-size:14px;
  line-height:1;
}

.pcc-btn:hover{filter:brightness(0.95);}

.pcc-btn-secondary{
  background:#fff;
  color:var(--pcc-primary);
}

.pcc-btn-danger{
  border-color: var(--pcc-danger);
  background: var(--pcc-danger);
}

.pcc-btn-link{
  background:transparent;
  border:0;
  color:var(--pcc-danger);
  cursor:pointer;
  padding:6px 8px;
}

.pcc-saves{display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap;}

.pcc-table-wrap{margin-top: 14px; overflow:auto; border:1px solid var(--pcc-border); border-radius:12px;}

.pcc-table{width:100%; border-collapse:collapse; min-width: 860px;}
.pcc-table th,
.pcc-table td{border-bottom:1px solid var(--pcc-border); padding:10px 12px; vertical-align:middle;}
.pcc-table th{background:#f9fafb; font-size:12px; color:#374151; text-align:left;}
.pcc-num{text-align:right; font-variant-numeric: tabular-nums;}

.pcc-table input{
  width: 140px;
  max-width: 100%;
  padding:8px 10px;
  border:1px solid var(--pcc-border);
  border-radius:10px;
}

.pcc-input-group{
  display:flex;
  align-items:center;
  gap:8px;
}

.pcc-input-group-right{justify-content:flex-end;}

.pcc-prefix,
.pcc-suffix{
  font-size:12px;
  color:var(--pcc-muted);
  white-space:nowrap;
}

.pcc-help{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:16px;
  height:16px;
  border:1px solid var(--pcc-border);
  border-radius:999px;
  font-size:11px;
  color:var(--pcc-muted);
  margin-left:6px;
  position:relative;
  cursor:help;
  user-select:none;
  background:#fff;
  line-height:1;
}

.pcc-help:focus{
  outline:2px solid rgba(37, 99, 235, 0.35);
  outline-offset:2px;
}

.pcc-help::before{
  content:'';
  position:absolute;
  left:50%;
  top: calc(100% + 2px);
  transform: translateX(-50%);
  border:6px solid transparent;
  border-bottom-color:#111827;
  opacity:0;
  pointer-events:none;
  transition: opacity 0.12s ease;
  z-index: 21;
}

.pcc-help::after{
  content: attr(data-tooltip);
  position:absolute;
  left:50%;
  top: calc(100% + 8px);
  transform: translateX(-50%);
  width:max-content;
  max-width: 280px;
  padding:8px 10px;
  background:#111827;
  color:#fff;
  border-radius:10px;
  font-size:12px;
  line-height:1.2;
  opacity:0;
  pointer-events:none;
  transition: opacity 0.12s ease;
  z-index: 20;
}

.pcc-help:hover::after,
.pcc-help:focus::after{opacity:1;}

.pcc-help:hover::before,
.pcc-help:focus::before{opacity:1;}

.pcc-custom{
  margin-top: 10px;
  border:1px dashed var(--pcc-border);
  border-radius:12px;
  padding:12px;
  background:#fbfbfc;
}

.pcc-custom-grid{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.pcc-custom-actions{margin-top:10px;}

.pcc-muted{font-size: 11px; color: var(--pcc-muted); margin-top:2px;}

.pcc-summary{
  margin-top: 14px;
  border:1px solid var(--pcc-border);
  border-radius:12px;
  padding: 12px;
  max-width: 420px;
  margin-left:auto;
}

.pcc-summary-row{display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid #f3f4f6;}
.pcc-summary-row:last-child{border-bottom:0;}
.pcc-summary-final strong{font-size: 18px;}