:root {
    --primary-color: #f00 ;
    --primary-dark: #5a2bc0;
    --primary-light: #8a5ff3;
    --text-color: #333333;
    --text-light: #666666;
    --background: #ffffff;
    --background-alt: #f8f9fa;
    --border-color: #e0e0e0;
}
/* ========= Pagination (x-pager) ========= */
.x-pager.is-ltr{ direction:ltr; }
.x-pager{
  margin:22px 0 0;
  display:flex;
  justify-content:center;
}
.x-pager__list{
  --primary:#e41d1d;      /* نفس الأحمر اللي بتستخدمه */
  --text:#0f172a;
  --muted:#6b7280;
  --ring:rgba(228,29,29,.18);
  --border:#e5e7eb;
  display:flex; gap:8px;
  align-items:center; justify-content:center;
  list-style:none; padding:0; margin:0;
  flex-wrap:wrap;
}
.x-pager__item{ list-style:none; }

.x-pager__item a,
.x-pager__item span{
  min-width:40px; height:40px; line-height:40px;
  padding:0 12px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:700;
  color:var(--text); text-decoration:none;
  background:#fff; border:1px solid var(--border);
  border-radius:10px;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease, background .18s ease;
}

/* الحالة الحالية */
.x-pager__item.is-active span,
.x-pager__item.is-active a{
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
  box-shadow:0 6px 18px var(--ring);
  cursor:default;
}

/* السابق/التالي */
.x-pager__item.is-prev a,
.x-pager__item.is-next a{
  font-weight:800;
}

/* تفاعل الهوفر والضغط */
.x-pager__item a:hover{
  transform:translateY(-2px);
  border-color:#d1d5db;
  box-shadow:0 10px 22px rgba(0,0,0,.08);
}
.x-pager__item a:active{
  transform:translateY(0);
}

/* أيقونة داخل السابق/التالي */
.x-pager__icon{
  font-size:16px; line-height:1; display:inline-block;
}

/* تحسين اللمس على الموبايل */
@media (max-width:480px){
  .x-pager__list{ gap:6px; }
  .x-pager__item a, .x-pager__item span{
    min-width:36px; height:36px; line-height:36px; border-radius:9px; font-size:13px;
  }
}

/* احترام تقليل الحركة */
@media (prefers-reduced-motion:reduce){
  .x-pager__item a{ transition:none; }
}









.tnp-subscription input.tnp-submit, .tnp-profile input.tnp-submit, .tnp-unsubscribe button.tnp-submit, .tnp-reactivate button.tnp-submit {
  background-color: #f00;
 
}





.woocommerce .woocommerce-result-count {
 
  display: none;
}



.woocommerce .woocommerce-ordering {
  display: none;
}


#sidebar {
  display: none !important;
}
.woocommerce .woocommerce-breadcrumb {

  display: none;
}












/* ===== HEADER BASE ===== */

#site-header {
    /* لا نعرّف الـ var هنا، نفترض أنه معرف مسبقاً في مكان آخر */
    font-family: inherit;
}

/* Top Bar (الصف الأول) */
.top-bar {
    width: 100%;
    background: #f2f2f2;
    padding: 3px 0; /* تقليل البادنغ */
    font-size: 14px;
}

.top-bar-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px; /* مسافة بسيطة يمين ويسار فقط */
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-bar-left {
    display: flex;
    align-items: center;
    gap: 15px;
}

/* Social Icons */
.top-bar-right a {
    margin-left: 10px;
    font-size: 18px;
    text-decoration: none;
    color: #333333;
}

.top-bar-right a:hover {
    color: var(--primary-color);
}

/* Main Header (الصف الثاني: الشعار + المنيو) */
.main-header {
    background: #ffffff;
    padding: 8px 0; /* تقليل البادنغ */
    border-bottom: 1px solid #dddddd;
}

.main-header-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px; /* فقط يمين ويسار */
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Logo */
.site-logo img {
    height: 60px; /* أصغر قليلاً عشان يقل الإحساس بالفراغ */
    width: auto;
}

/* Desktop Navigation */
.main-nav {
    display: flex;
}

.main-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 20px;
}

.main-nav ul li a {
    text-decoration: none;
    color: #333333;
    font-size: 15px;
}

.main-nav ul li.current-menu-item a {
    font-weight: bold;
    color: var(--primary-color); /* اللون الأساسي من المتغير */
}

/* ===== الصف الثالث: بار البحث ===== */
/* هنا سيُطبع محتوى search.php */

.header-search-area {
    width: 100%;
    background: var(--primary-color); /* اللون الأساسي var */
    padding: 8px 0; /* صف ثالث بارتفاع معقول */
}

.header-search-area .search-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

/* مثال تنسيق لعناصر الفورم داخل search.php (عدّل حسب كودك) */
.header-search-area form {
    display: flex;
    gap: 10px;
}

.header-search-area input[type="text"],
.header-search-area input[type="search"] {
    flex: 1;
    padding: 8px 10px;
    border: 1px solid #dddddd;
    border-radius: 4px;
    font-size: 14px;
}

.header-search-area button,
.header-search-area input[type="submit"] {
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    background: #ffffff;
    color: #333333;
    cursor: pointer;
    font-size: 14px;
}

.header-search-area button:hover,
.header-search-area input[type="submit"]:hover {
    background: #f2f2f2;
}

/* ===== Mobile Menu ===== */

.menu-toggle {
    display: none;
    font-size: 24px;
    background: none;
    border: none;
    cursor: pointer;
    color: #333333;
}

/* Overlay */
.mobile-menu-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 998;
}

/* Side panel */
.mobile-menu-panel {
    position: fixed;
    top: 0;
    right: 0;
    width: 280px;
    max-width: 80%;
    height: 100%;
    background: #ffffff;
    box-shadow: -2px 0 6px rgba(0, 0, 0, 0.15);
    transform: translateX(100%);
    transition: transform 0.25s ease;
    z-index: 999;
    display: flex;
    flex-direction: column;
}

.mobile-menu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 15px;
    border-bottom: 1px solid #dddddd;
}

.mobile-logo img {
    height: 50px;
    width: auto;
}

.mobile-menu-close {
    background: none;
    border: none;
    font-size: 22px;
    cursor: pointer;
    color: #333333;
}

.mobile-nav {
    padding: 15px;
}

.mobile-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile-menu li {
    margin-bottom: 8px;
}

.mobile-menu li a {
    display: block;
    text-decoration: none;
    color: #333333;
    font-size: 15px;
    padding: 6px 0;
    border-bottom: 1px solid #eeeeee;
}

.mobile-menu li.current-menu-item a {
    color: var(--primary-color);
    font-weight: bold;
}

/* Open state */
body.mobile-menu-open .mobile-menu-overlay {
    opacity: 1;
    visibility: visible;
}

body.mobile-menu-open .mobile-menu-panel {
    transform: translateX(0);
}

/* Responsive */
@media (max-width: 768px) {
    .main-nav {
        display: none;
    }

    .menu-toggle {
        display: block;
    }
}