/* Course-page styles for csc696i-f26.html.
   Loaded after the site-wide css/site.css, which supplies the shared template
   (navbar, sub-menu, section headings, footer). Only rules specific to the
   course page belong here.
   ══════════════════════════════════════════════════════════════ */

.tbd {
    color: #6c757d;
    font-style: italic;
}

/* Keep sub-menu jump targets clear of the sticky navbar + sub-menu (~105px) */
#overview, #schedule, #grading, #ethics {
    scroll-margin-top: 6rem;
}

/* ── Definition-list logistics grid ── */
dl.logistics {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.5rem 1.5rem;
    margin: 1.25rem 0 0;
}
dl.logistics dt {
    font-weight: 600;
    color: var(--bs-blue);
}
dl.logistics dd {
    margin: 0;
    color: #495057;
}
@media (max-width: 600px) {
    dl.logistics { grid-template-columns: 1fr; gap: 0.1rem; }
    dl.logistics dd { margin-bottom: 0.6rem; }
}

/* ── Tables ── */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 1rem 0;
    font-size: 0.95rem;
}
th, td {
    text-align: left;
    padding: 0.65rem 0.85rem;
    border: 1px solid #dee2e6;
    vertical-align: top;
}
th {
    background: rgba(171, 5, 32, 0.06);
    font-weight: 600;
    color: var(--bs-blue);
}
td.weight {
    white-space: nowrap;
    font-weight: 600;
}

table.schedule {
    font-size: 0.88rem;
}
table.schedule th,
table.schedule td {
    padding: 0.45rem 0.65rem;
}
table.schedule td.week {
    width: 4%;
    text-align: center;
    font-weight: 700;
    color: var(--bs-blue);
}
table.schedule th:nth-child(2),
table.schedule th:nth-child(3),
table.schedule td:nth-child(2),
table.schedule td:nth-child(3) {
    width: 35%;
}
table.schedule th:last-child,
table.schedule td:last-child {
    width: 26%;
}
table.schedule .day-date {
    font-weight: 700;
    color: var(--bs-blue);
    margin-right: 0.4em;
}
table.schedule .day-date::after {
    content: ':';
}
table.schedule tr.unit td {
    background: var(--bs-blue);
    color: #fff;
    font-weight: 700;
}
table.schedule td.no-class {
    background: rgba(171, 5, 32, 0.1);
    color: var(--bs-red);
    font-weight: 600;
    font-style: italic;
}
table.schedule td.no-class .day-date {
    color: var(--bs-red);
}
.due {
    color: var(--bs-red);
    font-weight: 600;
}

/* Standing caveat above the schedule table */
p.schedule-note {
    display: flex;
    gap: 0.7rem;
    align-items: flex-start;
    background: var(--bs-cool-gray);
    border-left: 5px solid var(--bs-azurite);
    padding: 0.85rem 1.1rem;
    font-size: 0.9rem;
}
p.schedule-note i {
    color: var(--bs-azurite);
    flex-shrink: 0;
    margin-top: 0.15rem;
}