/* ==========================================================================
   BARAH X v2.1 - Premium Commerce UI for Salla Click
   شركة بارعة ®
========================================================================== */

/* ==================== 1. الأساسيات ==================== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:#fff;color:#111827;
  font-family:"IBM Plex Sans Arabic","Tajawal",sans-serif;
  line-height:1.7;-webkit-font-smoothing:antialiased
}
img,a,button{transition:.25s ease}

/* ==================== 2. المتغيرات ==================== */
:root{
  --br-primary:#6D28D9;
  --br-primary-hover:#5B21B6;
  --br-dark:#1F2937;
  --br-text:#111827;
  --br-muted:#6B7280;
  --br-border:#E5E7EB;
  --br-bg:#ffffff;
  --br-radius:18px;
  --br-shadow:0 10px 30px rgba(0,0,0,.08);
  --br-container:1280px;
}

/* ==================== 3. الحاوية ==================== */
.br-container{width:min(calc(100% - 32px),var(--br-container));margin:auto}

/* ==================== 4. الأزرار ==================== */
.br-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:0 24px;border:none;border-radius:12px;
  background:var(--br-primary);color:#fff;font-weight:700;cursor:pointer;
}
.br-btn:hover{background:var(--br-primary-hover);transform:translateY(-2px)}

/* ==================== 5. كرت المنتج ==================== */
.s-product-card,.s-product-card-entry{
  background:#fff;border:1px solid var(--br-border);border-radius:var(--br-radius);
  overflow:hidden;display:flex;flex-direction:column;height:100%;
  transition:transform .25s,box-shadow .25s,border-color .25s;will-change:transform;
}
.s-product-card:hover,.s-product-card-entry:hover{
  transform:translateY(-4px);border-color:var(--br-primary);box-shadow:var(--br-shadow);
}
.s-product-card-image{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#fff;overflow:hidden}
.s-product-card-image img{width:100%;height:100%;object-fit:contain;padding:14px;transition:.35s}
.s-product-card:hover img{transform:scale(1.05)}

.s-product-card-content{padding:18px;display:flex;flex-direction:column;flex:1}
.s-product-card-title{
  font-weight:700;line-height:1.55;min-height:58px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.s-product-card-price,.price{font-size:20px;font-weight:800;color:#E11D48}
del,.price-before{color:#999;font-size:14px}
.star-rating{transform:scale(1.05)}
.s-product-card .btn,.s-product-card-entry .btn{
  width:100%;height:46px;border-radius:12px;font-weight:700
}
.s-product-card .btn:hover{transform:translateY(-2px)}

/* ==================== 6. روابط مهمة ==================== */
.barah-important-links{
  padding:28px 16px;background:#F9FAFB;border-top:1px solid var(--br-border);margin-top:32px
}
.barah-important-links h4{
  margin:0 0 16px;font-size:17px;font-weight:700;color:var(--br-dark);
  position:relative;padding-bottom:10px
}
.barah-important-links h4:after{
  content:'';position:absolute;right:0;bottom:0;width:40px;height:2px;
  background:var(--br-primary);border-radius:2px
}
.barah-policy-list{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px
}
.barah-policy-list a{
  color:var(--br-muted);text-decoration:none;font-size:14px;padding:8px 0;
  border-bottom:1px dashed transparent
}
.barah-policy-list a:hover{color:var(--br-primary);border-bottom-color:var(--br-primary)}

/* ==================== 7. الخريطة ==================== */
#barah-map-section{max-width:1200px;margin:40px auto;padding:0 16px}
#barah-map-section .barah-title{font-size:22px;font-weight:700;color:var(--br-dark);margin-bottom:6px}
#barah-map-section .barah-sub{color:var(--br-muted);margin-bottom:16px}
#barah-map-section .barah-frame{border-radius:var(--br-radius);overflow:hidden;box-shadow:var(--br-shadow);border:1px solid var(--br-border)}
#barah-map-section iframe{width:100%;height:300px;border:0;display:block}
#barah-map-section .barah-btns{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}

/* ==================== 8. الفوتر ==================== */
footer{border-top:1px solid #eee;padding-top:40px}
footer h3,footer h4{font-size:18px;margin-bottom:12px}

/* ==================== 9. الجوال ==================== */
@media(max-width:768px){
  .s-product-card-content{padding:14px}
  .s-product-card-title{min-height:48px;font-size:14px}
  .s-product-card-price,.price{font-size:18px}
  .barah-policy-list{grid-template-columns:1fr;gap:8px;text-align:center}
  .barah-policy-list a{max-width:280px;margin:auto}
  #barah-map-section iframe{height:220px}
  .barah-important-links h4:after{right:50%;transform:translateX(50%)}
}