/**
 * MLabs Forms - Frontend Stylesheet
 * Đảm bảo tương thích hoàn toàn với Theme Flatsome và các theme WordPress hiện đại
 */

.mlabs-form-wrapper {
    position: relative;
    margin: 1.5em 0;
}

/* Ẩn triệt để trường bẫy Honeypot với mắt người */
.mlabs-hp-wrap {
    display: none !important;
    position: absolute !important;
    left: -9999px !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Spinner khi đang gửi */
.mlabs-form-wrapper .wpcf7-spinner,
.mlabs-form-wrapper .mlabs-spinner {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 8px;
    vertical-align: middle;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 50%;
    border-top-color: #fff;
    animation: mlabs-spin 0.8s linear infinite;
}

@keyframes mlabs-spin {
    to {
        transform: rotate(360deg);
    }
}

/* Trạng thái submit */
.mlabs-form.submitting button[type="submit"],
.mlabs-form.submitting input[type="submit"] {
    opacity: 0.75;
    cursor: not-allowed;
    pointer-events: none;
}

/* Thông báo lỗi validation bên dưới từng trường */
.mlabs-form-wrapper .wpcf7-not-valid-tip {
    color: #dc2626;
    font-size: 0.85em;
    font-weight: 500;
    display: block;
    margin-top: 4px;
    line-height: 1.4;
}

.mlabs-form-wrapper .wpcf7-not-valid {
    border-color: #dc2626 !important;
    background-color: #fffbfa !important;
}

/* Khung thông báo kết quả chung */
.mlabs-form-wrapper .mlabs-response-output {
    margin: 20px 0 10px !important;
    padding: 14px 18px !important;
    border-radius: 6px !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
    display: none;
    clear: both !important;
    text-align: left !important;
}

/* Khi không có nội dung thì ẩn */
.mlabs-form-wrapper .mlabs-response-output:empty {
    display: none !important;
}

/* Trạng thái thành công */
.mlabs-form-wrapper form.sent .mlabs-response-output,
.mlabs-form-wrapper form[data-status="sent"] .mlabs-response-output,
.mlabs-form-wrapper .mlabs-response-output.success {
    display: block !important;
    background-color: #f0fdf4 !important;
    border: 2px solid #22c55e !important;
    color: #15803d !important;
    font-weight: 500 !important;
}

/* Trạng thái lỗi dữ liệu hoặc thất bại */
.mlabs-form-wrapper form.invalid .mlabs-response-output,
.mlabs-form-wrapper form[data-status="invalid"] .mlabs-response-output,
.mlabs-form-wrapper form.failed .mlabs-response-output,
.mlabs-form-wrapper form[data-status="failed"] .mlabs-response-output,
.mlabs-form-wrapper .mlabs-response-output.error {
    display: block !important;
    background-color: #fef2f2 !important;
    border: 2px solid #ef4444 !important;
    color: #b91c1c !important;
    font-weight: 500 !important;
}

/* Trạng thái spam hoặc cảnh báo */
.mlabs-form-wrapper form.spam .mlabs-response-output,
.mlabs-form-wrapper form[data-status="spam"] .mlabs-response-output,
.mlabs-form-wrapper .mlabs-response-output.warning {
    display: block !important;
    background-color: #fffbeb !important;
    border: 2px solid #f59e0b !important;
    color: #b45309 !important;
    font-weight: 500 !important;
}