@import "layout.css";
@import "lightdark.css";

h1 {
    /* font-size: 3em; */
    text-align: center;
    font-family: 'MB Corpo S Title';
    color: whitesmoke;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #40407A;
    vertical-align: middle;
    display: table-cell;
}

h2 {
    font-family: 'MB Corpo S Title';
    text-align: left;
    font-size: 2em;
    color: whitesmoke;
    justify-self: center;
}
h2 a {
    color: #90C4EC;
}

h2 a:visited {
    color: #90C4EC;
}

main h2 {
    justify-self: center;
}

h3 {
    font-size: 1.10em;
    text-align: center;
    font-family: 'MB Corpo S Text Office';
    color: white;
}

h4 {
    font-size: 1.5em;
    font-style: italic;
    text-align: center;
    font-family: 'MB Corpo S Text Office';
}

.frequentReport {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    display: grid;
    /* flex-direction: column; */
    gap: 5px;
    min-width: 98vw;
    /* min-height: ; */
    margin: auto;
    /* margin: 18px; */
}

.report {
    display: grid;
    grid-template-rows: minmax(0, 1fr) minmax(0, 15fr) minmax(0, 4fr);
    background-color: gray;
    text-align: center;
    gap: 10px;
    height: 42vh;
}

.report p {
    color: white;
}

.frequentReport img {
    width: 100%;
    height: 100%;
    border: 0;
}

.reportsDiv {
    display: flex;
    text-align: center;
    align-items: center;
    align-content: center;
    /* width: 100%; */
}

.mainContent {
    display: grid;
    grid-template-rows: auto auto;
    gap: 5px;
    text-align: center;
}

.mainMTContent {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    background-color: gray;
    justify-self: center;
    gap: 5px;
    min-width: 98vw;
    height: 84vh;
}

.mainMTReport {
    display: grid;
    grid-template-rows: minmax(0, 1fr) minmax(0, 30fr);
    background-color: gray;
    justify-self: center;
    gap: 5px;
    height: 84vh;
    width: 100%;
}

.pagination {
    display: flex;
    justify-content: center;
    font-size: .8em;
}

.pagination a {
    padding: 2px 6px;
    text-decoration: none;
    background-color: slategray;
    color: white;
    border: 1px solid darkslategrey;
    border-radius: 4px;
}

.pagination a:hover {
    background-color: darkblue;
    color: white;
}

.pagination .active {
    background-color: darkblue;
    color: white;
}

#page-numbers {
    font-size: .6em;
    color: white;
    padding-bottom: .25em;
}

#paginationContainer {
    display: grid;
    grid-template-rows: auto auto;
}

#fullpage {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: contain;
  background-repeat: no-repeat no-repeat;
  background-position: center center;
  background-size: 90% 90%;
  background-color: transparent;
  backdrop-filter: blur(10px);
}

#fullpage div {
    display: block;
    position: absolute;
    right: .75vw;
    top: 1.25vh;
}

#fullpage button {
    height: 30px; 
    width: 30px; 
    font-size: 30px;
    border-radius: 50%;
    border-color: white;
    border-style: solid;
    background-color: salmon;
}






#paginationContainer {
  display: flex;
  justify-content: center;
  padding: .5em 0;
}

.page {
  display: none;
}

.page.active {
  display: block;
}

/* ===== Table of Contents (dots + page number) ===== */
#toc-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 40%;
}

#toc-list li { margin: .35em 0; }

/* Each entry is a 3-column grid: [title] [........] [page] */
#toc-list a {
  display: grid;
  grid-template-columns: max-content 1fr max-content;
  align-items: baseline;
  column-gap: .5rem;
  text-decoration: underline;
  color: #90C4EC;  
  font-family: 'MB Corpo S Text Office', sans-serif;
  font-size: x-large;
}

/* Title on the left */
#toc-list .toc-title {
  white-space: nowrap;         /* keeps long titles from wrapping before dots */
}

/* Dotted leader fills the middle column */
#toc-list .toc-dots {
  border-bottom: 2px dotted currentColor;
  height: 0;                   /* we only want the border line */
  transform: translateY(-.15em); /* aligns dots with baseline nicely */
}

/* Page number pinned right */
#toc-list .toc-page {
  white-space: nowrap;
  font-variant-numeric: tabular-nums; /* cleaner number alignment */
}

/* (Optional) Hover/Active state */
#toc-list a:hover { opacity: .7; }
#toc-list a.active { font-weight: 700; }