/* ============================================================================
   Terra Verde — right-to-left (Arabic)
   ----------------------------------------------------------------------------
   Loaded after theme.css and woocommerce.css, only when the page is served in
   a right-to-left language (inc/enqueue.php). Every rule is scoped to
   html[dir="rtl"], so it always outranks the left-to-right rule it mirrors.

   Two kinds of rule live here:
   1. Mirrors — anything theme.css or woocommerce.css pins to a physical side
      (left/right offsets, one-sided margins, paddings and borders, text-align,
      gradients that pool under the copy, arrows that point "forward").
      Flex and grid mirror on their own and are not repeated.
   2. Arabic type — the Arabic face joins the font stack, letter-spacing goes
      back to zero (tracking tears connected script apart), lines get a little
      more height, and runs that must stay left-to-right (phone numbers, the
      quantity stepper) are isolated.
   ============================================================================ */

/* ---------- 1. Type ---------- */
html[dir="rtl"]{--f:'Montserrat','Cairo',system-ui,-apple-system,'Segoe UI',Tahoma,sans-serif}
html[dir="rtl"] body{line-height:1.75}
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3,html[dir="rtl"] h4{letter-spacing:0;line-height:1.35}
html[dir="rtl"] .hero-title,html[dir="rtl"] .tv-corp .corp-hero h1{letter-spacing:0;line-height:1.25}
/* Arabic sits a touch lower on the line than Montserrat's caps; give the tiny
   uppercase labels a little more size so they stay legible */
html[dir="rtl"] .eyebrow,html[dir="rtl"] .hero-pill,html[dir="rtl"] .coll-badge,html[dir="rtl"] .coll-arrow,html[dir="rtl"] .pcard-tag,html[dir="rtl"] .pcard-oos,
html[dir="rtl"] .scent2-best,html[dir="rtl"] .scent2-b .fam,html[dir="rtl"] .scent-card .fam,html[dir="rtl"] .sm-body .fam,html[dir="rtl"] .foot-bar .pay,
html[dir="rtl"] .tv-gift-edit .tv-gift-k,html[dir="rtl"] .tv-scentpick .sp-slot-k,html[dir="rtl"] .tv-free.tv-gift{font-size:.72rem}
html[dir="rtl"] .nav-links a{font-size:.86rem}
html[dir="rtl"] .announce .wrap{font-size:.78rem}

/* Left-to-right islands: phone numbers (the bidi algorithm would reverse the
   digit groups), the quantity stepper (minus, number, plus) and star rows */
html[dir="rtl"] [dir="ltr"]{unicode-bidi:isolate}
/* values that may stay Latin (a spec such as "115 × 70 × 70 mm", the address) read in their own order */
html[dir="rtl"] .tv-specs td,html[dir="rtl"] .foot .contact li span,html[dir="rtl"] .ci-card span{unicode-bidi:plaintext}
html[dir="rtl"] .woocommerce .quantity{direction:ltr}

/* ---------- 2. Header, announcement bar, drawer, search ---------- */
html[dir="rtl"] .skip-link{left:auto;right:-999px;border-radius:0 0 0 8px}
html[dir="rtl"] .skip-link:focus{right:0}
html[dir="rtl"] .nav-links{margin-left:0;margin-right:auto}
html[dir="rtl"] .nav-links>li>a::after{left:auto;right:0}
html[dir="rtl"] .cart-count{right:auto;left:-8px}
html[dir="rtl"] .search-close{right:auto;left:-6px}
html[dir="rtl"] .search-overlay form{padding:.5rem 1.4rem .5rem .6rem}
html[dir="rtl"] .mobile-nav{transform:translateX(-100%)}
html[dir="rtl"] .mobile-nav.open{transform:none}
@media(max-width:1080px){html[dir="rtl"] .nav-icons{margin-left:0;margin-right:auto}}

/* ---------- 3. Hero ---------- */
/* the chevrons swap sides and point the other way: "previous" is now on the right */
html[dir="rtl"] .hero-arrow svg{transform:scaleX(-1)}
html[dir="rtl"] .hero-arrow.prev{left:auto;right:var(--gutter)}
html[dir="rtl"] .hero-arrow.next{right:auto;left:var(--gutter)}
html[dir="rtl"] .hero-overlay{left:auto;right:0}
/* the dark pool sits under the headline, which is now bottom-right; the pale sheen enters from the right */
html[dir="rtl"] .hero-scrim{background:
   radial-gradient(120% 105% at 94% 112%, rgba(39,23,50,.82), rgba(39,23,50,0) 58%),
   linear-gradient(0deg, rgba(39,23,50,.55), rgba(39,23,50,0) 46%),
   linear-gradient(260deg, rgba(250,247,241,.16), rgba(39,23,50,0) 40%)}
