Update style.css

style.css

@@ -2,17 +2,16 @@
 
 body {
   font-family: "Noto Sans Arabic", sans-serif;
-  background-color: #f9fafb; /* خلفية رمادية فاتحة */
-  color: #333333; /* لون النص */
+  background-color: #f9fafb;
+  color: #333333;
 }
 
 .container {
   margin: 0 auto;
   padding: 1rem;
-  max-width: 768px; /* عرض الصفحة */
+  max-width: 768px;
 }
 
-/* العنوان */
 h1 {
   font-size: 1.875rem;
   font-weight: bold;
@@ -20,47 +19,44 @@ h1 {
   margin-bottom: 1.5rem;
 }
 
-/* الأزرار */
 button {
-  background-color: #4f46e5; /* لون أزرق */
-  color: #ffffff; /* لون النص أبيض */
+  background-color: #4f46e5;
+  color: #ffffff;
   padding: 0.75rem 1rem;
   border: none;
-  border-radius: 8px; /* رواندنس */
+  border-radius: 8px;
   cursor: pointer;
   transition: background-color 0.3s ease;
   font-weight: bold;
 }
 
 button:hover {
-  background-color: #4338ca; /* أزرق أغمق عند الـ Hover */
+  background-color: #4338ca;
 }
 
 button:disabled {
-  background-color: #a5b4fc; /* لون خافت إذا كان الزر معطل */
+  background-color: #a5b4fc;
   cursor: not-allowed;
 }
 
-/* حقول الإدخال */
 textarea,
 input[type="range"] {
   width: 100%;
   padding: 0.75rem;
   border: 1px solid #d1d5db;
-  border-radius: 6px; /* رواندنس خفيف */
+  border-radius: 6px;
   margin-top: 0.5rem;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); /* ظل خفيف */
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
   transition: border-color 0.3s ease, box-shadow 0.3s ease;
 }
 
 textarea:focus,
 input[type="range"]:focus {
   outline: none;
-  border-color: #6366f1; /* تركيز بالأزرق الفاتح */
-  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2); /* ظل عند التركيز */
+  border-color: #6366f1;
+  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
 }
 
-/* صندوق الإعدادات */
 .bg-gray-50 {
   background-color: #f9fafb;
   border-radius: 8px;
@@ -74,10 +70,9 @@ label {
 
 span.text-sm {
   font-size: 0.875rem;
-  color: #6b7280; /* لون رمادي للنصوص الثانوية */
+  color: #6b7280;
 }
 
-/* حاوية الملخص */
 .border {
   border: 1px solid #e5e7eb;
   border-radius: 8px;
@@ -95,3 +90,28 @@ p.leading-relaxed {
   line-height: 1.75;
   color: #4b5563;
 }
+
+/* معالجة المناطق السوداء والراوندس */
+.gradio-container {
+  background: #f9fafb !important;
+  color: #333333 !important;
+}
+
+.dark {
+  background: #f9fafb !important;
+  color: #333333 !important;
+}
+
+.gr-box {
+  background: #ffffff !important;
+  border-radius: 12px !important;
+}
+
+.gr-form, .gr-panel {
+  background: #ffffff !important;
+  border-radius: 12px !important;
+}
+
+.gr-input-label {
+  color: #333333 !important;
+}