/* Responsive improvements for different screen sizes */

:root {
  /* Base font size that scales with viewport */
  font-size: clamp(14px, 1vw, 18px);
}

/* Large desktop screens (1920px+) */
@media (min-width: 1920px) {
  body {
    font-size: 1.1rem;
  }
  
  /* Scale up containers and padding */
  .container {
    max-width: 1600px;
    margin: 0 auto;
  }
  
  /* Increase spacing for better readability */
  h1 { font-size: 2.5rem; }
  h2 { font-size: 2rem; }
  h3 { font-size: 1.75rem; }
  
  /* Scale buttons and inputs */
  button, input, select, textarea {
    font-size: 1.1rem;
  }
}

/* Standard desktop (1366px - 1919px) */
@media (min-width: 1366px) and (max-width: 1919px) {
  body {
    font-size: 1rem;
  }
  
  .container {
    max-width: 1280px;
  }
}

/* Small laptops and tablets (768px - 1365px) */
@media (min-width: 768px) and (max-width: 1365px) {
  body {
    font-size: 0.95rem;
  }
  
  .container {
    max-width: 100%;
    padding: 0 1rem;
  }
}

/* Mobile devices (< 768px) */
@media (max-width: 767px) {
  body {
    font-size: 0.9rem;
  }
  
  h1 { font-size: 1.75rem; }
  h2 { font-size: 1.5rem; }
  h3 { font-size: 1.25rem; }
  
  .container {
    padding: 0 0.5rem;
  }
}

/* Prevent text from being too small */
input, button, select, textarea {
  font-size: max(1rem, 16px);
}

/* Improve table readability on large screens */
@media (min-width: 1920px) {
  table {
    font-size: 1.1rem;
  }
  
  table th,
  table td {
    padding: 1rem;
  }
}

/* Better form field sizing */
@media (min-width: 1920px) {
  input[type="text"],
  input[type="number"],
  input[type="email"],
  input[type="password"],
  select,
  textarea {
    padding: 0.75rem 1rem;
    min-height: 48px;
  }
}