/* HotVoucher — English layout (left-to-right)
   The pages carry dir="rtl" themselves and the CSS hooks onto them with [dir=rtl]; so instead of removing that attribute
   (which breaks the layout rules) we only flip the direction and alignment in English mode. */
html[lang='en'] [dir='rtl'],
html[lang='en'] #hv-header,
html[lang='en'] #hv-footer,
html[lang='en'] .hv-nav,
html[lang='en'] .hv-sheet,
html[lang='en'] #toast,
html[lang='en'] #install,
html[lang='en'] #update,
html[lang='en'] .hv-offline { direction: ltr; }

/* Text alignment: whatever was right-aligned in Persian becomes left-aligned in English (inline styles are overridden with important) */
html[lang='en'] [style*='text-align:right'] { text-align: left !important; }
html[lang='en'] [style*='text-align: right'] { text-align: left !important; }

/* Font: a Latin font sits better in English, but Vazirmatn has Latin too; we only reset the letter spacing to normal */
html[lang='en'] body { letter-spacing: 0; }

/* Numbers and Latin codes need no bidirectional isolation in English */
html[lang='en'] bdi[dir='ltr'] { unicode-bidi: normal; }

/* In English no right-to-left block remains (sheets built in code with dir="rtl") */
html[lang='en'] [dir='rtl'] { direction: ltr !important; }
html[lang='en'] [dir='rtl'][style*='text-align:right'] { text-align: left !important; }
/* The "Back" arrow points left in English */
html[lang='en'] svg:has(> path[d='M8 4l6 6-6 6']), html[lang='en'] svg:has(> path[d='M12 4l-6 6 6 6']) { transform: scaleX(-1); }
/* Amount column in asset/transaction rows: left-aligned in Persian (the end side), right-aligned in English */
html[lang='en'] .screen div[style*='text-align:left;line-height:1.25'] { text-align: right !important; }
/* Home tile labels (sport/live casino/casino): smaller in English so they do not overflow the tile */
html[lang='en'] .screen span[style*='font-weight:800'][style*='padding-inline-start:22px'] { font-size: 12px !important; letter-spacing: 0; white-space: nowrap; padding-inline-start: 38px !important; padding-inline-end: 6px; }

/* ===== English: Inter font and home tiles with a softer look ===== */
html[lang='en'] body, html[lang='en'] #app, html[lang='en'] [style*="font-family:'Vazirmatn'"], html[lang='en'] .hv-sheet, html[lang='en'] #hv-sheet { font-family: 'Inter', 'Vazirmatn', system-ui, sans-serif !important; }
html[lang='en'] .screen div[style*='box-shadow:0 4px 0'] {
  height: 54px !important; border-radius: 16px !important;
  box-shadow: 0 1px 2px rgba(23,25,30,.06), 0 8px 18px rgba(23,25,30,.10) !important;
  background-image: linear-gradient(135deg, rgba(255,255,255,.45), rgba(255,255,255,0) 60%) !important;
  border: 1px solid rgba(255,255,255,.55);
}
html[lang='en'] .screen div[style*='box-shadow:0 4px 0'] span { font-family: 'Inter', sans-serif !important; font-weight: 700 !important; font-size: 13px !important; letter-spacing: .01em; text-shadow: 0 1px 0 rgba(255,255,255,.35); }
html[lang='en'] .screen div[style*='box-shadow:0 4px 0'] svg { opacity: .9; }
/* Spark on the FireTemple/Toto tiles in English: bolder, with a soft glow and slightly bigger */
html[lang='en'] .screen div[style*='box-shadow:0 4px 0'] > svg[style*='opacity:.55'] { opacity: .95 !important; filter: drop-shadow(0 0 3px rgba(255,255,255,.9)) drop-shadow(0 2px 4px rgba(23,25,30,.18)); transform: scale(1.18) rotate(-6deg); transform-origin: bottom left; bottom: 4px !important; }
/* English: inline right-aligned/right-to-left (which was the "start" in Persian) → left */
html[lang='en'] [style*='text-align:right'] { text-align: left !important; }
html[lang='en'] [style*='direction:rtl'] { direction: ltr !important; }