/*
Theme Name: Souko Outillage
Theme URI: https://soukoutillage.com
Author: Souko Outillage
Description: قالب ووردبريس مخصص لمتجر أدوات ومعدات، متوافق بالكامل مع WooCommerce. تصميم صناعي حديث بألوان أحمر/أسود مع قوائم تصنيفات منسدلة، سلايدر بانر، شارات عروض وجديد، وأقسام الأكثر مبيعاً.
Version: 1.6.5
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: souko-tools
Tags: e-commerce, custom-menu, featured-images, translation-ready
*/

/* ============================================================
   1. DESIGN TOKENS
   ============================================================ */
:root{
  --ink:#1d1d1b;
  --steel:#232323;
  --steel-2:#2f2f2f;
  --paper:#f7f7f5;
  --paper-2:#efeee9;
  --line:#e4e2dc;
  --red:#e2231a;
  --red-dark:#b31712;
  --yellow:#ffb703;
  --white:#ffffff;
  --muted:#767268;
  --radius:2px;
  --font-head:"Barlow Condensed", "Tahoma", sans-serif;
  --font-body:"Inter", "Tahoma", sans-serif;
  --maxw:1280px;
}

/* ============================================================
   2. RESET & BASE
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  font-size:15px;
  line-height:1.6;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none;margin:0;padding:0}
h1,h2,h3,h4{
  font-family:var(--font-head);
  font-weight:700;
  letter-spacing:.2px;
  margin:0 0 .5em;
  color:var(--steel);
}
h2.section-title{
  font-size:clamp(24px,3vw,34px);
  border-inline-start:5px solid var(--red);
  padding-inline-start:14px;
  margin:0 0 22px;
}
.container{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--red);color:var(--white);
  padding:11px 22px;border:0;border-radius:var(--radius);
  font-family:var(--font-head);font-size:16px;letter-spacing:.3px;
  cursor:pointer;transition:background .15s ease, transform .1s ease;
}
.btn:hover{background:var(--red-dark)}
.btn.outline{background:transparent;color:var(--white);border:1px solid rgba(255,255,255,.5)}
.btn.outline:hover{background:rgba(255,255,255,.12)}
:focus-visible{outline:2px solid var(--red);outline-offset:2px}
@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important;scroll-behavior:auto !important}}

/* ============================================================
   3. TOP UTILITY BAR
   ============================================================ */

/* ============================================================
   4. HEADER
   ============================================================ */
.site-header{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:60}
.header-main{display:flex;align-items:center;gap:14px;padding:14px 0;flex-wrap:nowrap}
.site-logo img{max-height:56px;width:auto}.site-logo-image{width:auto;height:48px;max-width:100%;object-fit:contain}
.site-logo{font-family:var(--font-head);font-size:28px;color:var(--steel);flex:0 1 auto;min-width:0;overflow:hidden}
.site-logo span{color:var(--red)}

.header-search{flex:1;max-width:560px;min-width:0}
.header-search form{display:flex;border:2px solid var(--steel);border-radius:var(--radius);overflow:hidden}
.header-search input[type="search"]{
  flex:1;border:0;padding:10px 14px;font-family:var(--font-body);font-size:14px;background:var(--white);
}
.header-search button{background:var(--red);color:#fff;border:0;padding:0 18px;cursor:pointer}
.header-search button:hover{background:var(--red-dark)}

.header-actions{display:flex;align-items:center;gap:16px;margin-inline-start:auto;flex-shrink:0;margin-right:0.5cm}
.header-action{display:flex;flex-direction:column;align-items:center;font-size:12px;color:var(--steel);position:relative}
.header-action .icon{font-size:22px;line-height:1}
.header-action .badge{
  position:absolute;top:-6px;inset-inline-end:-10px;background:var(--red);color:#fff;
  font-size:10px;min-width:17px;height:17px;border-radius:50%;display:flex;align-items:center;justify-content:center;
}
@media (max-width:900px){.header-search{display:none}}

/* ============================================================
   5. CATEGORY MEGA NAV
   ============================================================ */
.mega-nav{background:var(--white);color:var(--ink);border-inline-end:1px solid var(--line)}
.mega-nav .container{position:relative}
.mega-nav > .container > ul{display:flex;align-items:stretch}
.mega-nav > .container > ul.menu-quick{border-top:1px solid var(--line);margin-top:10px;padding-top:6px}
.menu-heading{font-family:var(--font-head);font-size:13px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);padding:14px 18px 4px}
.mega-nav > .container > ul > li{position:relative}
.mega-nav > .container > ul > li > a{
  display:block;padding:13px 18px;font-family:var(--font-head);font-size:16px;letter-spacing:.3px;white-space:nowrap;
  color:var(--ink);border-bottom:1px solid transparent;
}
.mega-nav > .container > ul > li:hover > a,
.mega-nav > .container > ul > li > a:focus{background:var(--paper-2);color:var(--red)}
.menu-toggle{display:none}

