/* === BASE === */
:root {
  --side-padding: 1.5rem; /* Adjust as needed */
}

main{
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}


body {
  /* Add top padding equal to the header's full height */
  padding-top: 0.5rem; /* Match your header's min-height */
  background: #f6f6f6;
}







/* Dark mode overrides */
@media (prefers-color-scheme: dark) {
  body{
    background: #181818;
    color: #eee;
  }

  .project-cover-row,
  .project-cover-anim,
  .project-cover-content-container,
  .project-main-grid,
  .project-image-main,
  .project-main-info,
  .project-header-row,
  .project-title,
  .project-title--projectpage,
  .project-description,
  .project-grid,
  .project-grid--project,
  .project-card {
    color: #eee !important;
    border-color: #333 !important;
  }



  /* Ensure text inside .text-font or similar custom classes is also light */
  .text-font {
    color: #eee !important;
  }


  input,
  textarea,
  select,
  button,
  .project-table-header,
  .project-title,
  .project-title--projectpage,
  .project-table-header-right,
  .project-table-row td,
  .project-table-title,
  .project-table-field,
  .project-table-year,
  .project-description,
  .header-nav,
  .header-nav .nav-link,
  .header-nav .nav-link.is-active,
  header .logo,
	.about-social-links a,
	.about-slide-text,
	.about-slide-content,
  footer {
    color: #eee !important;
    border-color: #333;
  }
 
  .project-tag{ 
    background: #323232 !important;
    color: #eee !important;
  }

  header,
  footer {
    background: #181818;
  }

  .header-nav .nav-link {
    color: #888 !important;
  }
  .header-nav .nav-link.is-active {
    color: #fff !important;
  }

  .project-table-header,
  .project-table-header-right,
  .project-table-row td {
    color: #eee !important;
    border-color: #444;
  }


 

  footer a {
    color: #bbb !important;
  }
}