/* register_style.css - مع دعم جميع اللغات */
    :root { 
        --primary: #2c5aa0; 
        --secondary: #1e3a8a; 
        --accent: #f97316; 
        --light: #f8fafc; 
        --dark: #1e293b; 
        --gray: #64748b; 
        --success: #10b981; 
        --danger: #ef4444;
    }
    
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    
    body {
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        background: linear-gradient(135deg, #f0f4f8 0%, #e2e8f0 100%);
        color: var(--dark);
        line-height: 1.6;
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        transition: all 0.3s ease;
    }
    
    /* تنسيقات الاتجاهات */
    .rtl-direction {
        direction: rtl;
        text-align: right;
    }
    
    .ltr-direction {
        direction: ltr;
        text-align: left;
    }
    
    /* تنسيقات خاصة باللغات */
    .ar-lang {
        font-family: 'Segoe UI', 'Arial', 'Noto Sans Arabic', sans-serif;
    }
    
    .en-lang {
        font-family: 'Segoe UI', 'Arial', sans-serif;
        letter-spacing: 0.3px;
    }
    
    .ur-lang {
        font-family: 'Noto Nastaliq Urdu', 'Alvi Lahori Nastaleeq', 'Segoe UI', sans-serif;
        font-size: 18px;
        line-height: 1.8;
    }
    
    .hi-lang {
        font-family: 'Noto Sans Devanagari', 'Segoe UI', sans-serif;
        font-size: 18px;
    }
    
    .zh-lang {
        font-family: 'Noto Sans SC', 'Microsoft YaHei', 'Segoe UI', sans-serif;
        font-size: 18px;
    }
    
    .bn-lang {
        font-family: 'Noto Sans Bengali', 'Segoe UI', sans-serif;
        font-size: 18px;
    }
    
    .id-lang {
        font-family: 'Segoe UI', 'Arial', sans-serif;
    }
    
    .tr-lang {
        font-family: 'Segoe UI', 'Arial', sans-serif;
    }
    
    /* الشريط العلوي */
    .header {
        background: #fff;
        box-shadow: 0 2px 10px rgba(0,0,0,.1);
        padding: 15px 0;
    }
    
    .navbar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 20px;
    }
    
    .logo {
        display: flex;
        align-items: center;
        gap: 10px;
    }
    
    .logo-text {
        font-size: 24px;
        font-weight: 700;
        color: var(--primary);
    }
    
    .language-switch {
        margin-left: 20px;
    }
    
    .language-switch select {
        padding: 8px 15px;
        border-radius: 4px;
        border: 1px solid #ddd;
        background-color: white;
        font-size: 14px;
        min-width: 150px;
    }
    
    /* المحتوى الرئيسي */
    .container {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 40px 20px;
        max-width: 1200px;
        margin: 0 auto;
        width: 100%;
    }
    
    .register-content {
        max-width: 500px;
        width: 100%;
    }
    
    .register-card {
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 10px 30px rgba(0,0,0,.1);
        padding: 40px;
        width: 100%;
    }
    
    .register-header {
        text-align: center;
        margin-bottom: 30px;
    }
    
    .register-header h1 {
        font-size: 28px;
        color: var(--secondary);
        margin-bottom: 10px;
    }
    
    .register-header p {
        color: var(--gray);
    }
    
    .welcome-banner {
        background: rgba(249,115,22,.1);
        border: 1px solid rgba(249,115,22,.2);
        border-radius: 8px;
        padding: 15px;
        margin-bottom: 20px;
        text-align: center;
    }
    
    .welcome-banner h3 {
        color: var(--accent);
        margin-bottom: 5px;
    }
    
    /* النماذج */
    .form-group {
        margin-bottom: 20px;
    }
    
    .form-label {
        display: block;
        margin-bottom: 8px;
        font-weight: 600;
        color: var(--dark);
    }
    
    .form-control {
        width: 100%;
        padding: 12px 15px;
        border: 1px solid #d1d5db;
        border-radius: 8px;
        font-size: 16px;
        transition: .3s;
        background: #fff;
    }
    
    .form-control:focus {
        outline: none;
        border-color: var(--primary);
        box-shadow: 0 0 0 3px rgba(44,90,160,.1);
    }
    
    .form-control.is-invalid {
        border-color: var(--danger);
        box-shadow: 0 0 0 3px rgba(239,68,68,.1);
    }
    
    .checkbox-group {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        margin-bottom: 20px;
    }
    
    .checkbox-group input {
        margin-top: 3px;
    }
    
    .checkbox-group label {
        font-size: 14px;
        line-height: 1.4;
    }
    
    .terms-link {
        color: var(--primary);
        text-decoration: none;
    }
    
    .terms-link:hover {
        text-decoration: underline;
    }
    
    .verification-section {
        background: #f8f9fa;
        border: 1px solid #dee2e6;
        border-radius: 8px;
        padding: 15px;
        margin-bottom: 20px;
    }
    
    .verification-row {
        display: flex;
        gap: 10px;
        align-items: flex-end;
    }
    
    .verification-input {
        flex: 1;
        min-height: 46px;          /* ✅ مهم للجوال */
        text-align: center;        /* ✅ أجمل لرمز التحقق */
        letter-spacing: 4px;       /* ✅ وضوح الأرقام */
        direction: ltr;            /* ✅ الأرقام تظهر بشكل صحيح */
    }
    
    .btn {
        padding: 12px 20px;
        border-radius: 8px;
        font-weight: 600;
        cursor: pointer;
        transition: .3s;
        border: none;
        font-size: 16px;
    }
    
    .btn-primary {
        background: var(--primary);
        color: #fff;
    }
    
    .btn-primary:hover {
        background: var(--secondary);
    }
    
    .btn-secondary {
        background: var(--gray);
        color: #fff;
    }
    
    .btn-secondary:hover {
        background: #55667a;
    }
    
    .btn-disabled {
        background: #cbd5e1;
        color: #64748b;
        cursor: not-allowed;
    }
    
    .btn-full {
        width: 100%;
    }
    
    .btn-verify {
        white-space: nowrap;
        height: 46px;
    }
    
    .register-footer {
        text-align: center;
        margin-top: 20px;
    }
    
    .register-footer a {
        color: var(--primary);
        text-decoration: none;
    }
    
    .register-footer a:hover {
        color: var(--secondary);
        text-decoration: underline;
    }
    
    .alert {
        padding: 12px 15px;
        border-radius: 8px;
        margin-bottom: 20px;
    }
    
    .alert-danger {
        background: rgba(239,68,68,.1);
        color: var(--danger);
        border: 1px solid rgba(239,68,68,.2);
    }
    
    .alert-success {
        background: rgba(16,185,129,.1);
        color: var(--success);
        border: 1px solid rgba(16,185,129,.2);
    }
    
    .password-requirements {
        font-size: 14px;
        color: var(--gray);
        margin-top: 5px;
    }
    
    .password-strength {
        height: 5px;
        background: #eee;
        margin-top: 5px;
        border-radius: 5px;
        overflow: hidden;
    }
    
    .strength-bar {
        height: 100%;
        width: 0%;
        background: var(--danger);
        transition: .3s;
    }
    
    .recaptcha-container {
        margin: 20px 0;
        display: flex;
        justify-content: center;
    }
    
    .recaptcha-box {
        background: #f9f9f9;
        border: 2px solid #d3d3d3;
        border-radius: 4px;
        padding: 10px;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        cursor: pointer;
    }
    
    .recaptcha-checkbox {
        width: 20px;
        height: 20px;
        border: 2px solid #d3d3d3;
        border-radius: 3px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .recaptcha-checkbox.checked {
        background: #4285f4;
        border-color: #4285f4;
    }
    
    .recaptcha-checkbox.checked::after {
        content: "✓";
        color: #fff;
        font-weight: 700;
    }
    
    .recaptcha-text {
        font-size: 14px;
        color: #555;
    }
    
    .simple-footer {
        background: var(--dark);
        color: #fff;
        text-align: center;
        padding: 20px;
        margin-top: auto;
    }
    
    .text-success { color: var(--success); }
    .text-danger  { color: var(--danger); }
    .text-info    { color: var(--primary); }
    
    .mt-2 { margin-top: 8px; }
    
    /* تحسينات لإدخال الهاتف الدولي */
    .intl-tel-input { width: 100%; }

    /* ✅ (مهم) قواعد الاتجاهات - اتركها كما هي لسطح المكتب */
    .rtl-direction .verification-row { flex-direction: row; }
    .ltr-direction .verification-row { flex-direction: row; }

    .rtl-direction .checkbox-group { flex-direction: row; }
    .ltr-direction .checkbox-group { flex-direction: row; }
    
    /* ✅ التجاوب مع الشاشات المختلفة */
    @media (max-width: 768px) {
        .register-card { padding: 30px 20px; }

        /* ✅ FIX: اجعل صف التحقق عمودي على الجوال (بنفس/أعلى خصوصية) */
        .rtl-direction .verification-row,
        .ltr-direction .verification-row {
            flex-direction: column;
            align-items: stretch;
        }

        /* ✅ FIX: تأكيد أن الحقل والزر يأخذان عرض كامل */
        .rtl-direction .verification-input,
        .ltr-direction .verification-input {
            width: 100%;
            flex: 0 0 auto;
        }

        .rtl-direction .btn-verify,
        .ltr-direction .btn-verify {
            width: 100%;
        }

        .navbar {
            flex-direction: column;
            gap: 15px;
        }
        
        .language-switch {
            margin-left: 0;
            margin-top: 10px;
        }
        
        .ur-lang, .hi-lang, .zh-lang, .bn-lang { font-size: 16px; }
        .language-switch select { min-width: 120px; }
    }

/* CSP hardening additions */
[hidden]{display:none!important}
.message-slot{font-size:14px}
.verification-method-toggle{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.verification-method-option{display:flex;align-items:center;gap:8px;cursor:pointer}
.strength-bar.strength-0{width:0%;background:var(--danger)}
.strength-bar.strength-1{width:25%;background:var(--danger)}
.strength-bar.strength-2{width:50%;background:var(--accent)}
.strength-bar.strength-3{width:75%;background:var(--accent)}
.strength-bar.strength-4{width:100%;background:var(--success)}
.btn-icon{margin-inline-end:.35rem}

/* intl-tel-input integration fixes */
.iti{width:100%;display:block}
.iti input.form-control{width:100%}
html[dir="rtl"] .iti{direction:ltr;text-align:left}
html[dir="rtl"] .iti input{direction:ltr;text-align:left}
html[dir="rtl"] .iti__country-list{text-align:left;direction:ltr}