/* styles/style.css */

@import 'theme.css';
@import 'animations.css';
@import 'components/header.css';
@import 'components/tables.css';
@import 'components/cards.css';
@import 'components/footer.css';
@import 'components/loading.css';
@import 'components/solar-card.css'; 
@import 'components/error.css';

/* Responsive */
@media screen and (min-width: 1920px) {
    body {
        font-size: calc(1vw + 0.5vh);
    }
    
    .card {
        max-width: 95vw;
    }
}

/* Mobile responsiveness */
@media screen and (max-width: 768px) {
    .solar-compact {
      font-size: 0.9em; /* Reduce font size on small screens */
    }
    
    .metrics-group {
      padding: 8px; /* Reduce padding on mobile */
    }
    
    /* Stack metrics groups on very small screens */
    @media screen and (max-width: 480px) {
      .middle-row {
        flex-direction: column;
      }
    }
  }