/* FELLESTRENING - Mobile Fixes CSS
 * Fixes for text visibility and mobile optimization
 */

/* Ensure all form text is visible */
.form-control, .form-control:focus {
    color: #333 !important;
    background-color: #fff !important;
}

.bmd-form-group .form-control {
    color: #333 !important;
    background-color: #fff !important;
}

.bmd-form-group.is-focused .form-control {
    color: #333 !important;
    background-color: #fff !important;
}

.bmd-form-group .bmd-label-floating {
    color: #6c757d !important;
}

.bmd-form-group.is-focused .bmd-label-floating {
    color: #ffc107 !important;
}

/* Override Material Design text colors */
.bg-login .form-control {
    color: #333 !important;
    background-color: #fff !important;
}

.bg-login .bmd-label-floating {
    color: #6c757d !important;
}

.bg-login .bmd-label-floating.bmd-label-floating-focused {
    color: #ffc107 !important;
}

/* Mobile-specific improvements */
@media (max-width: 768px) {
    .form-control {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 15px 20px;
    }
    
    .btn-mobile {
        padding: 15px 25px;
        font-size: 16px;
        font-weight: 600;
        margin: 10px 0;
        border-radius: 25px;
        text-transform: uppercase;
        letter-spacing: 1px;
    }
    
    .login-form, .registration-form, .profile-form {
        margin: 10px;
        padding: 20px;
    }
}

/* Ensure all text in forms is visible */
input[type="text"], 
input[type="email"], 
input[type="password"], 
input[type="date"], 
textarea, 
select {
    color: #333 !important;
    background-color: #fff !important;
}

input[type="text"]:focus, 
input[type="email"]:focus, 
input[type="password"]:focus, 
input[type="date"]:focus, 
textarea:focus, 
select:focus {
    color: #333 !important;
    background-color: #fff !important;
}

/* Placeholder text */
input::placeholder, 
textarea::placeholder {
    color: #999 !important;
}

/* Labels */
label, .bmd-label-floating {
    color: #6c757d !important;
}

/* Headers in forms */
.form h4, .form h5, .form h6 {
    color: #333 !important;
}

/* Error and success messages */
.error-message {
    background: #f8d7da;
    color: #721c24;
    padding: 15px;
    border-radius: 8px;
    margin: 15px;
    text-align: center;
    font-weight: 500;
}

.success-message {
    background: #d4edda;
    color: #155724;
    padding: 15px;
    border-radius: 8px;
    margin: 15px;
    text-align: center;
    font-weight: 500;
}