.article-hero .btn,.article-item .title:hover{color:var(--primary)}.article-count,.article-hero .blog-container,.blog-card,.blog-card h3,.blog-card p{text-align:center}:root{--blog-bg:#f7f7fb;--card-bg:#ffffff;--text:#111827;--muted:#6b7280;--primary:#5458a2;--primary-2:#6d72b5;--border:#e5e7eb}.article-item,.blog-card{border:1px solid var(--border)}body.dark-theme{--blog-bg:#0f1220;--card-bg:#151833;--text:#e5e7ff;--muted:#a1a7c4;--border:#262b4a}.blog-hero{background:radial-gradient(1200px 400px at 50% -100px,rgba(84,88,162,.25),transparent 60%),linear-gradient(135deg,var(--primary) 0,var(--primary-2) 100%);color:#fff;padding:72px 0 64px;position:relative}.blog-hero h1{font-size:38px;font-weight:700;letter-spacing:-.02em;margin:0 0 12px}.blog-hero p{font-size:18px;opacity:.95}.blog-container{width:100%;max-width:1200px;margin:0 auto;padding:0 16px}.blog-content{background:var(--blog-bg);padding:40px 0 64px}.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}.blog-card-link{text-decoration:none;color:inherit;display:block}.article-list,.blog-list{list-style:none;margin:0;display:grid}.blog-card{background:var(--card-bg);border-radius:16px;padding:22px;box-shadow:0 8px 24px rgba(84,88,162,.08);transition:transform .25s,box-shadow .25s,border-color .25s}.article-title,.read-more-btn{text-decoration:none;transition:.3s}.blog-card-link:focus .blog-card,.blog-card-link:hover .blog-card,.blog-card:hover{transform:translateY(-6px);box-shadow:0 14px 30px rgba(84,88,162,.15);border-color:rgba(84,88,162,.35)}.blog-card h3{font-size:20px;color:var(--text);margin:0 0 8px}.blog-card p{color:var(--muted);line-height:1.7;margin:0 0 14px}.blog-list{padding:0;grid-template-columns:1fr;gap:10px}.blog-list li{position:relative;padding:10px 12px;border:1px dashed var(--border);border-radius:12px;color:var(--text);background:linear-gradient(0deg,rgba(255,255,255,.3),rgba(255,255,255,.3))}@media (min-width:640px){.blog-list{grid-template-columns:repeat(2,1fr)}}@media (min-width:992px){.blog-list{grid-template-columns:repeat(3,1fr)}}.blog-hero .blog-container{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:180px}.article-hero{background:linear-gradient(135deg,var(--primary) 0,var(--primary-2) 100%);color:#fff;padding:64px 0}.article-hero .btn{margin-top:16px;background:#fff;padding:10px 16px;border-radius:10px;display:inline-block}.article-list{padding:0;grid-template-columns:1fr;gap:12px}.article-item{display:flex;align-items:center;justify-content:space-between;background:var(--card-bg);border-radius:12px;padding:14px 16px}#articleList,.checklist,.tips{list-style:none;padding:0;margin:0}.article-item .title{color:var(--text);font-weight:600;text-decoration:none}.article-item .date{color:var(--muted);font-size:14px}.article-body{color:var(--text);line-height:1.9;font-size:18px;display:grid;gap:12px}.article-body p{margin:0}.section-title{font-size:22px;font-weight:700;color:var(--text)}.article-count,.article-count *,.article-count strong{color:#007bff!important}.checklist,.tips{display:grid;gap:8px}.checklist li,.tips li{background:var(--card-bg);border:1px solid var(--border);border-radius:10px;padding:10px 12px}.steps{padding-inline-start:22px;display:grid;gap:6px}.callout{background:rgba(84,88,162,.08);border:1px solid rgba(84,88,162,.25);border-radius:12px;padding:12px 14px}.callout.success{background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.25)}.article-list .article-item .title{display:inline-block;border-bottom:3px solid #5458a2;padding-bottom:8px;margin-bottom:12px;transition:border-color .3s}.article-list .article-item .title:hover{border-bottom-color:#3d4070}.article-count{margin-top:12px;font-size:15px;font-weight:700;padding-top:10px}.article-count strong{font-size:16px;font-weight:700}.article-tags{margin-top:40px;padding-top:30px;border-top:1px solid #e0e0e0}.tags-header{display:flex;align-items:center;gap:10px;padding:15px 0}.tags-header i{color:#5458a2;font-size:20px}.tags-header span{color:#333;font-size:15px;font-weight:600;line-height:1.6}#articleList{direction:rtl}.article-item{margin-bottom:30px;padding-bottom:20px;border-bottom:1px solid #e5e5e5;display:flex;flex-direction:column}.article-item:last-child{border-bottom:none}.article-title{display:block;width:100%;font-size:20px;font-weight:700;color:#1a1a1a;line-height:1.6;margin-bottom:0;padding-bottom:10px;border-bottom:4px solid #6d72b5}.article-title:hover{color:#06c;border-bottom-color:#004999}.read-more-btn{display:inline-block;align-self:flex-start;margin-top:15px;padding:10px 24px;background-color:#6d72b5;color:#fff;font-size:15px;font-weight:600;border-radius:5px}.read-more-btn:hover{background-color:#6d72b5;transform:translateX(-5px)}@media (max-width:768px){.article-title{font-size:18px}.read-more-btn{font-size:14px;padding:8px 18px}}.blog-card{display:flex;flex-direction:column;align-items:center;justify-content:center}

.callout {
  background: rgba(84, 88, 162, 0.08);
  border: 1px solid rgba(84, 88, 162, 0.25);
  border-radius: 12px;
  padding: 16px 18px; /* زيادة padding قليلاً */
  word-spacing: normal; /* إجبار المسافات الطبيعية */
  white-space: normal; /* السماح بالتفاف طبيعي */
  line-height: 1.8; /* مسافة أفضل بين الأسطر */
  direction: rtl; /* التأكد من الاتجاه */
}

.callout strong,
.callout a {
  word-spacing: inherit; /* وراثة نفس المسافات */
  display: inline; /* عدم كسر الأسطر بشكل غير متوقع */
}



/* نظام الترقيم (Pagination) */
.pagination-container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-top: 40px;
  padding: 20px 0;
  flex-wrap: wrap;
}

