
.ep-wrap{display:flex; flex-direction:column; width:95vw; height:90vh; border:1px solid #e6e6e6; border-radius:14px; overflow:hidden; background:#fff; position:relative}
.ep-main{display:flex; flex:1 1 auto; min-height:0;}
.ep-leftbar{position:absolute; left:12px; top:12px; z-index:60; width:auto; background:transparent; border:0; display:flex; flex-direction:column; align-items:flex-start; gap:10px; padding:0}
/* Smaller left icons (requested) */
.ep-iconbtn{width:48px; height:48px; border-radius:14px; border:1px solid #ddd; background:#fff; cursor:pointer; font-size:22px; line-height:1; box-shadow:0 10px 24px rgba(0,0,0,.10)}
.ep-iconbtn.danger{border-color:#ffb3b3}

/* Save / My designs moved under reset */
.ep-leftbar-actions{display:flex; flex-direction:column; gap:6px; width:160px;}
.ep-canvas-area{flex:1 1 auto; position:relative; background:#f7f7fb; min-height:0; overflow:hidden}
.ep-canvas-stage{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; z-index:0}
.ep-editor{width:80%; height:80%; background:#fff; border-radius:16px; box-shadow:0 8px 30px rgba(0,0,0,.08)}
.ep-bottom-left{position:absolute; left:12px; bottom:12px; z-index:10}
.ep-help{border:1px solid #ddd; background:#fff; border-radius:999px; padding:10px 14px; cursor:pointer}
.ep-price{background:#fff; border:1px solid #eee; border-radius:16px; padding:14px; box-shadow:0 10px 24px rgba(0,0,0,.08)}
.ep-bottom-bar{border-top:1px solid #eee; background:#fff; padding:8px 10px;}
.ep-price-full{width:100%; max-width:none; box-shadow:none;}

/* Bottom layout (requested) */
.ep-bottom-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
  align-items:stretch;
}
.ep-bottom-row{display:flex; align-items:center; gap:14px; flex-wrap:wrap;}
.ep-bat-label{font-size:12px; line-height:1.2;}
.ep-bottom-right{display:flex; flex-direction:column; gap:6px; align-items:stretch;}

.ep-save,.ep-my-designs{width:100%; padding:9px 10px; border-radius:12px; border:1px solid #ddd; background:#fff; cursor:pointer; font-weight:700}
.ep-my-designs{font-weight:700}

.ep-qty-row{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.ep-qty-label{color:#666; font-size:12px; font-weight:700;}
.ep-qty-input{width:110px; padding:6px 8px; border:1px solid #ddd; border-radius:10px; font-size:14px}

.ep-pricebox{border:1px solid #eee; border-radius:12px; padding:8px 10px; background:#fafafa;}
.ep-price-line{display:flex; align-items:baseline; justify-content:space-between; gap:10px; font-size:12px;}
.ep-price-line strong{font-size:13px;}
.ep-discount-line strong{color:#111;}
.ep-total-line strong{font-size:14px;}

/* Bulk (quantity) discount table */
.ep-bulk-wrap{margin-top:8px; border:1px solid #eee; border-radius:12px; background:#fff; overflow:hidden;}
.ep-bulk-title{padding:8px 10px; font-weight:800; font-size:12px; border-bottom:1px solid #f0f0f0; background:#fafafa;}
.ep-bulk-table{width:100%; border-collapse:collapse; font-size:11px;}
.ep-bulk-table th,.ep-bulk-table td{padding:7px 10px; border-bottom:1px solid #f5f5f5; text-align:left;}
.ep-bulk-table th{color:#666; font-weight:800;}
.ep-bulk-table tr:last-child td{border-bottom:0;}
.ep-bulk-table tr.ep-bulk-active td{background:#f6f3ff;}
.ep-bulk-table td:last-child{text-align:right; font-weight:800;}

/* --- Bulk discount table: compact + placed under the plugin (requested) --- */
.ep-bulk-below{padding:10px 0 2px; display:flex; justify-content:center;}
.ep-bulk-below .ep-bulk-wrap{margin-top:0; width:100%; max-width:380px; border-radius:10px;}
.ep-bulk-below .ep-bulk-title{padding:6px 8px; font-size:11px;}
.ep-bulk-below .ep-bulk-table{font-size:10px;}
.ep-bulk-below .ep-bulk-table th,.ep-bulk-below .ep-bulk-table td{padding:5px 8px;}

.ep-add-to-cart,.ep-update-cart{width:100%; padding:10px; border:0; border-radius:12px; cursor:pointer; color:#fff; background:var(--ep-accent,#7c4dff); font-weight:800}

@media (max-width: 980px){
  .ep-bottom-grid{grid-template-columns: 1fr;}
}

/* --- Cart: links shown inside Woo item data (theme-proof) --- */
.ep-cart-action{
  display:inline-block;
  padding:6px 10px;
  border-radius:10px;
  text-decoration:none !important;
  font-weight:700;
}
.ep-cart-preview{ background:#0b5fff; color:#fff !important; }
.ep-cart-edit{ background:#111; color:#fff !important; }

/* Right panel: even more compact to reduce scrolling */
.ep-rightbar{
  width:420px;
  background:#fff;
  border-left:1px solid #eee;
  position:relative;
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:0;
  font-size:11px;
}

/* Accordion: one open at a time, body scrolls inside the open block */
.ep-accordion{display:flex; flex-direction:column; height:100%; min-height:0;}
.ep-acc-item{border-bottom:1px solid #f0f0f0; display:flex; flex-direction:column; flex:0 0 auto;}
.ep-acc-item.active{flex:1 1 auto; min-height:0;}
.ep-acc-head{
  padding:12px 14px;
  background:#fff;
  border:0;
  text-align:left;
  font-weight:800;
  cursor:pointer;
  user-select:none;
  font-size:13px;
}
.ep-acc-item.active .ep-acc-head{background:#f6f3ff;}
.ep-acc-body{display:none; padding:12px 14px 14px; overflow:auto; min-height:0;}
.ep-acc-item.active .ep-acc-body{display:block; flex:1 1 auto;}

/* Black scrollbar inside blocks (more visible) */
.ep-acc-body{scrollbar-width:thin; scrollbar-color:#000 #e6e6e6;}
.ep-acc-body::-webkit-scrollbar{width:12px;}
.ep-acc-body::-webkit-scrollbar-track{background:#e6e6e6;}
.ep-acc-body::-webkit-scrollbar-thumb{background:#000; border-radius:999px; border:2px solid #e6e6e6;}
.ep-acc-body::-webkit-scrollbar-thumb:hover{background:#111;}
.ep-field{margin:10px 0}
.ep-field label{display:block; font-size:10px; color:#666; margin-bottom:5px}
.ep-select, .ep-fonts{width:100%; padding:8px; border:1px solid #ddd; border-radius:12px; font-size:12px}
.ep-dim{width:100%; padding:8px; border:1px solid #ddd; border-radius:12px; font-size:12px}
.ep-swatches{display:flex; flex-wrap:wrap; gap:10px}
.ep-swatch{width:26px; height:26px; border-radius:999px; border:1px solid rgba(0,0,0,.15); cursor:pointer}
.ep-muted{color:#777; font-size:10px}
.ep-check{display:block; margin-top:10px}
.ep-file{width:100%}
.ep-add-text{margin-top:10px; width:100%; padding:10px; border-radius:12px; border:0; background:var(--ep-accent,#7c4dff); color:#fff; font-weight:700; cursor:pointer}

.ep-modal{position:absolute; inset:0; background:rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center; z-index:50}
.ep-modal-card{width:min(760px,90vw); max-height:80vh; background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.25)}
.ep-modal-head{display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid #eee}
.ep-modal-body{padding:14px; overflow:auto; max-height:70vh}
.ep-modal-close{border:1px solid #ddd; background:#fff; border-radius:10px; padding:6px 10px; cursor:pointer}

.ep-cart-thumb{width:56px; height:56px; object-fit:cover; border-radius:10px}
.ep-cart-edit{margin-top:8px}

/* Range sliders: black track + red thumb */
input[type=range]{-webkit-appearance:none; width:100%; height:28px; background:transparent}
input[type=range]::-webkit-slider-runnable-track{height:6px; background:#000; border-radius:999px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:18px; height:18px; background:#d00; border-radius:50%; margin-top:-6px; cursor:pointer}
input[type=range]::-moz-range-track{height:6px; background:#000; border-radius:999px}
input[type=range]::-moz-range-thumb{width:18px; height:18px; background:#d00; border-radius:50%; border:0; cursor:pointer}

/* Cart edit overlay */
.ep-cart-editor-overlay{position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:9999; padding:18px; display:flex; align-items:center; justify-content:center}
.ep-cart-editor-overlay .ep-wrap{width:95vw; height:95vh}


/* ===== UI Harmonisation (v1.0.4) ===== */
:root{
  --ep-violet:#3b1b6e;
  --ep-violet-2:#5622a6;
  --ep-white:#ffffff;
  --ep-radius:14px;
}

.ep-wrap button,
.ep-wrap .button,
.woocommerce-cart .ep-edit-btn,
.woocommerce-cart .ep-cancel-edit{
  background: var(--ep-violet);
  color: var(--ep-white) !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  font-weight: 700 !important;
  line-height: 1.1;
  cursor: pointer;
  transition: transform .05s ease, opacity .15s ease;
}
.ep-wrap button:hover,
.ep-wrap .button:hover,
.woocommerce-cart .ep-edit-btn:hover,
.woocommerce-cart .ep-cancel-edit:hover{
  opacity:.92;
}
.ep-wrap button:active,
.ep-wrap .button:active{
  transform: translateY(1px);
}
.ep-wrap button[disabled]{
  opacity:.6; cursor:not-allowed;
}

/* Block titles (inside accordion bodies) */
.ep-acc-body > h3{
  background: var(--ep-violet);
  color: var(--ep-white);
  font-weight: 800;
  padding: 10px 12px;
  border-radius: 12px;
  margin: 0 0 10px 0;
}

/* Make action icons easier to click (trash/up/down already enlarged in JS) */


/* --- Right panel blocks (accordion: 1 open at a time) --- */
.ep-accordion{display:flex; flex-direction:column; height:100%; min-height:0; padding:12px; gap:10px;}
.ep-acc-item{display:flex; flex-direction:column; flex:0 0 auto; border:1px solid #eee; border-radius:16px; overflow:hidden; background:#fff; min-height:0;}
.ep-acc-item.active{flex:1 1 auto;}
.ep-acc-head{width:100%; text-align:left; border:0; background:#111; color:#fff; font-weight:800; padding:12px 14px; cursor:pointer;}
.ep-acc-body{display:none; padding:12px 14px; flex:1 1 auto; min-height:0; overflow:auto; scrollbar-gutter: stable;}
.ep-acc-item.active .ep-acc-body{display:block;}

/* Black, visible scrollbar inside the opened block */
.ep-acc-body{scrollbar-width:thin; scrollbar-color:#000 rgba(0,0,0,.08);}
.ep-acc-body::-webkit-scrollbar{width:12px;}
.ep-acc-body::-webkit-scrollbar-thumb{background:#000; border-radius:999px;}
.ep-acc-body::-webkit-scrollbar-track{background:rgba(0,0,0,.08); border-radius:999px;}

/* ===== Compact right panel (v1.1.4) ===== */
.ep-rightbar{font-size:11px; width:380px;}
.ep-acc-head{font-size:11px; padding:8px 10px !important;}
.ep-acc-body{font-size:11px; padding:8px 10px 10px;}
.ep-acc-body > h3{padding:7px 9px; margin:0 0 8px 0; font-size:11px;}
.ep-field{margin:6px 0;}
.ep-field label{font-size:9.5px; margin-bottom:4px;}
.ep-select, .ep-fonts, .ep-dim{padding:6px 8px; border-radius:10px; font-size:11px;}
.ep-muted{font-size:9.5px;}
.ep-add-text{padding:9px 10px !important; border-radius:10px;}
.ep-swatch{width:22px; height:22px;}


/* --- Font picker (hover preview) --- */
.ep-fontpicker{position:relative; width:100%;}
.ep-fontpicker-btn{
  width:100%;
  text-align:left;
  padding:6px 8px;
  border:1px solid #ddd;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  font-size:11px;
}
.ep-fontpicker-list{
  position:absolute;
  left:0; right:0;
  top:calc(100% + 6px);
  max-height:240px;
  overflow:auto;
  border:1px solid #ddd;
  border-radius:12px;
  background:#fff;
  z-index:50;
  box-shadow:0 10px 30px rgba(0,0,0,0.12);
}
.ep-fontpicker-item{
  padding:8px 10px;
  cursor:pointer;
  font-size:14px;
  line-height:1.2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.ep-fontpicker-name{flex:0 0 auto;}
.ep-fontpicker-sample{flex:1 1 auto; text-align:right; font-size:22px; line-height:1;}
.ep-fontpicker-item:hover{background:rgba(124,77,255,0.10);}