@media(min-width:901px) and (min-aspect-ratio:16/9){
  html[dir="rtl"] .hero-arrow.prev{right:auto;left:calc(100% + var(--gutter))}
  html[dir="rtl"] .hero-pill{text-align:right}
}
@media(max-width:760px),(max-width:900px) and (max-height:560px){
  html[dir="rtl"] .hero-arrow.prev{left:auto;right:8px}
  html[dir="rtl"] .hero-arrow.next{right:auto;left:8px}
}

/* ---------- 4. Section links, cards, badges ---------- */
/* every "forward" arrow (View all…, Buy, Read more, Back to…) points left in Arabic */
html[dir="rtl"] .icon-arrow{transform:scaleX(-1)}
html[dir="rtl"] .tv-back-arrow{display:inline-block;transform:scaleX(-1)}
html[dir="rtl"] .coll-arrow{padding:0 1.1em 0 .95em}
html[dir="rtl"] .scent2-foot .coll-arrow{padding:0 1em 0 .9em}
@media(max-width:560px){html[dir="rtl"] .coll-arrow{padding:0 .9em 0 .8em}}
html[dir="rtl"] .pcard-tag{left:auto;right:12px}
html[dir="rtl"] .pcard-sale{right:auto;left:12px}
html[dir="rtl"] .pcard-oos{left:auto;right:12px}
html[dir="rtl"] .pcard-add{margin-left:0;margin-right:auto}
/* A price is a Latin phrase (EGP, digits, the dash between a range's ends, an old price struck before the new), so each
   reads left to right where the line puts it: "EGP 80 - EGP 2,600" keeps its order, and del/ins keep their LTR margins. */
html[dir="rtl"] .price,html[dir="rtl"] .coll-price{unicode-bidi:plaintext}
html[dir="rtl"] .scent2-best{left:auto;right:12px}
html[dir="rtl"] .sm-close{right:auto;left:.8rem}

/* ---------- 5. Quotes and prose ---------- */
html[dir="rtl"] .entry blockquote,html[dir="rtl"] .tv-story .st-concept .pull{border-left:0;padding-left:0;padding-right:1.2rem}
html[dir="rtl"] .tv-story .st-concept .pull{border-right:2px solid var(--sage)}
html[dir="rtl"] .entry blockquote{border-right:3px solid var(--sage)}
html[dir="rtl"] .entry ul,html[dir="rtl"] .entry ol{padding-left:0;padding-right:1.3em}
html[dir="rtl"] .rcard q{quotes:"\00AB" "\00BB"}

/* ---------- 6. Corporate page ---------- */
html[dir="rtl"] .tv-corp .corp-lines div+div{border-left:0;border-right:1px solid var(--line-strong)}
@media(max-width:760px){html[dir="rtl"] .tv-corp .corp-lines div+div{border-right:0}}
@media(min-width:1120px){
  html[dir="rtl"] .tv-corp .corp-perks li{border-left:0;border-right:1px solid var(--line)}
  html[dir="rtl"] .tv-corp .corp-perks li:first-child{border-right:0;padding-right:0;padding-left:1rem}
  html[dir="rtl"] .tv-corp .corp-perks li:last-child{padding-right:1rem;padding-left:0}
}

/* ---------- 7. Forms, search ---------- */
html[dir="rtl"] .tv-search{padding:.4rem 1.3rem .4rem .5rem}
html[dir="rtl"] .tv-hp{left:auto!important;right:-9999px!important}

/* ---------- 8. Floating pills and the footer bar that makes room for them ---------- */
html[dir="rtl"] .tv-wa{right:auto;left:22px;padding:.85em 1em .85em 1.25em}
html[dir="rtl"] .tv-buy{right:auto;left:22px;padding:.85em 1em .85em 1.25em}
html[dir="rtl"] .foot-bar{padding-right:var(--gutter);padding-left:calc(var(--gutter) + 170px)}
@media(max-width:640px){
  html[dir="rtl"] .tv-wa{right:auto;left:14px;padding:.85em}
  html[dir="rtl"] .tv-buy{right:auto;left:14px;padding:.75em .9em .75em 1.1em}
  html[dir="rtl"] .foot-bar{padding-left:var(--gutter)}
}

