/* ملف family-style.css */
:root { 
    --primary-teal: #159895; 
    --dark-teal: #1a5f7a; 
    --light-bg: #f8fafc;
    --input-height: 42px;
    --error-red: #dc2626;
}

.form-container { max-width: 1200px; margin: 0 auto; }

.main-card { 
    background: white; 
    border-radius: 16px; 
    border: 1px solid #e2e8f0; 
    overflow: hidden; 
    margin-top: 1rem; 
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}
.dark .main-card { 
    background: #1e293b; 
    border-color: #334155; 
}

.form-header-text { margin-bottom: 0.5rem; padding-right: 0.5rem; }
.form-header-text h1 { 
    font-size: 1.5rem; 
    font-weight: 800; 
    color: #1e293b; 
}
.form-header-text p { 
    color: #64748b; 
    font-size: 0.85rem; 
    font-style: italic; 
}
.dark .form-header-text h1 { 
    color: #f1f5f9; 
}
.dark .form-header-text p {
    color: #94a3b8;
}

.section-box { 
    background: #fff; 
    border: 1px solid #edf2f7; 
    border-radius: 12px; 
    padding: 1.5rem; 
    margin-bottom: 1.5rem; 
}
.dark .section-box { 
    background: #1e293b; 
    border-color: #334155; 
}

.section-title { 
    color: var(--dark-teal); 
    font-weight: 800; 
    font-size: 1.1rem; 
    margin-bottom: 1.25rem; 
    display: flex; 
    align-items: center; 
    gap: 8px; 
    border-right: 4px solid var(--primary-teal); 
    padding-right: 10px; 
}
.dark .section-title { 
    color: #2dd4bf; 
}

.form-label { 
    font-weight: 600; 
    color: #4a5568; 
    font-size: 0.85rem; 
    margin-bottom: 0.6rem; 
    display: block; 
}
.dark .form-label { 
    color: #cbd5e0; 
}

.required-star { 
    color: var(--error-red); 
    margin-right: 2px; 
    font-weight: 800; 
}

.form-input { 
    height: var(--input-height);
    border: 1px solid #cbd5e0; 
    border-radius: 8px; 
    padding: 0 1rem; 
    width: 100%; 
    background-color: #fff; 
    font-size: 0.9rem;
    color: #2d3748;
    transition: border-color 0.2s;
}

/* تصحيح ألوان النص في الوضع الداكن */
.dark .form-input { 
    background-color: #0f172a !important; 
    border-color: #334155 !important; 
    color: #f8fafc !important; 
}

/* تصحيح النصوص داخل الحقول */
.dark .form-input::placeholder {
    color: #94a3b8 !important;
}

.dark input.form-input[type="text"],
.dark input.form-input[type="number"],
.dark input.form-input[type="tel"],
.dark input.form-input[type="date"],
.dark textarea.form-input {
    color: #f8fafc !important;
    background-color: #0f172a !important;
}

.dark .form-input:focus {
    color: #f8fafc !important;
    background-color: #0f172a !important;
}

.form-input.is-invalid {
    border-color: var(--error-red) !important;
    background-color: #fff5f5;
}
.dark .form-input.is-invalid { 
    background-color: #451a1a; 
    color: #f8fafc !important;
}

.error-text { 
    color: var(--error-red); 
    font-size: 0.75rem; 
    margin-top: 4px; 
    font-weight: 600; 
}

/* تخصيص Select2 */
.select2-container--default .select2-selection--single {
    height: var(--input-height) !important;
    border-radius: 8px !important;
    border: 1px solid #cbd5e0 !important;
    background-color: #fff !important;
    display: flex;
    align-items: center;
    transition: border-color 0.2s;
}

.dark .select2-container--default .select2-selection--single {
    background-color: #0f172a !important;
    border-color: #334155 !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #2d3748 !important;
    line-height: var(--input-height) !important;
    padding-right: 12px !important;
    padding-left: 32px !important;
    font-size: 0.9rem;
}

.dark .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #f8fafc !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered[title="اختر..."] {
    color: #64748b !important;
}
.dark .select2-container--default .select2-selection--single .select2-selection__rendered[title="اختر..."] {
    color: #94a3b8 !important;
}

.select2-dropdown {
    background-color: #fff !important;
    border-color: #cbd5e0 !important;
    border-radius: 8px !important;
    margin-top: 4px !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}
.dark .select2-dropdown {
    background-color: #1e293b !important;
    border-color: #334155 !important;
}

.select2-container--default .select2-results__option {
    color: #2d3748 !important;
    padding: 8px 12px !important;
    transition: background-color 0.2s ease;
    font-size: 0.85rem;
}
.dark .select2-container--default .select2-results__option {
    color: #cbd5e0 !important;
    background-color: #1e293b !important;
}

/* الأوبشن باللون الأخضر */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--primary-teal) !important;
    color: white !important;
}

.select2-container--default .select2-results__option--selected {
    background-color: rgba(21, 152, 149, 0.1) !important;
    color: var(--dark-teal) !important;
    font-weight: 600;
}
.dark .select2-container--default .select2-results__option--selected {
    background-color: rgba(21, 152, 149, 0.2) !important;
    color: #99f6e4 !important;
}

.select2-search--dropdown {
    padding: 8px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}
.dark .select2-search--dropdown {
    border-bottom-color: #334155 !important;
}

.select2-search--dropdown .select2-search__field {
    border: 1px solid #cbd5e0 !important;
    border-radius: 6px !important;
    padding: 6px 12px !important;
    width: 100% !important;
    color: #2d3748 !important;
    background-color: #fff !important;
    font-size: 0.875rem !important;
}
.dark .select2-search--dropdown .select2-search__field {
    background-color: #0f172a !important;
    border-color: #334155 !important;
    color: #f1f5f9 !important;
}

