/**
 * SMS Verification for Contact Form 7
 * By MBit - https://mbit.co.il
 * Minimal CSS - Easy to override
 */

/* כפתור שליחת קוד - סגנון מינימלי */
.sms-send-code-btn {
    display: inline-block;
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    border: none;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.sms-send-code-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.sms-send-code-btn.sent {
    background-color: #4CAF50;
    color: white;
}

/* סטטוס שליחה */
.sms-send-status {
    display: inline-block;
    margin-right: 10px;
    font-size: 14px;
    vertical-align: middle;
}

/* שדה קוד אימות */
.sms-verification-field.verified {
    background-color: #e8f5e9;
    border-color: #4CAF50;
    color: #2e7d32;
}

.sms-verification-field.error {
    background-color: #ffebee;
    border-color: #f44336;
    animation: shake 0.3s ease;
}

/* סטטוס אימות */
.sms-verification-status {
    display: inline-block;
    margin-right: 10px;
    font-weight: 600;
    font-size: 14px;
    vertical-align: middle;
    padding: 8px 12px;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.sms-verification-status .sms-success,
.sms-send-status .sms-success {
    color: #2e7d32;
    background-color: #e8f5e9;
    border: 1px solid #4CAF50;
    padding: 6px 12px;
    border-radius: 4px;
    display: inline-block;
    animation: fadeIn 0.3s ease;
}

.sms-verification-status .sms-error,
.sms-send-status .sms-error {
    color: #c62828;
    background-color: #ffebee;
    border: 1px solid #f44336;
    padding: 6px 12px;
    border-radius: 4px;
    display: inline-block;
    animation: shake 0.3s ease;
}

.sms-verification-status .sms-loading,
.sms-send-status .sms-loading {
    color: #ff9800;
    padding: 6px 12px;
}

/* אנימציות */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

/* תמיכה ב-RTL */
[dir="rtl"] .sms-verification-status,
[dir="rtl"] .sms-send-status {
    margin-right: 0;
    margin-left: 10px;
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    .sms-verification-field.verified {
        background-color: #1b5e20;
        border-color: #66bb6a;
        color: #a5d6a7;
    }
    
    .sms-verification-field.error {
        background-color: #b71c1c;
        border-color: #ef5350;
        color: #ffcdd2;
    }
}

/* סגנון מינימלי - ניתן בקלות לדריסה */
.sms-minimal .sms-send-code-btn {
    background: none;
    border: none;
    padding: 0;
    color: inherit;
}

.sms-minimal .sms-verification-status,
.sms-minimal .sms-send-status {
    padding: 0;
    background: none;
    border: none;
}