/* Apply Kenning */
.page-Kenning {
    background: linear-gradient(rgba(44, 62, 80, 0.9), rgba(44, 62, 80, 0.9)), url('../images/apply.jpg');
    /* background: linear-gradient(rgba(44, 62, 80, 0.9), rgba(44, 62, 80, 0.9)), url('https://images.unsplash.com/photo-1498050108023-c5249f4df085?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80'); */
    background-size: cover;
    background-position: center;
    color: var(--white);
    text-align: center;
    padding: 150px 0 80px;
}

/* Application Form */
.application-form {
    padding: 80px 0;
}

.application-form .container {
    max-width: 800px;
}

.form-section {
    margin-bottom: 40px;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--light-gray);
}

.form-section h2 {
    color: var(--secondary);
    margin-bottom: 25px;
    font-size: 1.5rem;
}

.form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.form-row .form-group {
    flex: 1;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: var(--secondary);
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid var(--light-gray);
    border-radius: 4px;
    font-size: 1rem;
}

.form-group textarea {
    min-height: 120px;
}

.error-message {
    color: var(--primary);
    font-size: 0.8rem;
    margin-top: 5px;
    display: none;
}

.form-actions {
    text-align: center;
    margin-top: 40px;
}

/* Form Messages */
#form-messages {
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 4px;
    display: none;
}

#form-messages.success {
    display: block;
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

#form-messages.error {
    display: block;
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

#form-messages ul {
    margin: 0;
    padding-left: 20px;
}

.success-message {
    margin: 0;
}

/* Error messages */
.error-message {
    color: #dc3545;
    font-size: 0.875em;
    margin-top: 5px;
    display: none;
}

/* Show error message when there's an error */
.form-group.has-error .error-message {
    display: block;
}

.form-group.has-error input,
.form-group.has-error select,
.form-group.has-error textarea {
    border-color: #dc3545;
}

/* Add these styles to your CSS file */
.form-message {
    margin-top: 15px;
    padding: 12px 20px;
    border-radius: 4px;
    font-size: 16px;
    text-align: center;
    display: none; /* Hidden by default */
}

.form-message.success {
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
    display: block;
}

.form-message.error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
    display: block;
}

@media (max-width: 768px) {
    .form-row {
        flex-direction: column;
        gap: 0;
    }
    
    .page-Kenning {
        padding: 120px 0 60px;
    }
}