/*********************
      MAIN COLUMN
         text
**********************/
main {
    counter-reset: section example; /* Reset both section and example counters */
}

/* Format the text in the main column for book chapter */
main p, dt, dd {
    text-align: justify;
    line-height: 1.7;
    text-indent: 2em;
    font-size: 15px;
}

li, li::marker, .sourceCode, .cell-output {
    font-size: 15px;
}

/* Change the format paragraph for lists in text */
main ol > li > p,
main ul > li > p {
    text-indent: 0em;
    line-height: 1.2;
    padding-left: 1em;
}

figure {
    text-align: center;
    margin: auto;
    margin-bottom: 10px;  
    margin-top: 2em;  
}

figure > p:first-child {
    font-size: 1.5em;
    text-align: center;
    margin-bottom: 0;
}

.image * {
    margin-bottom: 0;
}

/* To provide the source of the image */
.source-img * {
    font-size: 10px;
    margin: 0 auto;
    text-align: left;
}

.source-img {
    margin: 0 0 1em 0;
}

figcaption {
    counter-increment: figure;
    color: #6c757d;
    font-size: 13px;
    letter-spacing: 1.2px;
    margin: auto;
    width: 100%;
}

figcaption::before {
    content: "Figure " counter(section) "." counter(figure) ": "; /* Fixed concatenation */
    font-weight: bold;
    font-size: 15px;
    color: #6c757d;
}

img {
    margin-bottom: 10px;
}

/* Section header */
main h2 {
    counter-increment: section; /* Increment section counter */
    counter-reset: subsection example; /* Reset both subsection and example counters */
}

main h2::before {
    content: counter(section) ". ";
}

main h3 {
    font-size: 2em;
    font-family: inherit;
    margin-top: 1em;
    margin-bottom: 1em;
    padding: 5px 20px 15px 30px;
    letter-spacing: normal;
    color: black;
    background-color: rgba(20, 20, 30, 0.2);
    border-radius: .5em;
    text-decoration-style: dotted;
    text-decoration: underline;
    width: 100%;
    counter-increment: subsection; /* Increment subsection counter */
}

main h3::before {
    content: counter(section) "." counter(subsection) ". ";
}

.language-r {
    padding-top: 3px;
    padding-bottom: 3px;
}

.end-part {
    text-align: right;
    font-size: 20px;
}

.end-part::before {
    content: "\25A1";
}

main > button {
    border-radius: 10px;
    box-shadow: 8px 8px 16px 0 rgba(0, 0, 0, 0.493);
    background-color: rgb(86, 85, 87);
    color: white;
    padding: 10px;
    margin-bottom: 4em;
}

main button:hover {
    cursor: pointer;
}

table {
    table-layout: fixed;
    width: 100%;
    min-width: 600px;
    border-collapse: collapse;
    border-top: 3px double black;
    border-bottom: 3px double black;
}

.collapsible {
    display: none;
}

/* Configure table */
tbody td {
    text-align: center;
    letter-spacing: 1px;
}

th {
    border-bottom: 1px solid black;
}

tr {
    font-size: 13px;
}

thead tr {
    background-color: rgb(58, 58, 58);
    color: white;
    font-size: 15px;
    text-align: center;
}

tbody tr:nth-child(even) {
    background-color: rgba(190, 189, 189, 0.5);
}

tr th:nth-child(odd) {
    width: 115px;
}

thead th:nth-child(even) {
    border-right: 2px solid white;
}

tbody td:nth-child(even) {
    border-right: 2px solid black;
}

tbody td:last-child {
    border-right: none;
}

.row-button button {
    background-color: white;
    border: none;
    width: 100%;
}

/* Example */
.example {
    font-size: 20px;
    font-style: italic;
    font-weight: bold;
    border-bottom: 1px solid black;
    counter-increment: example;
}

/* Keep YAML description for listing cards/metadata, but don't show it under the page title */
.quarto-title-block .description {
    display: none;
}

