/* site.css (Bootstrap 5 companion)
   - WordPress-specific selectors removed
   - Old CSS reset removed (Bootstrap 5 includes Reboot)
   - Bootstrap 3 navbar overrides updated to Bootstrap 5
*/

/* --- Base --- */

:root{
  --site-bg-overlay: rgba(250,250,250,0.85);
  --site-nav-bg: rgba(75,75,75,0.75);
  --site-footer-bg: rgba(75,75,75,0.75);
}

html { font-size: 100%; }

body{
  background: url('/assets/musicbg4.jpg') no-repeat center center fixed;
  background-size: cover;
  color: #000;
  font-family: "Vollkorn", serif;
  font-size: 18px;
  line-height: 1.4;
  overflow-x: hidden;
}

/* Links */
a{ color:#21759b; text-decoration: none; }
a:hover{ color:#0f3647; text-decoration: underline; }

/* Optional helper */
.font-bold{ font-weight: 700; }

/* --- Page typography (minimal “theme” bits you were actually using) --- */

.entry-header{
  margin-bottom: 1.25rem;
}

.entry-title{
  font-size: 1.5rem; /* ~24px */
  line-height: 1.2;
  font-weight: 700;
  margin: 0 0 1rem 0;
}

.entry-content{
  line-height: 1.7;
}

.entry-content p{
  margin: 0 0 1rem 0;
}

.entry-content ul,
.entry-content ol{
  margin: 0 0 1rem 1.25rem;
}

.entry-content blockquote{
  padding: 1rem 1.25rem;
  margin: 0 0 1rem 0;
  font-style: italic;
  background: rgba(0,0,0,0.04);
  border-left: 4px solid rgba(0,0,0,0.15);
}

/* Media should be fluid */
img, video, iframe { max-width: 100%; height: auto; }

/* If you still want the “fancy image” look on content images */
.entry-content img{
  border-radius: .25rem;
  box-shadow: 0 1px 4px rgba(0,0,0,.2);
}

/* --- Bootstrap 5 navbar tweaks (replaces old BS3 rules) --- */

/* Apply this class to your navbar: <nav class="navbar navbar-expand-lg navbar-dark jsnav"> */
.navbar.jsnav{
  background: var(--site-nav-bg);
  border: 0;
  box-shadow: none;
}

/* Brand */
.navbar.jsnav .navbar-brand{
  font-weight: 700;
  color: #fff;
}

/* Links */
.navbar.jsnav .nav-link{
  font-size: 18px;
  color: rgba(255,255,255,0.9);
}

.navbar.jsnav .nav-link:hover,
.navbar.jsnav .nav-link:focus{
  color: #fff;
  text-decoration: none;
}

/* Toggler button */
.navbar.jsnav .navbar-toggler{
  border-color: rgba(255,255,255,0.4);
}

/* --- Footer --- */

#colophon{
  font-size: 14px;
  color: #eee;
  background: var(--site-footer-bg);
  padding: 20px;
  margin-top: 1.5rem;
}

#colophon a{ color:#ddd; text-decoration:none; }
#colophon a:hover{ color:#fff; text-decoration: underline; }

/* --- Responsive adjustments --- */

@media (max-width: 992px){
  .content{ padding: 20px; }
  .navbar.jsnav .nav-link{ font-size: 16px; }
}

/* --- Print --- */
@media print{
  body{
    background: none !important;
    color:#000;
    font-size: 10pt;
  }

  .navbar, #colophon{ display:none !important; }

  .content{
    background: none !important;
    padding: 0 !important;
  }

  a{ text-decoration: none; color:#000; }
}

/* Make toggler icon visible on dark bg */
.navbar-dark .navbar-toggler {
  border-color: rgba(255,255,255,.2);
}

.navbar.jsnav .nav-link {
  text-transform: none;
}

/* Only active nav items are uppercase */
.navbar.jsnav .nav-link.active,
.navbar.jsnav .active > .nav-link {
  text-transform: uppercase;
  font-weight: 700;
  color:#fff;
}


/* Teaching page: show graduate courses in blue */
.is-grad {
  color: var(--bs-primary);
}