/* Sub-menu = mega dropdown, columns styled automatically */
.mega-nav li ul{
  display:none;position:absolute;top:100%;inset-inline-start:0;
  background:var(--white);color:var(--ink);min-width:640px;max-width:calc(100vw - 40px);
  padding:22px 26px;border-top:3px solid var(--red);
  box-shadow:0 14px 30px rgba(0,0,0,.18);
  columns:3;column-gap:26px;z-index:70;
}
.mega-nav li:hover > ul{display:block}
.mega-nav li ul li{break-inside:avoid;margin-bottom:6px}
.mega-nav li ul li a{
  display:block;padding:7px 4px;font-size:14px;border-bottom:1px dashed var(--line);
}
.mega-nav li ul li a:hover{color:var(--red)}
/* nested (third level) collapses inline under parent, no extra flyout */
.mega-nav li ul li ul{position:static;display:block;box-shadow:none;border:0;padding:2px 0 6px 12px;columns:1;min-width:0}
.mega-nub{font-size:11px;background:var(--yellow);color:#3a2a00;padding:2px 6px;border-radius:2px;margin-inline-start:6px}

@media (max-width:1024px){
  .mega-nav{position:fixed;inset-inline-start:0;top:0;bottom:0;width:300px;
    transform:translateX(-105%);transition:transform .2s ease;overflow-y:auto;z-index:120}
  html[dir="rtl"] .mega-nav{transform:translateX(105%)}
  .mega-nav.is-open{transform:translateX(0)}
  .mega-nav > .container{padding:70px 16px 30px}
  .mega-nav > .container > ul{flex-direction:column}
  .mega-nav > .container > ul > li > a{border-bottom:1px solid var(--line)}
  .mega-nav li ul{position:static;display:none;box-shadow:none;border:0;columns:1;min-width:0;background:var(--paper)}
  .mega-nav li.is-open > ul{display:block}
  .menu-toggle{
    display:flex !important;align-items:center;gap:8px;background:none;border:0;color:var(--steel);
    font-family:var(--font-head);font-size:16px;cursor:pointer;padding:12px 0;flex-shrink:0;margin-left:0.5cm;
  }
}
@media (max-width:400px){
  .header-main{gap:10px}
  .site-logo-image{height:40px}
  .header-action{font-size:11px}
  .header-action .icon{font-size:20px}
}

/* ============================================================
   6. HERO SLIDER
   ============================================================ */
.hero-slider{position:relative;overflow:hidden;background:var(--steel)}
.hero-slide{
  display:none;position:relative;min-height:340px;background-size:cover;background-position:center;
  align-items:center;
}
.hero-slide.is-active{display:flex}
.hero-slide::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.15))}
.hero-slide .container{position:relative;z-index:2}
.hero-copy{max-width:560px;color:#fff}
.hero-eyebrow{color:var(--yellow);font-family:var(--font-head);font-size:15px;margin-bottom:8px}
.hero-copy h2{color:#fff;font-size:clamp(28px,4vw,46px);margin-bottom:14px}
.hero-copy p{margin:0 0 20px;color:#e9e9e9}
.hero-dots-wrap{position:absolute;bottom:16px;inset-inline-start:0;inset-inline-end:0;z-index:3;pointer-events:none}
.hero-dots{display:flex;justify-content:flex-end;gap:8px;pointer-events:auto}
.hero-dots button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(255,255,255,.5);cursor:pointer}
.hero-dots button.is-active{background:var(--red)}
.hero-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;background:rgba(0,0,0,.35);color:#fff;
  border:0;width:38px;height:38px;border-radius:50%;cursor:pointer;font-size:18px;
}
.hero-arrow.prev{inset-inline-start:14px}
.hero-arrow.next{inset-inline-end:14px}
.hero-arrow:hover{background:var(--red)}

/* ============================================================
   7. TRUST STRIP
   ============================================================ */
.trust-strip{background:var(--white);border-bottom:1px solid var(--line)}
.trust-strip .container{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:20px}
.trust-item{display:flex;align-items:center;gap:12px}
.trust-item .icon{font-size:26px;color:var(--red)}
.trust-item strong{display:block;font-family:var(--font-head);font-size:15px}
.trust-item span{color:var(--muted);font-size:12.5px}
@media (max-width:900px){.trust-strip .container{grid-template-columns:repeat(2,1fr)}}

/* ============================================================
   8. CATEGORY TILES
   ============================================================ */
.cat-tiles{padding:38px 0 6px}
.cat-tiles-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.cat-tile{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  text-align:center;padding:18px 8px;transition:border-color .15s, transform .15s;
}
.cat-tile:hover{border-color:var(--red);transform:translateY(-3px)}
.cat-tile img{width:44px;height:44px;object-fit:contain;margin:0 auto 10px}
.cat-tile span{font-family:var(--font-head);font-size:14px}
@media (max-width:900px){.cat-tiles-grid{grid-template-columns:repeat(3,1fr)}}

/* ============================================================
   9. PRODUCT SECTIONS / CARDS
   ============================================================ */
.shop-section{padding:34px 0}
.shop-section.alt{background:var(--paper-2)}
.section-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:20px;gap:16px;flex-wrap:wrap}
.section-head a.view-all{font-family:var(--font-head);color:var(--red);white-space:nowrap}
.section-head a.view-all:hover{color:var(--red-dark)}

ul.products{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
/* WooCommerce gives products a percentage width/float by default.
   Reset those values so the theme's CSS Grid can size each card correctly. */
ul.products::before,ul.products::after{display:none !important;content:none !important}
ul.products li.product{
  width:auto !important;
  max-width:none !important;
  float:none !important;
  clear:none !important;
  margin:0 !important;
  list-style:none;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:14px;position:relative;transition:box-shadow .15s, transform .15s;
}
ul.products li.product:hover{box-shadow:0 10px 24px rgba(0,0,0,.10);transform:translateY(-3px)}
ul.products li.product a img{display:block;width:100%;height:auto;max-width:100%;border-radius:2px;aspect-ratio:1/1;object-fit:contain;background:var(--paper)}
ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--font-body);font-weight:600;font-size:13.5px;color:var(--ink);
  margin:10px 0 6px;line-height:1.4;min-height:2.8em;
}
ul.products li.product .price{font-family:var(--font-head);font-size:18px;color:var(--red);font-weight:700}
ul.products li.product .price del{color:var(--muted);font-size:13px;font-weight:400;margin-inline-end:6px}
ul.products li.product .price ins{text-decoration:none}
ul.products li.product .button{
  display:block;margin-top:10px;text-align:center;background:var(--steel);color:#fff !important;
  padding:9px;border-radius:2px;font-family:var(--font-head);font-size:14px;
}
ul.products li.product .button:hover{background:var(--red)}
ul.products li.product .added_to_cart{display:block;text-align:center;font-size:12px;margin-top:6px}

