.rkps-widget{ width:100%; direction:rtl; }
.rkps-track{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:16px;
}

.rkps-card{
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
}

.rkps-media{ position:relative; aspect-ratio: 1/1; overflow:hidden; }
.rkps-media img{ width:100%; height:100%; object-fit:cover; display:block; }

.rkps-badge{
  position:absolute; top:12px; left:12px;
  font-size:12px; padding:6px 10px; border-radius:999px;
  background: rgba(0,0,0,.45);
  color:#fff; border:1px solid rgba(255,255,255,.15);
}

.rkps-body{ padding:14px; }
.rkps-title{ margin:0 0 8px; font-weight:900; font-size:16px; }
.rkps-price{ opacity:.85; margin-bottom:10px; }

.rkps-actions{ display:flex; gap:10px; align-items:center; }
.rkps-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 12px; border-radius:12px;
  background: rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.14);
  color:#fff; text-decoration:none; font-weight:800;
}

@media(max-width:1024px){
  .rkps-track{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media(max-width:640px){
  .rkps-track{ grid-template-columns: 1fr; }
}
/* =========================================
   RK Woo Slider (Glass) — RTL + Swiper
   ========================================= */

.rkps-widget{
  direction: rtl;
  width: 100%;
  position: relative;
}

.rkps-top{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  margin-bottom: 14px;
}

.rkps-nav{
  display:flex;
  gap:10px;
}

/* Nav buttons (top-right like screenshot) */
.rkps-prev, .rkps-next{
  width:46px; height:46px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.20);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
  cursor:pointer;
  position: relative;
  transition: transform .2s ease, border-color .2s ease;
}
.rkps-prev:hover, .rkps-next:hover{
  transform: translateY(-2px);
  border-color: rgba(32,227,210,.45);
}

.rkps-prev::before, .rkps-next::before{
  content:"";
  position:absolute;
  inset:0;
  margin:auto;
  width:10px; height:10px;
  border: 2px solid rgba(255,255,255,.85);
  border-top: 0; border-right: 0;
  transform: rotate(45deg);
}
.rkps-next::before{ transform: rotate(-135deg); }

/* Swiper base */
.rkps-swiper{
  width:100%;
  direction: rtl; /* important for RTL */
  padding-bottom: 10px;
}
.rkps-swiper .swiper-wrapper{
  align-items: stretch;
}

/* Slide: do NOT center items */
.rkps-swiper .swiper-slide{
  height: auto;
  display:block;
}

/* Card */
.rkps-card{
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(900px 260px at 20% 0%, rgba(32,227,210,.14), transparent 60%),
    radial-gradient(700px 240px at 80% 35%, rgba(37,182,255,.10), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.05));
  box-shadow: 0 18px 70px rgba(0,0,0,.35);
  overflow:hidden;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.rkps-card:hover{
  transform: translateY(-8px);
  border-color: rgba(32,227,210,.28);
  box-shadow: 0 30px 110px rgba(0,0,0,.45);
}

/* Media 1080x1080 (1:1) */
.rkps-media{
  position: relative;
  aspect-ratio: 1 / 1;
  overflow:hidden;
  margin: 14px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.22);
}
.rkps-media img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
  transform: scale(1.001);
  transition: transform .5s ease;
}
.rkps-card:hover .rkps-media img{ transform: scale(1.06); }

/* Badge */
.rkps-badge{
  position:absolute;
  top:12px;
  left:12px;
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(0,0,0,.38);
  border: 1px solid rgba(255,255,255,.16);
  color:#fff;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Body */
.rkps-body{ padding: 0 16px 16px; }
.rkps-title{
  margin: 6px 0 8px;
  font-weight: 1000;
  font-size: 16px;
  color: rgba(255,255,255,.92);
}
.rkps-price{
  margin: 0 0 12px;
  opacity: .85;
  color: rgba(255,255,255,.85);
}

/* Actions */
.rkps-actions{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap:10px;
  flex-wrap: wrap;
}

.rkps-link, .rkps-cart{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 42px;
  padding: 0 14px;
  border-radius: 999px;
  text-decoration:none !important;
  font-weight: 900;
  font-size: 13px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.22);
  color: rgba(255,255,255,.92) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.rkps-link:hover, .rkps-cart:hover{
  transform: translateY(-2px);
  border-color: rgba(32,227,210,.45);
  box-shadow: 0 14px 40px rgba(32,227,210,.10);
}

/* Make add-to-cart not super wide */
.rkps-actions .button{ margin:0 !important; }

/* Empty */
.rkps-empty{
  padding: 18px;
  border-radius: 16px;
  border: 1px dashed rgba(255,255,255,.22);
  background: rgba(0,0,0,.18);
  color: rgba(255,255,255,.82);
}

/* Responsive */
@media (max-width: 1024px){
  .rkps-top{ margin-bottom: 12px; }
}
