/*
Theme Name: AMP Westmead
Description: Right-to-left overrides, loaded after style.css for Arabic and any
other right-to-left language. Not a mirrored copy of the stylesheet: only the
rules that genuinely have a direction are repeated here.

Most of the layout needs nothing. Flex and grid rows reverse themselves under
dir="rtl", and the stylesheet already uses margin-inline, padding-inline and
inset-inline in the places that matter. What is left is the handful of physical
left/right declarations, gathered here.
*/

/* Bulleted lists indent from the side the text starts on. */
.prose ul { padding-left: 0; padding-right: 1.25em; }

/* The skip link sits in the corner the reader's eye starts from. */
.skip-link { left: auto; right: var(--space-s); }

/* Divider rules between the logo, the locality and the accreditation mark. */
.logo__place {
  padding-left: 0;
  padding-right: 0.6rem;
  border-left: 0;
  border-right: 1px solid var(--line);
}
@media (max-width: 34rem) {
  .logo__place { padding-right: 0.45rem; }
}
.accred {
  padding-left: 0;
  padding-right: 0.7rem;
  border-left: 0;
  border-right: 1px solid var(--line);
}
.primary-nav__accred .accred { padding-right: 0; border-right: 0; }

/* Accent bars sit on the edge the text starts from, not on the left. */
.site-footer__urgent {
  border-left: 1px solid rgb(255 255 255 / 0.18);
  border-right: 4px solid var(--accent-600);
}
.sheets-intro,
.bulk {
  border-left: 1px solid var(--brand-100);
  border-right: 4px solid var(--brand-600);
}

/* Table columns: the label leads, the figure trails. */
.hours__table th,
.hours__table td { text-align: right; }
.hours__table td { text-align: left; }
.fee-table th,
.fee-table td { text-align: right; }

/* A trailing arrow leans the way it points, which is the other way here. */
.btn:hover > svg:last-child,
.sheet:hover .sheet__source svg,
.news-item:hover .news-item__more svg,
.map-card__cta:hover svg,
a.service:hover .service__more svg,
.hero__where:hover .hero__where-go svg,
.news-strip__item:hover .news-strip__more svg { transform: translateX(-4px); }
/* The session card's rule draws out from the side the text starts on. */
.allied__half.is-revealed .allied__rule { transform-origin: right; }

/* Dietetics' yellow sits out from its photo on the side the text runs to. */
.allied__half--dietetics .allied__portrait { box-shadow: -7px 7px 0 var(--al-accent); }
@container (min-width: 36rem) {
  .allied__half--dietetics .allied__card--photo .allied__portrait { box-shadow: -5px 5px 0 var(--al-accent); }
}

/* Rules and highlights that draw in do so from the side the text starts on. */
.news-strip__item::before { transform-origin: right; }
.hero__mark { background-position: right; }

/* The hero's panel stands back from the start of the line, which is the
   right-hand side here. */
@media (min-width: 64rem) {
  .hero__panel { inset: 0 12% 5.5rem 0; }
}

/* The services band runs the other way, so the second copy of the list, which
   sits to its left, is the one that scrolls into view. */
@keyframes ticker-rtl { to { transform: translateX(33.3333%); } }
@media (prefers-reduced-motion: no-preference) {
  .ticker__track { animation-name: ticker-rtl; }
}

/* Phone numbers and street addresses are written left to right in every
   language. Without this, a right-to-left page reorders their parts, and
   "(02) 9633 4033" is shown as "4033 9633 (02)". Only the number itself is
   isolated, so the button or link around it keeps the page's direction. */
a[href^="tel:"] span { direction: ltr; unicode-bidi: isolate; }
a[href^="tel:"]:not(:has(span)) { direction: ltr; unicode-bidi: isolate; }
.site-footer__address,
.contact__value--address,
.hero__where-text strong,
.hero__where-text span { unicode-bidi: plaintext; text-align: right; }

/* The "back" arrow on a news post is already rotated 180deg to point back;
   under rtl the rotation is what makes it point the wrong way. */
.post__back svg { transform: none; }