/* Root-level custom properties for easy tuning */
:root {
  /* font sizes (relative to the parent) */
  --size-h1: 1.8em;
  --size-h2: 1.4em;
  --size-h3: 1.3em;
  --size-h4: 1.2em;
  --size-text: 1.1em; /* p  */
  --size-li: 1.0em; 

  /* progressive indentation */
  --indent-h1: 0em;
  --indent-h2: .5em;
  --indent-h3: 1em;
  --indent-h4: 1.5em;
  --indent-p: 2em;     /* p lines up with h4 */
  --indent-list: 2.5em;  /* lists are indented beneath p */

  /* spacing */
  --block-gap: 0.5em;
  --line-height: 1.35;
}

/* Base text settings (inherit for consistency) */
body {
  line-height: var(--line-height);
}

/* Headings: size + progressive indentation */
h1, h2, h3, h4 {
  font-weight: 550;
}

h1 {
  font-size: var(--size-h1);
  margin-left: var(--indent-h1);
}


blockquote, blockquote p{ color: #4B248E; font-weight:650; border-color:#4B248E ;font-size: var(--size-li);}

/* Relative sizing */
#wiki_page_show h1.page-title {
  font-size: 1.0em;     /* ~40% larger than Canvas’s default for h1 on pages */
  line-height: 1.25;
  color: #4B248E;
  font-weight: 450;
}

/* Responsive clamp (min -> preferred -> max) */
#wiki_page_show h1.page-title {
  font-size: clamp(1.15rem, 1.0rem + 0.8vw, 1.9rem);
  line-height: 1.25;
}

h2 {
  font-size: var(--size-h2);
  margin-left: var(--indent-h2);
  color: #512698;
}

h3 {
  font-size: var(--size-h3);
  margin-left: var(--indent-h3);
    color: #512698;
}

h4 {
  font-size: var(--size-h4);
  margin-left: var(--indent-h4);
    color: #512698;
}

/* Paragraph aligns with h4 */
p {
  font-size: var(--size-text);

  margin-left: var(--indent-p);
}

/* Lists are indented beneath p; keep bullets/numbers visible */
ul, ol {
  font-size: var(--size-li);
  margin-top: var(--block-gap);
  margin-bottom: var(--block-gap);
  margin-left: var(--indent-list); /* further in than p */
  padding-left: 1.1em;             /* space for markers */
  list-style-position: outside;
}

/* List items inherit size; provide reasonable spacing */
li {
  margin: 0.25em 0;
}

/* Optional: reduce indentation on narrow screens for readability */
@media (max-width: 600px) {
  :root {
    --indent-h2: 0.25em;
    --indent-h3: 0.5em;
    --indent-h4: 0.75em;
    --indent-p: 1em;
    --indent-list: 1.25em;
  }
}


/* EXAMPLE HTML of admonitions
 <div class="admonition note" role="alert" aria-labelledby="alert-heading">
   <div class="title" role="heading" aria-level="4">
     <h
   </div>
   <div class="content">
     This is a note admonition
   </div>
 </div>
 */
 
.admonition {
    padding: 1rem;
    margin-bottom: 1.8rem;
    margin-top: 1.8rem;
    border-left: 0.67rem solid transparent;
    border-radius: 0.4rem;
  }
  
.admonition .title {
    margin: 0;
    /* text-transform: uppercase;  */
    border: 1px solid;
    border-style: hidden hidden solid;
    font-weight: bold;
  }
  
.admonition .content {
  /*     padding-left: .75em; */
    padding-right: 0.8rem;
    padding-top: 0.6rem; 
    margin-left: 0;
    border-left: 0;
    border-top: 0;
    min-height: 0;
  }
  
  /* common heading style/size */
.admonition h2,
.admonition h3,
.admonition h4,
.admonition h5 {
    font-weight: bold;
    font-size: 1.1rem;
    display: inline; 
  }


/* Highlights information that users should take into account, even when skimming. Icon &#9432;*/
.note {
    border-color: blue;
    background-color: #f6fcff;
}
.note .title {
    color: blue;
    border-color: blue;
}

/* Optional information to help a user be more successful. */
.tip {
    border-color: green;
    background-color: #FBFFFB;
}
.tip .title {
    color: green;
    border-color: green;
}

/* Crucial information necessary for users to succeed. */
.important {
    border-color: #fff607;
    background-color: #f9f9f7;
}
.important .title {
    color: black;
    border-color: black;
}

/* Critical content demanding immediate user attention due to potential risks. */
.warning {
    border-color: #9D6600;
    background-color: #FFFEF9;
}
.warning .title {
    color: #9D6600;
    border-color: #9D6600;
}

/* Negative potential consequences of an action. */
.caution {
    border-color: red;
    background-color: #fffbfb;
}
.caution .title {
    color: #B30000;
    border-color: red;
}

/* Generic UW-Stevens Point branded admonition for top of guides. */
.uwstp {
    border-color: #512698;
    background-color: #f1edf8;
}
.uwstp .title {
    color: black;
    border-color: #512698;
}