/* =========================================
   WP Generic Carousel (scoped reset + base)
   ========================================= */

.wpgc,
.wpgc * ,
.wpgc *::before,
.wpgc *::after {
  box-sizing: border-box;
}

.wpgc {
  /* design tokens */
  --wpgc-pad: 4px;
  --wpgc-gap: 16px;
  --wpgc-max: 1200px;
  --wpgc-radius: 14px;
  --wpgc-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  --wpgc-primary: #2563eb;
  --wpgc-title: #111827;
  --wpgc-meta: #6b7280;
  --wpgc-surface: #ffffff;
  --wpgc-muted-bg: #f3f4f6;
  --wpgc-dot: #09264b;
  --wpgc-progress-bg: #3d1616;

  position: relative;
  width: 100%;
  min-width: 0;
  box-shadow:none;
}

/* layout modes */
.wpgc--boxed {
  max-width: var(--wpgc-max);
  margin-inline: auto;
  border:none;
}

.wpgc--full {
  max-width: 100%;
}

/* viewport / track / slides */
.wpgc__viewport {
  overflow: hidden;
  padding: var(--wpgc-pad);
  touch-action: pan-y;           /* vertical page scroll allowed */
  -webkit-user-select: none;
  user-select: none;
  border: 0;
  box-shadow:none !important;
}

.wpgc__track {
  display: flex;
  gap: var(--wpgc-gap);
  will-change: transform;
  -webkit-user-drag: none;
}

.wpgc__slide {
  min-width: 25%;
  min-height: 1px;
}

/* cards */
.wpgc__card {
  display: block;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  background: var(--wpgc-surface);
  border-radius: var(--wpgc-radius);
  box-shadow: var(--wpgc-shadow);
  -webkit-user-drag: none;
  user-select: none;
}

.wpgc__thumb img,
.wpgc__placeholder {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: var(--wpgc-muted-bg);
  -webkit-user-drag: none;
  user-select: none;
}

.wpgc__body {
  padding: 12px;
}

.wpgc__title {
  margin: 0 0 8px;
  font-size: 16px;
  line-height: 1.4;
  color: var(--wpgc-title);
}

.wpgc__meta {
  font-size: 13px;
  color: var(--wpgc-meta);
}

/* controls */
.wpgc__controls {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 10px;
}

.wpgc__nav {
  border: 0;
  border-radius: 10px;
  padding: 8px 12px;
  cursor: pointer;
  background: var(--wpgc-primary);
  color: #fff;
  line-height: 1;
}

.wpgc__nav[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

/* footer / dots / progress / counter */
.wpgc__footer {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.wpgc__dots {
  display: flex;
  gap: 6px;
  justify-content: center;
}

.wpgc__dot {
  inline-size: 8px;
  block-size: 8px;
  border-radius: 999px;
  border: 0;
  padding: 0;
  cursor: pointer;
  background: var(--wpgc-dot);
}

.wpgc__dot.is-active {
  background: var(--wpgc-primary);
}

.wpgc__progress {
  block-size: 4px;
  background: var(--wpgc-progress-bg);
  border-radius: 999px;
  overflow: hidden;
}

.wpgc__progress > span {
  display: block;
  inline-size: 0;
  block-size: 100%;
  background: var(--wpgc-primary);
  transition: inline-size 0.3s ease;
}

.wpgc__counter {
  font-size: 12px;
  color: var(--wpgc-meta);
  text-align: end;
}

/* RTL tweak */
.wpgc[dir="rtl"] .wpgc__controls {
  justify-content: flex-start;
}

/* accessibility: visible keyboard focus */
.wpgc :where(button, [href], [tabindex]):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--wpgc-primary) 70%, #fff);
  outline-offset: 2px;
}

/* respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .wpgc__track,
  .wpgc__progress > span {
    transition: none !important;
  }
}

/* چیدمان خود اسلایدها در RTL برعکس شود */
/*.wpgc[dir="rtl"] .wpgc__track {*/
/*  flex-direction: row-reverse;*/
/*}*/

