/* ═══════════════════════════════════════════════════════════
   Salma Collection — تحسين التنظيم العام v1
   ═══════════════════════════════════════════════════════════ */

/* ── 1. الشريط العائم — أصغر وأنظف ── */
.float {
 left: 12px !important;
 top: 50% !important;
 transform: translateY(-50%) !important;
 gap: 3px !important;
 display: flex !important;
 flex-direction: column !important;
}
.float a,
.float button {
 width: 38px !important;
 height: 38px !important;
 border-radius: 10px !important;
 font-size: 15px !important;
 box-shadow: 0 3px 10px rgba(0,0,0,.15) !important;
 border-bottom: none !important;
 margin: 0 !important;
}

/* ── 2. لوجو الهيدر — متناسق ── */
.salma-logo-wrap {
 gap: 10px !important;
 text-decoration: none !important;
}
.salma-logo-img {
 height: 52px !important;
 width: auto !important;
 object-fit: contain !important;
 border-radius: 10px !important;
 box-shadow: 0 2px 10px rgba(216,27,122,.15) !important;
}
.salma-brand-text b {
 font-size: 18px !important;
 letter-spacing: -.3px !important;
}

/* ── 3. الهيدر العام — ارتفاع مناسب ── */
.tw-head.salam-main-head {
 height: auto !important;
 padding: 12px 0 !important;
 gap: 24px !important;
}

/* ── 4. الشريط العلوي — أنظف ── */
.topline.salam-topline .container {
 height: 34px !important;
 display: flex !important;
 justify-content: space-between !important;
 align-items: center !important;
}
.topline.salam-topline .top-links {
 display: flex !important;
 gap: 18px !important;
 font-size: 11px !important;
}
.topline.salam-topline .top-contact {
 display: flex !important;
 gap: 14px !important;
 align-items: center !important;
 font-size: 11px !important;
}

/* ── 5. شريط الخدمات — نظيف ── */
.salam-service-strip {
 border-top: 1px solid #f3c6df !important;
 border-bottom: 1px solid #f3c6df !important;
}
.salam-service-strip .container {
 display: flex !important;
 justify-content: space-around !important;
 align-items: center !important;
 height: 38px !important;
 gap: 12px !important;
}
.salam-service-strip span {
 font-size: 11px !important;
 white-space: nowrap !important;
}

/* ── 6. بطاقات التصنيفات — متناسقة ── */
.category-grid a,
.home-category-card-v32 {
 border-radius: 14px !important;
 transition: all .2s ease !important;
}

/* ── 7. Hero section — متناسقة ── */
.salam-fallback-hero {
 border-radius: 18px !important;
 overflow: hidden !important;
 margin-bottom: 20px !important;
}
.hero-kicker {
 display: inline-block !important;
 margin-bottom: 12px !important;
}

/* ── 8. الـ section titles — خط تحت العنوان ── */
.section-title h2::after,
.salam-title h2::after {
 content: '';
 display: block;
 width: 48px;
 height: 3px;
 background: linear-gradient(135deg, #d81b7a, #c8a227);
 border-radius: 2px;
 margin-top: 6px;
}

/* ── 9. الفوتر Trust bar — grid متساوية ── */
.footer-trust {
 display: grid !important;
 grid-template-columns: repeat(3, 1fr) !important;
 gap: 0 !important;
 padding: 18px 0 !important;
}
.footer-trust > div {
 display: flex !important;
 flex-direction: column !important;
 align-items: center !important;
 text-align: center !important;
 padding: 10px 20px !important;
 border-left: 1px solid rgba(255,255,255,.12) !important;
 font-size: 12px !important;
}
.footer-trust > div:last-child { border-left: none !important; }
.footer-trust b { font-size: 13px !important; margin-bottom: 2px !important; }
.footer-trust small { font-size: 10px !important; opacity: .8 !important; }

/* ── 10. product card hover — أنعم ── */
.product-card:hover {
 transform: translateY(-4px) !important;
 box-shadow: 0 16px 40px rgba(216,27,122,.14) !important;
}

/* ── 11. أزرار الـ Add to cart ── */
.add,
.salam-add-cart {
 border-radius: 8px !important;
 font-size: 12px !important;
 height: 36px !important;
 font-weight: 700 !important;
 transition: all .2s !important;
}

/* ── 12. mobile ── */
@media(max-width:700px) {
 .footer-trust { grid-template-columns: 1fr !important; }
 .footer-trust > div { border-left: none !important; border-bottom: 1px solid rgba(255,255,255,.1) !important; }
 .salam-service-strip .container { flex-wrap: wrap !important; height: auto !important; padding: 6px 0 !important; }
 .float { left: 8px !important; }
 .float a, .float button { width: 34px !important; height: 34px !important; }
}