/* =======================================
   نوروین - CSS اصلی - نسخه ریسپانسیو کامل
   ======================================= */

:root {
  --primary:      #2563EB;
  --primary-dark: #1d4ed8;
  --primary-light:#60a5fa;
  --primary-50:   #eff6ff;
  --primary-100:  #dbeafe;
  --secondary:    #1e3a5f;
  --secondary-dark:#0d1b2a;
  --accent:       #F4A261;
  --accent-dark:  #e2823c;
  --accent-light: #fde3c7;
  --success:      #2A9D8F;
  --success-light:#e6f7f5;
  --warning:      #F4A261;
  --rose:         #db2777;
  --violet:       #7c3aed;
  --dark:         #111827;
  --white:        #ffffff;
  --gray-50:  #f9fafb;
  --gray-100: #f3f4f6;
  --gray-200: #e5e7eb;
  --gray-300: #d1d5db;
  --gray-400: #9ca3af;
  --gray-500: #6b7280;
  --gray-600: #4b5563;
  --gray-700: #374151;
  --gray-800: #1f2937;
  --radius:    12px;
  --radius-sm: 8px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --shadow:    0 2px 16px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.14);
  --shadow-primary: 0 10px 25px -6px rgba(37,99,235,.35);
  --shadow-accent:  0 10px 24px -6px rgba(226,130,60,.4);
  --gradient-primary: linear-gradient(135deg,#3b82f6 0%,var(--primary) 55%,#1e40af 100%);
  --gradient-dark:    linear-gradient(135deg,var(--secondary) 0%,var(--secondary-dark) 100%);
  --gradient-accent:  linear-gradient(135deg,#fbbf6a 0%,var(--accent) 55%,var(--accent-dark) 100%);
  --trans:     all 0.25s cubic-bezier(.4,0,.2,1);
  --trans-fast:all 0.15s ease;
  --mobile-nav-h: 68px;
  --pattern-on-dark:  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='1' stroke-opacity='.55'%3E%3Crect x='16' y='16' width='32' height='32' transform='rotate(45 32 32)'/%3E%3Crect x='16' y='16' width='32' height='32'/%3E%3C/g%3E%3C/svg%3E");
  --pattern-on-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72'%3E%3Cg fill='none' stroke='%232563EB' stroke-width='1' stroke-opacity='.07'%3E%3Crect x='16' y='16' width='32' height='32' transform='rotate(45 32 32)'/%3E%3Crect x='16' y='16' width='32' height='32'/%3E%3C/g%3E%3C/svg%3E");
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  font-family:'Vazirmatn',sans-serif;
  background:#f4f5f7;
  color:var(--gray-800);
  direction:rtl;
  line-height:1.7;
  font-size:15px;
  overflow-x:hidden;
}
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; transition:var(--trans); }
ul { list-style:none; }
button,input,select,textarea { font-family:'Vazirmatn',sans-serif; }
button { cursor:pointer; border:none; background:none; }
.container { max-width:1280px; margin:0 auto; padding:0 20px; }
::selection { background:var(--primary); color:white; }

/* دسترسی‌پذیری: فوکوس قابل مشاهده با کیبورد */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline:2.5px solid var(--primary); outline-offset:2px; border-radius:4px;
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after {
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
}

