/*
 * UI typography scale tuned for Aegro's most common viewports:
 * Desktop: 1366x768, 1536x864, 1920x1080
 * Mobile: ~390px wide
 */

:root {
  --ui-type-scale: 1;
}

@media (min-width: 1280px) {
  :root {
    --ui-type-scale: 1.06;
  }
}

@media (min-width: 1536px) {
  :root {
    --ui-type-scale: 1.1;
  }
}

@media (max-width: 640px) {
  :root {
    --ui-type-scale: 1.02;
  }
}

/* Tailwind semantic sizes */
.text-xs {
  font-size: calc(0.8125rem * var(--ui-type-scale)) !important;
  line-height: 1.45 !important;
}

.text-sm {
  font-size: calc(0.9375rem * var(--ui-type-scale)) !important;
  line-height: 1.45 !important;
}

.text-base {
  font-size: calc(1rem * var(--ui-type-scale)) !important;
  line-height: 1.5 !important;
}

.text-lg {
  font-size: calc(1.125rem * var(--ui-type-scale)) !important;
  line-height: 1.4 !important;
}

.text-xl {
  font-size: calc(1.375rem * var(--ui-type-scale)) !important;
  line-height: 1.3 !important;
}

.text-2xl {
  font-size: calc(1.625rem * var(--ui-type-scale)) !important;
  line-height: 1.25 !important;
}

/* Tailwind arbitrary sizes used across templates */
.text-\[10px\] {
  font-size: calc(0.72rem * var(--ui-type-scale)) !important;
}

.text-\[11px\] {
  font-size: calc(0.8rem * var(--ui-type-scale)) !important;
}

.text-\[13px\] {
  font-size: calc(0.92rem * var(--ui-type-scale)) !important;
}

.text-\[15px\] {
  font-size: calc(1.03rem * var(--ui-type-scale)) !important;
}

.text-\[16px\] {
  font-size: calc(1.1rem * var(--ui-type-scale)) !important;
}

.text-\[26px\] {
  font-size: calc(1.9rem * var(--ui-type-scale)) !important;
  line-height: 1.15 !important;
}

.text-\[28px\] {
  font-size: calc(2rem * var(--ui-type-scale)) !important;
  line-height: 1.15 !important;
}

@media (min-width: 640px) {
  .sm\:text-\[32px\] {
    font-size: calc(2.25rem * var(--ui-type-scale)) !important;
    line-height: 1.1 !important;
  }
}