/* ============================================
   ALBASAER — FRONTEND MASTER CSS (Arabic / RTL)
   Mirrors en/master.css with RTL adjustments
   ============================================ */
@import url('../en/master.css');

/* ── Direction & Font ── */
*, *::before, *::after { direction: rtl; unicode-bidi: embed; }
html { direction: rtl; }
body { direction: rtl; font-family: '29LT Zarid', 'Work Sans', system-ui, sans-serif; }

:root {
  --font-body:    '29LT Zarid', 'Work Sans', system-ui, sans-serif;
  --font-heading: '29LT Zarid', 'Work Sans', system-ui, sans-serif;
}

/* ── Nav underline: slide from right in RTL ── */
.site-header__nav-link::after {
  transform-origin: right center;
}

/* ── Section: flip left glow to right side ── */
.section--free-books::before {
  left: auto;
  right: -160px;
}

/* ── Section header: border on right side ── */
.section-header__left--bordered {
  border-left: none;
  padding-left: 0;
  border-right: 4px solid #8a1538;
  padding-right: 16px;
}

/* ── Section link: flip arrow ── */
.section-link svg { transform: scaleX(-1); }

/* ── Book card: badge on left, text right-aligned, margin flip ── */
.book-card__badge       { right: auto; left: 16px; }
.book-card__body        { text-align: right; }
.book-card__rating      { margin-left: 0; margin-right: 4px; }

/* ── Newsletter input: RTL ── */
.site-footer__newsletter-input {
  direction: rtl;
  text-align: right;
}
.book-card__stars {
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  gap: 2px;
  margin-bottom: 8px;
}
.book-card__rating { font-size: 12px; color: #6a7282; margin-right: 4px; }

.book-card__title {
  font-size: 18px;
  font-weight: 700;
  color: #101828;
  margin: 0 0 4px;
  letter-spacing: -0.2px;
  line-height: 1.4;
}
.book-card__author {
  font-size: 14px;
  color: #4a5565;
  margin: 0;
}

.book-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row-reverse;
  padding: 16px 20px;
  margin-top: 16px;
}
.book-card__price {
  font-size: 18px;
  font-weight: 700;
  color: #8a1538;
  letter-spacing: -0.2px;
}
.book-card__price--paid { color: #8a1538; }

.book-card__wishlist {
  width: 36px; height: 36px;
  border-radius: 50%;
  border: none;
  background: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #d1d5db;
  transition: color 0.2s ease;
  padding: 0;
}
.book-card__wishlist:hover { color: #8a1538; }

/* ── Mobile nav: right-aligned ── */
.mobile-nav { text-align: right; }

/* ── Responsive overrides ── */
@media (max-width: 768px) {
  /* Push login/burger to left (RTL start = right visually, so auto on margin-right) */
  .site-header__actions { margin-left: 0; margin-right: auto; }

  /* Footer bottom: align to right in RTL */
  .site-footer__bottom { align-items: flex-end; }

  /* Section header stacks aligned to right */
  .section-header { align-items: flex-end; }


}

/* ── Cart RTL overrides ─────────────────────────────────────────────── */

/* Badge: flip to inline-start (left in LTR = right in RTL, badge stays on start) */
.site-header__cart-badge { top: 4px; right: auto; left: 4px; }

/* In RTL flex row, items appear right-to-left.
   Desired visual order (RTL): cover(right) | info | price | qty | del(left)
   Since flex in RTL already reverses, we keep the same order numbers and
   just flip the price text alignment. */
.cart-item__price-col  { text-align: start; }

/* Summary label/value — RTL flex already reverses, no extra overrides needed.
   Checkout arrow direction set server-side via isAr check in the view. */

/* Auth RTL overrides live in auth.css via [dir="rtl"] selectors */

/* ── User pill RTL ────────────────────────────────────────────────── */
/* In RTL the pill padding flips: avatar is on the right, name on the left */
.site-header__user-pill {
  padding: 0 14px 0 8px;
}
/* Dropdown opens from left edge in RTL */
.site-header__user-dropdown {
  right: auto;
  left: 0;
}