.youtube {
    color: #EE0F0F;
}

.rounded-corners {
    border-radius: 2%;
}

.md-typeset__table {
    width: 100%;
}

.md-typeset__table table:not([class]) {
    display: table
}

/* Tables wrapped in .table-fit shrink to their content instead of the page width */
.md-typeset .table-fit .md-typeset__scrollwrap,
.md-typeset .table-fit .md-typeset__table {
    width: auto;
}

.md-typeset .table-fit table:not([class]) {
    width: auto;
    min-width: 0;
}

/* Material gives every header cell min-width: 5rem, which is what stretches the table */
.md-typeset .table-fit table:not([class]) th,
.md-typeset .table-fit table:not([class]) td {
    min-width: 0;
    padding: .5em .75em;
}

/* Calendar table and its legend side by side */
.md-typeset .calendar-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: .8rem 1.6rem;
    /* same size Material uses for table text */
    font-size: .6rem;

}

.md-typeset .calendar-legend {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 1em;
}

/* Grade: the individual and team boxes side by side, equal width */
.md-typeset .grade-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: .8rem 1.6rem;
}

/* framed group inside the legend */
.md-typeset .grade-box,
.md-typeset .calendar-legend-box {
    display: flex;
    flex-direction: column;
    gap: .4rem;
    padding: .5rem .6rem;
    border: .05rem solid var(--md-typeset-table-color);
    border-radius: .2rem;
}

/* both boxes share the row at equal width */
.md-typeset .grade-box {
    flex: 1 1 0;
    min-width: 0;
}

.md-typeset .grade-box-title,
.md-typeset .calendar-legend-title {
    margin: 0;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    opacity: .65;
    /* same size Material uses for table text */
    font-size: .5rem;
}

.md-typeset .grade-box-title {
    font-size: .7rem;
}

/* the two grade tables size to their content, not to the box */
.md-typeset .grade-box .md-typeset__scrollwrap,
.md-typeset .grade-box .md-typeset__table {
    width: 100%;
    margin: 0;
    padding: 0;
}

.md-typeset .grade-box table:not([class]) {
    width: 100%;
    min-width: 0;
    border: none;
}

.md-typeset .grade-box table:not([class]) th,
.md-typeset .grade-box table:not([class]) td {
    min-width: 0;
    padding: .35em .6em;
}

.md-typeset .calendar-legend p {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .35rem;
    margin: 0;
}

/* Syllabus: quieter table chrome, emphasis on the lesson titles */
.md-typeset .syllabus h3 {
    margin: 1.8em 0 .4em;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--md-default-fg-color--light);
}

.md-typeset .syllabus .md-typeset__scrollwrap {
    margin-top: 0;
}

.md-typeset .syllabus table:not([class]) {
    border: none;
    border-radius: 0;
}

.md-typeset .syllabus table:not([class]) th {
    padding: .3em .8em;
    font-size: .55rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--md-default-fg-color--light);
    border-bottom: .05rem solid var(--md-typeset-table-color);
}

.md-typeset .syllabus table:not([class]) td {
    padding: .5em .8em;
}

.md-typeset .syllabus table:not([class]) th:first-child,
.md-typeset .syllabus table:not([class]) td:first-child {
    width: 2rem;
    min-width: 0;
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: var(--md-default-fg-color--light);
}

.md-typeset .syllabus table:not([class]) td:nth-child(2) {
    font-weight: 600;
}

.md-typeset .syllabus table:not([class]) td:last-child {
    color: var(--md-default-fg-color--light);
}

.mexam, .fexam, .sexam,
.quizzes, .q1, .q2, .q3,
.project {
    padding: 4px;
    border-radius: 4px;
    color: black;
}

.mexam { background-color: mediumspringgreen; }
.fexam { background-color: mediumturquoise; }
.sexam { background-color: green; color: white; }

.quizzes, .q1, .q2, .q3 {
    background-color: aquamarine;
}

.project {
    color: white;
    background-color: hotpink;
}
/* The logo is white line art: darken it on the light header (modern variant) */
[data-md-color-scheme="default"] .md-logo img {
    filter: invert(1);
}

/* Class slides (Marp, scripts/slides/build.py) embedded in the page */
.md-typeset .slides-embed {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    margin: 1em 0 .4em;
    border: 1px solid var(--md-default-fg-color--lightest);
    border-radius: 6px;
    overflow: hidden;
    background: var(--md-default-bg-color);
}

.md-typeset .slides-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* CAP theorem diagram (classes/distributed_systems/cap/cap-venn*.svg, inlined) */
.md-typeset .cap-venn {
    display: block;
    width: 100%;
    max-width: 34rem;
    height: auto;
    margin: 1.2em auto;
    font-family: var(--md-text-font-family);
}
.md-typeset .cap-venn .ring { fill-opacity: .14; stroke-width: 2.5; }
.md-typeset .cap-venn .c { fill: #2f6fed; stroke: #2f6fed; }
.md-typeset .cap-venn .a { fill: #1e9e5a; stroke: #1e9e5a; }
.md-typeset .cap-venn .p { fill: #e5484d; stroke: #e5484d; }
[data-md-color-scheme="slate"] .md-typeset .cap-venn .ring { fill-opacity: .2; }
[data-md-color-scheme="slate"] .md-typeset .cap-venn .c { fill: #6e9bff; stroke: #6e9bff; }
[data-md-color-scheme="slate"] .md-typeset .cap-venn .a { fill: #4cc38a; stroke: #4cc38a; }
[data-md-color-scheme="slate"] .md-typeset .cap-venn .p { fill: #ff6b6f; stroke: #ff6b6f; }
.md-typeset .cap-venn text {
    fill: var(--md-default-fg-color);
    /* halo in the page colour: circle outlines never cut through the letters */
    paint-order: stroke;
    stroke: var(--md-default-bg-color);
    stroke-width: 3px;
    stroke-linejoin: round;
}
.md-typeset .cap-venn .name { font-size: 25px; font-weight: 700; }
.md-typeset .cap-venn .def { font-size: 14px; fill: var(--md-default-fg-color--light); }
.md-typeset .cap-venn .pair { font-size: 24px; font-weight: 800; }
.md-typeset .cap-venn .ex { font-size: 13px; fill: var(--md-default-fg-color--light); }
.md-typeset .cap-venn .ca { fill: var(--md-default-fg-color--light); }
.md-typeset .cap-venn .none { fill: var(--md-default-bg-color); stroke: #e5484d; stroke-width: 2.5; }
.md-typeset .cap-venn .none-x { stroke: #e5484d; stroke-width: 3; stroke-linecap: round; }
.md-typeset .cap-venn .none-t { font-weight: 600; fill: var(--md-default-fg-color); }
.md-typeset .cap-venn .foot { font-size: 15px; font-style: italic; fill: var(--md-default-fg-color--light); }