/* Shared presentation rules used by live decks, Play preview, and editors. */
@import url("https://fonts.googleapis.com/css2?family=Inter+Tight:wght@300;400;500;600;700;800&family=Noto+Sans+Arabic:wght@400;500;600;700&display=swap");

.sl-rich-text {
  font-family: inherit;
}

:where(
  html:lang(ar),
  html:lang(hi),
  html:lang(ur),
  html:lang(fa),
  [data-slide-lang-root]:lang(ar),
  [data-slide-lang-root]:lang(hi),
  [data-slide-lang-root]:lang(ur),
  [data-slide-lang-root]:lang(fa)
) {
  font-family: "Noto Sans Arabic", "Inter Tight", "Inter", system-ui, sans-serif;
}

:where(
  html:lang(ar),
  html:lang(hi),
  html:lang(ur),
  html:lang(fa),
  [data-slide-lang-root]:lang(ar),
  [data-slide-lang-root]:lang(hi),
  [data-slide-lang-root]:lang(ur),
  [data-slide-lang-root]:lang(fa)
) .sl-rich-text {
  font-family: "Noto Sans Arabic", "Inter Tight", "Inter", system-ui, sans-serif;
}

:where(
  html[dir="rtl"],
  [data-slide-lang-root][dir="rtl"]
) {
  direction: rtl;
}

:where(html[dir="rtl"], [data-slide-lang-root][dir="rtl"]) .sl-opinions,
:where(html[dir="rtl"], [data-slide-lang-root][dir="rtl"]) .sl-feedback.sl-score {
  direction: ltr;
}

:where(html[dir="rtl"], [data-slide-lang-root][dir="rtl"]) .sl-feedback.sl-score .sl-counting {
  direction: rtl;
}

.sl-welcome-supporting-text,
.sl-welcome-supporting-text * {
  color: #333;
}

.sl-preview-field-ref {
  display: inline-block;
  padding: 0.05em 0.35em;
  border: 1px solid rgba(112, 89, 231, 0.3);
  border-radius: 0.35em;
  color: #5941cf;
  background: rgba(112, 89, 231, 0.08);
  font: inherit;
  line-height: 1.2;
  white-space: nowrap;
}

.sl-title .sl-title-unbold {
  font-style: normal !important;
  font-weight: 400 !important;
}

.sl-title .sl-title-unbold strong,
.sl-title .sl-title-unbold b {
  font-weight: 400 !important;
}

/* Image orientation is derived during rendering when dimensions are available;
   legacy images are classified on load using the same orientation classes. */
@media (min-width: 600px) {
  .sl-statement:has(.sl-attachment--portrait) .sl-attachment-info {
    flex: 3;
  }

  .sl-statement:has(.sl-attachment--portrait) .sl-attachment {
    flex: 2;
  }

  html[data-display-mode="fullscreen"] .sl-statement:has(.sl-attachment--portrait) .sl-attachment-info,
  html[data-display-mode="fullscreen"] .sl-statement:has(.sl-attachment--portrait) .sl-attachment {
    flex: 1;
  }

  .sl-attachment-image {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 560px;
  }
}

@media (max-width: 599px) {
  .sl-attachment > figure {
    width: 100%;
    height: auto;
  }

  .sl-attachment-image {
    height: auto;
    max-height: 280px;
  }

  .sl-attachment--portrait .sl-attachment-image {
    width: auto;
    object-fit: contain;
  }

  .sl-attachment--landscape .sl-attachment-image,
  .sl-attachment--square .sl-attachment-image {
    width: 100%;
    object-fit: cover;
  }
}