/* stopwatch.css - Neon JukeBox theme matching Pi-Dan Ingenuity */

.stopwatch-container {
    max-width: 900px;
    margin: 40px auto;
    padding: 40px;
    background: linear-gradient(180deg, rgba(12, 25, 43, 0.96), rgba(5, 10, 19, 0.98));
    border: 1px solid rgba(0, 229, 255, 0.24);
    border-radius: 8px;
    box-shadow:
        0 16px 38px rgba(0, 0, 0, 0.34),
        0 0 24px rgba(0, 229, 255, 0.1);
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
}

.stopwatch-container h1 {
    color: #f7fbff;
    font-size: 2.8em;
    margin-bottom: 20px;
    text-shadow: 0 0 18px rgba(0, 229, 255, 0.24);
}

.intro {
    font-size: 1.3em;
    line-height: 1.6;
    max-width: 800px;
    margin: 0 auto 40px;
    color: #c4d7e4;
}

.spotify-section {
    max-width: 600px;
    margin: 40px auto;
}

.spotify-section h2 {
    color: #f7fbff;
    font-size: 1.8em;
    margin-bottom: 15px;
}

#display {
    font-size: 3em;
    margin: 30px 0;
    color: #35f283;
    font-weight: bold;
    text-shadow:
        0 0 18px rgba(29, 185, 84, 0.34),
        0 0 28px rgba(0, 229, 255, 0.12);
}

#controls button {
    margin: 10px;
    padding: 15px 35px;
    font-size: 18px;
    border-radius: 8px;
    background-color: #1db954;
    color: #03110a;
    border: 1px solid rgba(53, 242, 131, 0.64);
    cursor: pointer;
    font-weight: bold;
    transition: background-color 0.3s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

#controls button:hover {
    background-color: #35f283;
    box-shadow: 0 0 18px rgba(29, 185, 84, 0.22);
}

#controls button:disabled {
    background-color: #435064;
    color: #9fb3c2;
    cursor: not-allowed;
}

#laps {
    list-style-type: none;
    padding: 0;
    margin-top: 30px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

#laps li {
    font-size: 1.2em;
    margin: 10px 0;
    color: #d7edf7;
    padding: 10px;
    background: rgba(4, 8, 16, 0.7);
    border-left: 5px solid #ff2dd6;
    border-radius: 8px;
}

.instructions {
    font-size: 1.2em;
    color: #c4d7e4;
    line-height: 1.7;
    margin-top: 50px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}