/* Sale / New badges */
ul.products li.product .onsale{
  position:absolute;top:10px;inset-inline-start:10px;background:var(--red);color:#fff;
  font-family:var(--font-head);font-size:12px;padding:3px 10px;border-radius:2px;z-index:2;min-height:0;line-height:1.6;
}
.badge-new{
  position:absolute;top:10px;inset-inline-end:10px;background:var(--yellow);color:#3a2a00;
  font-family:var(--font-head);font-size:12px;padding:3px 10px;border-radius:2px;z-index:2;
}
.badge-oos{
  position:absolute;top:10px;inset-inline-end:10px;background:var(--muted);color:#fff;
  font-family:var(--font-head);font-size:12px;padding:3px 10px;border-radius:2px;z-index:2;
}

@media (max-width:1150px){ul.products{grid-template-columns:repeat(4,1fr)}}
@media (max-width:860px){ul.products{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){ul.products{grid-template-columns:repeat(2,1fr)}.cat-tiles-grid{grid-template-columns:repeat(2,1fr)}}
/* Horizontal product shelves: products stay side-by-side and can be browsed right-to-left. */
ul.products{
  display:flex !important;
  flex-wrap:nowrap !important;
  flex-direction:row !important;
  direction:ltr;
  overflow-x:auto;
  overflow-y:hidden;
  gap:16px;
  scroll-snap-type:x proximity;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
  padding:4px 2px 12px !important;
}
ul.products li.product{
  flex:0 0 calc((100% - 64px)/5) !important;
  scroll-snap-align:start;
}
ul.products::-webkit-scrollbar{height:6px}
ul.products::-webkit-scrollbar-thumb{background:#c8c8c8;border-radius:20px}
/* Homepage shelves use the same horizontal behavior. */
.products-section ul.products,.promo-section ul.products{display:flex !important;flex-wrap:nowrap !important;grid-template-columns:none !important}
.products-section ul.products li.product,.promo-section ul.products li.product{flex:0 0 calc((100% - 64px)/5) !important}
/* Category cards can also be browsed horizontally when there are many categories. */
.category-grid{display:flex;flex-wrap:nowrap;overflow-x:auto;direction:rtl;gap:14px;padding:3px 2px 12px;scroll-snap-type:x proximity;scrollbar-width:thin}
.category-card{flex:0 0 calc((100% - 70px)/6);scroll-snap-align:start}
.category-grid::-webkit-scrollbar{height:6px}.category-grid::-webkit-scrollbar-thumb{background:#c8c8c8;border-radius:20px}
@media(max-width:1100px){ul.products li.product,.products-section ul.products li.product,.promo-section ul.products li.product{flex-basis:calc((100% - 48px)/4) !important}.category-card{flex-basis:calc((100% - 42px)/4)}}
@media(max-width:800px){ul.products li.product,.products-section ul.products li.product,.promo-section ul.products li.product{flex-basis:calc((100% - 32px)/3) !important}.category-card{flex-basis:calc((100% - 28px)/3)}}
@media(max-width:480px){ul.products{gap:10px}.products-section ul.products,.promo-section ul.products{gap:10px}.products-section ul.products li.product,.promo-section ul.products li.product,ul.products li.product{flex-basis:calc((100% - 10px)/2) !important}.category-grid{gap:10px}.category-card{flex-basis:calc((100% - 10px)/2)}}


/* ============================================================
   10. WOOCOMMERCE GENERIC PAGES (shop/category/single/cart)
   ============================================================ */
.site-main.woocommerce-page{display:block;padding:28px 0}
.woocommerce-breadcrumb{font-size:13px;color:var(--muted);margin-bottom:16px}
.woocommerce-breadcrumb a{color:var(--muted)}
.woocommerce-breadcrumb a:hover{color:var(--red)}
.woocommerce-ordering select{border:1px solid var(--line);padding:8px 10px;border-radius:2px}
.woocommerce div.product .summary .price{color:var(--red);font-family:var(--font-head);font-size:26px}
.woocommerce div.product form.cart .button{
  background:var(--red);color:#fff;font-family:var(--font-head);font-size:16px;padding:12px 26px;border-radius:2px;
}
.woocommerce div.product form.cart .button:hover{background:var(--red-dark)}
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
  background:var(--steel);color:#fff;border-radius:2px;font-family:var(--font-head);
}
.woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover{background:var(--red)}
.woocommerce-tabs ul.tabs li a{font-family:var(--font-head)}
.star-rating{color:var(--yellow)}

/* ============================================================
   11. FOOTER
   ============================================================ */
.site-footer{background:var(--steel);color:#cfcfcf;margin-top:40px;font-size:14px}
.footer-top{padding:44px 0;border-bottom:1px solid #3a3a3a}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:32px;position:relative;left:0.3cm}
.footer-grid h4{color:#fff;font-size:17px;margin-bottom:14px}
.footer-grid ul li{margin-bottom:9px}
.footer-grid ul li a:hover{color:var(--yellow)}
.footer-about p{color:#a9a9a9}
.footer-social{display:flex;gap:10px;margin-top:14px}
.footer-social a{
  width:34px;height:34px;border-radius:50%;border:1px solid #4a4a4a;display:flex;align-items:center;justify-content:center;
}
.footer-social a:hover{background:var(--red);border-color:var(--red)}
.footer-bottom{padding:16px 0;font-size:13px;color:#9c9c9c;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.souko-copyright{position:relative;top:-0.3cm;right:-0.3cm}
@media (max-width:600px){
  .footer-bottom{flex-direction:column;align-items:center;text-align:center;gap:4px;padding-bottom:110px}
}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr}}

/* Floating contact buttons */
.floating-contacts{position:fixed;bottom:22px;inset-inline-end:22px;display:flex;flex-direction:column;gap:10px;z-index:90}
.floating-contacts a{
  width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:24px;box-shadow:0 6px 16px rgba(0,0,0,.25);
}
.floating-contacts .wa{background:#25D366}
.floating-contacts .fb{background:#0084FF}

/* Mobile nav overlay */
.menu-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:110}
@media (max-width:1024px){.mega-nav.is-open ~ #menuOverlay{display:block}}

/* Back to top */
#back-to-top{
  position:fixed;bottom:22px;inset-inline-start:22px;width:42px;height:42px;border-radius:50%;background:var(--steel);
  color:#fff;border:0;display:none;align-items:center;justify-content:center;cursor:pointer;z-index:90;
}
#back-to-top.show{display:flex}

/* ============================================================
   16. CHEK-STYLE STOREFRONT / PRODUCT DETAIL
   ============================================================ */
.service-strip{background:#fff;border-bottom:1px solid var(--line)}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.service-grid>div{display:grid;grid-template-columns:42px 1fr;column-gap:10px;padding:18px 14px;border-inline-end:1px solid var(--line)}
.service-grid>div:last-child{border-inline-end:0}
.service-grid span{grid-row:1/3;font-size:25px;display:flex;align-items:center;justify-content:center}
.service-grid strong{font-size:14px}.service-grid small{color:var(--muted);font-size:11px}
.home-section{padding:42px 0}.home-section:nth-of-type(even){background:#fafafa}
.section-head{align-items:end;margin-bottom:22px}.section-head h2{margin:2px 0 0;font-size:30px}.section-head>a{color:var(--red);font-weight:700;font-size:13px}
.section-kicker{font-size:11px;letter-spacing:1.5px;color:var(--red);font-weight:800}
.category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.category-card{background:#fff;border:1px solid var(--line);padding:14px;text-align:center;transition:.18s;min-width:0}
.category-card:hover{transform:translateY(-3px);border-color:var(--red);box-shadow:0 10px 24px rgba(0,0,0,.08)}
.category-card img{width:100%;height:120px;object-fit:contain;margin-bottom:10px}.category-card span{display:block;font-weight:700;font-size:14px;line-height:1.3}.category-card small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.category-placeholder{height:120px;display:grid;place-items:center;background:#f3f3f3;font-weight:800;color:#888;margin-bottom:10px}
.products-section ul.products,.promo-section ul.products{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.products-section ul.products li.product,.promo-section ul.products li.product{padding:0 0 14px;overflow:hidden;border:1px solid #e4e4e4;border-radius:0;background:#fff}
.products-section ul.products li.product>a.woocommerce-LoopProduct-link,.promo-section ul.products li.product>a.woocommerce-LoopProduct-link{display:block;padding:12px}
.products-section ul.products li.product a img,.promo-section ul.products li.product a img{width:100%;height:210px;object-fit:contain;background:#fff;margin:0 0 8px}
.products-section ul.products li.product .woocommerce-loop-product__title,.promo-section ul.products li.product .woocommerce-loop-product__title{padding:0 12px;margin:4px 0 7px;font-size:14px;min-height:40px}
.products-section ul.products li.product .price,.promo-section ul.products li.product .price{padding:0 12px;font-size:18px}
.products-section ul.products li.product .button,.promo-section ul.products li.product .button{margin:10px 12px 0}
.product-page{padding:28px 0 50px}.product-page .woocommerce-breadcrumb{margin-bottom:20px}.souko-single-product{background:#fff}
.product-main-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:42px;align-items:start}
.product-gallery-col{min-width:0}.product-summary-col{position:relative;padding:4px 0}.product-summary-col .product_title{font-size:32px;line-height:1.2;margin:8px 0 15px}.product-summary-col .price{font-size:28px!important;font-weight:800}.product-summary-col .woocommerce-product-details__short-description{font-size:14px;line-height:1.8;color:#555;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;margin:16px 0}
.product-info-boxes{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);margin-top:18px}.product-info-boxes div{padding:12px;border-inline-end:1px solid var(--line)}.product-info-boxes div:last-child{border-inline-end:0}.product-info-boxes strong,.product-info-boxes span{display:block}.product-info-boxes strong{font-size:11px;color:var(--muted);margin-bottom:4px}.product-info-boxes span{font-weight:700;font-size:13px}
.souko-single-product .woocommerce-product-gallery{width:100%!important;float:none!important}.souko-single-product .woocommerce-product-gallery__wrapper{margin:0}.souko-single-product .woocommerce-product-gallery__image{background:#fff;border:1px solid var(--line)}.souko-single-product .woocommerce-product-gallery__image img{width:100%;height:auto;max-height:560px;object-fit:contain}
.souko-single-product .flex-control-thumbs{display:grid!important;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px!important}.souko-single-product .flex-control-thumbs li{width:auto!important;float:none!important;margin:0!important}.souko-single-product .flex-control-thumbs img{height:90px;object-fit:contain;border:1px solid var(--line)}
.product-details-area{margin-top:44px}.product-details-area .woocommerce-tabs{border-top:1px solid var(--line);padding-top:24px}.product-details-area .woocommerce-tabs ul.tabs{padding:0!important;margin:0 0 20px!important;display:flex;gap:4px}.product-details-area .woocommerce-tabs ul.tabs:before{display:none!important}.product-details-area .woocommerce-tabs ul.tabs li{background:#f5f5f5!important;border:0!important;border-radius:0!important;margin:0!important}.product-details-area .woocommerce-tabs ul.tabs li.active{background:var(--red)!important}.product-details-area .woocommerce-tabs ul.tabs li a{color:#222!important}.product-details-area .woocommerce-tabs ul.tabs li.active a{color:#fff!important}.product-details-area .related.products{margin-top:40px}.product-details-area .related.products>h2,.product-details-area .up-sells>h2{font-size:25px}
.woocommerce div.product form.cart .button{border-radius:2px;padding:12px 25px;font-size:15px}.woocommerce div.product form.cart div.quantity input.qty{height:44px}
@media(max-width:1100px){.category-grid{grid-template-columns:repeat(4,1fr)}.products-section ul.products,.promo-section ul.products{grid-template-columns:repeat(4,minmax(0,1fr))}.product-main-grid{grid-template-columns:1fr 1fr}}
@media(max-width:800px){.service-grid{grid-template-columns:repeat(2,1fr)}.service-grid>div:nth-child(2){border-inline-end:0}.category-grid{grid-template-columns:repeat(3,1fr)}.products-section ul.products,.promo-section ul.products{grid-template-columns:repeat(2,minmax(0,1fr))}.product-main-grid{grid-template-columns:1fr}.product-summary-col .product_title{font-size:25px}}
@media(max-width:480px){.service-grid{grid-template-columns:1fr}.service-grid>div{border-inline-end:0;border-bottom:1px solid var(--line)}.category-grid{grid-template-columns:repeat(2,1fr)}.products-section ul.products,.promo-section ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.products-section ul.products li.product a img,.promo-section ul.products li.product a img{height:150px}.section-head h2{font-size:24px}.product-info-boxes{grid-template-columns:1fr}}

/* ============================================================
   QUICK ORDER FORM — inspired by the supplied Souk Outillage UI
============================================================ */
.souko-quick-order{margin:22px 0 10px;padding:0}
.souko-order-heading{font-family:var(--font-body);font-size:20px;text-align:center;font-weight:800;color:#202020;margin:0 0 20px}
.souko-order-form{width:100%}
.souko-order-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px 28px}
.souko-field{position:relative;display:flex;align-items:center;min-height:58px;background:#fff;border:3px solid #c6ae73;border-radius:3px;overflow:hidden;direction:rtl}
.souko-field-green{border-color:#69bd3b}
.souko-field-icon{flex:0 0 42px;text-align:center;font-size:21px;line-height:1}
.souko-field input,.souko-field select{width:100%;height:52px;border:0!important;outline:0!important;background:#fff!important;box-shadow:none!important;padding:8px 12px 8px 8px;font-family:var(--font-body);font-size:18px;font-weight:600;color:#333;text-align:right}
.souko-field input::placeholder{color:#5a5a5a;opacity:1}
.souko-field select{appearance:auto;cursor:pointer}
.souko-field:focus-within{box-shadow:0 0 0 2px rgba(105,189,59,.14)}
.souko-quick-order-actions{margin-top:18px;display:flex;justify-content:flex-end}
.souko-confirm-order{width:100%;min-height:58px;border:0;border-radius:4px;background:#a8790b;color:#fff;font-family:var(--font-body);font-size:21px;font-weight:800;cursor:pointer;padding:12px 20px;box-shadow:none}
.souko-confirm-order:hover{background:#8e6509}
.souko-whatsapp-order{display:flex;align-items:center;justify-content:center;width:max-content;max-width:100%;margin:14px auto 0;padding:12px 24px;background:#25d366;color:#fff;border-radius:32px;font-family:var(--font-body);font-size:18px;font-weight:700;line-height:1.2}
.souko-whatsapp-order:hover{background:#1fb857;color:#fff}
.souko-order-summary{margin-top:26px;background:#eef8ff;border-radius:4px;overflow:hidden}
.souko-summary-head{min-height:62px;display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:4px solid #b99b5a;color:#263238;font-size:21px}
.souko-summary-head>span{font-size:26px}.souko-summary-head strong{font-weight:800}.souko-summary-toggle{margin-inline-start:auto;border:0;background:transparent;font-size:38px;line-height:1;cursor:pointer;color:#b99b5a;transform:translateY(-4px)}
.souko-summary-body{padding:16px 20px 20px}
.souko-summary-product{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:6px 0 16px;border-bottom:3px dotted #b7b7a5;font-size:17px;font-weight:700}
.souko-summary-name{max-width:70%;line-height:1.45}.souko-summary-qty{white-space:nowrap;display:flex;gap:6px;align-items:center;direction:ltr}.souko-summary-qty b{background:#a8790b;color:#fff;padding:2px 8px;border-radius:3px}
.souko-summary-row{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:3px dotted #b7b7a5;font-size:17px;font-weight:600}.souko-summary-row:last-child{border-bottom:0}.souko-summary-row strong{font-size:20px;color:#8b6200}
.souko-order-status{font-size:14px;text-align:center;color:#b31712;font-weight:700;margin-top:8px;min-height:0}
.souko-delivery{margin-top:16px;background:#fff;border:3px solid #c6ae73;border-radius:3px;padding:12px 14px;direction:rtl}
.souko-delivery-label{display:block;font-family:var(--font-body);font-size:15px;font-weight:800;color:#333;margin-bottom:10px}
.souko-delivery-options{display:flex;flex-direction:column;gap:8px}
.souko-delivery-option{display:flex;align-items:center;gap:10px;padding:10px 12px;border:2px solid #e2dbc8;border-radius:3px;cursor:pointer;font-family:var(--font-body);font-size:16px;font-weight:700;color:#333;background:#fbf9f3}
.souko-delivery-option input{width:18px;height:18px;flex:0 0 auto;cursor:pointer}
.souko-delivery-option-label{flex:1 1 auto}
.souko-delivery-option-cost{color:#8b6200;font-weight:800;white-space:nowrap}
.souko-delivery-option:has(input:checked){border-color:#a8790b;background:#fdf3df}
.souko-delivery-single{padding:10px 12px;font-family:var(--font-body);font-size:16px;font-weight:700;color:#333}
@media(max-width:800px){
  .souko-delivery-option{font-size:15px;padding:9px 10px}
}
.woocommerce div.product form.cart{margin-bottom:0}
@media(max-width:800px){
  .souko-order-fields{grid-template-columns:1fr;gap:12px}
  .souko-order-heading{font-size:19px}
  .souko-field{min-height:57px}
  .souko-field input,.souko-field select{font-size:17px}
  .souko-confirm-order{font-size:19px}
  .souko-summary-body{padding:14px}
  .souko-summary-product,.souko-summary-row{font-size:15px}
  .souko-summary-name{max-width:64%}
}

/* ============================================================
   ORDER RECEIVED / THANK YOU — Souko style
============================================================ */
.woocommerce-order-received .woocommerce-page,
.woocommerce-order-received .site-main{background:#fff}
.souko-thankyou-message{
  margin:0 auto 26px;
  padding:28px 22px;
  text-align:center;
  background:#fff;
  border:1px solid #eadfca;
  border-top:5px solid #a8790b;
  box-shadow:0 8px 24px rgba(0,0,0,.05);
  border-radius:4px;
}
.souko-thankyou-message h2{margin:0 0 10px;font-size:30px;font-weight:800;color:#a8790b}
.souko-thankyou-message p{margin:5px 0;font-size:18px;font-weight:700;color:#333}
.woocommerce-order-received .woocommerce-order{max-width:980px;margin:0 auto;padding:10px 0 45px}
.woocommerce-order-received .woocommerce-order ul.order_details{margin:0 0 22px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.woocommerce-order-received .woocommerce-order ul.order_details li{float:none;width:auto;margin:0;padding:14px;background:#eef8ff;border:1px solid #dcecf5;border-radius:4px;text-align:center}
.woocommerce-order-received .woocommerce-order .woocommerce-order-details,
.woocommerce-order-received .woocommerce-order .woocommerce-customer-details{background:#fff;border:1px solid #e5e5e5;padding:20px;margin-top:18px}
.woocommerce-order-received .woocommerce-order h2{font-size:23px;margin-top:0}
.woocommerce-order-received .woocommerce-order table.shop_table{border-collapse:collapse;border:1px solid #e4e4e4}
.woocommerce-order-received .woocommerce-order table.shop_table th,
.woocommerce-order-received .woocommerce-order table.shop_table td{padding:13px 12px;border-bottom:1px solid #e7e7e7}
.woocommerce-order-received .woocommerce-order table.shop_table tfoot th{color:#555}
.woocommerce-order-received .woocommerce-order .woocommerce-customer-details address{border:0;background:#f8fafb;padding:16px;line-height:1.9}
@media(max-width:650px){
  .souko-thankyou-message{padding:22px 14px}
  .souko-thankyou-message h2{font-size:24px}
  .souko-thankyou-message p{font-size:16px}
  .woocommerce-order-received .woocommerce-order ul.order_details{grid-template-columns:1fr}
  .woocommerce-order-received .woocommerce-order .woocommerce-order-details,
  .woocommerce-order-received .woocommerce-order .woocommerce-customer-details{padding:14px}
  .woocommerce-order-received .woocommerce-order table.shop_table th,
  .woocommerce-order-received .woocommerce-order table.shop_table td{padding:10px 7px;font-size:13px}
}

.woocommerce-order-received .woocommerce-order .woocommerce-notice--success{display:none}

/* Horizontal shelves: browse from left to right. */
ul.products,
.products-section ul.products,
.promo-section ul.products{direction:ltr !important;}
ul.products li.product{direction:rtl;}
.category-grid{direction:ltr !important;}

/* عرض الأسعار بشكل صحيح داخل RTL: 1300 د.ج */
.souko-price-ltr,.souko-delivery-option-cost{direction:ltr;unicode-bidi:isolate;white-space:nowrap}

/* ============================================================
   صفحات المتجر (Tous les produits / Promotions / Les plus vendus / الفئات / البحث):
   شبكة عادية تنكسر لأسطر بدل الشريط الأفقي، وبطاقات بنفس شكل الصفحة الرئيسية.
============================================================ */
body.post-type-archive-product ul.products,
body.tax-product_cat ul.products,
body.tax-product_tag ul.products,
body.search ul.products{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:16px !important;
  flex-wrap:wrap !important;
  overflow:visible !important;
  scroll-snap-type:none;
  direction:rtl !important;
  padding:4px 0 12px !important;
}
body.post-type-archive-product ul.products li.product,
body.tax-product_cat ul.products li.product,
body.tax-product_tag ul.products li.product,
body.search ul.products li.product{
  flex:none !important;
  width:auto !important;
  min-width:0;
  padding:0 0 14px;
  overflow:hidden;
  border:1px solid #e4e4e4;
  border-radius:0;
  background:#fff;
  display:flex;
  flex-direction:column;
}
body.post-type-archive-product ul.products li.product>a.woocommerce-LoopProduct-link,
body.tax-product_cat ul.products li.product>a.woocommerce-LoopProduct-link,
body.tax-product_tag ul.products li.product>a.woocommerce-LoopProduct-link,
body.search ul.products li.product>a.woocommerce-LoopProduct-link{display:block;padding:12px 12px 0;flex:1 1 auto}
body.post-type-archive-product ul.products li.product a img,
body.tax-product_cat ul.products li.product a img,
body.tax-product_tag ul.products li.product a img,
body.search ul.products li.product a img{width:100%;height:210px;object-fit:contain;background:#fff;margin:0 0 8px}
body.post-type-archive-product ul.products li.product .woocommerce-loop-product__title,
body.tax-product_cat ul.products li.product .woocommerce-loop-product__title,
body.tax-product_tag ul.products li.product .woocommerce-loop-product__title,
body.search ul.products li.product .woocommerce-loop-product__title{
  padding:0;margin:4px 0 7px;font-size:14px;line-height:1.45;min-height:40px;
  overflow-wrap:anywhere;word-break:normal;
}
body.post-type-archive-product ul.products li.product .price,
body.tax-product_cat ul.products li.product .price,
body.tax-product_tag ul.products li.product .price,
body.search ul.products li.product .price{display:block;padding:0;font-size:18px}
body.post-type-archive-product ul.products li.product .button,
body.tax-product_cat ul.products li.product .button,
body.tax-product_tag ul.products li.product .button,
body.search ul.products li.product .button{margin:10px 12px 0;white-space:normal}

@media(max-width:1100px){
  body.post-type-archive-product ul.products,body.tax-product_cat ul.products,body.tax-product_tag ul.products,body.search ul.products{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
}
@media(max-width:800px){
  body.post-type-archive-product ul.products,body.tax-product_cat ul.products,body.tax-product_tag ul.products,body.search ul.products{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
}
@media(max-width:600px){
  body.post-type-archive-product ul.products,body.tax-product_cat ul.products,body.tax-product_tag ul.products,body.search ul.products{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important}
  body.post-type-archive-product ul.products li.product a img,body.tax-product_cat ul.products li.product a img,body.tax-product_tag ul.products li.product a img,body.search ul.products li.product a img{height:150px}
  body.post-type-archive-product ul.products li.product .button,body.tax-product_cat ul.products li.product .button,body.tax-product_tag ul.products li.product .button,body.search ul.products li.product .button{margin:10px 8px 0;font-size:13px;padding:9px 6px}
}

/* أسعار WooCommerce (المتجر، الفئات، السلة، صفحة المنتج): تظهر "17900 د.ج" داخل RTL */
.woocommerce-Price-amount,.woocommerce-Price-amount bdi{direction:ltr !important;unicode-bidi:isolate !important;white-space:nowrap}

/* نصوص بطاقات المنتجات باللون الأسود (العنوان والسعر) بدل الأزرق القادم من إعدادات/إضافات خارجية */
.woocommerce ul.products li.product a,
.woocommerce ul.products li.product a:visited,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price .amount,
.woocommerce ul.products li.product .price bdi,
.woocommerce ul.products li.product .woocommerce-Price-currencySymbol,
ul.products li.product a,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .price,
ul.products li.product .price .amount{
  color:#111 !important;
}
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount,
ul.products li.product .price del .amount{color:#777 !important}
/* زر "Ajouter au panier" يبقى أبيض على خلفية داكنة */
.woocommerce ul.products li.product a.button,
ul.products li.product a.button,
ul.products li.product .added_to_cart{color:#fff !important}

/* ============================================================
   المزايا داخل الخلفية السوداء (تحت "Voir les produits")
============================================================ */
.hero-stage{position:relative}
.hero-slider.has-services .hero-slide{min-height:300px}
.hero-services{position:relative;z-index:2;background:#111;border-top:1px solid rgba(255,255,255,.12)}
.hero-services .service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.hero-services .service-grid>div{display:grid;grid-template-columns:40px 1fr;column-gap:10px;align-items:center;padding:16px 14px;border-inline-end:1px solid rgba(255,255,255,.12);border-bottom:0}
.hero-services .service-grid>div:last-child{border-inline-end:0}
.hero-services .service-grid span{grid-row:1/3;font-size:24px;display:flex;align-items:center;justify-content:center;color:#fff}
.hero-services .service-grid strong{color:#fff;font-size:14px;line-height:1.3}
.hero-services .service-grid small{color:rgba(255,255,255,.65);font-size:11.5px;line-height:1.3}
@media (max-width:800px){
  .hero-slider.has-services .hero-slide{min-height:240px}
  .hero-services .service-grid{grid-template-columns:repeat(2,1fr)}
  .hero-services .service-grid>div{padding:12px 10px;grid-template-columns:30px 1fr;column-gap:8px}
  .hero-services .service-grid>div:nth-child(2){border-inline-end:0}
  .hero-services .service-grid>div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.12)}
  .hero-services .service-grid span{font-size:20px}
  .hero-services .service-grid strong{font-size:12.5px}
  .hero-services .service-grid small{font-size:10.5px}
}

/* ============================================================
   البحث على الهاتف: شريط بحث كامل تحت الشعار
============================================================ */
@media (max-width:900px){
  .header-main{flex-wrap:wrap;row-gap:10px;padding:10px 0}
  .header-search{display:block !important;order:10;flex:0 0 100%;max-width:none;padding:0 12px}
  .header-search form{border-width:1.5px;border-radius:8px}
  .header-search input[type="search"]{padding:10px 12px;font-size:16px;min-width:0}
  .header-search button{padding:0 16px;font-size:16px}
}

/* عنوان الواجهة أبيض فوق الخلفية السوداء */
.hero-copy h1{color:#fff}

/* الهاتف — الصفحة الرئيسية: شريط البحث تحت الخلفية السوداء وفوق المنتجات */
.home-mobile-search{display:none}
@media (max-width:900px){
  body.home .site-header .header-search{display:none !important}
  .home-mobile-search{display:block;background:var(--white);padding:14px 0;border-bottom:1px solid var(--line)}
  .home-mobile-search form{display:flex;border:1.5px solid var(--steel);border-radius:8px;overflow:hidden;background:var(--white)}
  .home-mobile-search input[type="search"]{flex:1;min-width:0;border:0;padding:11px 12px;font-size:16px;font-family:var(--font-body);background:var(--white)}
  .home-mobile-search button{background:var(--red);color:#fff;border:0;padding:0 16px;font-size:16px;cursor:pointer}
}

/* ============================================================
   الطلب من السلة
============================================================ */
.souko-cart-order{max-width:760px;margin:30px auto 10px;padding:18px 18px 22px;background:#fff;border:1px solid var(--line);border-radius:6px}
.souko-cart-order[hidden]{display:none}
.souko-cart-order .souko-quick-order{margin-top:0}
.souko-cart-hint{margin:14px 0 0;padding:10px 12px;background:#fbf9f3;border:1px dashed #d8c9a3;border-radius:4px;font-size:14px;line-height:1.7;color:#333}
.souko-cart-hint a{color:#8b6200;font-weight:700;text-decoration:underline}
#soukoSummaryItems .souko-summary-product + .souko-summary-product{padding-top:10px}
@media(max-width:600px){.souko-cart-order{margin:20px 0;padding:14px 12px 18px;border-radius:0;border-left:0;border-right:0}}

/* نص مخفي لقارئات الشاشة */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}

/* ============================================================
   بطاقات المنتجات: عنوان وسط، سعر أحمر، زر "Ajouter au panier" برتقالي
============================================================ */
ul.products li.product{text-align:center}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .woocommerce-loop-product__title{color:#4a4a4a !important;font-weight:500;text-align:center}
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price .amount,
.woocommerce ul.products li.product .price bdi,
.woocommerce ul.products li.product .woocommerce-Price-currencySymbol,
ul.products li.product .price,
ul.products li.product .price .amount{color:#e2231a !important}
ul.products li.product .price{display:block;text-align:center;font-weight:800}
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount,
.woocommerce ul.products li.product .price del bdi,
ul.products li.product .price del .amount{color:#999 !important}
.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product .button,
ul.products li.product .button{
  display:block !important;width:auto;margin:12px 12px 0 !important;padding:13px 10px !important;
  background:#f9b233 !important;color:#fff !important;border:0 !important;border-radius:5px !important;
  font-family:var(--font-body) !important;font-size:14px !important;font-weight:700 !important;
  text-transform:uppercase;letter-spacing:.3px;text-align:center;line-height:1.2;white-space:normal;
}
.woocommerce ul.products li.product a.button:hover,
ul.products li.product .button:hover{background:#eb9f12 !important;color:#fff !important}
.woocommerce ul.products li.product a.button.loading{opacity:.7}
.woocommerce ul.products li.product a.added_to_cart{color:#8b6200 !important;font-weight:600}
@media(max-width:600px){
  .woocommerce ul.products li.product a.button,ul.products li.product .button{margin:10px 8px 0 !important;font-size:12.5px !important;padding:11px 6px !important}
}

/* موضع العملة يتبع إعداد WooCommerce: نعزل رمز العملة حتى لا يقلب المتصفح ترتيب "د.ج 750" */
.woocommerce-Price-currencySymbol{unicode-bidi:isolate}

/* ============================================================
   صورة المنتج في البطاقة: تملأ عرض البطاقة كاملاً بدون فراغات جانبية
============================================================ */
ul.products li.product{padding-top:0 !important;overflow:hidden}
ul.products li.product > a.woocommerce-LoopProduct-link,
.products-section ul.products li.product > a.woocommerce-LoopProduct-link,
.promo-section ul.products li.product > a.woocommerce-LoopProduct-link,
body.post-type-archive-product ul.products li.product > a.woocommerce-LoopProduct-link,
body.tax-product_cat ul.products li.product > a.woocommerce-LoopProduct-link,
body.tax-product_tag ul.products li.product > a.woocommerce-LoopProduct-link,
body.search ul.products li.product > a.woocommerce-LoopProduct-link{padding:0 0 4px !important}
ul.products li.product a img,
.products-section ul.products li.product a img,
.promo-section ul.products li.product a img,
body.post-type-archive-product ul.products li.product a img,
body.tax-product_cat ul.products li.product a img,
body.tax-product_tag ul.products li.product a img,
body.search ul.products li.product a img{
  display:block;width:100% !important;max-width:none !important;height:auto !important;
  aspect-ratio:1/1;object-fit:cover !important;margin:0 0 10px !important;border-radius:0 !important;background:#fff;
}
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .price{padding-left:12px !important;padding-right:12px !important}
@media(max-width:600px){
  ul.products li.product .woocommerce-loop-product__title,
  ul.products li.product .price{padding-left:8px !important;padding-right:8px !important}
}
