/* =====================================
   GLOBAL STYLING
===================================== */

body {
    font-family: Arial, Helvetica, sans-serif;
    margin: 20px;
}

/* =====================================
   PERSONAL PAGE STYLES
===================================== */

/* Unique header colors */
.personal-page h2.about-header {
    color: darkblue;
}

.personal-page h2.hobbies-header {
    color: darkgreen;
}

.personal-page h2.education-header {
    color: darkred;
}

/* Education formatting */
.personal-page .college {
    font-weight: bold;
}

.personal-page .highschool {
    font-style: italic;
}

.personal-page .certificate {
    text-decoration: underline;
}

/* Hover effect ONLY on personal page */
.personal-page a {
    transition: font-size 0.3s ease;
}

.personal-page a:hover {
    font-size: 150%;
}

/* =====================================
   CLASS SCHEDULE PAGE
===================================== */

/* Table layout */
.schedule-page table {
    width: 100%;
    border-collapse: collapse;
}

/* Center text inside cells */
.schedule-page th,
.schedule-page td {
    border: 1px solid black;
    padding: 10px;
    text-align: center;
}

/* Header row color (Primary color: Blue) */
.schedule-page th {
    background-color: blue;
    color: white;
}

/* Stripe every other data row */
.schedule-page tr:nth-child(even) {
    background-color: lightgray;
}

/* Ordered list formatting */
.schedule-page ol {
    list-style-type: decimal;
}

.schedule-page ol ol {
    list-style-type: upper-alpha;
}

/* =====================================
   ACCOUNT PAGE
===================================== */

/* Custom Radio Buttons */
.account-page input[type="radio"] {
    accent-color: grey;
}

.account-page input[type="radio"]:checked {
    accent-color: green;
}

/* Custom Checkboxes */
.account-page input[type="checkbox"] {
    accent-color: grey;
}

.account-page input[type="checkbox"]:checked {
    accent-color: blue;
}

/* =====================================
   ePORTFOLIO PAGE
===================================== */

/* Center name */
.portfolio-page h1 {
    text-align: center;
}

/* Image link styling */
.portfolio-page img {
    width: 200px;
    margin: 20px;
}