/*
Theme Name: SEO-Speed-2026 RTL
Description: ملف الأنماط للغة العربية والاتجاه من اليمين لليسار (RTL)
*/

/**
 * ========================================
 * RTL Styles - أنماط اللغة العربية
 * ========================================
 * 
 * هذا الملف يحتوي على التعديلات المطلوبة لدعم اللغة العربية
 * واتجاه الكتابة من اليمين إلى اليسار
 */

/* ===================================
   1. Direction & Text Alignment
   =================================== */
body {
    direction: rtl;
    text-align: right;
}

/* ===================================
   2. Header & Navigation
   =================================== */
.header-inner {
    flex-direction: row-reverse;
}

.site-branding {
    margin-right: 0;
    margin-left: auto;
}

.main-navigation ul {
    flex-direction: row-reverse;
}

.main-navigation li {
    margin-right: 0;
    margin-left: var(--space-2);
}

.menu-toggle {
    margin-right: 0;
    margin-left: auto;
}

/* ===================================
   3. Content & Typography
   =================================== */
h2::after {
    right: 0;
    left: auto;
}

ul,
ol {
    padding-right: var(--space-6);
    padding-left: 0;
}

blockquote {
    border-right: 4px solid var(--color-primary);
    border-left: none;
    padding-right: var(--space-6);
    padding-left: 0;
    margin-right: 0;
    margin-left: auto;
}

/* ===================================
   4. Post Cards & Grid
   =================================== */
.post-card-meta {
    flex-direction: row-reverse;
}

.post-card-meta>* {
    margin-right: 0;
    margin-left: var(--space-4);
}

.post-card-meta>*:last-child {
    margin-left: 0;
}

.category-count {
    margin-right: auto;
    margin-left: 0;
}

/* ===================================
   5. Entry Meta & Icons
   =================================== */
.entry-meta {
    flex-direction: row-reverse;
}

.entry-meta>* {
    margin-right: 0;
    margin-left: var(--space-4);
}

.entry-meta>*:last-child {
    margin-left: 0;
}

.entry-meta svg,
.post-card-meta svg {
    margin-left: var(--space-2);
    margin-right: 0;
}

/* ===================================
   6. Navigation Links
   =================================== */
.post-navigation .nav-links {
    flex-direction: row-reverse;
}

.nav-previous {
    text-align: right;
}

.nav-next {
    text-align: left;
}

/* ===================================
   7. Footer
   =================================== */
.footer-navigation ul {
    flex-direction: row-reverse;
}

.social-links {
    flex-direction: row-reverse;
}

/* ===================================
   8. Comments
   =================================== */
.comment {
    border-right: 3px solid var(--color-primary);
    border-left: none;
    padding-right: var(--space-6);
    padding-left: var(--space-4);
}

.children {
    padding-right: var(--space-8);
    padding-left: 0;
}

.comment-reply-link {
    float: left;
}

/* ===================================
   9. Forms
   =================================== */
.search-form {
    direction: rtl;
}

.search-submit {
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
}

input[type="search"] {
    border-radius: var(--radius-md) 0 0 var(--radius-md);
}

/* ===================================
   10. Buttons & Links
   =================================== */
.button svg,
.read-more-btn svg {
    margin-right: var(--space-2);
    margin-left: 0;
    transform: rotate(180deg);
}

.share-buttons {
    flex-direction: row-reverse;
}

.share-buttons .share-label {
    margin-left: var(--space-3);
    margin-right: 0;
}

/* ===================================
   11. Tags & Categories
   =================================== */
.tags-links svg,
.cat-links svg {
    margin-left: var(--space-2);
    margin-right: 0;
}

.tags-label {
    margin-left: var(--space-2);
    margin-right: 0;
}

/* ===================================
   12. 404 Page
   =================================== */
.categories-list {
    text-align: right;
}

.category-link svg {
    margin-left: var(--space-2);
    margin-right: 0;
}

/* ===================================
   13. Archive Page
   =================================== */