/* ===== TOP BAR ===== */
.top-bar {
  background:var(--gradient-dark);
  color:rgba(255,255,255,0.85);
  font-size:13px; padding:8px 0;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.top-bar .container { display:flex; justify-content:space-between; align-items:center; }
.top-bar-right,.top-bar-left { display:flex; align-items:center; gap:18px; }
.top-bar span,.top-bar a { display:flex; align-items:center; gap:5px; color:rgba(255,255,255,0.85); }
.top-bar a:hover { color:var(--accent); }
.admin-link { background:var(--primary); color:white !important; padding:2px 12px; border-radius:20px; }

/* ===== HEADER ===== */
.main-header {
  background:white;
  box-shadow:0 1px 12px rgba(0,0,0,0.06);
  position:sticky; top:0; z-index:1000;
  transition:box-shadow .3s ease;
}
.main-header.scrolled { box-shadow:0 4px 24px rgba(17,24,39,.12); }
.header-inner { display:flex; align-items:center; gap:18px; padding:13px 0; }

/* لوگو */
.logo { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.logo-img { height:54px; width:auto; object-fit:contain; }
.logo-icon {
  width:42px; height:42px;
  background:var(--gradient-primary);
  border-radius:11px; display:grid; place-items:center;
  color:white; font-size:21px; font-weight:900;
  box-shadow:var(--shadow-primary);
}
.logo-brand { display:block; font-size:21px; font-weight:800; color:var(--secondary); line-height:1.1; }
.logo-sub   { display:block; font-size:11px; color:var(--gray-400); }

/* سرچ */
.search-box { flex:1; max-width:580px; }
.search-box form {
  display:flex;
  border:2px solid var(--gray-200);
  border-radius:50px; overflow:hidden;
  transition:var(--trans);
}
.search-box form:focus-within { border-color:var(--primary); box-shadow:0 0 0 4px rgba(37,99,235,0.1); }
.search-cat {
  border:none; outline:none; background:var(--gray-100);
  padding:0 12px; font-size:13px; color:var(--gray-600);
  cursor:pointer; min-width:100px;
  border-left:1px solid var(--gray-200);
}
.search-box input {
  flex:1; border:none; outline:none;
  padding:10px 14px; font-size:14px; color:var(--gray-800);
}
.search-box button {
  background:var(--primary); color:white;
  padding:0 18px; font-size:16px; border:none;
  transition:var(--trans);
}
.search-box button:hover { background:var(--primary-dark); }

/* اکشن‌ها */
.header-actions { display:flex; align-items:center; gap:5px; }
.action-btn {
  width:40px; height:40px; border-radius:9px;
  display:grid; place-items:center;
  color:var(--gray-600); font-size:17px;
  position:relative; transition:var(--trans);
}
.action-btn:hover { background:var(--gray-100); color:var(--primary); }
.cart-badge {
  position:absolute; top:3px; right:3px;
  background:var(--primary); color:white;
  width:17px; height:17px; border-radius:50%;
  font-size:10px; display:grid; place-items:center; font-weight:700;
}
.mobile-menu-btn { display:none; font-size:22px; color:var(--gray-700); padding:4px; }

/* ===== NAV ===== */
.main-nav {
  background:white;
  border-top:1px solid var(--gray-200);
  border-bottom:3px solid var(--primary);
}
.nav-list {
  display:flex; align-items:center;
  flex-wrap:nowrap;
}
.nav-list li { position:relative; }
.nav-list > li > a {
  display:flex; align-items:center; gap:5px;
  padding:12px 14px; font-size:14px; font-weight:500;
  color:var(--gray-700); white-space:nowrap;
  transition:var(--trans); position:relative;
}
.nav-list > li > a::after {
  content:''; position:absolute; right:14px; left:14px; bottom:6px; height:2px;
  background:var(--primary); border-radius:2px; transform:scaleX(0); transform-origin:center;
  transition:var(--trans);
}
.nav-list > li > a:hover { color:var(--primary); }
.nav-list > li > a:hover::after { transform:scaleX(1); }
.nav-list > li:hover > a { background:rgba(37,99,235,0.04); }
.seller-cta {
  color:var(--primary) !important; font-weight:700 !important;
  border:2px solid var(--primary) !important;
  border-radius:24px !important; margin:5px 6px !important;
  padding:5px 14px !important;
}
.seller-cta::after { display:none; }
.seller-cta:hover { background:var(--primary) !important; color:white !important; box-shadow:var(--shadow-primary); }

/* Dropdown */
.has-dropdown { position:relative; }
.dropdown-menu {
  position:absolute; top:100%; right:0;
  background:white; min-width:195px;
  border-radius:var(--radius); box-shadow:var(--shadow-lg);
  padding:7px; z-index:999;
  opacity:0; visibility:hidden; transform:translateY(7px);
  transition:var(--trans);
  border-top:3px solid var(--primary);
}
.has-dropdown:hover .dropdown-menu { opacity:1; visibility:visible; transform:translateY(0); }
.dropdown-menu a { display:flex; align-items:center; gap:7px; padding:9px 12px; border-radius:7px; font-size:13px; color:var(--gray-700); }
.dropdown-menu a:hover { background:var(--primary-50); color:var(--primary); padding-right:15px; }

/* ===== FLASH ===== */
.flash-message {
  display:flex; align-items:center; gap:10px;
  padding:13px 20px; font-weight:500; font-size:14px;
  animation:slideDown .3s ease;
}
.flash-success { background:#d1fae5; color:#065f46; border-bottom:3px solid #10b981; }
.flash-error   { background:#fee2e2; color:#991b1b; border-bottom:3px solid #ef4444; }
.flash-info    { background:#dbeafe; color:#1e40af; border-bottom:3px solid #3b82f6; }
.flash-message button { margin-right:auto; font-size:20px; opacity:.6; color:inherit; }
@keyframes slideDown { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }

.main-content { min-height:60vh; }

/* ===== BUTTONS ===== */
.btn {
  display:inline-flex; align-items:center; gap:7px;
  padding:11px 22px; border-radius:50px;
  font-size:14px; font-weight:600; cursor:pointer;
  transition:var(--trans); border:none; text-decoration:none;
  position:relative;
}
.btn-primary { background:var(--gradient-primary); color:white; box-shadow:var(--shadow-primary); }
.btn-primary:hover { transform:translateY(-2px); color:white; box-shadow:0 14px 28px -8px rgba(37,99,235,.45); }
.btn-primary:active { transform:translateY(0); }
.btn-secondary { background:var(--gray-200); color:var(--gray-700); }
.btn-secondary:hover { background:var(--gray-300); transform:translateY(-1px); }
.btn-success { background:var(--success); color:white; }
.btn-success:hover { background:#21867a; color:white; transform:translateY(-1px); }
.btn-danger { background:#ef4444; color:white; }
.btn-danger:hover { background:#dc2626; color:white; }
.btn-outline { background:transparent; border:2px solid var(--gray-300); color:var(--gray-700); }
.btn-outline:hover { border-color:var(--primary); color:var(--primary); background:var(--primary-50); }
.btn-sm { padding:7px 15px; font-size:13px; border-radius:9px; }
.btn-block { width:100%; justify-content:center; }

/* ===== HERO ===== */
.hero {
  background:linear-gradient(135deg,var(--secondary) 0%,#16213e 100%);
  color:white; overflow:hidden; position:relative;
}
.hero-slider { position:relative; min-height:420px; }
.hero-slide { display:none; padding:50px 0; animation:fadeIn .4s ease; }
.hero-slide.active { display:block; }
@keyframes fadeIn { from{opacity:0;transform:translateX(15px)} to{opacity:1;transform:translateX(0)} }
.hero-inner { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
.hero-text h1 { font-size:36px; font-weight:900; line-height:1.35; margin-bottom:12px; }
.hero-text h1 span { color:var(--accent); }
.hero-text p { font-size:16px; opacity:.8; margin-bottom:26px; }
.hero-btns { display:flex; gap:12px; flex-wrap:wrap; }
.hero-dots { display:flex; justify-content:center; gap:7px; padding:16px; }
.hero-dot { width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.3); cursor:pointer; transition:var(--trans); }
.hero-dot.active { background:var(--primary); width:26px; border-radius:4px; }

/* ===== STATS ===== */
.stats-bar { background:white; padding:16px 0; border-bottom:1px solid var(--gray-200); }
.stats-grid { display:grid; grid-template-columns:repeat(3,2fr); }
.stat-item { display:flex; align-items:center; gap:13px; padding:0 24px; border-left:1px solid var(--gray-200); }
.stat-item:last-child { border-left:none; }
.stat-icon { width:46px; height:46px; border-radius:11px; display:grid; place-items:center; font-size:19px; flex-shrink:0; }
.stat-icon.red    { background:rgba(37,99,235,.1);  color:var(--primary); }
.stat-icon.blue   { background:rgba(29,53,87,.1);   color:var(--secondary); }
.stat-icon.green  { background:rgba(42,157,143,.1); color:var(--success); }
.stat-icon.orange { background:rgba(244,162,97,.1); color:var(--accent); }
.stat-num   { font-size:21px; font-weight:800; color:var(--dark); line-height:1.1; }
.stat-label { font-size:12px; color:var(--gray-400); }

/* ===== SECTION ===== */
.section { padding:56px 0; }
.section-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:30px; gap:16px; }
.section-title { font-size:clamp(19px,2.4vw,24px); font-weight:800; color:var(--dark); position:relative; padding-right:15px; letter-spacing:-.01em; }
.section-title::before { content:''; position:absolute; right:0; top:50%; transform:translateY(-50%); width:5px; height:26px; background:var(--gradient-primary); border-radius:3px; }
.section-eyebrow { display:block; font-size:12px; font-weight:700; color:var(--primary); letter-spacing:.03em; margin-bottom:6px; padding-right:15px; }
.section-link { color:var(--primary); font-weight:600; font-size:14px; display:flex; align-items:center; gap:4px; flex-shrink:0; padding:8px 14px; border-radius:50px; transition:var(--trans); }
.section-link:hover { gap:8px; background:var(--primary-50); }

/* ===== PRODUCT CARD ===== */
.products-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:18px; }
.product-card {
  background:white; border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow); transition:var(--trans); position:relative;
  border:1px solid var(--gray-100);
}
.product-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:transparent; }
.product-badge { position:absolute; top:10px; right:10px; z-index:2; padding:4px 10px; border-radius:20px; font-size:11px; font-weight:700; color:white; box-shadow:0 4px 10px rgba(0,0,0,.18); }
.badge-sale { background:linear-gradient(135deg,#ef4444,#dc2626); }
.badge-new  { background:linear-gradient(135deg,#34d399,var(--success)); }
.product-image { position:relative; height:200px; overflow:hidden; background:var(--gray-50); }
.product-image img { width:100%; height:100%; object-fit:cover; transition:transform .5s cubic-bezier(.25,.8,.25,1); }
.product-card:hover .product-image img { transform:scale(1.08); }
.product-actions { position:absolute; bottom:-55px; left:0; right:0; display:flex; gap:6px; padding:8px; background:linear-gradient(transparent,rgba(0,0,0,.55)); transition:var(--trans); }
.product-card:hover .product-actions { bottom:0; }
.product-action-btn { flex:1; background:white; color:var(--gray-800); border-radius:8px; padding:8px 5px; font-size:12px; font-family:'Vazirmatn',sans-serif; font-weight:600; display:flex; align-items:center; justify-content:center; gap:4px; border:none; cursor:pointer; transition:var(--trans-fast); }
.product-action-btn.add-cart { background:var(--primary); color:white; }
.product-action-btn:hover { transform:translateY(-1px); filter:brightness(1.06); }
.product-info { padding:14px; }
.product-seller { font-size:12px; color:var(--gray-400); margin-bottom:6px; display:flex; align-items:center; gap:4px; }
.product-name { font-size:14px; font-weight:600; color:var(--gray-800); margin-bottom:10px; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.6em; transition:var(--trans-fast); }
.product-card:hover .product-name { color:var(--primary); }
.product-price { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.price-original { font-size:12px; color:var(--gray-400); text-decoration:line-through; }
.price-current  { font-size:16px; font-weight:800; color:var(--primary); }

/* ===== CATEGORIES ===== */
.categories-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:16px; }
.category-card {
  --cc-1:#60a5fa; --cc-2:#2563EB; --cc-bg:#eff6ff; --cc-shadow:rgba(37,99,235,.32);
  background:linear-gradient(180deg,var(--cc-bg) 0%,#ffffff 72%);
  border-radius:var(--radius-lg); padding:24px 12px 18px;
  text-align:center; box-shadow:var(--shadow); transition:var(--trans);
  border:1.5px solid transparent; display:flex; flex-direction:column; align-items:center;
  position:relative; overflow:hidden; isolation:isolate;
}
.category-card::before {
  content:''; position:absolute; inset:0; z-index:-1; opacity:0;
  background-image:var(--pattern-on-light); transition:opacity .35s ease;
}
.category-card:hover::before { opacity:1; }
.category-card:hover {
  border-color:var(--cc-2); transform:translateY(-7px);
  box-shadow:0 18px 32px -10px var(--cc-shadow);
}
.category-icon-badge {
  width:60px; height:60px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg,var(--cc-1),var(--cc-2));
  display:grid; place-items:center; margin-bottom:13px;
  box-shadow:0 8px 18px -4px var(--cc-shadow);
  transition:var(--trans);
}
.category-card:hover .category-icon-badge { transform:scale(1.1) rotate(-6deg); }
.category-icon  { font-size:26px; display:block; line-height:1; filter:drop-shadow(0 1px 1px rgba(0,0,0,.12)); }
.category-name  { font-size:13.5px; font-weight:700; color:var(--gray-800); line-height:1.4; }
.category-count { font-size:11px; color:var(--gray-500); margin-top:5px; font-weight:600; background:rgba(0,0,0,.04); padding:2px 9px; border-radius:20px; }

/* چرخه‌ی رنگ برای هر دسته — حس بازارچه‌ی رنگارنگ */
.category-card:nth-child(8n+1) { --cc-bg:#eff6ff; --cc-1:#60a5fa; --cc-2:#2563EB; --cc-shadow:rgba(37,99,235,.32); }
.category-card:nth-child(8n+2) { --cc-bg:#fff7ed; --cc-1:#fdba74; --cc-2:#ea580c; --cc-shadow:rgba(234,88,12,.3); }
.category-card:nth-child(8n+3) { --cc-bg:#f0fdfa; --cc-1:#2dd4bf; --cc-2:#0d9488; --cc-shadow:rgba(13,148,136,.3); }
.category-card:nth-child(8n+4) { --cc-bg:#fdf2f8; --cc-1:#f9a8d4; --cc-2:#db2777; --cc-shadow:rgba(219,39,119,.28); }
.category-card:nth-child(8n+5) { --cc-bg:#f5f3ff; --cc-1:#c4b5fd; --cc-2:#7c3aed; --cc-shadow:rgba(124,58,237,.28); }
.category-card:nth-child(8n+6) { --cc-bg:#f1f5f9; --cc-1:#94a3b8; --cc-2:#1e3a5f; --cc-shadow:rgba(30,58,95,.3); }
.category-card:nth-child(8n+7) { --cc-bg:#fefce8; --cc-1:#fde047; --cc-2:#ca8a04; --cc-shadow:rgba(202,138,4,.28); }
.category-card:nth-child(8n)   { --cc-bg:#f0fdf4; --cc-1:#86efac; --cc-2:#16a34a; --cc-shadow:rgba(22,163,74,.28); }

/* ===== SELLERS ===== */
.sellers-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(195px,1fr)); gap:18px; }
.seller-card { background:white; border-radius:var(--radius-lg); padding:22px 18px; box-shadow:var(--shadow); text-align:center; transition:var(--trans); border:1px solid var(--gray-100); }
.seller-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:transparent; }
.seller-avatar { width:76px; height:76px; border-radius:50%; object-fit:cover; margin:0 auto 12px; border:3px solid white; box-shadow:0 0 0 3px var(--primary),var(--shadow); }
.seller-avatar-placeholder { width:76px; height:76px; border-radius:50%; background:var(--gradient-primary); color:white; display:flex; align-items:center; justify-content:center; font-size:27px; font-weight:800; margin:0 auto 12px; box-shadow:0 0 0 3px white,var(--shadow-primary); }
.seller-name  { font-size:14.5px; font-weight:700; color:var(--dark); margin-bottom:5px; }
.seller-rating{ color:var(--warning); font-size:13px; margin-bottom:7px; }
.seller-stats { display:flex; justify-content:center; gap:14px; font-size:12px; color:var(--gray-400); padding-top:10px; border-top:1px dashed var(--gray-200); }
.seller-visit-btn { display:block; margin-top:13px; padding:9px; background:var(--gray-100); border-radius:50px; color:var(--gray-700); font-weight:700; font-size:13px; transition:var(--trans); }
.seller-visit-btn:hover { background:var(--gradient-primary); color:white; box-shadow:var(--shadow-primary); }

/* ===== PROMO ===== */
.promo-banners { display:grid; grid-template-columns:2fr 1fr; gap:16px; margin-bottom:40px; }
.promo-card { border-radius:var(--radius-lg); overflow:hidden; position:relative; min-height:180px; display:flex; align-items:center; padding:26px; color:white; background-size:cover; background-position:center; background-repeat:no-repeat; }
.promo-card::before { content:''; position:absolute; inset:0; background:rgba(0,0,0,0.38); border-radius:var(--radius-lg); }
.promo-card-lg { min-height:260px; }
.promo-content { position:relative; z-index:2; }
.promo-tag { background:var(--primary); color:white; padding:3px 11px; border-radius:20px; font-size:12px; font-weight:700; margin-bottom:9px; display:inline-block; }
.promo-title { font-size:22px; font-weight:900; margin-bottom:5px; }
.promo-sub { opacity:.85; margin-bottom:14px; font-size:13px; }

/* ===== SHOP LAYOUT ===== */
.shop-layout { display:grid; grid-template-columns:250px 1fr; gap:24px; align-items:start; }
.filter-sidebar { background:white; border-radius:var(--radius-lg); padding:20px; box-shadow:var(--shadow); height:fit-content; border:1px solid var(--gray-100); position:sticky; top:88px; }

/* ===== CART ===== */
.cart-layout { display:grid; grid-template-columns:1fr 320px; gap:24px; align-items:start; }
.cart-items { background:white; border-radius:var(--radius-lg); padding:22px; box-shadow:var(--shadow); border:1px solid var(--gray-100); }
.cart-item { display:grid; grid-template-columns:80px 1fr auto; gap:15px; align-items:center; padding:18px 0; border-bottom:1px solid var(--gray-100); }
.cart-item:last-child { border-bottom:none; }
.cart-item-img { width:80px; height:80px; border-radius:var(--radius); object-fit:cover; border:1px solid var(--gray-100); }
.cart-item-name { font-weight:700; margin-bottom:4px; font-size:14px; }
.cart-item-seller { font-size:12px; color:var(--gray-400); }
.cart-item-price { font-size:14.5px; font-weight:800; color:var(--primary); margin-top:6px; }
.quantity-control { display:inline-flex; align-items:center; gap:2px; margin-top:9px; background:var(--gray-50); border-radius:10px; padding:3px; border:1px solid var(--gray-100); }
.qty-btn { width:26px; height:26px; border-radius:7px; background:transparent; font-size:16px; display:grid; place-items:center; cursor:pointer; border:none; transition:var(--trans-fast); color:var(--gray-600); }
.qty-btn:hover { background:var(--primary); color:white; }
.qty-num { font-weight:700; min-width:30px; text-align:center; font-size:13.5px; }
.remove-btn { width:34px; height:34px; border-radius:9px; color:var(--gray-300); font-size:15px; cursor:pointer; background:var(--gray-50); border:none; transition:var(--trans); display:grid; place-items:center; }
.remove-btn:hover { color:white; background:#ef4444; }
.cart-summary { background:white; border-radius:var(--radius-lg); padding:22px; box-shadow:var(--shadow); height:fit-content; position:sticky; top:88px; border:1px solid var(--gray-100); }
.summary-title { font-size:16px; font-weight:800; margin-bottom:16px; }
.summary-row { display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--gray-100); font-size:14px; color:var(--gray-600); }
.summary-row:last-child { border-bottom:none; font-weight:800; font-size:17px; color:var(--primary); padding-top:14px; margin-top:4px; }


/* ===== AUTH ===== */
.auth-page {
  min-height:100vh; display:grid; place-items:center;
  background:var(--gradient-dark);
  background-image:var(--pattern-on-dark), var(--gradient-dark);
  padding:40px 20px; position:relative;
}
.auth-card { background:white; border-radius:var(--radius-lg); padding:40px; width:100%; max-width:440px; box-shadow:0 30px 70px -20px rgba(0,0,0,.5); position:relative; z-index:1; }
.auth-logo { text-align:center; margin-bottom:26px; }
.auth-title { font-size:22px; font-weight:800; text-align:center; margin-bottom:5px; }
.auth-sub { text-align:center; color:var(--gray-400); margin-bottom:24px; font-size:14px; }
.auth-footer { text-align:center; margin-top:20px; color:var(--gray-500); font-size:14px; }
.auth-footer a { color:var(--primary); font-weight:600; }

/* ===== FORMS ===== */
.form-group { margin-bottom:16px; }
.form-label { display:block; font-size:13px; font-weight:600; color:var(--gray-700); margin-bottom:6px; }
.form-control { width:100%; padding:11px 14px; border:1.5px solid var(--gray-200); border-radius:10px; font-family:'Vazirmatn',sans-serif; font-size:14px; color:var(--gray-800); transition:var(--trans); background:var(--gray-50); }
.form-control:hover { border-color:var(--gray-300); }
.form-control:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 4px rgba(37,99,235,0.1); background:white; }
textarea.form-control { resize:vertical; }
.form-hint { font-size:12px; color:var(--gray-400); margin-top:4px; }

/* ===== INPUT CARD FORMAT ===== */
.card-input-wrapper { position:relative; }
.card-input-wrapper .card-icon {
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  color:var(--gray-400); font-size:16px; pointer-events:none;
}
.card-input-wrapper .form-control { padding-right:40px; letter-spacing:2px; font-size:15px; }

/* ===== BADGES ===== */
.badge { display:inline-flex; align-items:center; gap:4px; padding:4px 12px; border-radius:20px; font-size:12px; font-weight:700; }
.badge-active    { background:#d1fae5; color:#065f46; }
.badge-pending   { background:#fef3c7; color:#92400e; }
.badge-inactive  { background:#f3f4f6; color:#6b7280; }
.badge-cancelled { background:#fee2e2; color:#991b1b; }
.badge-paid      { background:#d1fae5; color:#065f46; }
.badge-suspended { background:#fee2e2; color:#991b1b; }

/* ===== ALERT ===== */
.alert { padding:13px 16px; border-radius:12px; margin-bottom:14px; display:flex; align-items:center; gap:9px; font-size:14px; }
.alert-success { background:#d1fae5; color:#065f46; border-right:4px solid #10b981; }
.alert-error   { background:#fee2e2; color:#991b1b; border-right:4px solid #ef4444; }
.alert-info    { background:#dbeafe; color:#1e40af; border-right:4px solid #3b82f6; }

/* ===== TABLES ===== */
.admin-table-wrap { background:white; border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; }
.admin-table-header { padding:16px 20px; border-bottom:1px solid var(--gray-200); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; }
.admin-table-title { font-size:14px; font-weight:700; }
.table-responsive { overflow-x:auto; -webkit-overflow-scrolling:touch; }
table { width:100%; border-collapse:collapse; min-width:600px; }
th { background:var(--gray-50); padding:11px 13px; text-align:right; font-size:12px; font-weight:700; color:var(--gray-500); white-space:nowrap; border-bottom:1px solid var(--gray-200); }
td { padding:12px 13px; border-bottom:1px solid var(--gray-100); font-size:13px; vertical-align:middle; }
tr:last-child td { border-bottom:none; }
tr:hover td { background:var(--gray-50); }

/* ===== ADMIN LAYOUT ===== */
.admin-wrapper { display:flex; min-height:100vh; }
.admin-sidebar {
  width:255px; background:var(--secondary);
  color:white; flex-shrink:0;
  position:fixed; height:100vh; overflow-y:auto;
  right:0; top:0; z-index:200;
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.2) transparent;
  transition:transform 0.3s ease;
}
.admin-brand { padding:20px; font-size:19px; font-weight:900; border-bottom:1px solid rgba(255,255,255,.1); display:flex; align-items:center; gap:10px; }
.admin-nav { padding:12px; }
.admin-nav-section { color:rgba(255,255,255,.35); font-size:10px; font-weight:700; letter-spacing:1px; padding:14px 12px 5px; text-transform:uppercase; }
.admin-nav a { display:flex; align-items:center; gap:10px; padding:10px 13px; border-radius:var(--radius-sm); color:rgba(255,255,255,.7); font-size:13px; transition:var(--trans); margin-bottom:2px; }
.admin-nav a:hover,.admin-nav a.active { background:rgba(255,255,255,.1); color:white; }
.admin-nav a i { width:16px; text-align:center; flex-shrink:0; }
.admin-main { margin-right:255px; flex:1; min-width:0; }
.admin-topbar { background:white; padding:13px 26px; border-bottom:1px solid var(--gray-200); display:flex; justify-content:space-between; align-items:center; position:sticky; top:0; z-index:100; box-shadow:0 1px 6px rgba(0,0,0,.05); flex-wrap:wrap; gap:10px; }
.admin-topbar-title { font-size:18px; font-weight:700; }
.admin-body { padding:24px; background:#f0f2f5; min-height:calc(100vh - 60px); }

/* ===== STATS CARDS ===== */
.stats-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:22px; }
.stats-card { background:white; border-radius:var(--radius); padding:20px; box-shadow:var(--shadow); display:flex; align-items:center; gap:13px; }
.stats-card-icon { width:52px; height:52px; border-radius:13px; display:grid; place-items:center; font-size:22px; flex-shrink:0; }
.stats-card-val { font-size:24px; font-weight:900; color:var(--dark); line-height:1.1; }
.stats-card-label { font-size:12px; color:var(--gray-400); margin-top:2px; }
.stats-card-trend { font-size:11px; margin-top:3px; }
.trend-up   { color:var(--success); }
.trend-down { color:var(--primary); }

/* ===== DASHBOARD کاربر ===== */
.dashboard-layout { display:grid; grid-template-columns:245px 1fr; gap:20px; padding:26px 20px; max-width:1280px; margin:0 auto; }
.dashboard-sidebar { background:white; border-radius:var(--radius); box-shadow:var(--shadow); height:fit-content; overflow:hidden; }
.sidebar-user { padding:24px; text-align:center; background:linear-gradient(135deg,var(--secondary),#16213e); color:white; }
.sidebar-name { font-size:15px; font-weight:700; }
.sidebar-role { font-size:12px; opacity:.7; margin-top:2px; }
.sidebar-nav  { padding:9px; }
.sidebar-nav a { display:flex; align-items:center; gap:10px; padding:10px 13px; border-radius:var(--radius-sm); color:var(--gray-700); font-size:13px; font-weight:500; transition:var(--trans); margin-bottom:2px; }
.sidebar-nav a:hover,.sidebar-nav a.active { background:rgba(37,99,235,.07); color:var(--primary); }
.sidebar-nav a i { width:17px; text-align:center; }
.dashboard-content { min-height:400px; }
.page-title { font-size:21px; font-weight:800; color:var(--dark); margin-bottom:22px; display:flex; align-items:center; gap:11px; }
.page-title i { width:38px; height:38px; border-radius:11px; background:var(--primary-50); color:var(--primary); display:inline-grid; place-items:center; font-size:16px; flex-shrink:0; }
.stars { color:#F4A261; letter-spacing:1px; }

/* ===== PRODUCT DETAIL ===== */
.product-detail { display:grid; grid-template-columns:1fr 1fr; gap:34px; padding:30px 0; }
.product-gallery { position:sticky; top:90px; }
.main-image { border-radius:var(--radius-lg); overflow:hidden; margin-bottom:10px; background:var(--gray-50); box-shadow:var(--shadow); }
.main-image { aspect-ratio:1; overflow:hidden; border-radius:var(--radius-lg); background:var(--gray-50); }
.main-image img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.main-image img:hover { transform:scale(1.04); }
.thumb-gallery { display:flex; gap:8px; flex-wrap:wrap; }
.thumb-item { width:72px; height:72px; border-radius:var(--radius-sm); overflow:hidden; cursor:pointer; border:2px solid transparent; transition:var(--trans); opacity:.7; }
.thumb-item.active,.thumb-item:hover { border-color:var(--primary); opacity:1; }
.thumb-item img { width:100%; height:100%; object-fit:cover; }
.product-detail-name { font-size:23px; font-weight:800; color:var(--dark); margin-bottom:11px; line-height:1.4; }
.product-detail-brand { font-size:12px; color:var(--gray-400); margin-bottom:6px; }
.detail-price-current  { font-size:31px; font-weight:900; color:var(--primary); letter-spacing:-.02em; }
.detail-price-original { font-size:16px; color:var(--gray-300); text-decoration:line-through; margin-right:10px; }
.detail-discount-badge { background:linear-gradient(135deg,#ef4444,#dc2626); color:white; padding:4px 12px; border-radius:20px; font-size:13px; font-weight:700; }
.detail-meta { display:grid; gap:9px; padding:16px; background:var(--gray-50); border-radius:var(--radius); margin-top:16px; font-size:13px; }
.detail-meta-row { display:flex; justify-content:space-between; align-items:center; }
.detail-meta-label { color:var(--gray-500); }
.detail-meta-val { font-weight:600; }

/* ===== TABS ===== */
.tabs { display:flex; gap:2px; border-bottom:2px solid var(--gray-200); margin-bottom:20px; flex-wrap:wrap; }
.tab-btn { padding:11px 20px; font-size:14px; font-weight:600; color:var(--gray-500); background:none; border:none; border-bottom:3px solid transparent; margin-bottom:-2px; cursor:pointer; transition:var(--trans); font-family:'Vazirmatn',sans-serif; }
.tab-btn.active,.tab-btn:hover { color:var(--primary); border-bottom-color:var(--primary); }
.tab-content { display:none; animation:fadeInUp .3s ease; }
.tab-content.active { display:block; }

/* ===== BREADCRUMB ===== */
.breadcrumb { padding:14px 0; margin-bottom:6px; }
.breadcrumb ol { display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:13px; }
.breadcrumb li { display:flex; align-items:center; gap:6px; color:var(--gray-400); }
.breadcrumb li:last-child { color:var(--gray-700); font-weight:600; }
.breadcrumb li:not(:last-child)::after { content:'/'; color:var(--gray-300); }
.breadcrumb a { color:var(--gray-400); transition:var(--trans-fast); }
.breadcrumb a:hover { color:var(--primary); }

/* ===== PAGINATION ===== */
.pagination { display:flex; justify-content:center; gap:7px; margin-top:36px; flex-wrap:wrap; }
.page-btn { width:38px; height:38px; border-radius:10px; display:grid; place-items:center; font-size:13px; font-weight:600; background:white; color:var(--gray-700); box-shadow:var(--shadow); transition:var(--trans); text-decoration:none; border:1px solid var(--gray-100); }
.page-btn.active,.page-btn:hover { background:var(--gradient-primary); color:white; border-color:transparent; box-shadow:var(--shadow-primary); }

/* ===== EMPTY STATE ===== */
.empty-state { text-align:center; padding:70px 20px; }
.empty-icon  { font-size:58px; margin-bottom:18px; opacity:.35; filter:grayscale(.3); }
.empty-title { font-size:18px; font-weight:700; color:var(--gray-600); margin-bottom:8px; }
.empty-sub   { color:var(--gray-400); margin-bottom:22px; font-size:14px; }

/* ===== FOOTER ===== */
.main-footer {
  background:var(--gradient-dark);
  background-image:var(--pattern-on-dark), var(--gradient-dark);
  color:rgba(255,255,255,.8); margin-top:50px; position:relative;
  border-top:1px solid rgba(255,255,255,.06);
}
.footer-top  { padding:56px 0 46px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:40px; }
.footer-logo { font-size:28px; font-weight:900; color:white; margin-bottom:12px; }
.footer-brand p { font-size:13px; line-height:1.9; opacity:.65; margin-bottom:18px; }
.social-links { display:flex; gap:10px; }
.social-links a { width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.08); display:grid; place-items:center; font-size:15px; color:rgba(255,255,255,.75); transition:var(--trans); }
.social-links a:hover { background:var(--gradient-primary); color:white; transform:translateY(-3px); box-shadow:var(--shadow-primary); border-color:transparent; }
.footer-col h4 { font-size:15px; font-weight:700; color:white; margin-bottom:18px; position:relative; padding-right:12px; }
.footer-col h4::before { content:''; position:absolute; right:0; top:3px; bottom:3px; width:3px; background:var(--accent); border-radius:2px; }
.footer-col ul li { margin-bottom:9px; }
.footer-col ul a { font-size:13px; opacity:.65; transition:var(--trans); display:inline-block; }
.footer-col ul a:hover { opacity:1; color:var(--accent); padding-right:4px; }
.contact-list li { display:flex; align-items:center; gap:9px; margin-bottom:11px; font-size:13px; }
.contact-list i { color:var(--accent); width:14px; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding:18px 0; text-align:center; font-size:12px; opacity:.55; position:relative; }

/* ===== SELLER SIDEBAR (سفید) ===== */
.seller-sidebar-white { background:white; border-left:1px solid var(--gray-200); }
.seller-sidebar-white .admin-brand { color:var(--secondary); border-bottom-color:var(--gray-200); }
.seller-sidebar-white .admin-nav-section { color:var(--gray-400); }
.seller-sidebar-white .admin-nav a { color:var(--gray-600); }
.seller-sidebar-white .admin-nav a:hover,
.seller-sidebar-white .admin-nav a.active { background:rgba(37,99,235,.07); color:var(--primary); }

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar { width:5px; height:5px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--gray-300); border-radius:3px; }
::-webkit-scrollbar-thumb:hover { background:var(--primary); }

/* ===== PAGE HERO (نوار سربرگ صفحات داخلی) ===== */
.page-hero { background:var(--gradient-dark); background-image:var(--pattern-on-dark),radial-gradient(ellipse 700px 400px at 15% 0%,rgba(37,99,235,.3),transparent),var(--gradient-dark); padding:52px 0 44px; text-align:center; position:relative; overflow:hidden; }
.page-hero-eyebrow { display:inline-flex; align-items:center; gap:6px; background:rgba(244,162,97,.16); color:#fcd34d; padding:6px 16px; border-radius:30px; font-size:12px; font-weight:700; margin-bottom:15px; border:1px solid rgba(244,162,97,.3); position:relative; z-index:1; }
.page-hero h1 { font-size:clamp(24px,3.6vw,36px); font-weight:900; color:#fff; margin-bottom:10px; position:relative; z-index:1; }
.page-hero p { font-size:14.5px; color:rgba(255,255,255,.68); max-width:580px; margin:0 auto; line-height:1.85; position:relative; z-index:1; }

/* ===== VALUE / INFO CARDS ===== */
.value-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:20px; }
.value-card { background:#fff; border-radius:var(--radius-lg); padding:30px 22px; text-align:center; box-shadow:var(--shadow); border:1.5px solid var(--gray-100); transition:var(--trans); }
.value-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:transparent; }
.value-ico { width:60px; height:60px; border-radius:17px; display:grid; place-items:center; font-size:25px; color:#fff; margin:0 auto 16px; transition:var(--trans); }
.value-card:hover .value-ico { transform:scale(1.08) rotate(-5deg); }
.value-card:nth-child(4n+1) .value-ico { background:linear-gradient(135deg,#60a5fa,#2563EB); box-shadow:0 10px 20px -6px rgba(37,99,235,.4); }
.value-card:nth-child(4n+2) .value-ico { background:linear-gradient(135deg,#4ade80,#16a34a); box-shadow:0 10px 20px -6px rgba(22,163,74,.4); }
.value-card:nth-child(4n+3) .value-ico { background:linear-gradient(135deg,#fde047,#ca8a04); box-shadow:0 10px 20px -6px rgba(202,138,4,.4); }
.value-card:nth-child(4n) .value-ico   { background:linear-gradient(135deg,#f9a8d4,#db2777); box-shadow:0 10px 20px -6px rgba(219,39,119,.4); }
.value-card h3 { font-size:15.5px; font-weight:800; color:var(--dark); margin-bottom:8px; }
.value-card p  { font-size:13px; color:var(--gray-500); line-height:1.8; }

/* ===== بخش‌های صفحه درباره‌ی ما ===== */
.about-section { margin-bottom:56px; }
.about-section-title { font-size:20px; font-weight:800; color:var(--dark); margin-bottom:18px; display:flex; align-items:center; gap:11px; }
.about-section-title i { width:38px; height:38px; border-radius:11px; background:var(--primary-50); color:var(--primary); display:grid; place-items:center; font-size:16px; flex-shrink:0; }
.about-lead { font-size:15px; color:var(--gray-600); line-height:1.9; margin-bottom:14px; }

.stat-band { background:var(--gradient-primary); background-image:var(--pattern-on-dark),var(--gradient-primary); color:white; padding:44px 30px; border-radius:var(--radius-xl); margin-bottom:56px; position:relative; overflow:hidden; box-shadow:var(--shadow-primary); }
.stat-band-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:20px; position:relative; z-index:1; }
.stat-band-item { text-align:center; }
.stat-band-num { font-size:clamp(28px,3.6vw,38px); font-weight:900; margin-bottom:6px; letter-spacing:-.02em; }
.stat-band-lbl { font-size:13.5px; opacity:.85; }

.commission-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; }
.commission-card { background:white; border-radius:var(--radius-lg); padding:22px; box-shadow:var(--shadow); border-top:4px solid var(--tier-color,var(--primary)); transition:var(--trans); }
.commission-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.commission-pct { font-size:30px; font-weight:900; color:var(--tier-color,var(--primary)); margin-bottom:9px; }
.commission-range { color:var(--gray-600); font-size:13px; margin-bottom:14px; display:flex; align-items:center; gap:6px; }
.commission-range i { color:var(--tier-color,var(--primary)); }
.commission-note { font-size:12px; color:var(--gray-400); }

.tip-box { background:var(--primary-50); border-right:4px solid var(--primary); padding:18px 20px; border-radius:12px; margin-top:24px; }
.tip-box-title { color:var(--primary-dark); font-weight:700; margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.tip-box p { color:#1e40af; font-size:13.5px; margin:0; line-height:1.8; }

.cta-band { background:var(--gray-50); border:1.5px dashed var(--gray-300); padding:38px 30px; border-radius:var(--radius-xl); text-align:center; }
.cta-band h2 { color:var(--dark); margin-bottom:10px; font-size:21px; }
.cta-band p  { color:var(--gray-500); margin-bottom:20px; font-size:14px; }

@media (max-width:640px) {
  .stat-band-grid { grid-template-columns:1fr 1fr; }
  .about-section-title { font-size:18px; }
}

/* ===== تماس با ما ===== */
.contact-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:40px; margin-bottom:56px; align-items:start; }
.contact-info-card { background:white; border-radius:var(--radius-lg); padding:10px; box-shadow:var(--shadow); border:1px solid var(--gray-100); }
.contact-info-row { display:flex; align-items:flex-start; gap:14px; padding:15px; border-radius:12px; transition:var(--trans-fast); }
.contact-info-row:hover { background:var(--gray-50); }
.contact-info-ico { width:44px; height:44px; border-radius:12px; background:var(--primary-50); color:var(--primary); display:grid; place-items:center; font-size:17px; flex-shrink:0; }
.contact-info-label { font-weight:700; color:var(--dark); margin-bottom:3px; font-size:14px; }
.contact-info-value { color:var(--gray-500); font-size:13.5px; line-height:1.7; }
.map-placeholder { width:100%; height:320px; border-radius:var(--radius-lg); display:flex; align-items:center; justify-content:center; color:var(--gray-400); background:linear-gradient(135deg,var(--gray-100),var(--gray-50)); border:1.5px dashed var(--gray-300); }
@media (max-width:820px) { .contact-grid { grid-template-columns:1fr; } }

/* ===== SELLER LIST CARD (صفحه فروشندگان) ===== */
.seller-list-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.seller-list-card { background:white; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); transition:var(--trans); border:1px solid var(--gray-100); }
.seller-list-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:transparent; }
.slc-head { background:var(--gradient-dark); background-image:var(--pattern-on-dark),var(--gradient-dark); padding:20px; color:white; position:relative; }
.slc-top { display:flex; align-items:center; gap:14px; }
.slc-avatar { width:56px; height:56px; border-radius:50%; object-fit:cover; border:3px solid rgba(255,255,255,.3); flex-shrink:0; }
.slc-avatar-placeholder { width:56px; height:56px; border-radius:50%; background:var(--gradient-accent); display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:900; color:white; flex-shrink:0; border:3px solid rgba(255,255,255,.2); }
.slc-name { font-size:16px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.slc-city { font-size:12px; opacity:.65; margin-top:3px; }
.slc-rating { position:absolute; top:16px; left:16px; background:rgba(255,255,255,.14); border-radius:20px; padding:4px 11px; font-size:12px; font-weight:700; border:1px solid rgba(255,255,255,.15); }
.slc-rating i { color:#F4A261; }
.slc-stats { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--gray-100); }
.slc-stat { text-align:center; padding:13px; border-left:1px solid var(--gray-100); }
.slc-stat:last-child { border-left:none; }
.slc-stat-num { font-size:18px; font-weight:800; color:var(--secondary); }
.slc-stat-lbl { font-size:11px; color:var(--gray-400); margin-top:2px; }
.slc-body { padding:15px; }
.slc-products-lbl { font-size:12px; color:var(--gray-400); margin-bottom:10px; font-weight:600; }
.slc-products { display:flex; gap:8px; }
.slc-product { flex:1; min-width:0; }
.slc-product img,.slc-product-ph { width:100%; height:70px; object-fit:cover; border-radius:9px; border:1px solid var(--gray-100); }
.slc-product-ph { background:var(--gray-50); display:flex; align-items:center; justify-content:center; font-size:24px; }
.slc-product-price { font-size:11px; color:var(--primary); font-weight:700; margin-top:5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.slc-more { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; background:var(--gray-50); border-radius:9px; height:70px; color:var(--gray-500); font-size:11px; font-weight:700; text-align:center; transition:var(--trans-fast); }
.slc-more:hover { background:var(--primary-50); color:var(--primary); }
.slc-empty { padding:20px; text-align:center; color:var(--gray-400); font-size:13px; }
.slc-desc { padding:0 15px 13px; font-size:13px; color:var(--gray-500); line-height:1.75; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.slc-visit { display:flex; align-items:center; justify-content:center; gap:8px; margin:0 15px 15px; padding:11px; background:var(--gray-100); color:var(--gray-700); border-radius:50px; font-weight:700; font-size:13.5px; transition:var(--trans); }
.seller-list-card:hover .slc-visit { background:var(--gradient-primary); color:white; box-shadow:var(--shadow-primary); }

/* ===== FILTER BAR (نوار فیلتر) ===== */
.filter-bar { background:white; border-radius:var(--radius-lg); padding:20px; box-shadow:var(--shadow); margin-bottom:26px; border:1px solid var(--gray-100); }
.filter-bar form { display:flex; gap:14px; flex-wrap:wrap; align-items:flex-end; }
.filter-bar-field { flex:1; min-width:200px; }
.filter-bar-field label { font-size:12px; color:var(--gray-500); font-weight:600; display:block; margin-bottom:6px; }
.filter-bar-search { position:relative; }
.filter-bar-search i { position:absolute; right:14px; top:50%; transform:translateY(-50%); color:var(--gray-400); }
.filter-bar-search input { padding-right:38px; }

/* ===== FILTER SIDEBAR (لیست دسته‌بندی) ===== */
.filter-group { margin-bottom:22px; }
.filter-group:last-child { margin-bottom:0; }
.filter-title { font-size:13.5px; font-weight:800; color:var(--dark); margin-bottom:12px; display:flex; align-items:center; gap:8px; padding-bottom:10px; border-bottom:1.5px solid var(--gray-100); }
.filter-title i { color:var(--primary); }
.filter-link { display:flex; justify-content:space-between; align-items:center; padding:8px 10px; font-size:13.5px; border-radius:9px; color:var(--gray-700); transition:var(--trans-fast); margin-bottom:2px; }
.filter-link:hover { background:var(--primary-50); color:var(--primary); }
.filter-link.active { background:var(--primary-50); color:var(--primary); font-weight:700; }
.filter-link-count { background:var(--gray-100); border-radius:20px; padding:2px 9px; font-size:11px; color:var(--gray-500); }
.filter-link.active .filter-link-count { background:var(--primary); color:white; }
.filter-sub-link { display:flex; justify-content:space-between; align-items:center; padding:6px 10px 6px 8px; margin-right:14px; font-size:12.5px; color:var(--gray-500); border-radius:8px; transition:var(--trans-fast); }
.filter-sub-link:hover,.filter-sub-link.active { background:var(--gray-50); color:var(--primary); }
.filter-price-row { display:flex; flex-direction:column; gap:10px; }
.filter-price-row label { font-size:12px; color:var(--gray-500); margin-bottom:5px; display:block; }

/* ===== TOOLBAR (نوار مرتب‌سازی) ===== */
.toolbar { background:white; border-radius:var(--radius-lg); padding:15px 20px; margin-bottom:22px; display:flex; justify-content:space-between; align-items:center; box-shadow:var(--shadow); border:1px solid var(--gray-100); flex-wrap:wrap; gap:10px; }
.toolbar-count { font-size:14px; color:var(--gray-600); }
.toolbar-count b { color:var(--dark); font-weight:800; }
.toolbar-sort { display:flex; align-items:center; gap:10px; }
.toolbar-sort span { font-size:13px; color:var(--gray-400); }
.toolbar-sort select { width:auto; padding:8px 13px; font-size:13px; }

/* ===== SHOP HEADER (فروشگاه فروشنده) ===== */
.shop-header { background:var(--gradient-dark); background-image:var(--pattern-on-dark),radial-gradient(ellipse 600px 300px at 10% 0%,rgba(37,99,235,.3),transparent),var(--gradient-dark); color:white; padding:44px 0; position:relative; overflow:hidden; }
.shop-header-inner { display:flex; align-items:center; gap:24px; position:relative; z-index:1; flex-wrap:wrap; }
.shop-avatar { width:92px; height:92px; border-radius:50%; object-fit:cover; flex-shrink:0; border:4px solid rgba(255,255,255,.15); box-shadow:0 10px 30px rgba(0,0,0,.3); }
.shop-avatar-placeholder { width:92px; height:92px; border-radius:50%; background:var(--gradient-accent); display:flex; align-items:center; justify-content:center; color:white; font-size:36px; font-weight:800; flex-shrink:0; border:4px solid rgba(255,255,255,.15); box-shadow:0 10px 30px rgba(0,0,0,.3); }
.shop-header h1 { font-size:clamp(22px,3vw,28px); font-weight:900; margin-bottom:7px; }
.shop-header-desc { opacity:.68; font-size:14px; margin-bottom:12px; max-width:520px; line-height:1.7; }
.shop-header-meta { display:flex; gap:10px; font-size:12.5px; flex-wrap:wrap; }
.shop-header-meta span { display:flex; align-items:center; gap:6px; background:rgba(255,255,255,.08); padding:5px 12px; border-radius:20px; border:1px solid rgba(255,255,255,.08); }

/* ============================================================
   ===== MOBILE BOTTOM NAVIGATION ===========================
   ============================================================ */
.mobile-bottom-nav {
  display:none;
  position:fixed;
  bottom:0; left:0; right:0;
  background:white;
  height:var(--mobile-nav-h);
  z-index:1100;
  box-shadow:0 -4px 24px rgba(0,0,0,0.12), 0 -1px 0 rgba(0,0,0,0.06);
  border-radius:20px 20px 0 0;
  overflow:hidden;
  -webkit-tap-highlight-color:transparent;
}
.mobile-bottom-nav::before {
  content:'';
  position:absolute;
  top:0; left:50%; transform:translateX(-50%);
  width:40px; height:4px;
  background:var(--gray-200);
  border-radius:2px;
  margin-top:8px;
}
.mobile-nav-items {
  display:flex;
  height:100%;
  padding:0 4px 6px;
}
.mobile-nav-item {
  flex:1; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:4px; cursor:pointer;
  text-decoration:none;
  color:var(--gray-400);
  font-size:10px; font-weight:600;
  border-radius:14px;
  margin:8px 2px 4px;
  transition:all 0.2s ease;
  position:relative;
  -webkit-tap-highlight-color:transparent;
  padding-top:4px;
}
.mobile-nav-item i {
  font-size:20px;
  transition:all 0.2s ease;
  display:block;
}
.mobile-nav-item span {
  font-size:10px;
  white-space:nowrap;
}
.mobile-nav-item.active {
  color:var(--primary);
}
.mobile-nav-item.active i {
  transform:translateY(-2px);
}
.mobile-nav-item.active::after {
  content:'';
  position:absolute;
  bottom:0; left:50%;
  transform:translateX(-50%);
  width:28px; height:3px;
  background:var(--primary);
  border-radius:2px 2px 0 0;
}
.mobile-nav-center {
  position:relative;
  top:-14px;
  margin:0 4px;
}
.mobile-nav-center-btn {
  width:54px; height:54px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 20px rgba(37,99,235,0.4);
  color:white; font-size:22px;
  transition:all 0.2s ease;
  position:relative;
}
.mobile-nav-center .mobile-nav-item {
  color:white;
  margin-top:0;
}
.mobile-nav-center .mobile-nav-item.active {
  color:white;
}
.mobile-nav-center .mobile-nav-item.active::after { display:none; }
.mobile-nav-center .mobile-nav-item i { font-size:22px; }
.mobile-nav-cart-badge {
  position:absolute;
  top:-4px; left:-4px;
  background:#ef4444;
  color:white;
  width:18px; height:18px;
  border-radius:50%;
  font-size:10px; font-weight:800;
  display:grid; place-items:center;
  border:2px solid white;
}

/* ===== MOBILE SEARCH OVERLAY ===== */
.mobile-search-overlay {
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.5);
  z-index:1200;
  align-items:flex-start;
  padding:60px 16px 20px;
}
.mobile-search-overlay.open { display:flex; }
.mobile-search-inner {
  width:100%;
  background:white;
  border-radius:var(--radius-lg);
  padding:20px;
  box-shadow:var(--shadow-lg);
}
.mobile-search-inner form {
  display:flex;
  border:2px solid var(--gray-200);
  border-radius:50px; overflow:hidden;
}
.mobile-search-inner input {
  flex:1; border:none; outline:none;
  padding:12px 16px; font-size:15px;
}
.mobile-search-inner button {
  background:var(--primary); color:white;
  padding:0 20px; border:none; font-size:16px;
}
.mobile-search-close {
  position:absolute; top:16px; left:16px;
  background:white; border:none;
  width:36px; height:36px; border-radius:50%;
  display:grid; place-items:center;
  font-size:18px; color:var(--gray-700);
  cursor:pointer;
}

/* ============================================================
   ===== RESPONSIVE ==========================================
   ============================================================ */

/* ---- 1200px ---- */
@media (max-width:1200px) {
  .container { padding:0 16px; }
  .footer-grid { grid-template-columns:1.5fr 1fr 1fr; gap:30px; }
  .footer-grid .footer-col:last-child { grid-column:1/-1; }
}

/* ---- 1100px ---- */
@media (max-width:1100px) {
  .admin-sidebar { width:220px; }
  .admin-main    { margin-right:220px; }
  .stats-cards   { grid-template-columns:repeat(2,1fr); }
  .hero-inner    { grid-template-columns:1fr; }
  .hero-image    { display:none; }
}

/* ---- 900px ---- */
@media (max-width:900px) {
  .shop-layout      { grid-template-columns:1fr; }
  .filter-sidebar   { display:none; }
  .product-detail   { grid-template-columns:1fr; }
  .promo-banners    { grid-template-columns:1fr; }
  .dashboard-layout { grid-template-columns:1fr; }
  .cart-layout      { grid-template-columns:1fr; }
  .footer-grid      { grid-template-columns:1fr 1fr; gap:30px; }
  .categories-grid  { grid-template-columns:repeat(auto-fill,minmax(122px,1fr)); gap:12px; }
  .category-card    { padding:20px 10px 15px; }
  .category-icon-badge { width:52px; height:52px; }
}

/* ---- 768px (Mobile Main) ---- */
@media (max-width:768px) {

  /* Top Bar */
  .top-bar-right   { display:none; }
  .top-bar-left a:not(:first-child):not(.admin-link) { display:none; }

  /* Header */
  .logo-img { height:38px; }
  .search-box { display:none; }
  .search-cat  { display:none; }
  .mobile-menu-btn { display:flex; align-items:center; justify-content:center; width:40px; height:40px; }

  /* Nav */
  .main-nav        { display:none; }
  .main-nav.open   {
    display:block;
    position:fixed; top:0; right:0;
    width:82%; max-width:310px;
    height:100vh; overflow-y:auto;
    background:white;
    z-index:1050;
    box-shadow:-8px 0 40px rgba(0,0,0,0.2);
    padding-top:60px;
    animation:slideInRight 0.3s ease;
  }
  @keyframes slideInRight { from{transform:translateX(100%)} to{transform:translateX(0)} }
  .nav-overlay {
    display:none;
    position:fixed; inset:0; background:rgba(0,0,0,0.5);
    z-index:1040;
  }
  .nav-overlay.open { display:block; }
  .main-nav.open .nav-list        { flex-direction:column; align-items:stretch; padding:8px; }
  .main-nav.open .nav-list > li > a { padding:13px 16px; border-radius:var(--radius-sm); border-bottom:1px solid var(--gray-100); font-size:15px; }
  .main-nav.open .has-dropdown .dropdown-menu {
    position:static; opacity:1; visibility:visible; transform:none;
    box-shadow:none; border:none; padding-right:24px;
    background:var(--gray-50); border-radius:var(--radius-sm);
    margin-top:4px; margin-bottom:4px;
  }
  .mobile-nav-close-btn {
    position:absolute; top:16px; left:16px;
    background:var(--gray-100); border:none;
    width:36px; height:36px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:18px; color:var(--gray-700); cursor:pointer;
    z-index:10;
  }
  .main-nav.open .mobile-nav-close-btn { display:flex; }

  /* Hero */
  .hero-slider { min-height:auto; }
  .hero-slide  { padding:30px 0 20px; }
  .hero-text h1 { font-size:22px; }
  .hero-text p  { font-size:14px; }
  .hero-btns .btn { padding:10px 18px; font-size:13px; }

  /* Stats */
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .stat-item  { border-left:none; border-bottom:1px solid var(--gray-200); padding:14px 10px; }
  .stat-item:nth-child(2n) { border-left:1px solid var(--gray-200); }

  /* Products */
  .products-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .product-image { height:160px; }
  /* روی لمسی hover معنا نداره، پس دکمه‌ی افزودن همیشه نمایان بماند */
  .product-actions { bottom:0; padding:6px; background:linear-gradient(transparent,rgba(0,0,0,.45) 60%); }
  .product-action-btn { padding:7px 4px; font-size:11px; }

  /* Section */
  .section { padding:28px 0; }
  .section-header { flex-direction:column; align-items:flex-start; gap:8px; }
  .section-title { font-size:18px; }

  /* Admin */
  .admin-sidebar { transform:translateX(100%); }
  .admin-sidebar.open { transform:translateX(0); }
  .admin-main    { margin-right:0; }
  .stats-cards   { grid-template-columns:repeat(2,1fr); }

  /* Footer */
  .footer-grid { grid-template-columns:1fr; gap:26px; }
  .footer-top  { padding:30px 0; }

  /* Dashboard */
  .dashboard-layout { padding:16px; }
  .dashboard-sidebar { display:none; }
  .dashboard-sidebar.open { display:block; }

  /* Auth */
  .auth-card { padding:26px 20px; }

  /* Mobile Bottom Nav — show */
  .mobile-bottom-nav { display:flex; flex-direction:column; justify-content:flex-end; }
  body { padding-bottom:var(--mobile-nav-h); }
  .main-footer { margin-bottom:0; padding-bottom:0; }

  /* Seller Register Mobile */
  .seller-reg-grid { grid-template-columns:1fr !important; }
  .seller-benefits-col { display:none; }
}

/* ---- 640px ---- */
@media (max-width:640px) {
  .cart-item { grid-template-columns:64px 1fr; gap:10px; }
  .cart-item > *:last-child { grid-column:2; }
  .promo-title { font-size:16px; }
  .auth-card { padding:20px 16px; }

  /* دسته‌بندی‌ها → ریل افقی قابل‌اسکرول، به‌جای گرید فشرده */
  .categories-grid {
    display:flex; flex-wrap:nowrap; overflow-x:auto;
    gap:12px; padding:2px 2px 14px; margin:0 -2px;
    scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;
  }
  .category-card {
    flex:0 0 92px; scroll-snap-align:start;
    padding:16px 6px 12px; border-radius:16px;
  }
  .category-icon-badge { width:52px; height:52px; margin-bottom:9px; }
  .category-icon  { font-size:22px; }
  .category-name  { font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  .category-count { display:none; }
}

/* ---- 480px ---- */
@media (max-width:480px) {
  .container { padding:0 12px; }
  .products-grid   { grid-template-columns:repeat(2,1fr); gap:8px; }
  .stats-cards     { grid-template-columns:1fr 1fr; }
  .hero-text h1    { font-size:19px; }
  .hero-btns { flex-direction:column; gap:8px; }
  .hero-btns .btn  { justify-content:center; }
  .page-title      { font-size:17px; }
}

/* ---- 380px ---- */
@media (max-width:380px) {
  .products-grid   { grid-template-columns:1fr 1fr; gap:7px; }
  .product-image   { height:140px; }
  .product-name    { font-size:13px; }
  .price-current   { font-size:14px; }
  .mobile-nav-item span { font-size:9px; }
  .mobile-nav-item i { font-size:18px; }
}

/* ===== ADMIN MOBILE ===== */
@media(max-width:900px){
  .admin-menu-btn{display:flex !important;align-items:center;justify-content:center}
  .admin-topbar{gap:10px}
  .admin-topbar-title{font-size:15px}
  .admin-body{padding:14px}
  .stats-cards{grid-template-columns:1fr 1fr}
  #adminOverlay{display:none}
  #adminOverlay.open{display:block !important}
  #adminSidebar.open{transform:translateX(0) !important}
}
@media(max-width:480px){
  .stats-cards{grid-template-columns:1fr 1fr}
  .stats-card-val{font-size:18px}
  .admin-body{padding:10px}
}

/* ============================================================
   ===== SIDEBAR RESPONSIVE (admin / seller / dashboard) ======
   ============================================================ */

/* دکمه همبرگر */
.sidebar-toggle-btn {
  display: none;
  align-items: center; justify-content: center;
  width: 40px; height: 40px;
  background: var(--gray-100);
  border: none; border-radius: 10px;
  font-size: 20px; color: var(--gray-700);
  cursor: pointer; flex-shrink: 0;
  transition: var(--trans);
}
.sidebar-toggle-btn:hover { background: var(--primary); color: white; }

/* overlay پشت sidebar */
.sidebar-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 198;
  backdrop-filter: blur(2px);
}
.sidebar-overlay.open { display: block; }

/* ===== ADMIN ===== */
@media (max-width: 1024px) {
  .sidebar-toggle-btn { display: flex; }

  .admin-sidebar {
    transform: translateX(110%);
    transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
    z-index: 199;
    width: 270px !important;
  }
  .admin-sidebar.open { transform: translateX(0); }
  .admin-main { margin-right: 0 !important; }

  .admin-topbar { padding: 12px 16px; gap: 10px; }
  .admin-topbar-title { font-size: 15px; }
  .admin-body { padding: 14px; }

  .stats-cards { grid-template-columns: 1fr 1fr; gap: 12px; }
  .stats-card-val { font-size: 20px; }
}

@media (max-width: 480px) {
  .stats-cards { grid-template-columns: 1fr 1fr; gap: 8px; }
  .admin-body  { padding: 10px; }
  .admin-table-header { flex-direction: column; align-items: flex-start; }
}

/* ===== SELLER PANEL ===== */
.seller-panel-sidebar {
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
}
@media (max-width: 1024px) {
  .seller-panel-sidebar {
    position: fixed !important;
    right: 0; top: 0;
    height: 100vh !important;
    z-index: 199;
    transform: translateX(110%);
    width: 270px !important;
    overflow-y: auto;
  }
  .seller-panel-sidebar.open { transform: translateX(0); }
  .seller-panel-main { margin-right: 0 !important; }
}

/* ===== DASHBOARD کاربر ===== */
.user-dashboard-sidebar {
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
}
@media (max-width: 900px) {
  .dashboard-layout { grid-template-columns: 1fr !important; padding: 12px !important; }

  .user-dashboard-sidebar {
    position: fixed !important;
    right: 0; top: 0;
    height: 100vh !important;
    z-index: 199;
    transform: translateX(110%);
    width: 270px !important;
    overflow-y: auto;
    border-radius: 0 !important;
    box-shadow: -8px 0 30px rgba(0,0,0,0.2) !important;
  }
  .user-dashboard-sidebar.open { transform: translateX(0); }

  .dashboard-topbar {
    display: flex !important;
    align-items: center;
    gap: 12px;
    background: white;
    padding: 12px 16px;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    margin-bottom: 16px;
  }
  .dashboard-topbar .sidebar-toggle-btn { display: flex; }
}

/* ===== PRODUCT DETAIL RESPONSIVE ===== */
@media (max-width: 900px) {
  .product-detail {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 16px 0 !important;
  }
  .product-gallery { position: static !important; }
  .main-image img  { height: 280px !important; }
  .detail-price-current { font-size: 24px !important; }
}
@media (max-width: 480px) {
  .main-image img  { height: 220px !important; }
  .thumb-gallery   { gap: 5px !important; }
  .thumb-item      { width: 56px !important; height: 56px !important; }
  .variant-btn     { padding: 6px 12px !important; font-size: 12px !important; }
}

/* ===== DASHBOARD TOPBAR BASE (hidden on desktop, shown via media query on mobile) ===== */
.dashboard-topbar { display: none; }

/* ===== SELLER / ADMIN PANEL RESPONSIVE GRIDS ===== */
.panel-grid-aside { display:grid; grid-template-columns:1fr 300px; gap:20px; }
@media (max-width:1024px) { .panel-grid-aside { grid-template-columns:1fr; } }

/* ===== SELLER WALLET RESPONSIVE ===== */
@media (max-width:900px) {
  .seller-wallet-grid-3   { grid-template-columns:1fr 1fr !important; }
  .seller-wallet-grid-aside { grid-template-columns:1fr !important; }
}
@media (max-width:480px) {
  .seller-wallet-grid-3 { grid-template-columns:1fr !important; }
}

/* ===== SELLER PROFILE / ADMIN SELLER-DETAIL RESPONSIVE ===== */
@media (max-width:900px) {
  .seller-profile-grid   { grid-template-columns:1fr !important; }
  .seller-profile-fields { grid-template-columns:1fr !important; }
  .admin-detail-grid     { grid-template-columns:1fr !important; }
}

/* ===== ORDER DETAIL RESPONSIVE ===== */
@media (max-width: 768px) {
  .order-detail-grid { grid-template-columns: 1fr !important; }
}