/* ═══════════════════════════════════════════════════════════
   داروخانه سهیل - استایل یکپارچه
   ═══════════════════════════════════════════════════════════ */

:root {
  --primary: #0057B7;
  --primary-dark: #003d8f;
  --secondary: #00A896;
  --accent: #F4A261;
  --danger: #E63946;
  --success: #2ec969;
  --warning: #fca311;
  --bg-body: #F5F8FF;
  --bg-card: #FFFFFF;
  --bg-section: #EEF3FB;
  --text-primary: #0D1B3E;
  --text-secondary: #4A5573;
  --text-muted: #8A94B0;
  --border: #D9E2F3;
  --border-light: #EEF0F8;
  --shadow-sm: 0 2px 8px rgba(0,87,183,0.08);
  --shadow-md: 0 8px 24px rgba(0,87,183,0.14);
  --shadow-card: 0 4px 20px rgba(0,87,183,0.10);
  --gradient-primary: linear-gradient(135deg,#0057B7 0%,#003d8f 100%);
  --gradient-hero: linear-gradient(135deg,#0057B7 0%,#0090d4 60%,#00A896 100%);
  --font: 'Vazirmatn', sans-serif;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-pill: 100px;
  --transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
}

*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--bg-body);color:var(--text-primary);font-family:var(--font);line-height:1.7;direction:rtl;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}

/* Header */
.site-header{background:var(--bg-card);box-shadow:0 2px 20px rgba(0,87,183,.1);position:sticky;top:0;z-index:1000;border-bottom:3px solid var(--primary);}
.header-top{background:var(--gradient-primary);padding:6px 0;text-align:center;font-size:.82rem;color:rgba(255,255,255,.9);}
.header-top span{margin:0 15px;}
.header-main{max-width:1300px;margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:30px;height:80px;}
.logo-wrap{display:flex;align-items:center;gap:12px;transition:var(--transition);}
.logo-wrap:hover{transform:scale(1.02);}
.logo-icon{width:52px;height:52px;background:var(--gradient-primary);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1.8rem;box-shadow:var(--shadow-sm);}
.logo-text h1{font-size:1.4rem;font-weight:800;color:var(--primary);line-height:1.2;}
.logo-text span{font-size:.75rem;color:var(--text-muted);}
.header-search{flex:1;max-width:440px;position:relative;}
.header-search input{width:100%;background:var(--bg-section);border:2px solid var(--border);border-radius:var(--radius-pill);padding:11px 20px 11px 48px;font-family:var(--font);font-size:.9rem;}
.header-search input:focus{outline:none;border-color:var(--primary);background:white;box-shadow:0 0 0 4px rgba(0,87,183,.1);}
.search-btn{position:absolute;left:14px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--primary);font-size:1.1rem;cursor:pointer;}
.header-actions{display:flex;gap:12px;margin-left:auto;}
.header-action-btn{display:flex;align-items:center;gap:6px;padding:9px 18px;border-radius:var(--radius-pill);font-family:var(--font);font-size:.88rem;font-weight:600;cursor:pointer;transition:var(--transition);border:none;}
.btn-cart{background:var(--gradient-primary);color:white;box-shadow:var(--shadow-sm);position:relative;}
.btn-cart:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.cart-count{position:absolute;top:-6px;left:-6px;background:var(--danger);color:white;border-radius:50%;width:20px;height:20px;font-size:.72rem;display:flex;align-items:center;justify-content:center;font-weight:700;}
.btn-login{background:transparent;border:2px solid var(--primary)!important;color:var(--primary);}
.btn-login:hover{background:var(--primary);color:white;}

/* Nav */
.main-nav{background:var(--bg-section);border-top:1px solid var(--border);}
.nav-inner{max-width:1300px;margin:0 auto;padding:0 20px;display:flex;gap:5px;}
.nav-link{display:flex;align-items:center;gap:6px;padding:12px 16px;font-size:.9rem;font-weight:600;color:var(--text-secondary);border-bottom:3px solid transparent;transition:var(--transition);}
.nav-link:hover,.nav-link.active{color:var(--primary);border-bottom-color:var(--primary);}
.nav-badge{background:var(--danger);color:white;font-size:.65rem;padding:2px 6px;border-radius:var(--radius-pill);font-weight:700;}

/* Buttons */
.btn-primary{padding:14px 32px;background:var(--gradient-primary);color:white;border:none;border-radius:var(--radius-pill);font-weight:700;font-size:1rem;cursor:pointer;transition:var(--transition);display:inline-flex;align-items:center;gap:8px;}
.btn-primary:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);}

/* Footer */
.footer{background:var(--text-primary);color:white;padding:40px 20px;margin-top:80px;text-align:center;}
.footer p{opacity:.8;margin-bottom:8px;}

@media (max-width:992px){
  .header-main{flex-wrap:wrap;height:auto;padding:15px 20px;}
  .header-search{max-width:100%;order:3;flex:1 1 100%;}
  .nav-inner{overflow-x:auto;}
}

/* محصولات مرتبط - دسکتاپ */
.related-section .products-grid {
    grid-template-columns: repeat(4, 1fr);
}

/* محصولات مرتبط - تبلت */
@media (max-width: 992px) {
    .related-section .products-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* محصولات مرتبط - موبایل */
@media (max-width: 768px) {
    .related-section .products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
}

/* محصولات مرتبط - موبایل کوچک */
@media (max-width: 480px) {
    .related-section .products-grid {
        grid-template-columns: 1fr;
    }
}
.btn-add{width:100%;padding:10px;background:var(--gradient-primary);color:white;border:none;border-radius:var(--radius-md);font-weight:700;cursor:pointer;transition:var(--transition);}
.btn-add:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);}