/* ============================================================
   SalarWeb — i18n: English mode (LTR)
   Load AFTER styles.css / slider.css. Only fires for
   html[dir="ltr"] / html.lang-en.
   ============================================================ */

html.lang-en{
  --site-font:'Segoe UI',Tahoma,Verdana,'Helvetica Neue',Arial,sans-serif;
}
html.lang-en body{
  font-family:var(--site-font);
  letter-spacing:0;
}
html.lang-en h1,html.lang-en h2,html.lang-en h3,html.lang-en h4{
  letter-spacing:-.2px;
}

/* ---------- structural mirrors ---------- */
html[dir="ltr"] .topline .container{direction:ltr;text-align:left}
html[dir="ltr"] .search-wrap{margin-right:0;margin-left:8px}
html[dir="ltr"] .search-wrap input{text-align:left}
html[dir="ltr"] .expert-widget{left:auto;right:18px}
@media (max-width:599px){
  html[dir="ltr"] .expert-widget{right:12px}
}
html[dir="ltr"] .mobile-nav-panel{
  right:auto;left:0;
  transform:translateX(-105%);
  box-shadow:20px 0 50px rgba(0,0,0,.22);
}
html[dir="ltr"] [data-mobile-nav].is-open .mobile-nav-panel,
html[dir="ltr"] .mobile-nav-sheet.is-open .mobile-nav-panel{transform:none}

/* ---------- text alignment ---------- */
html[dir="ltr"] .front-service-strip b,
html[dir="ltr"] .front-service-strip span{text-align:left}
html[dir="ltr"] .section-head h2,
html[dir="ltr"] .section-head p{text-align:left}
html[dir="ltr"] .category-heading h2{text-align:left}
html[dir="ltr"] .about-promise div,
html[dir="ltr"] .about-promise p{text-align:left}
html[dir="ltr"] .about-promise .btn{margin-right:0}
html[dir="ltr"] .static-hero-kicker,
html[dir="ltr"] .static-hero h1,
html[dir="ltr"] .static-hero p{text-align:left}
html[dir="ltr"] .breadcrumb{direction:ltr}
html[dir="ltr"] .static-breadcrumb{direction:ltr}

/* ---------- hero slider: text side already follows inset-inline;
   LTR: copy anchors to the left, arrows mirrored by slider.css ---------- */
html[dir="ltr"] .sw-hero-copy{direction:ltr;text-align:left}
html[dir="ltr"] .sw-hero-slide--plain:before{
  -webkit-mask-image:radial-gradient(circle at 25% 45%,#000 0%,transparent 72%);
  mask-image:radial-gradient(circle at 25% 45%,#000 0%,transparent 72%);
}
html[dir="ltr"] .sw-hero-slide--plain:after{right:auto;left:-140px}
html[dir="ltr"] .sw-hero-scrim{
  background:linear-gradient(to right,
    rgba(6,20,34,.92) 0%,rgba(6,20,34,.62) 26%,
    rgba(6,20,34,.24) 50%,rgba(6,20,34,0) 72%);
}
html[dir="ltr"] .sw-hero-slide--plain .sw-hero-scrim{
  background:linear-gradient(to right,
    rgba(6,20,34,.55) 0%,rgba(6,20,34,.2) 45%,rgba(6,20,34,0) 75%);
}

/* ---------- cards & lists ---------- */
html[dir="ltr"] .category-card div b,
html[dir="ltr"] .category-card div span{text-align:left}
html[dir="ltr"] .product-card .pc-name,
html[dir="ltr"] .product-card .pc-brand{text-align:left}
html[dir="ltr"] .product-card .pc-price{text-align:right}
html[dir="ltr"] .product-card .pc-desc{text-align:left}
html[dir="ltr"] .p-title,html[dir="ltr"] .p-brand{text-align:left}
html[dir="ltr"] .p-price{text-align:left}
html[dir="ltr"] .p-desc{text-align:left}
html[dir="ltr"] .p-buy-row{text-align:left}
html[dir="ltr"] .spec-table th,html[dir="ltr"] .spec-table td{text-align:left}
html[dir="ltr"] .review-card header,
html[dir="ltr"] .review-card p{text-align:left}
html[dir="ltr"] .article-card h3,html[dir="ltr"] .article-card p{text-align:left}
html[dir="ltr"] .article-body p{text-align:justify}

/* ---------- forms ---------- */
html[dir="ltr"] input.in,
html[dir="ltr"] textarea.in,
html[dir="ltr"] select.in,
html[dir="ltr"] .shop-search input{text-align:left}
html[dir="ltr"] .frow .fl b,html[dir="ltr"] .frow .fl small{text-align:left}

/* ---------- footer ---------- */
html[dir="ltr"] .footer-grid div h4,
html[dir="ltr"] .footer-grid ul{text-align:left}
html[dir="ltr"] .footer p{text-align:left}
html[dir="ltr"] .footer-bottom span{text-align:left}

/* ---------- arrows that are CSS-drawn ---------- */
html[dir="ltr"] a .arr,
html[dir="ltr"] .btn .arr{transform:scaleX(-1);display:inline-block}

/* ---------- misc decorations that assumed RTL ---------- */
html[dir="ltr"] .about-promise:after,
html[dir="ltr"] .about-promise:before{right:auto;left:-80px}
html[dir="ltr"] .topline .container span:last-child{margin-right:0;margin-left:0}