/*
 Theme Name: My Astra Child Theme
 Theme URI: https://yourwebsite.com/
 Description: A custom child theme for Astra to implement RTL for comments and post navigation.
 Author: Your Name
 Author URI: https://yourwebsite.com/
 Template: astra
 Version: 1.0.0
 Text Domain: my-astra-child
*/

/*
 * تبصرہ سیکشن اور پوسٹ نیویگیشن کے لیے کسٹم CSS
 * یہ کوڈ تبصرہ کے پورے علاقے اور اگلی/پچھلی پوسٹ نیویگیشن کو اردو لے آؤٹ (رائٹ ٹو لیفٹ) میں سیٹ کرتا ہے۔
 */

/* 1. مین کنٹینر اور ہیڈنگ (تبصرہ سیکشن) */
/* تبصرے کے پورے سیکشن کی سمت اور ٹیکسٹ الائنمنٹ کو درست کرتی ہے۔ */
#comments,
#respond {
    direction: rtl;
    text-align: right;
}

/* 2. لاگ اِن ہونے کا میسج (تبصرہ سیکشن) */
/* "Logged in as..." کے متن کو دائیں جانب کرتی ہے۔ */
.logged-in-as {
    text-align: right;
    direction: rtl;
    float: right;
}

/* 3. فارم کے خانے اور لیبل (تبصرہ سیکشن) */
/* تمام فارم لیبل اور ان پٹ خانوں کو دائیں جانب الائن کرتی ہے۔ */
.comment-form label,
.comment-form input,
.comment-form textarea {
    text-align: right;
}

/* 4. پلیس ہولڈر متن (تبصرہ سیکشن) */
/* تبصرے کے خانے کے اندر کے پلیس ہولڈر متن کو سٹائل کرتی ہے۔ */
.comment-form-comment textarea::placeholder {
    text-align: right;
    direction: rtl;
}

/* 5. ضروری خانے کا متن (تبصرہ سیکشن) */
/* "Required fields are marked *" کے متن کو دائیں جانب الائن کرتی ہے۔ */
.comment-notes {
    text-align: right;
    direction: rtl;
}

/* 6. جمع کروائیں کا بٹن (تبصرہ سیکشن) */
/* "Post Comment" بٹن کو بائیں جانب منتقل کرتی ہے، جو اردو لے آؤٹ کے لیے عام ہے۔ */
#submit {
    float: left;
    margin-left: 0;
    margin-right: auto;
}

/* 7. پوسٹ نیویگیشن (اگلی/پچھلی پوسٹ) */
/* Sets the overall direction for post navigation links. */
.post-navigation,
.nav-links {
    direction: rtl;
    text-align: right; /* Aligns the navigation block itself to the right */
    display: flex; /* Use flexbox for better control */
    justify-content: space-between; /* Puts previous on right, next on left */
    width: 100%; /* Ensure it takes full width */
}

/* Adjust individual navigation links for RTL */
.nav-previous,
.nav-next {
    text-align: right; /* Default alignment for text within the link */
    flex: 1; /* Allow items to grow */
}

/* Specific alignment for "Previous Post" link (which is usually on the left in LTR) */
.nav-previous {
    order: 2; /* Puts "Previous" on the left in RTL flexbox */
    text-align: left; /* Aligns its text to the left */
}

/* Specific alignment for "Next Post" link (which is usually on the right in LTR) */
.nav-next {
    order: 1; /* Puts "Next" on the right in RTL flexbox */
    text-align: right; /* Aligns its text to the right */
}

/* Adjust arrows or icons if present */
.nav-previous .post-title::before,
.nav-next .post-title::after {
    /* You might need to adjust specific arrow/icon styling here */
    /* For example, if there's a left arrow for previous, you might want to flip it */
    /* transform: scaleX(-1); */
    /* margin-left: 5px; /* Adjust spacing */
    /* margin-right: 0; */
}

/* Ensure link text is aligned correctly within its container */
.post-navigation a {
    direction: rtl;
    text-align: right;
    display: block; /* Make the link take full width of its flex item */
}