/* mySite.css */

body {
    font-family: Arial, sans-serif;
    background-color: #f4f4f4;
    text-align: center;
    margin: 0;
    padding: 20px;
}

h1 {
    color: #333;
}

/* Unique colors for section headers */
h2 {
    color: #800080; /* Purple */
}

    h2:nth-of-type(2) {
        color: #00008B; /* Dark Blue */
    }

    h2:nth-of-type(3) {
        color: #28a745; /* Green */
    }

/* Formatting Education list */
.education-list li.degree {
    font-weight: bold;
}

.education-list li.high-school {
    font-style: italic;
}

.education-list li.certificate {
    text-decoration: underline;
}

/* Hyperlink hover effect except for Class Schedule page */
p a:not(.no-hover) {
    text-decoration: none;
    color: #007bff;
    font-weight: bold;
    transition: font-size 0.2s ease-in-out;
}

    p a:not(.no-hover):hover {
        text-decoration: underline;
        font-size: 150%;
    }

/* Do not modify hyperlink text size for Class Schedule page */
.schedule-page a, .schedule-page a:hover, .bottom-links a, .bottom-links a:hover {
    font-size: 100% !important;
    transition: none !important;
}

/* Class Schedule Table Formatting */
.schedule-table {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
}

    .schedule-table th {
        background-color: #007bff !important; /* Primary color other than black or white */
        color: white !important;
        padding: 10px;
        text-align: center;
        font-weight: bold;
        border: 1px solid #ddd;
    }

    /* Stripe every other row, starting with the first data row after the header */
    .schedule-table tr:nth-child(odd) {
        background-color: #ffffff;
    }

    .schedule-table tr:nth-child(even) {
        background-color: #d9ebf9; /* Light blue striping */
    }

    .schedule-table td {
        padding: 10px;
        border: 1px solid #ddd;
        text-align: center;
        vertical-align: middle;
    }

/* Holiday and special event list formatting */
.holiday-list {
    width: 60%; /* Adjust width to center better */
    margin: 0 auto; /* Centers the list */
    padding-left: 0; /* Removes default left padding */
}

    .holiday-list > li {
        margin-bottom: 15px; /* Adds space between main list items */
        font-size: 18px; /* Adjusts text size */
    }

    .holiday-list ol {
        padding-left: 40px; /* Indents sub-items properly */
        text-align: left; /* Ensures sub-items stay aligned */
        display: block; /* Ensures proper spacing */
    }

        .holiday-list ol li {
            margin-bottom: 8px; /* Adds spacing between sub-items */
        }

/* Custom radio buttons for Major selection */
input[type="radio"] {
    appearance: none;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 2px solid gray;
    background-color: gray;
    margin-right: 5px;
    cursor: pointer;
}

    input[type="radio"]:checked {
        background-color: green;
        border-color: green;
    }

/* Custom checkboxes for Programming Language Experience */
input[type="checkbox"] {
    appearance: none;
    width: 15px;
    height: 15px;
    border-radius: 3px;
    border: 2px solid gray;
    background-color: gray;
    margin-right: 5px;
    cursor: pointer;
}

    input[type="checkbox"]:checked {
        background-color: blue;
        border-color: blue;
    }

form {
    background: white;
    max-width: 500px;
    margin: 0 auto;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    text-align: left;
}

label {
    font-weight: bold;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="date"] {
    width: 100%;
    padding: 10px;
    margin: 5px 0;
    border: 1px solid #ccc;
    border-radius: 5px;
}

/* Password validation message */
#passwordMessage {
    color: red;
    font-size: 14px;
}

button {
    background-color: #28a745;
    color: white;
    border: none;
    padding: 10px 15px;
    margin-top: 10px;
    cursor: pointer;
    border-radius: 5px;
    width: 100%;
    font-size: 16px;
}

    button:hover {
        background-color: #218838;
    }

    button:disabled {
        background-color: #ccc;
        cursor: not-allowed;
    }