/* Apply Inter font family */
body {
    font-family: 'Inter', sans-serif;
}
/* Custom colors matching the dark indigo/grey theme for reusability */
.bg-dark-indigo {
    background-color: #2c3e50; /* Deep Slate Blue/Dark Indigo */
}
.bg-dark-charcoal {
    background-color: #343a40; /* Darker Gray */
}
.text-accent-blue {
    color: #3498db; /* Elegant Blue Accent */
}
.border-accent-blue {
    border-color: #3498db;
}
.text-light-indigo {
    color: #bdc3c7; /* Light Gray/Off-White for readability */
}

/* Styling for the hidden radio buttons */
.quiz-option input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

/* Styling for the label (the clickable box) */
.quiz-option label {
    display: block;
    padding: 1rem;
    border: 2px solid #5a626a; /* Default border */
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    background-color: #4a4f54; /* Slightly lighter than body for contrast */
}

/* Hover effect */
.quiz-option label:hover {
    background-color: #5a626a;
}

/* Checked state */
.quiz-option input[type="radio"]:checked + label {
    border-color: #3498db; /* Accent border when selected */
    background-color: #3c5471; /* Darker indigo when selected */
}

/* Correct/Incorrect feedback states (set by JS) */
.correct-answer {
    background-color: #27ae60 !important; /* Green */
    border-color: #2ecc71 !important;
    color: white !important;
}
.incorrect-answer {
    background-color: #c0392b !important; /* Red */
    border-color: #e74c3c !important;
    color: white !important;
}