/*
Theme Name: Store Theme - RTL Stylesheet
Description: Full RTL stylesheet adhering strictly to RTL best practices (https://rtlstyling.com/posts/rtl-styling/ by Ahmad Shadeed).
Version: 1.0.0
*/

/* 1. Page Direction & Writing Mode */
html[dir="rtl"],
body.rtl,
:root {
  direction: rtl;
  unicode-bidi: isolate;
  text-align: start;
}

/* 2. Letter-Spacing / Tracking Reset
   Arabic letters are cursive and connected. Applying letter-spacing breaks ligature glyphs. */
html[dir="rtl"],
html[dir="rtl"] body,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] p,
html[dir="rtl"] span,
html[dir="rtl"] a,
html[dir="rtl"] button,
html[dir="rtl"] input,
html[dir="rtl"] select,
html[dir="rtl"] textarea {
  letter-spacing: normal !important;
}

/* 3. Uppercase Reset
   Uppercase and lowercase do not exist in Arabic script. Prevent artificial casing artifacts. */
html[dir="rtl"] .uppercase {
  text-transform: none !important;
}

/* 4. Text Underlines & Dot Clipping Prevention
   Default browser underlines intersect dots on letters like yaa, baa, kasra. */
html[dir="rtl"] a,
html[dir="rtl"] u,
html[dir="rtl"] ins {
  text-decoration-skip-ink: auto;
  text-underline-offset: 4px;
}

/* 5. WooCommerce Price <ins> Underline Removal */
html[dir="rtl"] .woocommerce-Price-amount,
html[dir="rtl"] ins.woocommerce-Price-amount,
html[dir="rtl"] .price ins,
html[dir="rtl"] .store-product-card ins {
  text-decoration: none !important;
}

/* 6. Word Breaking
   Arabic text must not be broken mid-word with break-all. */
html[dir="rtl"] {
  word-break: normal;
  overflow-wrap: break-word;
}

/* 7. Form Controls & Alignment */
html[dir="rtl"] input[type="text"],
html[dir="rtl"] input[type="search"],
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] textarea,
html[dir="rtl"] select {
  text-align: start;
}

/* 8. Bidirectional Directional Icons
   Chevrons/arrows indicating forward/next point left in RTL.
   Symmetrical icons (cart, star, bag, heart, close, user) do not flip. */
html[dir="rtl"] .store-icon--directional {
  transform: scaleX(-1);
}

/* 9. Tables in RTL */
html[dir="rtl"] table th,
html[dir="rtl"] table td {
  text-align: start;
}