/* **********************************************************
 * add custom styles after imports below
 * ********************************************************** */

@import "default.css";
@import "layout.css";
@import "menu.css";
@import "queries.css";

/* **********************************************************
 * to import a font, use the @import option, you can find
 * lots of font options at fonts.google.com for example.
 * ********************************************************** */

@import url('https://rsms.me/inter/inter.css');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

html {
    font-family: 'PT+Sans', sans-serif;
}


/* **********************************************************
 * Customizing
 *
 * changes to default settings like colors, typography,
 * spacing can be made in default.css
 *
 * other custom settings, start below
 *
 * ********************************************************** */

* {
    line-height: 115%;
    font-weight: 400;
}

body {
    background-color: var(--color-bg);
    color: var(--color-fg);
}


@media (orientation: portrait) {
    * {
        font-size: 16px;
    }
}



/* =========================================
   Weekly hover preview – final override
   ========================================= */

.weekly a:hover{
    color: rgba(0, 0, 0, 0.623)
}

.weekly li:hover p {
color: var(--color-12)
}

.weekly ul {
  overflow: visible;
  
}

.weekly a:hover mark {
  background: transparent;
}

.weekly .p__size-m {
  font-weight: 510;   /* or 700 if you want full bold */
  
}
/* The li that holds text + image */
.weekly li.hover-container {
  position: relative;
 
}

.weekly li.hover-container .hover-image {
  display: none;
  position: fixed;    /* <— FIXED instead of absolute */
  top: 250px;         /* adjust */
  left: 580px;         /* adjust */
  width: 240px;
  z-index: 10000;
}

.weekly li.hover-container:hover .hover-image {
  display: block !important;
  width: 20%;
}

/* Reduce space under "Semester 1" */
#weekly-reports .p__size-l {
  margin-bottom: 0.25rem;   
   font-weight: 600     /* or something small like 0.25rem */
}

/* Remove extra space above the list */
#weekly-reports .weekly ul {
  margin-top: 0.5rem;
      /* keep bullets indented if needed */
}