/* =========================================================
خط Tajawal (الأفضل تحميله عبر في ):
في حال تعذر ذلك، نُبقي @import هنا كحل بديل.
========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;500;700&display=swap');
/* ================== المتغيرات العامة ================== */
:root{
--primary-color:#000000;
--primary-gold:#97803a;
--color-secondary:#ffffff;
--font-main:'Tajawal', sans-serif;
--font-fallback:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
--footer-text:#fff;
}
/* تعميم الخط + بدائل فورية لتقليل FOIT */
body,h1,h2,h3,h4,h5,h6,p,a,span,li,button{
font-family: var(--font-main), var(--font-fallback) !important;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}
/* ================== الفوتر ================== */
.store-footer{
background-color:var(--primary-gold);
padding:2rem 0;
color:#fff;
text-align:right !important;
}
.store-footer__inner{color:#fff;padding:1rem;text-align:right !important;}
.store-footer__inner.da-bgm{background-color:#000;}
.footer-is-light .store-footer{background-color:var(--primary-color);}
.footer-is-light .store-footer .store-footer__inner{
background:linear-gradient(0deg,var(--primary-color),#8c6e5a);
color:#fff;
}
.footer-content{
display:flex;justify-content:flex-end;align-items:center;
padding:1rem;text-align:right !important;
}
.store-footer h3{
background:linear-gradient(90deg,#ffcc00,#ffffff);
-webkit-background-clip:text;-webkit-text-fill-color:transparent;
font-weight:bold;margin:0;padding:.5rem 0;
}
.store-footer p,.store-footer a,
.footer-is-light .store-footer p,.footer-is-light .store-footer a{
color:#fff;text-align:right !important;
}
.footer-gray-text{
color:gray;display:flex;justify-content:center;align-items:center;
text-align:center;margin:0 auto;width:fit-content;padding:1rem;
}
/* ارتفاع ثابت لمنع قفز التخطيط */
.footer-images img{height:7rem;width:auto;display:block}
/* ================== الأزرار العامة ================== */
button,button.button,input[type="submit"],a.button,.s-button,.s-button-primary,.salla-btn,
.cart .btn,.checkout .btn{
background-color:var(--primary-color);color:#fff;
border:1px solid var(--primary-color);border-radius:.5rem;
padding:.6rem 1.2rem;font-weight:bold;cursor:pointer;
transition:background-color .2s ease,color .2s ease,border-color .2s ease;
text-align:center;
}
button:hover,button.button:hover,input[type="submit"]:hover,a.button:hover,
.s-button:hover,.s-button-primary:hover,.salla-btn:hover,
.cart .btn:hover,.checkout .btn:hover{
background-color:var(--primary-gold);color:var(--primary-color);border-color:var(--primary-gold);
}
/* ===== أزرار الفوتر ===== */
.s-button-primary-outline{
background:#6e4b41;color:#fff;border:1px solid #fff;border-radius:.5rem;
padding:.5rem 1rem;font-weight:bold;transition:.2s ease;
}
.s-button-primary-outline:hover{background:#5b3d37;color:var(--primary-gold);}
/* ===== أزرار التبويبات ===== */
.s-button-outline.s-button-primary-outline:not(.inactive),
.s-button-element.s-button-outline.s-button-primary-outline:not(.inactive){
background-color:var(--primary-gold);color:var(--primary-color) !important;border-color:var(--primary-gold);
}
.s-button-outline.s-button-primary-outline.inactive,
.s-button-element.s-button-outline.s-button-primary-outline.inactive{
background-color:var(--primary-color);color:#fff !important;border-color:var(--primary-color);transition:all .2s ease;
}
.s-button-outline.s-button-primary-outline.inactive:hover,
.s-button-element.s-button-outline.s-button-primary-outline.inactive:hover{
background-color:var(--primary-gold);color:var(--primary-color) !important;border-color:var(--primary-gold);
}
/* ================== بطاقات/قوائم المنتجات ================== */
.product-title,.product-name,.product-price{
color:var(--primary-color);font-weight:bold;transition:color .2s ease;
}
.product-title:hover,.product-name:hover,
.s-product-card-entry:hover .product-price,
.s-product-card-entry:hover .s-product-card-content-title a{color:var(--primary-gold);cursor:pointer;}
.s-product-card-entry{
position:relative;border:2px solid var(--primary-color);border-radius:8px;
overflow:hidden;background-color:#fff;transition:border-color .2s ease, box-shadow .2s ease;
cursor:pointer;
}
/* ظل أخف لتقليل التكاليف */
@keyframes pulse-shadow{50%{box-shadow:0 6px 12px rgba(212,171,66,.18);}}
.s-product-card-entry:hover{border-color:var(--primary-gold);animation:pulse-shadow .4s ease-in-out;}
/* لمعان أخف وأقصر */
.s-product-card-entry::before{
content:'';
position:absolute;top:0;left:-60%;width:50%;height:100%;
background:linear-gradient(120deg,transparent,rgba(255,255,255,.25),transparent);
transform:skewX(-20deg);z-index:2;opacity:.6;
}
@keyframes shimmer{0%{left:-60%;}100%{left:120%;}}
.s-product-card-entry:hover::before{animation:shimmer .8s ease forwards;}
.s-product-card-content{padding:15px;background-color:transparent;box-shadow:none;}
/* تثبيت نسبة الأبعاد لتجنب CLS */
.s-product-card-image{aspect-ratio:3/4;overflow:hidden;}
.s-product-card-image img{width:100%;height:100%;object-fit:cover;display:block}
.s-product-card-content-title a{
color:var(--primary-color);transition:color .2s ease;text-decoration:none;
}
.s-product-card-content-title a:hover{color:var(--primary-gold);text-decoration:underline;}
.s-product-card-entry .s-button-primary-outline,
.s-product-card-entry .s-button{
background-color:var(--primary-color);color:#fff;border:1px solid var(--primary-color);
border-radius:.5rem;padding:.5rem 1rem;font-weight:bold;transition:.2s ease;
}
.s-product-card-entry:hover .s-button-primary-outline,
.s-product-card-entry:hover .s-button{
background-color:var(--primary-gold);color:var(--primary-color);border-color:var(--primary-gold);
}
/* ================== القائمة والبحث ================== */
button.toggle-menu,button.toggle-menu svg,button.toggle-menu path,i.sicon-menu{
color:var(--primary-color) !important;fill:var(--primary-color) !important;stroke:var(--primary-color) !important;
}
button.header-btn{background:transparent;border:none;padding:0;cursor:pointer;outline:2px solid transparent;transition:opacity .15s ease;}
button.header-btn .header-btn__icon.sicon-user-circle{color:var(--primary-color) !important;transition:none !important;}
h1,h2,h3,h4{color:var(--primary-color);}
/* ===== أقسام إضافية ===== */
.slide--cat-entry{border-color:var(--primary-color);background-color:#f4f4f4;}
.another-button:hover{color:var(--primary-gold);}
.store-footer a:hover{color:var(--primary-gold);}
/* ===== شريط علوي + بحث ===== */
.top-navbar{
display:flex;justify-content:space-between;align-items:center;
min-height:48px;padding:.5rem 1rem;background-color:var(--primary-color);color:var(--footer-text);
}
.s-search-icon svg{height:1rem;width:1rem;fill:#fff;}
.s-search-input{
background-color:#333;color:#fff;border:1px solid #fff;border-radius:18px;
padding:.5rem 1rem;font-size:1rem;
}
/* ================== تحسين CLS لعناصر محددة ================== */
/* رسالة السعر شامل الضريبة بدون تغيير ارتفاع مفاجئ */
.price.my-1:after{
content:"السعر شامل الضريبة";
display:inline-block; margin-inline-start:.5rem;
font-size:.85em; color:#555; background:transparent; padding:0;
}
/* الهيرو/السلايدر: حجز مساحة مسبقة */
.hero,.s-block--slider-with-bg{min-height:46vh;}
.s-block--slider-with-bg img{width:100%;height:auto;display:block}
/* أيقونات مميزات */
.s-block--features__item .feature-icon i{color:#fff;font-size:2.2rem;}
.s-block--features__item .feature-icon{
background-color:#8B1E2B !important;color:#fff;border-radius:50%;
width:60px;height:60px;display:flex;align-items:center;justify-content:center;
font-size:2rem;margin:0 auto 1rem;
}
/* ألوان الهوفر العامة */
.flex.items-center a:hover,.flex.items-center i:hover{color:var(--primary-gold) !important;}
.s-search-product-price{color:var(--primary-color) !important;font-weight:bold;}
.product-title{color:var(--primary-color);}
/* إزالة الهوامش السالبة التي تسبب قفز */
#featured-products-style2-10,.tabs-wrapper,.s-block.s-block--slider-with-bg + *{margin-top:0 !important;}
/* لا نغيّر جميع .p-4 عالمياً حتى لا نخرب التخطيط */
/* .p-4 { padding: .5rem; } <-- أزلنا التصفير الذي قد يسبب اضطراب التخطيط */
/* تقليل الحركة عند تفضيل المستخدم ذلك */
@media (prefers-reduced-motion: reduce){
*{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition:none !important;}
}