.select2-search--dropdown .select2-search__field::placeholder {
    color: #94a3b8 !important;
}
.dark .select2-search--dropdown .select2-search__field::placeholder {
    color: #64748b !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: var(--input-height) !important;
    right: auto !important;
    left: 8px !important;
    width: 24px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #64748b transparent transparent transparent !important;
    border-width: 6px 6px 0 6px !important;
    margin-top: -3px !important;
    margin-right: -3px !important;
}
.dark .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #94a3b8 transparent transparent transparent !important;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #64748b transparent !important;
    border-width: 0 6px 6px 6px !important;
    margin-top: 3px !important;
}
.dark .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #94a3b8 transparent !important;
}

.select2-container--default .select2-selection--single.is-invalid {
    border-color: var(--error-red) !important;
    background-color: #fff5f5 !important;
}
.dark .select2-container--default .select2-selection--single.is-invalid {
    border-color: #f87171 !important;
    background-color: #451a1a !important;
}

/* تصميم ملف الرفع */
.custom-file-upload {
    background: #f1f5f9;
    border: 1px dashed var(--primary-teal);
    border-radius: 8px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    gap: 10px;
    height: var(--input-height);
    transition: 0.3s;
}
.dark .custom-file-upload { 
    background: #1e293b; 
    border-color: #475569; 
}

.custom-file-upload input[type="file"] { 
    border: none; 
    background: transparent; 
    font-size: 0.75rem; 
    flex-grow: 1; 
    color: #4a5568;
}
.dark .custom-file-upload input[type="file"] {
    color: #cbd5e0 !important;
}

/* تصميم Checkbox */
.check-item { 
    background: #f0fdfa; 
    padding: 0.75rem; 
    border-radius: 12px; 
    display: flex; 
    align-items: center; 
    gap: 10px; 
    cursor: pointer; 
    border: 1px solid #ccfbf1;
    color: var(--dark-teal);
    font-weight: 700;
    transition: 0.2s;
}
.dark .check-item { 
    background: #134e4a; 
    color: #ccfbf1; 
    border-color: #115e59; 
}

.check-item:hover {
    background: #e0f2f1;
    border-color: var(--primary-teal);
}
.dark .check-item:hover {
    background: #0f766e;
    border-color: #0d9488;
}

/* تصميم الأزرار */
.btn-submit { 
    background: linear-gradient(to left, #1a5f7a, #159895); 
    color: white; 
    padding: 0.8rem 3rem; 
    border-radius: 10px; 
    font-weight: 700; 
    border: none; 
    cursor: pointer; 
    transition: 0.3s; 
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.btn-submit:hover { 
    opacity: 0.9; 
    transform: translateY(-2px); 
}

/* زر الإلغاء */
.btn-cancel {
    padding: 0.8rem 3rem;
    border-radius: 10px;
    font-weight: 700;
    border: 1px solid #cbd5e0;
    background-color: #f8fafc;
    color: #4a5568;
    transition: 0.3s;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dark .btn-cancel {
    background-color: #334155;
    border-color: #475569;
    color: #cbd5e0;
}
.btn-cancel:hover {
    background-color: #f1f5f9;
}
.dark .btn-cancel:hover {
    background-color: #475569;
}

/* تنسيق النص الطويل */
textarea.form-input {
    height: auto;
    min-height: calc(var(--input-height) * 1.5);
    padding: 10px 1rem;
    line-height: 1.5;
    resize: vertical;
}

/* تصحيح textarea في الوضع الداكن */
.dark textarea.form-input {
    color: #f8fafc !important;
    background-color: #0f172a !important;
}

.dark textarea.form-input::placeholder {
    color: #94a3b8 !important;
}

/* تنسيق الحقول المعطلة */
.form-input:disabled,
.form-input[readonly] {
    background-color: #f1f5f9;
    color: #64748b;
    cursor: not-allowed;
}
.dark .form-input:disabled,
.dark .form-input[readonly] {
    background-color: #334155;
    color: #94a3b8 !important;
}

/* قسم إضافي */
.additional-section {
    margin-top: 1.5rem;
    padding: 1.5rem;
    background: #f8fafc;
    border-radius: 12px;
    border: 1px dashed #cbd5e0;
}
.dark .additional-section {
    background: #1e293b;
    border-color: #475569;
}

/* تصحيح ألوان العناوين في الوضع الداكن */
.dark .additional-section h3 {
    color: #f1f5f9 !important;
}

/* تصحيح ألوان النص في الوضع الداكن */
.dark .text-gray-700 {
    color: #cbd5e0 !important;
}

.dark .text-gray-300 {
    color: #f1f5f9 !important;
}

/* تصحيح خلفية الأقسام المنقطة */
.dark .bg-slate-50 {
    background-color: rgba(30, 41, 59, 0.5) !important;
}

/* تصحيح الحدود المنقطة */
.dark .border-slate-200 {
    border-color: #475569 !important;
}

/* إضافة قاعدة عامة لتحديث ألوان النص في الوضع الداكن */
.dark input:-webkit-autofill,
.dark input:-webkit-autofill:hover,
.dark input:-webkit-autofill:focus,
.dark textarea:-webkit-autofill,
.dark textarea:-webkit-autofill:hover,
.dark textarea:-webkit-autofill:focus,
.dark select:-webkit-autofill,
.dark select:-webkit-autofill:hover,
.dark select:-webkit-autofill:focus {
    -webkit-text-fill-color: #f8fafc !important;
    -webkit-box-shadow: 0 0 0px 1000px #0f172a inset !important;
    transition: background-color 5000s ease-in-out 0s;
}