/* ================================================
   PRIKAZNA DISPLAY — Grid & Slider Shortcodes
   ================================================ */
.pcd-wrap { width:100%; box-sizing:border-box; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
.pcd-wrap * { box-sizing:border-box; }

/* HEADER */
.pcd-header { text-align:center; margin-bottom:32px; }
.pcd-heading { font-size:28px; font-weight:700; margin:0 0 8px; }
.pcd-subheading { font-size:16px; color:#9b8478; margin:0; }
.pcd-theme-dark .pcd-subheading { color:#a08888; }

/* GRID */
.pcd-grid { display:grid; gap:24px; }
.pcd-cols-1 { grid-template-columns:1fr; }
.pcd-cols-2 { grid-template-columns:repeat(2,1fr); }
.pcd-cols-3 { grid-template-columns:repeat(3,1fr); }
.pcd-cols-4 { grid-template-columns:repeat(4,1fr); }

/* CARD */
.pcd-card {
  background:#fff;
  border:1px solid #e8d8cc;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:transform .2s,box-shadow .2s;
}
.pcd-card:hover { transform:translateY(-4px); box-shadow:0 14px 40px rgba(0,0,0,.12); }
.pcd-theme-dark .pcd-card { background:#1a1118; border-color:#2e1a22; }
.pcd-theme-dark .pcd-card:hover { box-shadow:0 14px 40px rgba(0,0,0,.45); }

/* IMAGE */
.pcd-img {
  background-size:cover;
  background-position:center;
  position:relative;
  flex-shrink:0;
}
.pcd-img-placeholder {
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:48px;
  position:relative;
  flex-shrink:0;
  opacity:.7;
}
.pcd-badge {
  position:absolute;
  top:12px; left:12px;
  color:#fff;
  font-size:11px;
  font-weight:700;
  padding:4px 12px;
  border-radius:20px;
}
.pcd-type {
  position:absolute;
  bottom:12px; left:12px;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:11px;
  font-weight:600;
  padding:4px 10px;
  border-radius:20px;
  backdrop-filter:blur(4px);
}

/* BODY */
.pcd-body { padding:18px 20px 22px; display:flex; flex-direction:column; gap:7px; flex:1; }
.pcd-stars { display:flex; gap:2px; font-size:14px; }
.pcd-title { font-size:16px; font-weight:700; margin:0; line-height:1.4; color:#2c1a14; }
.pcd-theme-dark .pcd-title { color:#f5f0e8; }
.pcd-meta { font-size:12.5px; color:#9b8478; margin:0; }
.pcd-theme-dark .pcd-meta { color:#a08888; }
.pcd-desc { font-size:13.5px; color:#6b5040; line-height:1.6; margin:0; }
.pcd-theme-dark .pcd-desc { color:#c0a898; }
.pcd-price { font-size:16px; margin:4px 0 0; }
.pcd-btn {
  display:inline-block;
  color:#fff !important;
  padding:10px 22px;
  border-radius:30px;
  font-size:13px;
  font-weight:600;
  text-decoration:none !important;
  margin-top:auto;
  padding-top:12px;
  transition:all .18s;
  box-shadow:0 3px 12px rgba(0,0,0,.14);
  align-self:flex-start;
}
.pcd-btn:hover { opacity:.88; transform:translateY(-1px); }
.pcd-empty { text-align:center; padding:60px 20px; color:#9b8478; font-size:15px; }

/* SLIDER */
.pcd-slider-outer {
  position:relative;
  display:flex;
  align-items:center;
  gap:16px;
}
.pcd-slider-viewport {
  overflow:hidden;
  flex:1;
  border-radius:4px;
}
.pcd-slider-track {
  display:flex;
  gap:24px;
  transition:transform .4s cubic-bezier(.22,1,.36,1);
  will-change:transform;
}
.pcd-slide {
  flex-shrink:0;
}
.pcd-arrow {
  width:52px;
  height:52px;
  border-radius:50%;
  border:2px solid currentColor;
  background: rgba(255,255,255,0.92);
  font-size:26px;
  font-weight:400;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all .22s cubic-bezier(.22,1,.36,1);
  flex-shrink:0;
  line-height:1;
  box-shadow:0 4px 20px rgba(0,0,0,.15);
  padding:0;
}
.pcd-arrow:hover {
  transform:scale(1.10);
  box-shadow:0 6px 28px rgba(0,0,0,.22);
}

/* LIGHT theme arrows — rose */
.pcd-theme-light .pcd-arrow {
  color:#8b3a52;
  background:#fff;
  border-color:#8b3a52;
}
.pcd-theme-light .pcd-arrow:hover {
  background:#8b3a52;
  color:#fff !important;
  border-color:#8b3a52;
}

/* DARK theme arrows — gold, dark bg */
.pcd-theme-dark .pcd-arrow {
  color:#c9922a;
  background:rgba(26,17,24,0.92);
  border-color:#c9922a;
}
.pcd-theme-dark .pcd-arrow:hover {
  background:#c9922a;
  color:#1a1118 !important;
  border-color:#c9922a;
  box-shadow:0 6px 28px rgba(201,146,42,.35);
}
.pcd-dots { display:none !important; }
.pcd-dot  { display:none !important; }

/* RESPONSIVE */
@media(max-width:900px){
  .pcd-cols-3,.pcd-cols-4 { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:600px){
  .pcd-cols-2,.pcd-cols-3,.pcd-cols-4 { grid-template-columns:1fr; }
  .pcd-heading { font-size:22px; }
}

/* ADMIN Display Manager */
.dpm-preset-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
}
.dpm-preset-header h3 { margin:0; font-size:15px; }
.dpm-shortcode {
  font-family:monospace;
  font-size:12px;
  background:var(--fa-pl);
  color:var(--fa-primary);
  padding:4px 10px;
  border-radius:6px;
}

/* PRICE formatting */
.pcd-price strong { font-weight:700; font-size:18px; }
.pcd-price s { text-decoration:line-through; opacity:.5; font-size:14px; margin-right:4px; }

/* Better dots */
.pcd-dot { transition:all .25s; }
.pcd-dot:hover { opacity:.8; }

/* DARK theme card btn */
.pcd-theme-dark .pcd-btn {
  box-shadow:0 3px 14px rgba(201,146,42,.25);
}
.pcd-theme-dark .pcd-btn:hover {
  box-shadow:0 5px 22px rgba(201,146,42,.40);
}

/* ================================================================
   MOBILE RESPONSIVE — Slider & Grid
================================================================ */
@media (max-width: 768px) {
  /* Grid: 3 cols → 1 col on mobile */
  .pcd-cols-2,
  .pcd-cols-3,
  .pcd-cols-4 {
    grid-template-columns: 1fr !important;
    gap: 16px;
  }

  /* Slider: force 1 card visible */
  .pcd-slider-outer {
    gap: 8px;
  }
  .pcd-arrow {
    width: 36px;
    height: 36px;
    font-size: 20px;
    flex-shrink: 0;
  }
  .pcd-slide {
    /* JS sets width — override via data-cols=1 on mobile */
  }
  .pcd-card-img { height: 180px !important; }
  .pcd-body { padding: 14px 16px 18px; gap: 6px; }
  .pcd-title { font-size: 15px; }
  .pcd-heading { font-size: 22px; }
  .pcd-subheading { font-size: 14px; }
}

@media (max-width: 480px) {
  .pcd-arrow { width: 32px; height: 32px; font-size: 18px; }
  .pcd-card-img { height: 160px !important; }
}