/* /static/css/custom.css */

:root {
    /* 1. Define a new, modern primary color */
    --bs-primary: #4A90E2; /* A professional, friendly blue */
    --bs-primary-rgb: 74, 144, 226;

    /* 2. Sharper radius for all components */
    --bs-border-radius: 0.25rem;
    --bs-border-radius-lg: 0.3rem;
    --bs-border-radius-sm: 0.2rem;

    /* Define success color for ghost button */
    --bs-success: #28a745;
    --bs-success-rgb: 40, 167, 69;
}

body {
    background-color: #f8f9fa;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* --- Navbar & Progress --- */
.navbar-brand {
    font-weight: 600;
}

.progress-bar-container {
    background-color: #e9ecef;
    border-radius: var(--bs-border-radius);
}

/* --- Cards --- */
.card {
    border: 1px solid #e9ecef;
    border-radius: var(--bs-border-radius-lg);
    box-shadow: 0 4px 6px rgba(0,0,0,0.04); /* Add subtle depth */
}

/* --- Buttons --- */
.btn {
    border-radius: var(--bs-border-radius);
    font-weight: 600;
    transition: all 0.2s ease-in-out;
    border-width: 2px; /* Make borders more prominent */
}

.btn-lg {
    border-radius: var(--bs-border-radius-lg);
}

/* Transparent "Ghost" Primary Button Style */
.btn-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--bs-primary);

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
}

/* Transparent "Ghost" Success Button Style */
.btn-success {
    --bs-btn-color: var(--bs-success);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--bs-success);

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-success);
    --bs-btn-hover-border-color: var(--bs-success);
}

/* Ensure outline secondary for logout looks good */
.btn-outline-secondary {
    border-width: 2px;
}


/* --- Test View Specifics --- */
.answer-label {
    display: block;
    padding: 1rem;
    border: 2px solid #dee2e6;
    border-radius: var(--bs-border-radius);
    cursor: pointer;
    margin-bottom: 0.75rem;
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

.answer-label:hover {
    background-color: #eef5ff;
    border-color: var(--bs-primary);
}

.answer-label input[type="radio"]:checked + span {
    color: var(--bs-primary);
    font-weight: 600;
}

/* --- Utility Classes --- */
.back-link {
    color: var(--bs-secondary-color);
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}

.back-link:hover {
    color: var(--bs-primary);
    text-decoration: underline;
}