/* ---------- 9. Shop: product page, scent picker, sale badge ---------- */
html[dir="rtl"] .woocommerce div.product .summary p.price,html[dir="rtl"] .single-product .summary p.price{text-align:right} /* a block: plaintext would otherwise align it like its Latin content */
html[dir="rtl"] .single-product .variations th{text-align:right}
html[dir="rtl"] .tv-specs th,html[dir="rtl"] .tv-specs td{text-align:right}
/* the sale badge is pinned to the product box's top-right, beside the title; its mirror is the top-left.
   On one column WooCommerce's own RTL sheet moves the zoom button to the top-left, so there the badge
   goes to the top-right instead (the English one-column rule puts it top-left for the same reason) */
html[dir="rtl"] .woocommerce span.onsale{right:auto;left:12px}
@media(max-width:860px){html[dir="rtl"] .single-product div.product>span.onsale{left:auto;right:12px}}
html[dir="rtl"] .tv-shop select.tv-gift-sel,html[dir="rtl"] .tv-gift-sel{padding:.42em .7em .42em 1.9em;background-position:left .55em center}
html[dir="rtl"] .tv-scentpick .sp-head{padding:1.5rem 1.6rem 1.1rem 3.2rem}
html[dir="rtl"] .tv-scentpick .sp-x{right:auto;left:1.1rem}
html[dir="rtl"] .tv-scentpick .sp-slot{text-align:right}
@media(max-width:640px){html[dir="rtl"] .tv-scentpick .sp-head{padding:1.2rem 1.1rem 1rem 3rem}}

/* ---------- 10. Cart and checkout tables ---------- */
/* WooCommerce's right-to-left sheet floats the two columns of a col2-set again, under a
   selector carrying the body's own .rtl class, which outweighs the theme's float:none in
   woocommerce.css. The checkout's second column holds the order notes alone, so it shrank
   to a narrow box beside the billing fields instead of the full-width row beneath them.
   The same rule, scoped to the page's direction, weighs more and puts the columns back. */
html[dir="rtl"] .woocommerce .col2-set .col-1,html[dir="rtl"] .woocommerce .col2-set .col-2,
html[dir="rtl"] .woocommerce-page .col2-set .col-1,html[dir="rtl"] .woocommerce-page .col2-set .col-2{float:none;width:auto}
html[dir="rtl"] .woocommerce-cart table.shop_table.cart th{text-align:right}
html[dir="rtl"] .woocommerce-cart table.shop_table.cart td.actions{text-align:right}
html[dir="rtl"] .woocommerce .cart_totals table.shop_table th{text-align:right}
html[dir="rtl"] .woocommerce .cart_totals table.shop_table td{text-align:left}
@media(max-width:768px){html[dir="rtl"] .woocommerce-cart table.shop_table.cart tr th,html[dir="rtl"] .woocommerce-cart table.shop_table.cart tr td{text-align:right!important}}
html[dir="rtl"] .woocommerce-checkout #order_review table.shop_table th,html[dir="rtl"] .woocommerce-checkout #order_review table.shop_table td{text-align:right}
html[dir="rtl"] .woocommerce-checkout #order_review table.shop_table td:last-child,html[dir="rtl"] .woocommerce-checkout #order_review table.shop_table th:last-child{text-align:left}
html[dir="rtl"] .woocommerce-checkout #payment ul.payment_methods li input.input-radio{margin:0 0 0 .6em}
html[dir="rtl"] .woocommerce #payment ul.payment_methods li label img{margin-left:0;margin-right:.35rem}
html[dir="rtl"] .woocommerce-checkout #payment div.payment_box{margin:.4rem 1.6rem 0 0}