.archive-meta {
    text-align: right;
}

/* ===================================
   14. Pagination
   =================================== */
.pagination {
    flex-direction: row-reverse;
}

/* ===================================
   15. Skip Link
   =================================== */
.skip-link {
    right: var(--space-4);
    left: auto;
}

/* ===================================
   16. Special Typography for Arabic
   =================================== */

/* تحسين الخطوط العربية */
body {
    font-family: 'Segoe UI', Tahoma, 'Arabic Transparent', 'Arial', sans-serif;
    letter-spacing: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Segoe UI', Tahoma, 'Arabic Transparent', 'Arial', sans-serif;
    letter-spacing: 0;
}

/* تحسين قراءة النص العربي */
p {
    line-height: 1.8;
    word-spacing: 0.1em;
}

/* ===================================
   17. Code & Pre Blocks
   =================================== */
code,
pre {
    direction: ltr;
    text-align: left;
}

.copy-code-btn {
    left: 0.5rem;
    right: auto;
}

/* ===================================
   18. Back to Top Button
   =================================== */
.back-to-top {
    left: 2rem;
    right: auto;
}

/* ===================================
   19. External Link Icon
   =================================== */
.external-icon {
    margin-right: 0.2em;
    margin-left: 0;
}

/* ===================================
   20. Table Styles
   =================================== */
table {
    direction: rtl;
}

th,
td {
    text-align: right;
}

th:first-child,
td:first-child {
    padding-right: var(--space-4);
}

th:last-child,
td:last-child {
    padding-left: var(--space-4);
}

/* ===================================
   21. Image Alignment
   =================================== */
.alignright {
    float: left;
    margin-right: 0;
    margin-left: var(--space-6);
}

.alignleft {
    float: right;
    margin-left: 0;
    margin-right: var(--space-6);
}

/* ===================================
   22. Gallery
   =================================== */
.gallery {
    direction: rtl;
}

.gallery-item {
    text-align: right;
}

/* ===================================
   23. Widget Areas
   =================================== */
.widget ul {
    padding-right: 0;
    padding-left: 0;
}

.widget ul ul {
    padding-right: var(--space-4);
    padding-left: 0;
}

/* ===================================
   24. Accessibility
   =================================== */
[dir="rtl"] *:focus {
    outline-offset: 2px;
}

/* ===================================
   25. Mobile Responsive RTL
   =================================== */
@media (max-width: 768px) {
    .main-navigation {
        text-align: right;
    }

    .entry-meta {
        flex-direction: column;
        align-items: flex-start;
    }

    .post-card-meta {
        flex-direction: column;
        align-items: flex-start;
    }

    .back-to-top {
        left: 1rem;
        right: auto;
    }
}

/* ===================================
   26. Print Styles RTL
   =================================== */
@media print {
    body {
        direction: rtl;
        text-align: right;
    }
}

/* ===================================
   27. Custom Arabic Fonts (Optional)
   =================================== */
/*
إذا كنت تريد استخدام خط عربي مخصص، قم بإضافته هنا
مثال باستخدام Google Fonts:

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&display=swap');

body {
    font-family: 'Cairo', sans-serif;
}
*/

/* ===================================
   28. Number Direction
   =================================== */
/* الأرقام باللغة العربية */
.arabic-numbers {
    unicode-bidi: plaintext;
}

/* الأرقام الإنجليزية */
.english-numbers {
    direction: ltr;
    unicode-bidi: embed;
}

/* ===================================
   29. Form Labels RTL
   =================================== */
label {
    text-align: right;
    display: block;
}

input[type="checkbox"]+label,
input[type="radio"]+label {
    display: inline;
    margin-right: var(--space-2);
    margin-left: 0;
}

/* ===================================
   30. Performance Optimizations
   =================================== */
/* تحسينات الأداء للنص العربي */
body {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ===================================
   نهاية ملف RTL
   =================================== */
/* ===================================
   نهاية ملف RTL
   =================================== */