/* Samin Holding additions to the company dial: fonts, Persian (RTL) layout, photo backgrounds, language key. */

/* Vazirmatn everywhere, in both languages (self-hosted: assets/fonts/vazirmatn) */
.th-stage, .f-jb, .f-boardroom { font-family: "Vazirmatn", sans-serif; font-style: normal; }
.th-heroName { font-weight: 700; font-style: normal !important; }

/* ---------- twelve wedges: smaller labels so each fits its slice ---------- */
.sm-dial12 .th-wLabel { --r: calc(var(--dial) * .245); width: calc(var(--dial) * .105); font-size: calc(var(--dial) * .0155); letter-spacing: .08em; line-height: 1.3; }
.sm-dial12 .th-wIcon { --r: calc(var(--dial) * .362); width: calc(var(--dial) * .062); height: calc(var(--dial) * .062); }
@media (max-width: 699px) {
  .sm-dial12 .th-wIcon { --r: calc(var(--dial) * .33); width: calc(var(--dial) * .085); height: calc(var(--dial) * .085); }
}

/* company names are longer than edition names: let them wrap, a little smaller */
.sm-heroName { --hfs: clamp(36px, min(5.2vw, 8.4vh), 84px) !important; white-space: normal !important; max-width: min(15ch, 46vw); line-height: 1.02; }
@media (max-width: 699px) { .sm-heroName { --hfs: clamp(28px, 9.4vw, 46px) !important; max-width: none; } }

/* ---------- a company's photograph as the backdrop ---------- */
.sm-photoWorld { background-color: #0d0c0b; background-position: center; background-size: cover; background-repeat: no-repeat; }
.sm-photoWorld::after {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(120% 90% at 50% var(--hr-eye, 80%), #0a090800 0%, #0a0908a6 58%, #0a0908e6 100%),
    linear-gradient(180deg, #0a0908d9 0%, #0a090899 34%, #0a0908b3 100%);
}
.sm-photoWorld[data-on="true"] { animation: sm-drift 18s ease-out both; }
@keyframes sm-drift { from { background-size: auto 112%; } to { background-size: auto 104%; } }
@media (prefers-reduced-motion: reduce) { .sm-photoWorld[data-on="true"] { animation: none; } }
.sm-photoVignette { position: absolute; inset: 0; z-index: 1; background: radial-gradient(70% 55% at 50% var(--hr-eye, 80%), #efe9dc14 0%, #efe9dc00 60%); }

/* ---------- Persian ---------- */
[dir="rtl"] .th-stage, [dir="rtl"] .th-stage * { letter-spacing: 0 !important; }
[dir="rtl"] .th-wordmark { font-size: clamp(13px, 1.15vw, 15px); font-weight: 700; }
[dir="rtl"] .th-positioning { font-size: clamp(12px, .95vw, 13.5px); line-height: 1.95; }
[dir="rtl"] .th-heroTag { font-size: clamp(12px, 1vw, 14px); line-height: 1.8; }
[dir="rtl"] .th-hint, [dir="rtl"] .th-turnCue { font-size: 12px; }
[dir="rtl"] .sm-dial12 .th-wLabel { font-size: calc(var(--dial) * .0175); font-weight: 600; line-height: 1.55; }
[dir="rtl"] .th-hubEnter { font-size: 1.15em; font-weight: 700; }
[dir="rtl"] .th-keyLabel { font-size: 11px; }
[dir="rtl"] .th-heroName { line-height: 1.25; }
[dir="rtl"] .th-hubIndex { direction: ltr; unicode-bidi: isolate; }

/* the dial and its turn keys work in screen directions, whatever the language */
.th-dialWrap, .th-turnKeys { direction: ltr; }
[dir="rtl"] .th-dialWrap .th-wLabel, [dir="rtl"] .th-hubBody { direction: rtl; }

@media (min-width: 700px) {
  [dir="rtl"] .th-console { right: auto; left: clamp(18px, 3.2vw, 54px); }
  [dir="rtl"] .th-hint { right: auto; left: clamp(18px, 3.2vw, 54px); text-align: left; }
}

/* ---------- language key, styled like the console's keys ---------- */
.th-lang {
  border: 1px solid var(--hr-hair); background: var(--hr-key); min-height: 44px; color: var(--hr-ink);
  border-radius: 6px; align-items: center; justify-content: center; padding: 0 14px; display: inline-flex;
  font-size: 11px; font-weight: 600; letter-spacing: .14em; text-decoration: none;
  transition: color .26s var(--hr-ease), border-color .26s var(--hr-ease), background-color .26s var(--hr-ease);
}
.th-lang:lang(fa) { font-size: 13px; letter-spacing: 0; }
.th-lang:hover, .th-lang:focus-visible { border-color: var(--hr-ink); }
.th-console[data-spin="true"] .th-lang { pointer-events: none; opacity: .45; }
.sm-word { display: inline-block; white-space: nowrap; }