/* ---------- 11. Letter-spacing back to zero on every tracked label ---------- */
html[dir="rtl"] h1{letter-spacing:0}
html[dir="rtl"] h2{letter-spacing:0}
html[dir="rtl"] h3{letter-spacing:0}
html[dir="rtl"] h4{letter-spacing:0}
html[dir="rtl"] .eyebrow{letter-spacing:0}
html[dir="rtl"] .btn{letter-spacing:0}
html[dir="rtl"] .announce .wrap{letter-spacing:0}
html[dir="rtl"] .nav-links a{letter-spacing:0}
html[dir="rtl"] .mega-item .t{letter-spacing:0}
html[dir="rtl"] .mega-item .c{letter-spacing:0}
html[dir="rtl"] .mega-cta a{letter-spacing:0}
html[dir="rtl"] .mobile-nav a{letter-spacing:0}
html[dir="rtl"] .mobile-links a{letter-spacing:0}
html[dir="rtl"] .hero-pill{letter-spacing:0}
html[dir="rtl"] .hero-title{letter-spacing:0}
html[dir="rtl"] .tv-free{letter-spacing:0}
html[dir="rtl"] .trust-item{letter-spacing:0}
html[dir="rtl"] .sec-link{letter-spacing:0}
html[dir="rtl"] .coll-badge{letter-spacing:0}
html[dir="rtl"] .coll-arrow{letter-spacing:0}
html[dir="rtl"] .pcard-tag{letter-spacing:0}
html[dir="rtl"] .pcard-sale{letter-spacing:0}
html[dir="rtl"] .pcard-oos{letter-spacing:0}
html[dir="rtl"] .pcard-name{letter-spacing:0}
html[dir="rtl"] .chip{letter-spacing:0}
html[dir="rtl"] .scent-card .fam{letter-spacing:0}
html[dir="rtl"] .b2b-stat .l{letter-spacing:0}
html[dir="rtl"] .clients .lab{letter-spacing:0}
html[dir="rtl"] .clients-row{letter-spacing:0}
html[dir="rtl"] .foot h4{letter-spacing:0}
html[dir="rtl"] .foot-bar{letter-spacing:0}
html[dir="rtl"] .foot-bar .pay{letter-spacing:0}
html[dir="rtl"] .tv-corp .corp-contact-label{letter-spacing:0}
html[dir="rtl"] .tv-corp .corp-btn{letter-spacing:0}
html[dir="rtl"] .tv-corp .corp-lines dt{letter-spacing:0}
html[dir="rtl"] .ci-card strong{letter-spacing:0}
html[dir="rtl"] .tv-form label{letter-spacing:0}
html[dir="rtl"] .about-stat .l{letter-spacing:0}
html[dir="rtl"] .scent2-b .fam{letter-spacing:0}
html[dir="rtl"] .scent2-b h3{letter-spacing:0}
html[dir="rtl"] .scent2-best{letter-spacing:0}
html[dir="rtl"] .scent-hint{letter-spacing:0}
html[dir="rtl"] .sm-body .fam{letter-spacing:0}
html[dir="rtl"] .sm-notes .row .k{letter-spacing:0}
html[dir="rtl"] .mv-d .tag{letter-spacing:0}
html[dir="rtl"] .mv-d .quote p{letter-spacing:0}
html[dir="rtl"] .tv-wa{letter-spacing:0}
html[dir="rtl"] .tv-buy{letter-spacing:0}
html[dir="rtl"] .woocommerce .woocommerce-breadcrumb{letter-spacing:0}
html[dir="rtl"] .woocommerce-breadcrumb{letter-spacing:0}
html[dir="rtl"] .woocommerce a.button{letter-spacing:0}
html[dir="rtl"] .woocommerce button.button{letter-spacing:0}
html[dir="rtl"] .woocommerce input.button{letter-spacing:0}
html[dir="rtl"] .woocommerce #respond input#submit{letter-spacing:0}
html[dir="rtl"] .woocommerce a.button.alt{letter-spacing:0}
html[dir="rtl"] .woocommerce button.button.alt{letter-spacing:0}
html[dir="rtl"] .woocommerce-page a.button{letter-spacing:0}
html[dir="rtl"] .woocommerce-page button.button{letter-spacing:0}
html[dir="rtl"] .tv-coverage{letter-spacing:0}
html[dir="rtl"] .single-product .variations th{letter-spacing:0}
html[dir="rtl"] .tv-gift-edit .tv-gift-k{letter-spacing:0}
html[dir="rtl"] .tv-pills-label{letter-spacing:0}
html[dir="rtl"] .tv-pill{letter-spacing:0}
html[dir="rtl"] .tv-scentpick .sp-slot-k{letter-spacing:0}
html[dir="rtl"] .woocommerce span.onsale{letter-spacing:0}
html[dir="rtl"] .woocommerce-tabs ul.tabs li a{letter-spacing:0}
html[dir="rtl"] .tv-shop .tv-back{letter-spacing:0}
html[dir="rtl"] .woocommerce-cart table.shop_table.cart th{letter-spacing:0}
html[dir="rtl"] .woocommerce .wc-proceed-to-checkout a.checkout-button{letter-spacing:0}
html[dir="rtl"] .tv-details h2{letter-spacing:0}
