/* Custom Styles overriding or enhancing Pico.css */

/* Carousel Styles */
@keyframes tonext {
  75% {
    left: 0;
  }
  95% {
    left: 100%;
  }
  98% {
    left: 100%;
  }
  99% {
    left: 0;
  }
}

.carousel {
  position: relative;
  padding-top: 50%; /* Aspect Ratio 2:1 */
  filter: drop-shadow(0 0 10px #0003);
  perspective: 100px;
  margin-bottom: 2rem;
}

.carousel__viewport {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  overflow-x: scroll;
  counter-reset: item;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  list-style: none;
  padding: 0;
  margin: 0;
}

.carousel__slide {
  position: relative;
  flex: 0 0 100%;
  width: 100%;
  background-color: #f99;
  counter-increment: item;
}

.carousel__snapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  scroll-snap-align: center;
}

.carousel:hover .carousel__snapper,
.carousel:focus-within .carousel__snapper {
  animation-name: none;
}

/* Grid adjustments for Members */
.grid article {
    text-align: center;
    padding: 1rem;
}

/* Professor Profile Specific Styling */
.professor-profile {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center; /* Center content horizontally */
    gap: 2rem;
    max-width: 900px; /* Limit maximum width of the card itself */
    margin: 0 auto; /* Center the card within the page */
}

.professor-profile .professor-image-container {
    flex: 0 0 auto;
    max-width: 100%;
    text-align: center;
    /* Remove padding to tighten spacing */
    padding: 0; 
}

.professor-profile .professor-text-container {
    flex: 1;
    min-width: 300px;
    text-align: center; /* Center text by default (mobile) */
}

@media (min-width: 768px) {
    .professor-profile {
        flex-wrap: nowrap;
        text-align: left; /* Reset text align for the container */
    }
    .professor-profile .professor-image-container {
        flex-basis: 300px;
        text-align: center; /* Keep image centered in its container */
    }
    .professor-profile .professor-text-container {
        text-align: left; /* Left align text on desktop */
        padding-left: 0; /* Remove extra padding if gap handles it */
        /* Ensure the text container doesn't grow too wild relative to image */
        flex-grow: 2; 
    }
}

/* Homepage Sidebar Article Styling - Force Left Align & Normalize Padding */
.grid aside article,
.grid aside article header,
.grid aside article footer,
.grid aside article p,
.grid aside article .notice-content {
    text-align: left !important;
}

/* Remove default list indentation in sidebar to match News box alignment */
.grid aside article ul {
    padding-left: 0 !important;
    list-style-position: inside; /* Or list-style: none if bullets aren't needed */
}

/* Navigation Tweaks */
nav ul li a {
    text-decoration: none;
}
nav ul li a:hover {
    text-decoration: underline;
}

/* Mobile Responsive Navigation */
@media (max-width: 768px) {
    nav {
        flex-direction: column; /* Stack logo and links vertically */
        align-items: center;
    }
    nav ul {
        flex-wrap: wrap; /* Allow wrapping */
        justify-content: center; /* Center items */
        padding: 0;
        margin-top: 0.5rem;
    }
    nav ul li {
        padding: 0.2rem 0.5rem; /* Reduce padding between items */
    }
}