.example::before {
    content: "Example " counter(section) "." counter(example) ": ";
}

/* Define the box to be used by definitions, theorem, cautions, etc... */
.box-def {
    margin: 1.5625em auto;
    padding: 0 .6rem .8rem !important;
    overflow: hidden;
    page-break-inside: avoid;
    border-left: .4rem solid rgb(46, 194, 66);
    background-color: rgba(46, 194, 66, 0.08);
    border-radius: .1rem;
    box-shadow: 0 .2rem .5rem rgba(0,0,0,.05), 0 0 .05rem rgba(0,0,0,.1);
    transition: color .25s, background-color .25s, border-color .25s;
    counter-increment: definition;
}

/* Change the font for the elements inside the box. */
.box-def * {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 13px;
}

/* Change padding and margin of immediate childs of the box. */
.box-def > * {
    padding: 0px 10px;
    margin: 0;
}

/* configuring list inside box-definition */
.box-def > ol, .box-def > ul {
    width: inherit;
    margin: 20px 0px 0px 4em;
}

/* defines the first paragraph of a box as the title */
.box-def > p:first-child {  
    position: relative;
    margin: 0 -.6rem .75rem;
    padding: .2rem 1rem .2rem 1rem;
    text-indent: 0px;
    font-weight: 700;
    background-color: rgba(68, 255, 93, 0.15);
}

.box-def > p:first-child::before {
    content: "Definition " counter(section) "." counter(definition) ": "; /* Fixed concatenation */
}

/* changes the color for a cautious box */
.box-caution {
    border-left: .4rem solid rgb(251, 127, 77);
    background-color: rgba(251, 127, 77, 0.08);
}

.box-caution > p:first-child {
    background-color: rgba(255, 124, 72, 0.1);
}

.box-caution > p:first-child::before {
    content: "";
}

/* changes the color for an exercise box */
.box-exercise {
    border-left: .4rem solid rgb(59, 59, 59);
    background-color: rgba(59, 59, 59, 0.08);
    counter-increment: exercise;    
}

.box-exercise > p:first-child {
    font-size: 16px;
    background-color: rgba(0, 0, 0, 0.1);
}

.box-exercise > p:first-child::before {
    content: "Exercise " counter(section) "." counter(exercise); /* Fixed concatenation */
}

/* defines the question item */
.question-item {
    background-color: rgba(59, 59, 59, 0.08);
    font-style: italic;
    width: inherit;
    margin-top: 10px;
}

.question-item > * {
    text-indent: 0px;
    margin: 0em 1em .3em 1em;
    width: calc(100% - 2em);
}

/* changes the color for a solution sub-box */
.solution {
    margin-top: 2em;
    padding: 1em;
    border-left: .4em solid rgb(190, 131, 21);
    background-color: rgb(250, 242, 227);
    display: none;
}

.solution dt::before {
    content: "\27A2";
    color: green;
    font-size: 15px;
    margin-right: 0.2em;
}

.solution dt {
    font-style: italic;
    font-size: 14px;
}

.solution dd {
    margin-bottom: 2em;
    text-indent: 0;
    padding-left: 2em;
}

/* Button to show the answers */
.btn-show-answers {
    margin-top: 2em;
}

.plot {
    width: 100%;
    min-width: 650px;
    margin: 0px;
    margin-top: 10px;
    padding: 0;
    margin-bottom: 3em;
}

.plot > figcaption {
    text-align: center;
}

.plot-title {
    font-size: 1.7em;
    font-weight: bold;
}

.plot-subtitle {
    font-size: 18px;
    font-style: italic;
}

caption {
    margin-bottom: 0.5em;
}

.activity {
    font-size: 50px;
    border-style: double;
    border-width: 0 0 3px 0;
    margin-bottom: 1em;
}

pre.output {
    display: block;
    padding: 9.5px;
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.42857143;
    color: #333;
    word-break: break-all;
    word-wrap: break-word;
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin: 0 auto 1em auto;
    width: 75%;
}