/*
Theme Name: Strive Wear
Theme URI: https://example.com
Author: Strive Wear
Author URI: https://example.com
Description: ثيم ووردبريس مخصص لمتجر أحذية رجالية، متوافق مع WooCommerce. مبني بهوية "معبر المشاة" (خطوط صفراء + خلفية أسفلت).
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
Text Domain: strivewear
License: GNU General Public License v2 or later
License URI: LICENSE
Tags: e-commerce, woocommerce, rtl, custom-menu

WooCommerce compatible: yes
*/

:root{
  --ink:#12141c;
  --ink-soft:#1c2030;
  --paper:#f5f1e8;
  --paper-dim:#e7e1d2;
  --signal:#c9ccd1;
  --rust:#4f535a;
  --line:rgba(245,241,232,0.14);
  --line-strong:rgba(245,241,232,0.28);
}
*{box-sizing:border-box;}
body{
  background:var(--ink);
  color:var(--paper);
  font-family:'Cairo', sans-serif;
  line-height:1.6;
  margin:0;
}
h1,h2,h3,.brand-word{
  font-family:'Tajawal', sans-serif;
  font-weight:900;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 24px;}

.crosswalk{
  height:14px;
  background-image:repeating-linear-gradient(90deg, var(--signal) 0 34px, transparent 34px 58px);
  opacity:0.9;
}
.crosswalk.thin{height:8px;}
.crosswalk.dim{opacity:0.35;}

/* header */
.site-header{position:sticky; top:0; z-index:50; background:var(--ink); border-bottom:1px solid var(--line);}
.topbar{display:flex; align-items:center; justify-content:space-between; padding:16px 0; gap:20px; flex-wrap:wrap;}
.logo{display:flex; align-items:center; gap:10px; font-size:1.5rem;}
.logo .mark{
  width:34px; height:34px; border:2px solid var(--signal); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-family:'Tajawal'; font-weight:900; color:var(--signal); font-size:1rem;
}
.main-nav ul{display:flex; gap:28px; list-style:none; margin:0; padding:0; font-weight:600;}
.main-nav a{position:relative; padding:6px 2px; color:var(--paper-dim);}
.main-nav a:hover, .main-nav .current-menu-item a{color:var(--signal);}
.top-actions{display:flex; align-items:center; gap:18px;}
.icon-btn{
  display:flex; align-items:center; gap:6px; border:1px solid var(--line-strong);
  padding:8px 14px; border-radius:999px; font-size:0.85rem;
}
.icon-btn .count{
  background:var(--signal); color:var(--ink); font-weight:700; font-size:0.75rem;
  width:18px; height:18px; border-radius:50%; display:flex; align-items:center; justify-content:center;
}
.search-row{display:flex; align-items:center; border:1px solid var(--line-strong); border-radius:999px; padding:6px 14px;}
.search-row input{background:transparent; border:0; outline:0; color:var(--paper); font-family:'Cairo'; font-size:0.9rem;}

/* hero */
.hero{position:relative; padding:70px 0 60px; text-align:center;
  background: radial-gradient(ellipse at 50% 0%, rgba(255,193,69,0.10), transparent 60%), var(--ink);}
.hero.small{padding:40px 0 36px;}
.eyebrow{display:inline-flex; align-items:center; gap:10px; color:var(--signal); font-weight:700; font-size:0.85rem; letter-spacing:0.08em; margin-bottom:18px;}
.eyebrow .dash{width:26px; height:2px; background:var(--signal);}
.hero h1{font-size:clamp(2.2rem,5vw,3.6rem); line-height:1.15; max-width:780px; margin:0 auto 20px;}
.hero p.sub{color:var(--paper-dim); font-size:1.05rem; max-width:520px; margin:0 auto 30px;}
.hero-ctas{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
.btn{padding:14px 30px; border-radius:8px; font-weight:700; font-size:0.95rem; display:inline-block; cursor:pointer; border:none; font-family:'Cairo';}
.btn.solid{background:var(--signal); color:var(--ink);}
.btn.outline{border:1px solid var(--line-strong); color:var(--paper); background:transparent;}

/* section */
.section{padding:64px 0;}
.section.tight{padding:36px 0;}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:34px; gap:20px; flex-wrap:wrap;}
.section-head h2{font-size:clamp(1.5rem,3vw,2.1rem);}
.section-head p{color:var(--paper-dim); font-size:0.95rem; margin-top:6px;}

/* --- WooCommerce product loop (default markup) --- */
.woocommerce ul.products{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:22px;
  list-style:none; margin:0; padding:0;
}
.woocommerce ul.products li.product{
  background:var(--ink-soft); border:1px solid var(--line); border-radius:14px; overflow:hidden;
  padding:0 !important; transition:transform .25s, border-color .25s; text-align:right;
}
.woocommerce ul.products li.product:hover{transform:translateY(-4px); border-color:var(--line-strong);}
.woocommerce ul.products li.product a{color:var(--paper); text-decoration:none; display:block;}
.woocommerce ul.products li.product img{
  aspect-ratio:1/1; object-fit:cover; width:100%; border-radius:0; margin:0;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:1.02rem; font-weight:700; padding:16px 16px 4px; display:block;
}
.woocommerce ul.products li.product .price{
  padding:0 16px 16px; display:block; font-weight:700; color:var(--paper);
}
.woocommerce ul.products li.product .price del{color:var(--paper-dim); opacity:0.7;}
.woocommerce ul.products li.product .price ins{text-decoration:none; color:var(--signal);}
.woocommerce ul.products li.product .button{
  margin:0 16px 18px; display:inline-block; background:var(--paper); color:var(--ink) !important;
  padding:8px 16px; border-radius:8px; font-size:0.82rem; font-weight:700;
}
.woocommerce ul.products li.product .button:hover{background:var(--signal);}
.woocommerce ul.products li.product .onsale{
  position:absolute; top:12px; right:12px; background:var(--rust); color:var(--paper);
  font-size:0.72rem; font-weight:700; padding:4px 10px; border-radius:999px; min-height:0; min-width:0; line-height:1;
}
.woocommerce div.product{position:relative;}

