:root {
    --store-font: "Alexandria", sans-serif;
    --store-primary: #315b2d;
    --store-primary-dark: #173818;
    --store-primary-soft: #edf5ea;
    --store-gold: #c79a3b;
    --store-gold-dark: #9d7422;
    --store-bg: #f8f7f4;
    --store-card: #fff;
    --store-text: #20231f;
    --store-muted: #747b73;
    --store-border: #e9e5dc;
    --store-shadow: 0 12px 34px rgba(41, 55, 39, .08);
}

html, body, button, input, select, textarea { font-family: var(--store-font); }
html, body { overflow-x: hidden; }
body {
    margin: 0;
    padding-bottom: 170px !important;
    color: var(--store-text);
    background: radial-gradient(circle at top right, rgba(199,154,59,.08), transparent 260px), var(--store-bg);
}

.modern-store-home {
    width: min(1180px, calc(100% - 28px));
    margin: 0 auto;
    padding: 22px 0 170px;
    direction: rtl;
}

.customer-welcome { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px; }
.welcome-heading { display:flex; align-items:center; gap:12px; min-width:0; }
.welcome-logo { width:54px; height:54px; flex:0 0 54px; display:grid; place-items:center; border:1px solid rgba(199,154,59,.42); border-radius:18px; background:linear-gradient(145deg,#fff,#f3eadb); box-shadow:0 8px 22px rgba(111,86,38,.11); }
.welcome-logo span { font-size:27px; }
.welcome-text { min-width:0; }
.welcome-label { display:block; color:var(--store-muted); font-size:11px; font-weight:700; }
.welcome-text h1 { margin:2px 0; color:var(--store-primary-dark); font-size:clamp(20px,4vw,27px); line-height:1.35; font-weight:900; }
.welcome-text p { margin:0; color:var(--store-muted); font-size:11px; }
.welcome-cart { position:relative; width:46px; height:46px; flex:0 0 46px; display:grid; place-items:center; color:var(--store-primary); text-decoration:none; border:1px solid var(--store-border); border-radius:14px; background:#fff; box-shadow:0 7px 20px rgba(42,47,40,.06); }
.welcome-cart small { position:absolute; top:-6px; left:-6px; min-width:19px; height:19px; padding:0 4px; display:grid; place-items:center; color:#fff; background:#dc4248; border:2px solid #fff; border-radius:999px; font-size:8px; font-weight:900; }

.customer-search { height:54px; margin-bottom:18px; padding:0 8px; display:flex; align-items:center; border:1px solid var(--store-border); border-radius:16px; background:#fff; box-shadow:0 7px 24px rgba(47,52,44,.05); }
.customer-search input { width:100%; height:100%; padding:0 8px; border:0; outline:0; background:transparent; color:var(--store-text); font:inherit; font-size:13px; text-align:right; }
.customer-search button { width:40px; height:40px; flex:0 0 40px; display:grid; place-items:center; border:0; border-radius:12px; background:var(--store-primary-soft); color:var(--store-primary); cursor:pointer; }

.sheep-home-slider { position:relative !important; width:100% !important; margin:0 0 18px !important; overflow:hidden !important; border-radius:24px !important; background:#0d2a18 !important; box-shadow:0 18px 44px rgba(20,45,25,.18) !important; isolation:isolate; }
.sheep-slider-viewport { position:relative !important; width:100% !important; height:clamp(220px,38vw,430px) !important; overflow:hidden !important; }
.sheep-slider-track { position:relative !important; width:100% !important; height:100% !important; }
.sheep-slider-slide { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; margin:0 !important; visibility:hidden !important; opacity:0 !important; overflow:hidden !important; pointer-events:none !important; transform:scale(1.02); transition:opacity .5s ease, visibility .5s ease, transform .9s ease; }
.sheep-slider-slide.is-active { z-index:2 !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; transform:scale(1); }
.sheep-slider-slide img { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; display:block !important; object-fit:cover !important; object-position:center !important; border:0 !important; }
.sheep-slide-link { position:absolute !important; inset:0 !important; z-index:3 !important; display:block !important; }
.sheep-slider-control { position:absolute !important; z-index:8 !important; top:50% !important; width:38px !important; height:38px !important; padding:0 !important; display:grid !important; place-items:center !important; border:1px solid rgba(255,255,255,.28) !important; border-radius:50% !important; color:#fff !important; background:rgba(5,30,17,.48) !important; font:26px/1 Arial !important; cursor:pointer !important; transform:translateY(-50%) !important; }
.sheep-slider-previous { right:12px !important; }
.sheep-slider-next { left:12px !important; }
.sheep-slider-pagination { position:absolute !important; z-index:9 !important; right:50% !important; bottom:13px !important; display:flex !important; gap:7px !important; transform:translateX(50%) !important; }
.sheep-slider-pagination button { width:8px !important; height:8px !important; padding:0 !important; border:0 !important; border-radius:999px !important; background:rgba(255,255,255,.5) !important; }
.sheep-slider-pagination button.is-active { width:26px !important; background:#fff !important; }

.modern-benefits { margin-top:0; padding:12px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; border:1px solid var(--store-border); border-radius:20px; background:#fff; box-shadow:var(--store-shadow); }
.benefit-card { min-height:74px; padding:10px; display:flex; align-items:center; gap:10px; border-radius:15px; }
.benefit-icon { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:13px; background:#f4e8ca; color:var(--store-gold-dark); font-size:18px; font-weight:900; }
.benefit-card strong,.benefit-card small { display:block; }
.benefit-card strong { margin-bottom:3px; font-size:12px; }
.benefit-card small { color:var(--store-muted); font-size:9px; line-height:1.5; }

.modern-content-section { margin-top:36px; }
.modern-section-heading { margin-bottom:15px; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
.section-kicker { display:block; margin-bottom:4px; color:var(--store-gold-dark); font-size:10px; font-weight:900; }
.modern-section-heading h2 { margin:0; font-size:clamp(18px,4vw,23px); font-weight:900; }
.modern-section-heading > a { color:var(--store-primary); text-decoration:none; font-size:11px; font-weight:800; white-space:nowrap; }

.modern-breed-scroll { display:grid; grid-auto-flow:column; grid-auto-columns:130px; gap:11px; overflow-x:auto; padding:2px 1px 12px; scrollbar-width:none; scroll-snap-type:x mandatory; }
.modern-breed-scroll::-webkit-scrollbar,.home-articles-scroll::-webkit-scrollbar { display:none; }
.modern-breed-card { min-height:135px; padding:14px 10px; text-align:center; text-decoration:none; color:var(--store-text); border:1px solid var(--store-border); border-radius:19px; background:#fff; box-shadow:0 8px 24px rgba(45,50,43,.05); scroll-snap-align:start; }
.breed-icon { width:58px; height:58px; margin:0 auto 9px; display:grid; place-items:center; border-radius:50%; background:var(--store-primary-soft); }
.breed-icon span { font-size:27px; }
.modern-breed-card strong,.modern-breed-card small { display:block; }
.modern-breed-card strong { margin-bottom:4px; font-size:12px; }
.modern-breed-card small { color:var(--store-muted); font-size:8px; }

.modern-product-grid,.product-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.modern-product-grid .product-card,.product-grid .product-card { overflow:hidden; border:1px solid var(--store-border); border-radius:19px; background:#fff; box-shadow:0 9px 27px rgba(45,51,43,.06); }

.blog-section-heading p { margin:6px 0 0; color:var(--store-muted); font-size:11px; }
.home-articles-scroll { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(315px,38%); gap:12px; overflow-x:auto; padding:2px 1px 13px; scroll-snap-type:x mandatory; scrollbar-width:none; }
.home-article-card { display:grid; grid-template-columns:105px minmax(0,1fr); min-height:170px; overflow:hidden; color:var(--store-text); text-decoration:none; border:1px solid var(--store-border); border-radius:20px; background:#fff; box-shadow:0 9px 28px rgba(45,51,43,.06); scroll-snap-align:start; }
.home-article-cover { position:relative; display:grid; place-items:center; overflow:hidden; background:linear-gradient(145deg,var(--store-primary-dark),var(--store-primary)); }
.article-cover-2 { background:linear-gradient(145deg,#8e5d2c,#c78b4f); }
.article-cover-3 { background:linear-gradient(145deg,#315f5c,#4d8c86); }
.article-cover-4 { background:linear-gradient(145deg,#4e4035,#806a58); }
.home-article-icon { width:58px; height:58px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.22); border-radius:18px; background:rgba(255,255,255,.15); font-size:28px; }
.home-article-number { position:absolute; right:9px; bottom:8px; color:rgba(255,255,255,.72); font-size:10px; font-weight:800; }
.home-article-content { min-width:0; padding:14px; display:flex; flex-direction:column; }
.home-article-category { align-self:flex-start; padding:4px 9px; color:#39614d; background:#edf5f0; border-radius:999px; font-size:9px; font-weight:800; }
.home-article-content h3 { margin:9px 0 5px; font-size:13px; line-height:1.6; }
.home-article-content p { margin:0; color:var(--store-muted); font-size:10px; line-height:1.7; }
.home-article-footer { margin-top:auto; padding-top:9px; display:flex; align-items:center; justify-content:space-between; color:var(--store-primary); font-size:10px; font-weight:900; }
.home-article-arrow { width:27px; height:27px; display:grid; place-items:center; color:#fff; background:var(--store-primary); border-radius:50%; }

.home-faq-wrapper { overflow:hidden; border:1px solid #e2ebe5; border-radius:23px; background:linear-gradient(145deg,#f6faf7,#fff); box-shadow:0 13px 34px rgba(30,74,53,.07); }
.home-faq-intro { display:grid; grid-template-columns:54px minmax(0,1fr); gap:12px; padding:18px; border-bottom:1px solid #e3ece6; }
.home-faq-intro-icon { width:54px; height:54px; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,var(--store-primary-dark),var(--store-primary)); border-radius:17px; font-size:23px; font-weight:900; }
.home-faq-intro h2 { margin:2px 0 4px; font-size:20px; }
.home-faq-intro p { margin:0; color:var(--store-muted); font-size:11px; line-height:1.8; }
.home-faq-intro > a { grid-column:1/-1; min-height:42px; display:flex; align-items:center; justify-content:center; color:var(--store-primary); text-decoration:none; background:#fff; border:1px solid #d9e5dd; border-radius:13px; font-size:11px; font-weight:900; }
.home-faq-list { padding:6px 15px 15px; }
.home-faq-item { border-bottom:1px solid #e7eee9; }
.home-faq-item:last-child { border-bottom:0; }
.home-faq-item summary { min-height:64px; padding:7px 2px; display:grid; grid-template-columns:32px minmax(0,1fr) 30px; align-items:center; gap:9px; list-style:none; cursor:pointer; }
.home-faq-item summary::-webkit-details-marker { display:none; }
.faq-question-number { width:28px; height:28px; display:grid; place-items:center; color:#668071; background:#edf4ef; border-radius:9px; font-size:9px; font-weight:900; }
.faq-question-text { font-size:12px; font-weight:800; line-height:1.6; }
.faq-toggle-icon { width:29px; height:29px; display:grid; place-items:center; color:#41624f; background:#f0f5f2; border-radius:50%; transition:.2s; }
.faq-toggle-icon svg { width:16px; height:16px; }
.home-faq-item[open] .faq-toggle-icon { color:#fff; background:var(--store-primary); transform:rotate(180deg); }
.home-faq-item[open] .faq-question-number { color:#fff; background:var(--store-primary); }
.home-faq-answer { padding:0 40px 15px; }
.home-faq-answer p { margin:0; color:var(--store-muted); font-size:11px; line-height:1.9; }

.customer-promo-card { margin-top:38px; padding:22px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; color:#fff; background:var(--store-primary-dark); border-radius:22px; box-shadow:0 18px 40px rgba(31,64,29,.16); }
.promo-icon { width:58px; height:58px; display:grid; place-items:center; background:rgba(255,255,255,.1); border-radius:17px; font-size:27px; }
.promo-content h2 { margin:4px 0; font-size:17px; }
.promo-content span { color:#ebcc82; font-size:9px; font-weight:900; }
.promo-content p { margin:0; color:rgba(255,255,255,.7); font-size:10px; }
.customer-promo-card > a { min-height:42px; padding:9px 15px; display:flex; align-items:center; justify-content:center; color:var(--store-primary-dark); text-decoration:none; background:#fff; border-radius:12px; font-size:10px; font-weight:900; }

.flat-whatsapp-bar { position:fixed !important; z-index:99990 !important; right:max(10px,env(safe-area-inset-right)) !important; bottom:calc(86px + env(safe-area-inset-bottom)) !important; left:max(10px,env(safe-area-inset-left)) !important; width:min(520px,calc(100% - 20px)) !important; min-height:56px !important; margin:0 auto !important; padding:8px 13px !important; display:flex !important; align-items:center !important; gap:10px !important; color:#fff !important; text-decoration:none !important; background:#1faa59 !important; border:1px solid rgba(255,255,255,.2) !important; border-radius:14px !important; box-shadow:0 14px 35px rgba(24,139,72,.3) !important; }
.flat-whatsapp-icon { width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; background:rgba(255,255,255,.15); border-radius:10px; }
.flat-whatsapp-text { min-width:0; flex:1; display:flex; flex-direction:column; }
.flat-whatsapp-text strong { font-size:11px; font-weight:900; }
.flat-whatsapp-text small { overflow:hidden; color:rgba(255,255,255,.82); font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.flat-whatsapp-arrow { font-size:19px; font-weight:900; }
.floating-whatsapp { display:none !important; }

@media (min-width:768px) {
    .home-faq-wrapper { display:grid; grid-template-columns:minmax(240px,.75fr) minmax(0,1.4fr); }
    .home-faq-intro { align-content:start; border-bottom:0; border-left:1px solid #e3ece6; }
    .home-faq-list { padding:10px 20px; }
}

@media (min-width:900px) {
    .flat-whatsapp-bar { right:auto !important; left:24px !important; width:330px !important; margin:0 !important; bottom:104px !important; }
    body { padding-bottom:125px !important; }
    .modern-store-home { padding-bottom:135px; }
}

@media (max-width:768px) {
    .modern-store-home { width:calc(100% - 20px); padding-top:14px; }
    .sheep-home-slider { border-radius:18px !important; }
    .sheep-slider-viewport { height:220px !important; }
    .modern-benefits { overflow-x:auto; grid-template-columns:repeat(3,minmax(170px,1fr)); }
    .modern-product-grid,.product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
    .home-articles-scroll { grid-auto-columns:minmax(280px,84%); }
    .customer-promo-card { grid-template-columns:auto 1fr; padding:17px; }
    .customer-promo-card > a { grid-column:1/-1; width:100%; }
}

@media (max-width:480px) {
    .sheep-slider-viewport { height:185px !important; }
    .sheep-slider-control { width:32px !important; height:32px !important; font-size:21px !important; }
    .modern-benefits { grid-template-columns:repeat(3,minmax(150px,1fr)); }
    .home-article-card { grid-template-columns:92px minmax(0,1fr); min-height:160px; }
    .home-faq-answer { padding-right:35px; padding-left:30px; }
    .customer-promo-card { grid-template-columns:1fr; text-align:center; }
    .promo-icon { margin:auto; }
}
/* إصلاح أيقونات الأسئلة الشائعة */
.faq-toggle-icon {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    overflow: hidden !important;
    border-radius: 50% !important;
}

.faq-toggle-icon svg {
    display: block !important;
    width: 17px !important;
    height: 17px !important;
    min-width: 17px !important;
    max-width: 17px !important;
    min-height: 17px !important;
    max-height: 17px !important;
    flex: 0 0 17px !important;
}

/* منع أي SVG داخل الأسئلة من التمدد */
.home-faq-section svg,
.home-faq-item svg {
    width: 17px !important;
    height: 17px !important;
    max-width: 17px !important;
    max-height: 17px !important;
}

/* تثبيت عرض الصفحة */
.modern-store-home {
    width: min(1180px, calc(100% - 32px)) !important;
    max-width: 1180px !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

/* الجوال */
@media (max-width: 768px) {
    .modern-store-home {
        width: calc(100% - 20px) !important;
    }
}