.pagination-btn {
  padding: 10px 18px;
  background: #5458a2;
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  font-weight: 600;
  transition: all 0.3s ease;
  min-width: 45px;
}

.pagination-btn:hover:not(:disabled) {
  background: #3d4178;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(84, 88, 162, 0.3);
}

.pagination-btn:disabled {
  background: #ccc;
  cursor: not-allowed;
  opacity: 0.6;
}

.pagination-btn.active {
  background: #3d4178;
  box-shadow: 0 4px 12px rgba(84, 88, 162, 0.4);
}

.page-number {
  padding: 10px 16px;
  background: transparent;
  border: 2px solid #5458a2;
  color: #5458a2;
  border-radius: 6px;
  cursor: pointer;
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  font-weight: 600;
  transition: all 0.3s ease;
  min-width: 45px;
}

.page-number:hover {
  background: #5458a2;
  color: #fff;
  transform: translateY(-2px);
}

.page-number.active {
  background: #5458a2;
  color: #fff;
  border-color: #5458a2;
}

.page-info {
  font-family: 'Cairo', sans-serif;
  font-size: 15px;
  color: #666;
  padding: 0 10px;
}

/* Dark mode support */
body.dark-mode .page-number {
  border-color: #7a7ed9;
  color: #7a7ed9;
}

body.dark-mode .page-number:hover,
body.dark-mode .page-number.active {
  background: #7a7ed9;
  color: #fff;
  border-color: #7a7ed9;
}

body.dark-mode .page-info {
  color: #aaa;
}

/* Responsive */
@media (max-width: 768px) {
  .pagination-container {
    gap: 8px;
  }
  
  .pagination-btn,
  .page-number {
    padding: 8px 12px;
    font-size: 14px;
    min-width: 40px;
  }
  
  .page-info {
    font-size: 14px;
    width: 100%;
    text-align: center;
    order: -1;
    margin-bottom: 10px;
  }
}





/* تنسيق الأنشور (الروابط) - إجباري */
.article-body a,
.callout a,
.checklist a,
.tips a,
.steps a {
  color: #0066cc !important;
  text-decoration: underline !important;
  font-weight: normal !important;
  border-bottom: none !important;
  background: transparent !important;
}

.article-body a:hover,
.callout a:hover,
.checklist a:hover,
.tips a:hover,
.steps a:hover {
  color: #004999 !important;
  text-decoration: underline !important;
}