/* ════════════════════════════════════════════════════════════════
   DEEM — Site-wide skin  (PURE CSS)
   Paste into Salla's Custom CSS field, OR inside a <style>…</style>
   in a Custom-HTML element. No JS needed for styling.
   ════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600&family=Tajawal:wght@300;400;500;700&display=swap');

/* ===== 1. brand color variables (Raed reads these everywhere) ===== */
:root, body, .theme-raed{
  --color-primary:#2e23a8 !important;
  --color-primary-dark:#1f1488 !important;
  --color-primary-d:#1f1488 !important;
  --color-primary-l:#6f63e0 !important;
  --color-primary-reverse:#6f63e0 !important;
  --main-text-color:#1b1a26 !important;
  --main-text-color-dark:#1b1a26 !important;
  --color-text:#54515f !important;
  --font-main:"Tajawal" !important;
}

/* ===== 2. base page ===== */
body{
  background:#f7f7fb !important;
  color:#1b1a26 !important;
  font-family:"Tajawal",system-ui,sans-serif !important;
}
.s-block,.container,main,#app{ font-family:"Tajawal",system-ui,sans-serif !important; }

/* ===== 3. accents ===== */
.text-primary,.hover\:text-primary:hover{ color:#2e23a8 !important; }
.bg-primary{ background-color:#2e23a8 !important; }
.border-primary{ border-color:#2e23a8 !important; }
.fill-primary,.s-button-primary-link{ fill:#2e23a8 !important; }

/* ===== 4. buttons → indigo pills ===== */
.btn--primary,.s-button-primary,salla-button .btn--primary,button.btn--primary,.btn.btn--primary{
  background-color:#2e23a8 !important; border-color:#2e23a8 !important;
  color:#fff !important; border-radius:999px !important;
}
.btn--primary:hover,.s-button-primary:hover{ background-color:#1f1488 !important; }
.btn--outline,.btn--outline-primary{
  border-radius:999px !important; border-color:#2e23a8 !important; color:#2e23a8 !important;
}
.btn--outline:hover,.btn--outline-primary:hover{ background-color:#2e23a8 !important; color:#fff !important; }
salla-add-product-button .btn{ border-radius:999px !important; }

/* ===== 5. product cards ===== */
.s-product-card-entry,.product-entry{
  border-radius:16px !important; border:1px solid #ececf4 !important; background:#fff !important;
  transition:transform .3s ease, box-shadow .3s ease !important; overflow:hidden !important;
}
.s-product-card-entry:hover,.product-entry:hover{
  transform:translateY(-4px) !important; box-shadow:0 22px 44px -28px rgba(40,32,120,.45) !important;
}
.s-product-card-image,.product-entry__image,.s-product-card-image img{ border-radius:14px !important; }

/* ===== 6. inputs / search ===== */
.s-input,.form-input,input[type=text],input[type=email],input[type=search],.s-search-input{ border-radius:12px !important; }
.s-input:focus,.form-input:focus{ border-color:#6f63e0 !important; box-shadow:0 0 0 3px rgba(46,35,168,.12) !important; }

/* ===== 7. header / top nav ===== */
.top-navbar,header.s-header,.s-header{ background:#ffffff !important; }
.top-navbar a,.topnav-link-item{ color:#1b1a26 !important; }
.top-navbar a:hover{ color:#2e23a8 !important; }
.s-cart-summary-count,.badge--counter{ background:#2e23a8 !important; color:#fff !important; }

/* ===== 8. misc ===== */
.breadcrumbs a:hover{ color:#2e23a8 !important; }
::selection{ background:#2e23a8; color:#fff; }

/* ===== 9. footer ===== */
.store-footer{
  background:#16151f !important; color:#cfccdb !important;
  border-top:1px solid rgba(255,255,255,.07) !important;
  font-family:"Tajawal",system-ui,sans-serif !important;
}
.store-footer *{ border-color:rgba(255,255,255,.10) !important; }
.store-footer__inner{ padding:62px 0 18px !important; }
.store-footer h3{ color:#fff !important; font-weight:500 !important; letter-spacing:.04em !important; margin-bottom:18px !important; }
.store-footer .lg\:col-span-2 h3{ font-family:"Cormorant Garamond",serif !important; font-size:26px !important; letter-spacing:.30em !important; }
.store-footer p,.store-footer .text-text-grey,.store-footer .leading-6{ color:#a6a3bd !important; line-height:1.85 !important; }
.store-footer a{ color:#cfccdb !important; text-decoration:none !important; transition:.2s; }
.store-footer a:hover{ color:#fff !important; }
.store-footer a.hover\:text-primary:hover{ color:#8d83f0 !important; }
.store-footer li{ margin-bottom:10px !important; }
.store-footer salla-social a,.store-footer .contact-social a{
  width:38px !important; height:38px !important; display:inline-flex !important;
  align-items:center !important; justify-content:center !important;
  border:1px solid rgba(255,255,255,.18) !important; border-radius:50% !important; margin-inline-start:8px !important;
}
.store-footer salla-social a:hover,.store-footer .contact-social a:hover{ background:#fff !important; border-color:#fff !important; }
.store-footer salla-social a:hover *{ color:#16151f !important; fill:#16151f !important; }
.store-footer salla-social svg,.store-footer .contact-social svg{ width:16px !important; height:16px !important; }
.store-footer b{ color:#e7e5f5 !important; }
.store-footer salla-payments{ opacity:.95 !important; }
.store-footer salla-payments img{ border-radius:6px !important; }
.store-footer .copyright-text,.store-footer .copyright-text *,.store-footer .text-gray-400{ color:#8b88a0 !important; }
.store-footer h3::after{ content:""; display:block; width:26px; height:2px; margin-top:10px; background:#6f63e0; opacity:.8; border-radius:2px; }
.store-footer .lg\:col-span-2 h3::after{ display:none; }

/* ════ FARID THEME specifics (also harmless on Raed) ════ */
.store-header{ background:#ffffff !important; }
.store-header a:hover{ color:#2e23a8 !important; }
/* Salla button component → indigo pills */
.s-button-btn{ border-radius:999px !important; }
.s-button-primary,.s-button-filled{ background-color:#2e23a8 !important; border-color:#2e23a8 !important; color:#fff !important; }
.s-button-outline{ border-color:#2e23a8 !important; color:#2e23a8 !important; }
.s-button-outline:hover{ background-color:#2e23a8 !important; color:#fff !important; }
/* on-brand product badges + sale price (was red) */
.s-product-card-promotion-title{ background-color:#2e23a8 !important; border-radius:999px !important; }
.s-product-card-sale-price{ color:#2e23a8 !important; }