/**
 * @file forms.css
 * @description Bluedot Consulting - Form Styles & Validation States
 * Contains styles for form inputs, labels, textareas, focus states,
 * validation error states, and success messages used in contact forms
 * across the Bluedot Consulting website.
 *
 * @version 1.0.0
 */

/* ============================================================================
   Form Labels
   ============================================================================ */

label {
    display: block;
    color: #555;
    font-weight: 500;
}

/* ============================================================================
   Form Inputs
   ============================================================================ */

input,
select,
textarea {
    flex: 1;
    padding: 0.8rem 1rem;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 1rem;
    transition: border-color 0.3s ease;
}

input:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: #0087de;
    box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.1);
}

textarea {
    min-height: 120px;
    resize: vertical;
}

/* ============================================================================
   Validation Error States
   ============================================================================ */

.error label {
    color: red;
}

.error input,
.error select,
.error textarea {
    border-color: red;
}

/* ============================================================================
   Submit Button
   ============================================================================ */

.submit-btn {
    border: none;
    cursor: pointer;
}

/* ============================================================================
   Success Message
   ============================================================================ */

.success-message {
    color: #27ae60;
    margin-top: 1rem;
    display: none;
}