/* ===================================================================
   Base Typography & Global Styles
   Sequoia and Kings Canyon National Parks - Ranger Resources
   Modern Heritage Design - Google Fonts Integration
   =================================================================== */

/* Import Google Fonts - Playfair Display, Inter, Roboto Mono */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Inter:wght@300;400;500;600;700&family=Roboto+Mono:wght@400;500&display=swap');

/* Body base styles - background now handled in layout.css */
body {
  color: var(--color-text-primary);
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  font-weight: 400;
  font-style: normal;
}

/* Table and form elements typography */
body,
td,
th {
  font-size: var(--font-size-base);
  font-style: normal;
  line-height: var(--line-height-base);
}

/* Heading base styles */
h1,
h2,
h3,
.subhead,
.heading {
  font-family: var(--font-family-heading);
  font-weight: 400; /* Playfair looks elegant at normal weight */
  line-height: var(--line-height-tight);
}

h1 {
  font-size: var(--font-size-h1);
  letter-spacing: var(--letter-spacing-tight);
  margin-bottom: var(--spacing-3);
}

h2 {
  font-size: var(--font-size-h2);
  margin-bottom: var(--spacing-2);
}

h3 {
  font-size: var(--font-size-h3);
  margin-bottom: var(--spacing-2);
}

/* Utility class for monospace/data content */
.u-mono {
  font-family: var(--font-family-mono);
  font-size: 0.85rem;
}

/* Link States - Modern Heritage colors */
a:link {
  text-decoration: none;
  color: var(--color-link);
  transition: color 0.2s ease;
}

a:visited {
  text-decoration: none;
  color: var(--color-link); /* Same as unvisited links */
}

a:hover {
  text-decoration: none;
  color: var(--color-link-hover);
}

a:active {
  text-decoration: none;
  color: var(--color-link-hover); /* Same as hover, not distinct */
}

/* Blockquote styling */
blockquote {
  display: block;
  padding: var(--spacing-sm);
  margin: var(--spacing-lg);
  font: var(--font-size-blockquote) var(--font-family-serif);
  color: var(--color-primary);
  border-bottom: dashed 1px var(--color-border-light);
  border-top: dashed 1px var(--color-border-light);
  text-align: center;
}

blockquote.u-float-left {
  float: left;
  width: var(--width-blockquote-side);
  text-align: right;
  margin: var(--spacing-md);
}

blockquote.u-float-right {
  float: right;
  width: var(--width-blockquote-side);
  text-align: left;
  margin: var(--spacing-md);
}