/* assets/css/handpainted-style.css
   PC Handpainted Shop - Styles (phand- prefix)
   - Sidebar + grid layout, dual-range slider, cards, buttons
   - Uses !important in places to avoid theme overrides
*/

/* Container */
.phand-wrapper {
  max-width: 1400px !important;
  margin: 0 auto !important;
  display: flex !important;
  gap: 40px !important;
  padding: 40px 20px !important;
  box-sizing: border-box !important;
  align-items: flex-start !important;
  font-family: "Poppins", sans-serif !important;
  color: #222 !important;
}

/* Sidebar */
.phand-sidebar {
  width: 320px !important;
  background: #fff !important;
  border: 1px solid #e8e8e8 !important;
  padding: 22px !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.04) !important;
  position: sticky !important;
  top: 100px !important;
  flex-shrink: 0 !important;
}
.phand-sidebar .phand-sidebar-title {
  font-size: 20px !important;
  margin: 0 0 16px 0 !important;
  color: #4b2a26 !important;
  font-weight: 600 !important;
}

/* Section toggle */
.phand-section { border-top:1px solid #eee !important; padding:14px 0 !important; }
.phand-section:first-child { border-top:none !important; padding-top:0 !important; }
.phand-section-head {
  font-size:16px !important;
  font-weight:600 !important;
  color:#6b3a34 !important;
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  cursor:pointer !important;
  margin:0 !important;
  padding:8px 0 !important;
}
.phand-section-head::after { content: "+" !important; font-weight:700 !important; }
.phand-section.open .phand-section-head::after { content: "-" !important; }

/* Section content */
.phand-content { display:none !important; margin-top:8px !important; }
.phand-section.open .phand-content { display:block !important; }

/* Checkbox list */
.phand-content label { display:block !important; font-size:14px !important; color:#333 !important; margin-bottom:8px !important; cursor:pointer !important; }
.phand-content input[type="checkbox"] { accent-color:#8b2a20 !important; margin-right:8px !important; }

/* Buttons */
.phand-btn { background:#8b2a20 !important; color:#fff !important; border:0 !important; padding:10px 14px !important; border-radius:8px !important; cursor:pointer !important; font-weight:700 !important; }
.phand-btn[disabled] { opacity:0.6 !important; cursor:not-allowed !important; }
.phand-btn-ghost { background:#fff !important; color:#8b2a20 !important; border:1px solid #8b2a20 !important; }
.phand-actions { display:flex !important; gap:12px !important; margin-top:16px !important; }

/* Price slider (dual-thumb) */
.phand-price-values { display:flex !important; justify-content:space-between !important; font-weight:600 !important; color:#6b3a34 !important; margin-bottom:8px !important; }
.phand-price-slider { position:relative !important; height:54px !important; margin-top:6px !important; }
.phand-track { position:absolute !important; left:0 !important; right:0 !important; top:28px !important; height:6px !important; background:#e4c6bf !important; border-radius:4px !important; z-index:1 !important; }
.phand-track-active { position:absolute !important; top:28px !important; height:6px !important; background:#8b2a20 !important; border-radius:4px !important; z-index:2 !important; }
.phand-price-slider input[type="range"] { position:absolute !important; left:0 !important; width:100% !important; top:27px !important; height:6px !important; background:none !important; pointer-events:none !important; -webkit-appearance:none !important; z-index:3 !important; }
.phand-price-slider input[type="range"]::-webkit-slider-thumb { -webkit-appearance:none !important; width:18px !important; height:18px !important; border-radius:50% !important; background:#8b2a20 !important; border:2px solid #fff !important; pointer-events:auto !important; cursor:pointer !important; box-shadow:0 2px 6px rgba(0,0,0,0.2) !important; }
.phand-price-slider input[type="range"]::-moz-range-thumb { width:18px !important; height:18px !important; border-radius:50% !important; background:#8b2a20 !important; border:2px solid #fff !important; cursor:pointer !important; }

/* Main area */
.phand-main { flex:1 !important; box-sizing:border-box !important; }

/* Topbar */
.phand-topbar { display:flex !important; justify-content:space-between !important; align-items:center !important; margin-bottom:12px !important; }
.phand-title-large { font-family: "Cormorant Garamond", serif !important; font-weight:600 !important; font-size:28px !important; color:#6b3a34 !important; }

/* Grid (3 columns) */
.phand-grid { display:grid !important; grid-template-columns: repeat(3, 1fr) !important; gap:32px !important; justify-items:center !important; align-items:start !important; box-sizing:border-box !important; }

/* Card */
.phand-card { width:100% !important; max-width:320px !important; border-radius:10px !important; overflow:hidden !important; background:#fff !important; box-shadow:0 4px 12px rgba(0,0,0,0.06) !important; transition:transform .18s ease, box-shadow .18s ease !important; display:flex !important; flex-direction:column !important; }
.phand-card:hover { transform:translateY(-4px) !important; box-shadow:0 8px 24px rgba(0,0,0,0.08) !important; }

.phand-thumb { width:100% !important; height:357px !important; overflow:hidden !important; display:block !important; background:#f9f9f9 !important; }
.phand-thumb img { width:100% !important; height:100% !important; object-fit:cover !important; display:block !important; }

/* Card body */
.phand-card-body { padding:12px !important; text-align:center !important; flex:1 0 auto !important; display:flex !important; flex-direction:column !important; justify-content:space-between !important; box-sizing:border-box !important; }
.phand-card-title { font-size:14px !important; margin:0 0 10px 0 !important; color:#222 !important; font-weight:600 !important; line-height:1.35 !important; min-height:40px !important; }
.phand-card-price { color:#8b2a20 !important; font-weight:700 !important; margin-bottom:12px !important; font-size:15px !important; }

/* Buttons row */
.phand-card-actions { display:flex !important; gap:8px !important; justify-content:center !important; margin-top:8px !important; }
.phand-btn.phand-add-to-cart, .phand-btn.phand-buy-now { padding:9px 12px !important; border-radius:8px !important; font-weight:700 !important; background:#8b2a20 !important; color:#fff !important; border:0 !important; }
.phand-btn.phand-add-to-cart:hover, .phand-btn.phand-buy-now:hover { background:#6f241d !important; transform:translateY(-2px) !important; box-shadow: 0 8px 20px rgba(111,36,29,0.12) !important; }

/* Empty / Loading */
.phand-empty { padding:28px !important; text-align:center !important; color:#777 !important; }
.phand-grid.phand-loading { opacity:0.6 !important; pointer-events:none !important; }

/* Responsive */
@media (max-width:1200px) {
  .phand-wrapper { flex-direction:column !important; padding:28px 16px !important; }
  .phand-sidebar { width:100% !important; position:relative !important; top:auto !important; margin-bottom:18px !important; }
  .phand-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width:700px) {
  .phand-grid { grid-template-columns: 1fr !important; gap:20px !important; }
  .phand-thumb { height:340px !important; }
}