html {
    scroll-behavior: smooth;
}

header, footer {
	background: #10a1d6;
}

footer  {
  padding-top: 0.75rem;
  padding-bottom: 1rem;
}

header h1, header a, header small, footer small {
  color: #fff;
  --pico-primary-hover-underline: #fff;
}

.banner {
  width: 100%;
  margin: 0;
}

.banner img {
  width: 100vw;
  max-width: 100vw;
  height: auto;
  display: block;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-sizing: border-box;
}

.scroll-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
}

/* 
* Color customizations
*/

[data-theme=light],
:root:not([data-theme=dark]) {
  --pico-text-selection-color: #bdedff;
  --pico-primary: #10a1d6;
  --pico-primary-background: #10a1d6;
  --pico-primary-hover: #00aeee;
  --pico-primary-hover-background: #00aeee;;
  --pico-primary-hover-border: var(--pico-primary-hover-background);
  --pico-primary-hover-underline: var(--pico-primary-hover);
  --pico-mark-background-color: #c1eaff;
  --pico-primary-underline: #10a1d6;
  --pico-primary-focus: #d6f0ffad;
}

/*
* Customizations
* for the schedule accordion
*/

details summary {
    display: flex; /* Flex for chevron alignment */
    align-items: top; /* Vertically align text and chevron */
    justify-content: flex-start; /* Text aligned left */
    width: 100%; /* Ensure full width */
    word-wrap: break-word; /* Allow word wrapping */
  }
  
  details summary time {
    white-space: nowrap; /* Prevent line breaks for time text */
    margin-right: 0.5rem; /* Space between time and following text */
  }
  
  details summary strong {
    display: inline; /* Ensure strong elements remain inline */
    font-weight: bold; /* Default style for strong */
  }
  
  details summary::after {
    content: "";
    display: inline-block;
    width: 1rem;
    height: 1rem;
    margin-inline-start: calc(var(--pico-spacing, 1rem) * 0.5);
    transform: rotate(-90deg); /* Chevron initial state */
    background-image: var(--pico-icon-chevron);
    background-position: center;
    background-size: 1rem auto;
    background-repeat: no-repeat;
    transition: transform var(--pico-transition);
    vertical-align: middle; /* Align chevron with text */
    margin-left: auto; /* Push chevron to the right */
    flex-shrink: 0;
  }
  
  details[open] > summary::after {
    transform: rotate(0); /* Rotate chevron when open */
  }