/* 
 * SJB Frontend Job Posting - Main CSS
 * Styles for the frontend job submission form
 */

.sjb-frontend-form-container,
.sjb-edit-job-container {
    /*max-width: 800px;*/
    margin: 0 auto;
    padding: 20px;
}

.sjb-frontend-form,
.sjb-edit-form {
    background-color: #fff;
    padding: 25px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

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

.sjb-form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
    color: #333;
}

.sjb-form-control {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
}

.sjb-form-control:focus {
    border-color: #2271b1;
    box-shadow: 0 0 5px rgba(34, 113, 177, 0.2);
    outline: none;
}

input#city {
font-size:16px;
line-height:1.7;
font-weight:400;
background-color:#f5f7ff;
height:50px;
padding:0 20px;
margin:0 0 10px 0;
border-width:0;
border-radius:5px;
color:#6777a1;
transition:all 0.3s, height 0s;
}

.sjb-job-features-container {
    margin-top: 10px;
}

.sjb-job-feature-row {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}

.sjb-feature-name,
.sjb-feature-value {
    flex: 1;
}

.sjb-feature-actions {
    flex: 0 0 auto;
}

.sjb-add-feature,
.sjb-remove-feature {
    padding: 5px 10px;
    background-color: #f7f7f7;
    border: 1px solid #ddd;
    border-radius: 3px;
    cursor: pointer;
}

.sjb-add-feature:hover {
    background-color: #e7f5ff;
    border-color: #c7e5ff;
}

.sjb-remove-feature:hover {
    background-color: #ffe0e0;
    border-color: #ffcaca;
}

.sjb-form-actions {
    margin-top: 30px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.sjb-submit-button {
    background-color: #2271b1;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
}

.sjb-submit-button:hover {
    background-color: #135e96;
}

.sjb-cancel-button {
    background-color: #f7f7f7;
    color: #333;
    border: 1px solid #ddd;
    padding: 10px 20px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 500;
}

.sjb-cancel-button:hover {
    background-color: #e9e9e9;
    text-decoration: none;
}

.sjb-frontend-message {
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 4px;
}

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

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

.required {
    color: #d63638;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .sjb-job-feature-row {
        flex-direction: column;
        gap: 5px;
    }
    
    .sjb-feature-actions {
        text-align: right;
    }
}
