/* ── TOC: gap between TOC and first content line ────────────────────────── */ .toc { margin-bottom: 1.73rem; } /* ── TOC: hide phantom empty bullet when post starts with ### (h3) ──────── */ /* Hugo wraps orphaned h3s in a li>ul, leaving an empty li with no direct anchor. This hides it without affecting any meaningful TOC entry. */ #TableOfContents > ul > li:first-child:not(:has(> a)) { list-style: none; margin: 0; padding: 0; } /* ── UniNotes ───────────────────────────────────────────────────────────── */ .uninotes-breadcrumbs { font-size: 0.85rem; margin-bottom: 1.4rem; color: var(--foreground-color3, #888); } .uninotes-breadcrumbs a { color: var(--accent-color); text-decoration: none; } .uninotes-breadcrumbs a:hover { text-decoration: underline; } .uninotes-list { list-style: none; padding: 0; margin: 1.5rem 0 0 0; } .uninotes-list__item { margin-bottom: 0.6rem; border-left: 3px solid var(--accent-color); padding-left: 0.75rem; } .uninotes-list__link { color: var(--foreground-color); text-decoration: none; font-size: 1rem; } .uninotes-list__link:hover { color: var(--accent-color); text-decoration: underline; } .uninotes-list--subjects .uninotes-list__item { border-left-color: var(--accent-color); } .uninotes-list--units .uninotes-list__item { border-left-color: var(--foreground-color3, #888); } .uninotes-meta { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.75rem; } .uninotes-meta__pill { display: inline-block; font-size: 0.72rem; padding: 0.15rem 0.55rem; border-radius: 999px; border: 1px solid var(--accent-color); color: var(--accent-color); font-weight: 500; letter-spacing: 0.02em; } /* ── Menu links ─────────────────────────────────────────────────────────── */ /* Menu links */ .menu__link { color: var(--menu-color, var(--accent-color)); } [data-theme='light'] .menu__link { color: var(--menu-color); } [data-theme='dark'] .menu__link { color: var(--accent-color); } font-size: 0.9rem; margin-bottom: 1rem; font-weight: bold; } .breadcrumbs a { color: #3498db; text-decoration: none; } .breadcrumbs a:hover { text-decoration: underline; } .term-list { display: block; margin-top: 1rem; } .term-list__item { margin-bottom: 0.5rem; } .term-list__link { color: inherit; text-decoration: none; } .term-list__link:hover { text-decoration: underline; } .posts-list { margin-top: 2rem; } /* Brand actions */ .brand__actions { display: flex; align-items: center; gap: 0.4rem; margin-left: auto; flex-wrap: nowrap; } .brand__auth { display: flex; align-items: center; gap: 0.3rem; position: relative; } /* RSS Subscribe button */ .rss-subscribe__link { display: inline-flex; align-items: center; gap: 0.2rem; padding: 0.2rem 0.4rem; border-radius: 3px; border: 1px solid #ff3d3d; background-color: transparent; color: #ff3d3d !important; font-size: 0.7rem; font-weight: 340; text-decoration: none !important; line-height: 1.4; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } @media (prefers-color-scheme: dark) { .rss-subscribe__link { background-color: var(--foreground-color); border-color: currentColor; color: var(--background-color) !important; } .rss-subscribe__link:hover, .rss-subscribe__link:focus { background-color: transparent; border-color: var(--foreground-color); color: var(--foreground-color) !important; } } [data-theme='dark'] .rss-subscribe__link { background-color: var(--foreground-color); border-color: currentColor; color: var(--background-color) !important; } [data-theme='dark'] .rss-subscribe__link:hover, [data-theme='dark'] .rss-subscribe__link:focus { background-color: transparent; border-color: var(--foreground-color); color: var(--foreground-color) !important; } [data-theme='light'] .rss-subscribe__link { background-color: transparent; border-color: #ff3d3d; color: #ff3d3d !important; } [data-theme='light'] .rss-subscribe__link:hover, [data-theme='light'] .rss-subscribe__link:focus { background-color: transparent; border-color: #89808092; color: #000000bc !important; } .rss-subscribe__link:hover, .rss-subscribe__link:focus { background-color: transparent; border-color: #89808092; color: #000000bc !important; } .rss-subscribe__link svg { width: 10px; height: 10px; } /* Auth links base */ .auth-link { display: inline-flex; align-items: center; padding: 0.2rem 0.4rem; border-radius: 3px; font-size: 0.7rem; font-weight: 340; text-decoration: none !important; line-height: 1.4; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } /* Dropdown toggle — visible on ALL screens */ .brand__auth-check { display: none; } .brand__auth-toggle { display: inline-flex; align-items: center; justify-content: center; padding: 0.355rem 0.5rem; border-radius: 3px; border: 1px solid #f26522; background-color: #f26522; color: #fff; cursor: pointer; font-size: 0.7rem; font-weight: 340; line-height: 1.4; user-select: none; outline: none; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } .brand__auth-toggle:hover { background-color: transparent; border-color: #f26522; color: #f26522; } @media (prefers-color-scheme: dark) { .brand__auth-toggle { background-color: transparent; border-color: currentColor; color: var(--foreground-color); } .brand__auth-toggle:hover, .brand__auth:focus-within .brand__auth-toggle { background-color: var(--foreground-color) !important; border-color: var(--foreground-color) !important; color: var(--background-color) !important; } } /* Dropdown panel — hidden by default, shown on focus-within */ .brand__auth-links { display: none; position: absolute; top: calc(100% + 0.4rem); right: 0; flex-direction: column; gap: 0; background-color: var(--background-color); border: 1px solid var(--background-color1); border-radius: 6px; overflow: hidden; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18); z-index: 100; min-width: 110px; } .brand__auth:focus-within .brand__auth-links { display: flex; } .brand__auth-links .auth-link { border: none; border-radius: 0; padding: 0.55rem 1rem; font-size: 0.78rem; width: 100%; justify-content: center; background-color: transparent; color: var(--foreground-color) !important; } .brand__auth-links .auth-link:not(:last-child) { border-bottom: 1px solid var(--background-color1); } .brand__auth-links .auth-link:hover { background-color: var(--background-color1); color: var(--foreground-color) !important; } /* Mobile */ @media (max-width: 600px) { .brand__actions { gap: 0.16rem; } /* Hide desktop-only elements on mobile */ .brand__auth--desktop, .rss-subscribe__link--desktop { display: none !important; } .brand__auth-text { display: none; } } /* Hide mobile menu on desktop, show on mobile */ .brand__mobile-menu { display: none; position: relative; } @media (max-width: 600px) { .brand__mobile-menu { display: block; } } /* Mobile menu checkbox */ .brand__mobile-check { display: none; } /* Mobile toggle button — same color scheme as account button */ .brand__mobile-toggle { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; padding: 0; box-sizing: border-box; border-radius: 3px; border: 1px solid #ff3d3d; background-color: transparent; color: #ff3d3d; cursor: pointer; user-select: none; transition: background-color 0.2s ease, color 0.2s ease; } .brand__mobile-toggle:hover { background-color: transparent; border-color: #89808092; color: #000000bc; } /* Mobile dropdown panel */ .brand__mobile-links { display: none; position: absolute; right: 0; top: calc(100% + 0.3rem); background-color: var(--background-color); border: 1px solid var(--foreground-color3); border-radius: 4px; min-width: 130px; z-index: 100; flex-direction: column; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); } .brand__mobile-check:checked ~ .brand__mobile-links { display: flex; } [data-theme='light'] .brand__mobile-check:checked ~ .brand__mobile-toggle { background-color: transparent; border-color: #89808092; color: #000000bc; } @media (prefers-color-scheme: light) { .brand__mobile-check:checked ~ .brand__mobile-toggle { background-color: transparent; border-color: #89808092; color: #000000bc; } } .mobile-link { display: flex; align-items: center; gap: 0.4rem; padding: 0.5rem 0.75rem; color: var(--foreground-color); text-decoration: none; font-size: 0.8rem; white-space: nowrap; transition: background-color 0.15s ease; } [data-theme='light'] .brand__mobile-check:checked ~ .brand__mobile-links .mobile-link { color: #ff3d3d; } @media (prefers-color-scheme: light) { .brand__mobile-check:checked ~ .brand__mobile-links .mobile-link { color: #ff3d3d; } } .mobile-link:hover { background-color: var(--background-color1); } .mobile-link:not(:last-child) { border-bottom: 1px solid var(--foreground-color3); } /* Mobile toggle dark mode colors */ @media (prefers-color-scheme: dark) { .brand__mobile-toggle { background-color: transparent; border-color: currentColor; color: var(--foreground-color); } .brand__mobile-toggle:hover { background-color: var(--foreground-color); color: var(--background-color); } } [data-theme='light'] .brand__mobile-toggle { background-color: transparent; border-color: #ff3d3d; color: #ff3d3d; } [data-theme='light'] .brand__mobile-toggle:hover { background-color: transparent; border-color: #89808092; color: #000000bc; } [data-theme='dark'] .brand__mobile-toggle { background-color: transparent; border-color: currentColor; color: var(--foreground-color); } [data-theme='dark'] .brand__mobile-toggle:hover { background-color: var(--foreground-color); color: var(--background-color); } /* ── Mobile auth toggle colors ── */ /* Default (system light): orange filled */ @media (max-width: 600px) { .brand__auth-toggle { background-color: #f26522 !important; border-color: #f26522 !important; color: #fff !important; } .brand__auth:focus-within .brand__auth-toggle { background-color: transparent !important; border-color: #f26522 !important; color: #f26522 !important; } } /* System dark: outline */ @media (max-width: 600px) and (prefers-color-scheme: dark) { .brand__auth-toggle { background-color: transparent !important; border-color: currentColor !important; color: var(--foreground-color) !important; } .brand__auth:focus-within .brand__auth-toggle { background-color: var(--foreground-color) !important; border-color: var(--foreground-color) !important; color: var(--background-color) !important; } } /* Manual light override */ @media (max-width: 600px) { [data-theme='light'] .brand__auth-toggle { background-color: #f26522 !important; border-color: #f26522 !important; color: #fff !important; } [data-theme='light'] .brand__auth:focus-within .brand__auth-toggle { background-color: transparent !important; border-color: #f26522 !important; color: #f26522 !important; } /* Manual dark override */ [data-theme='dark'] .brand__auth-toggle { background-color: transparent !important; border-color: currentColor !important; color: var(--foreground-color) !important; } [data-theme='dark'] .brand__auth:focus-within .brand__auth-toggle { background-color: var(--foreground-color) !important; border-color: var(--foreground-color) !important; color: var(--background-color) !important; } } /* ── Theme switcher ── */ /* Force light theme */ [data-theme='light'] { --background-color: #fff; --background-color1: #777; --foreground-color: #000000e1; --foreground-color3: #665c54; --accent-color: #1133e9c5; --menu-color: #000000b4; } /* Force dark theme */ [data-theme='dark'] { --background-color: #171414; --background-color1: #fff; --foreground-color: #e3e1db; --foreground-color3: #ccc3b3; --accent-color: #fff; } .theme-toggle { display: inline-flex; align-items: center; justify-content: center; padding: 0.2rem; border: none; background: none; color: var(--foreground-color); cursor: pointer; line-height: 1; transition: opacity 0.2s ease; } .theme-toggle:hover { opacity: 0.6; } .theme-toggle__text--light, .theme-toggle__text--dark { display: none !important; } /* Default (system light): moon icon + "Dark" label */ .theme-toggle__sun { display: none; } .theme-toggle__moon { display: block; } /* Desktop icon size */ .theme-toggle svg { width: 16.5px; height: 16.5px; } .theme-toggle__text--light { display: none; } .theme-toggle__text--dark { display: inline; } /* System dark (no data-theme): sun icon + "Light" label */ @media (prefers-color-scheme: dark) { .theme-toggle__sun { display: block; } .theme-toggle__moon { display: none; } .theme-toggle__text--light { display: inline; } .theme-toggle__text--dark { display: none; } } /* Manual dark: sun icon + "Light" label */ [data-theme='dark'] .theme-toggle__sun { display: block; } [data-theme='dark'] .theme-toggle__moon { display: none; } [data-theme='dark'] .theme-toggle__text--light { display: inline; } [data-theme='dark'] .theme-toggle__text--dark { display: none; } /* Manual light: moon icon + "Dark" label */ [data-theme='light'] .theme-toggle__sun { display: none; } [data-theme='light'] .theme-toggle__moon { display: block; } [data-theme='light'] .theme-toggle__text--light { display: none; } [data-theme='light'] .theme-toggle__text--dark { display: inline; } /* Match size to other buttons on mobile */ @media (max-width: 600px) { .theme-toggle { width: 2.3rem; height: 2.3rem; box-sizing: border-box; padding: 0; } .theme-toggle svg { width: 16.5px; height: 16.5px; } .theme-toggle__text--light, .theme-toggle__text--dark { display: none !important; } } /* ── UniNotes Contents Panel ─────────────────────────────────────────────── */ .uninotes-contents { margin: 1.25rem 0 2rem 0; border-left: 3px solid var(--accent-color); padding-left: 1rem; display: flex; flex-direction: column; gap: 1.5rem; } .uninotes-contents__semester { display: flex; flex-direction: column; gap: 0.6rem; } .uninotes-contents__sem-link { text-transform: uppercase; color: var(--foreground-color); text-decoration: none; font-size: 1rem; font-weight: 400; } .uninotes-contents__sem-link:hover { color: var(--accent-color); text-decoration: underline; } .uninotes-contents__subject { display: flex; flex-direction: column; gap: 0.6rem; padding-left: 0.7rem; } .uninotes-contents__subject-link { font-size: 0.95rem; font-weight: 600; color: var(--foreground-color); text-decoration: none; letter-spacing: 0.01em; } .uninotes-contents__subject-link:hover { color: var(--accent-color); text-decoration: underline; } .uninotes-contents__units { list-style: none; padding: 1px; margin: 0.15rem 0 0 0.75rem; display: flex; flex-direction: column; gap: 0.4rem; } .uninotes-contents__unit { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; } .uninotes-contents__unit-link { font-size: 0.9rem; color: var(--foreground-color); text-decoration: none; } .uninotes-contents__unit-link:hover { color: var(--accent-color); text-decoration: underline; } .uninotes-contents__unit-cats { display: flex; gap: 0.3rem; } .uninotes-contents__cat { font-size: 0.65rem; font-weight: 600; letter-spacing: 0.04em; padding: 0.1rem 0.45rem; border-radius: 999px; border: 1px solid currentColor; text-decoration: none; text-transform: uppercase; } .uninotes-contents__cat--self { color: var(--accent-color); } .uninotes-contents__cat--self:hover { background: var(--accent-color); color: var(--background-color, #fff); } .uninotes-contents__cat--live { color: var(--accent-color); } .uninotes-contents__cat--live:hover { background: var(--accent-color); color: var(--background-color, #fff); } .uninotes-contents__cat--na { color: var(--foreground-color3, #888); opacity: 0.45; cursor: not-allowed; } /* ── Unit Choice Page (Self / Live) ─────────────────────────────────────── */ .unit-choice__subtitle { color: var(--foreground-color3, #888); margin-bottom: 1.5rem; font-size: 0.95rem; } .unit-choice__options { display: flex; gap: 1.2rem; flex-wrap: wrap; margin-top: 1rem; margin-bottom: 2rem; } @media (max-width: 600px) { .unit-choice__options { flex-direction: column; align-items: center; } .unit-choice__card { width: 100%; max-width: 260px; flex: none; } } .unit-choice__card { flex: 1; min-width: 180px; max-width: 260px; border: 2px solid var(--accent-color); border-radius: 12px; padding: 1.75rem 1.5rem; text-decoration: none; color: var(--foreground-color); display: flex; flex-direction: column; align-items: center; gap: 0.6rem; transition: background 0.18s ease, color 0.18s ease, transform 0.15s ease; text-align: center; cursor: pointer; } .unit-choice__card:hover { background: var(--accent-color); color: var(--background-color, #fff); transform: translateY(-2px); text-decoration: none; } /* .unit-choice__card--live intentionally matches .unit-choice__card — no overrides */ .unit-choice__icon { display: flex; align-items: center; justify-content: center; margin-bottom: 0.3rem; } .unit-choice__label { font-size: 1.25rem; font-weight: 700; letter-spacing: 0.01em; } .unit-choice__desc { font-size: 0.8rem; opacity: 0.72; line-height: 1.45; } /* notecategory pill colour */ .uninotes-meta__pill--self { border-color: var(--accent-color); color: var(--accent-color); } .uninotes-meta__pill--live { border-color: var(--accent-color); color: var(--accent-color); } .unit-choice__card--unavailable { border-color: var(--foreground-color3, #888); color: var(--foreground-color3, #888); cursor: not-allowed; opacity: 0.45; } .unit-choice__card--unavailable:hover { background: transparent; color: var(--foreground-color3, #888); transform: none; }