/* --- single product page (default markup) --- */
.woocommerce div.product div.images{margin-bottom:24px;}
.woocommerce div.product div.images img{border-radius:16px; border:1px solid var(--line);}
.woocommerce div.product .summary{}
.woocommerce div.product .summary h1.product_title{font-size:clamp(1.6rem,3vw,2.2rem); margin:10px 0 14px; font-family:'Tajawal'; font-weight:900;}
.woocommerce div.product .summary .price{font-size:1.7rem; font-weight:800; color:var(--paper); display:block; margin-bottom:18px;}
.woocommerce div.product .summary .price del{color:var(--paper-dim); font-size:1rem; opacity:0.7;}
.woocommerce div.product .summary .price ins{text-decoration:none; color:var(--signal);}
.woocommerce div.product form.cart{margin-bottom:20px;}
.woocommerce div.product form.cart .button{
  background:var(--signal); color:var(--ink); font-weight:700; padding:14px 30px;
  border-radius:8px; border:none; cursor:pointer; font-family:'Cairo';
}
.woocommerce div.product form.cart .quantity input{
  background:var(--ink); border:1px solid var(--line-strong); color:var(--paper);
  border-radius:8px; padding:10px; width:64px; text-align:center; font-family:'Cairo';
}
.woocommerce .woocommerce-product-attributes, .woocommerce-tabs{
  margin-top:30px; border-top:1px solid var(--line); padding-top:20px;
}
.woocommerce .woocommerce-product-attributes th, .woocommerce .woocommerce-product-attributes td{
  color:var(--paper-dim); padding:8px 0; border-bottom:1px solid var(--line);
}

/* --- cart & checkout (default markup) --- */
.woocommerce table.shop_table{width:100%; border-collapse:collapse; margin-bottom:24px;}
.woocommerce table.shop_table th, .woocommerce table.shop_table td{
  padding:14px 10px; border-bottom:1px solid var(--line); text-align:right;
}
.woocommerce table.shop_table img{width:64px; height:64px; object-fit:cover; border-radius:8px;}
.woocommerce #payment{background:var(--ink-soft); border:1px solid var(--line); border-radius:14px; padding:20px;}
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select{
  background:var(--ink); border:1px solid var(--line-strong); color:var(--paper); border-radius:8px;
  padding:12px 14px; font-family:'Cairo'; width:100%;
}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
  background:var(--signal); color:var(--ink); font-weight:700; padding:12px 24px;
  border-radius:8px; border:none; cursor:pointer; font-family:'Cairo';
}
.woocommerce-message, .woocommerce-info, .woocommerce-error{
  background:var(--ink-soft); border-inline-start:3px solid var(--signal);
  padding:14px 18px; border-radius:8px; list-style:none; margin-bottom:20px; color:var(--paper);
}

/* categories grid (custom shortcode/template use) */
.cat-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px;}
.cat-card{position:relative; border-radius:14px; overflow:hidden; aspect-ratio:4/3; background:var(--paper-dim);}
.cat-card img{width:100%; height:100%; object-fit:cover; opacity:0.88;}
.cat-card .overlay{
  position:absolute; inset:0; background:linear-gradient(0deg, rgba(18,20,28,0.9), rgba(18,20,28,0.05) 55%);
  display:flex; align-items:flex-end; padding:18px;
}
.cat-card .overlay span{font-weight:800; font-size:1.1rem; font-family:'Tajawal';}

/* info cards (shipping/payment page templates) */
.info-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px;}
.info-card{background:var(--ink-soft); border:1px solid var(--line); border-radius:14px; padding:26px;}
.info-card .icon{
  width:44px; height:44px; border-radius:10px; background:rgba(255,193,69,0.12); color:var(--signal);
  display:flex; align-items:center; justify-content:center; font-weight:800; margin-bottom:16px; font-size:1.1rem;
}
.info-card h3{font-size:1.05rem; margin-bottom:8px;}
.info-card p{color:var(--paper-dim); font-size:0.9rem;}

/* footer */
.site-footer{background:var(--ink-soft); padding-top:50px;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:30px; padding-bottom:40px;}
.foot-brand p{color:var(--paper-dim); font-size:0.9rem; margin-top:12px; max-width:280px;}
.foot-col h4{font-size:0.95rem; margin-bottom:16px; color:var(--signal);}
.foot-col ul{list-style:none; margin:0; padding:0;}
.foot-col li{margin-bottom:10px; font-size:0.9rem; color:var(--paper-dim);}
.foot-col a:hover{color:var(--signal);}
.foot-bottom{
  border-top:1px solid var(--line); padding:20px 0; display:flex; justify-content:space-between;
  align-items:center; flex-wrap:wrap; gap:10px; font-size:0.82rem; color:var(--paper-dim);
}

@media (max-width:860px){
  .main-nav{display:none;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .woocommerce div.product{display:block;}
}