/* 
 * Responsive Font System for 2560x1440 Standard
 * Base font size: 2.2vh at 2560x1440 resolution
 * Using vw/vh units for responsive scaling
 */

:root {
  --font-base: 1.2vw;
  
  /* Scale factors for different text sizes */
  --font-scale-xs: 0.95;   /* ~20.6px */
  --font-scale-sm: 1.00;   /* ~23.8px */
  --font-scale-md: 1.15;   /* ~26.9px */
  --font-scale-lg: 1.30;    /* ~31.7px (base) */
  --font-scale-xl: 1.45;   /* ~36.4px */
  --font-scale-xxl: 1.60;  /* ~42.8px */
  --font-scale-xxxl: 1.75;  /* ~50.7px */

  --vd: calc(1.1 * hypot(100vw, 100vh) / 100);
}

@media (max-width: 768px) {
  :root{
    --vd: calc(1.4 * hypot(100vw, 100vh) / 100);
  }
}

/* Responsive font classes */
.font-xs {
  font-size: calc(var(--vd) * var(--font-scale-xs));
  /* font-size: 1.43vh; Fallback */
}

.font-sm {
  font-size: calc(var(--vd) * var(--font-scale-sm));
  /* font-size: 1.65vh; Fallback */
}

.font-md {
  font-size: calc(var(--vd) * var(--font-scale-md));
  /* font-size: 1.87vh; Fallback */
}

.font-lg {
  font-size: calc(var(--vd) * var(--font-scale-lg));
  /* font-size: 2.2vh; Fallback */
}

.font-xl {
  font-size: calc(var(--vd) * var(--font-scale-xl));
  /* font-size: 2.53vh; Fallback */
}

.font-xxl {
  font-size: calc(var(--vd) * var(--font-scale-xxl));
  /* font-size: 2.97vh; Fallback */
}

.font-xxxl {
  font-size: calc(var(--vd) * var(--font-scale-xxxl));
  /* font-size: 3.52vh; Fallback */
}




/* Font weight classes */
.font-light {
  font-weight: 300;
}

.font-normal {
  font-weight: 400;
}

.font-medium {
  font-weight: 500;
}

.font-semibold {
  font-weight: 600;
}

.font-bold {
  font-weight: 700;
}

/* Text color classes matching existing theme */
.text-primary {
  color: #1e3a5f;
}

.text-secondary {
  color: #666;
}

.text-muted {
  color: #999;
}

.text-body {
  color: #444;
}

.text-light {
  color: #555;
}

/* Line height classes */
.lh-tight {
  line-height: 1.4;
}

.lh-normal {
  line-height: 1.6;
}

.lh-relaxed {
  line-height: 1.8;
}

.lh-loose {
  line-height: 2.0;
}

.lh-double {
  line-height: 2.2;
}

/* Text alignment */
.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-justify {
  text-align: justify;
}

/* Text indent */
.text-indent {
  text-indent: 2em;
}

/* Responsive utilities for different screen sizes */
@media screen and (min-width: 1920px) and (max-width: 2560px) {
  :root {
    --font-base: 1.3vw;
    --vd :  calc(1.25 * hypot(100vw, 100vh) / 100);
  }
}

@media screen and (min-width: 1600px) and (max-width: 1920px) {
  :root {
    --font-base: 1.25vw;
    --vd :  calc(1.2 * hypot(100vw, 100vh) / 100);
  }
}

@media screen and (min-width: 1366px) and (max-width: 1600px) {
  :root {
    --font-base: 1.2vw;
    --vd :  calc(1.15 * hypot(100vw, 100vh) / 100);
  }
}

@media screen and (min-width: 1024px) and (max-width: 1366px) {
  :root {
    --font-base: 1.5vh;
    --vd :  calc(1.1 * hypot(100vw, 100vh) / 100);
  }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
  :root {
    --font-base: 1.45vh;
    --vd :  calc(1.05 * hypot(100vw, 100vh) / 100);
  }
}

@media screen and (min-width: 480px) and (max-width: 768px) {
  :root {
    --font-base: 1.35vh;
    --vd :  calc(1.0 * hypot(100vw, 100vh) / 100);
  }
}

/* Print styles */
@media print {
  .font-xs { font-size: 10pt; }
  .font-sm { font-size: 11pt; }
  .font-md { font-size: 12pt; }
  .font-lg { font-size: 14pt; }
  .font-xl { font-size: 16pt; }
  .font-xxl { font-size: 18pt; }
  .font-xxxl { font-size: 20pt; }
}