.cpd-wrap {border:1px solid #e5e7eb; padding:16px; margin:16px 0; background:#fff;}
.cpd-title {margin:0 0 12px; font-size:18px; font-weight:600;}

.cpd-tabs {display:flex; gap:8px; margin-bottom:8px;}
.cpd-tab {border:1px solid #d1d5db; background:#f3f4f6; padding:6px 10px; cursor:pointer; border-radius:6px;}
.cpd-tab.is-active {background:#eef2ff; border-color:#6366f1;}

.cpd-designer {display:flex; gap:16px; align-items:flex-start;}
.cpd-left {flex:1; text-align:center;}
.cpd-right {width:320px;}
.cpd-canvas-wrap {position:relative;}
canvas {width:100%; height:auto; border:1px dashed #d1d5db; background:#f9fafb;}
.cpd-note {font-size:12px; color:#6b7280; margin:6px 0 0;}

.cpd-controls label {font-weight:600; display:block; margin-bottom:4px;}
.cpd-row {display:flex; align-items:center; gap:8px; margin:8px 0;}
.cpd-row input[type="text"]{flex:1;}
.cpd-actions {display:flex; gap:8px; margin-top:12px;}
.cpd-help {font-size:12px; color:#6b7280; margin-top:8px;}

.cpd-pricing-estimate {margin-top:12px; font-size:14px; background:#f9fafb; border:1px solid #e5e7eb; padding:10px; border-radius:6px;}
@media (max-width: 900px){
  .cpd-designer {flex-direction:column;}
  .cpd-right {width:100%;}
}
.cpd-tab:hover {
 background: var(--cpd-accent-weak); border-color: var(--cpd-accent);   
}


/* === THEME OVERRIDES (setează-ți paleta aici) === */
:root {
  --cpd-bg: #0f1115;           /* fundal panou */
  --cpd-border: #2a2e35;       /* borduri */
  --cpd-text: #e8eaed;         /* text principal */
  --cpd-accent: #ff3b30;       /* accent/butoane */
  --cpd-accent-weak: rgba(255,59,48,.12);
  --cpd-card: #1A1A1A;         /* suprafețe */
}

/* fundal + borduri */
.cpd-wrap { background: var(--cpd-card); border-color: var(--cpd-border); }
canvas { background: #0f1115; border-color: var(--cpd-border); }
.cpd-note, .cpd-help, .cpd-title, .cpd-controls label { color: var(--cpd-text); }

/* tab-uri */
.cpd-tab { background: #15181d; border-color: var(--cpd-border); color: var(--cpd-text); }
.cpd-tab.is-active { background: var(--cpd-accent-weak); border-color: var(--cpd-accent); }

/* inputuri */
.cpd-row input[type="text"],
.cpd-row input[type="color"],
.cpd-row input[type="range"],
.cpd-row input[type="file"],
.cpd-row select {
  background: #14171b;
  color: var(--cpd-text);
  border: 1px solid var(--cpd-border);
  border-radius: 10px;
  padding: 8px;
}

/* butoane */
.cpd-actions .button,
#cpd-add-text {
  background: var(--cpd-accent);
  color: #fff;
  border: 1px solid var(--cpd-accent);
  border-radius: 10px;
  font-weight: 700;
}
.cpd-actions .button:hover,
#cpd-add-text:hover {
  filter: brightness(0.95);
}

/* outline buttons (ex: Reset, Download dacă le vrei „secundare”) */
#cpd-reset, #cpd-download {
  background: transparent;
  color: var(--cpd-text);
  border: 1px solid var(--cpd-border);
}
#cpd-reset:hover, #cpd-download:hover {
  border-color: var(--cpd-accent);
  background: var(--cpd-accent-weak);
  color: #fff;
}

/* caseta de estimare cost */
.cpd-pricing-estimate {
  background: #121519;
  color: var(--cpd-text);
  border: 1px solid var(--cpd-border);
  border-radius: 10px;
}



.artup-btn.cpd-loading,
.single_add_to_cart_button.cpd-loading{
  opacity:.7; pointer-events:none;
}
.artup-btn.cpd-loading i,
.single_add_to_cart_button.cpd-loading i{ margin-right:.5rem; }