Update app.py

app.py

@@ -83,12 +83,11 @@ _model_cache = {}
 def load_model(model_name: str):
     if model_name in _model_cache:
         return _model_cache[model_name]
-    token = os.getenv("hf_token")
-    print(token)
-    tok = AutoTokenizer.from_pretrained("ai4bharat/indictrans2-en-indic-1B", trust_remote_code=True)
+
+    tok = AutoTokenizer.from_pretrained(model_name, trust_remote_code=True, use_fast=True)
     mdl = AutoModelForSeq2SeqLM.from_pretrained(
         model_name, trust_remote_code=True,
-        low_cpu_mem_usage=True, dtype=dtype, token=token
+        low_cpu_mem_usage=True, dtype=dtype
     ).to(device).eval()
 
     # Fix vocab
@@ -176,40 +175,56 @@ THEME = gr.themes.Soft(
 )
 
 CUSTOM_CSS = """
+/* Header + Panels */
 #hdr { text-align:center; padding:16px; }
 #hdr h1 { font-size:24px; font-weight:700; color:#f9fafb; margin:0; }
 #hdr p { font-size:14px; color:#9ca3af; margin-top:4px; }
 .panel { border:1px solid #1f2937; border-radius:10px; padding:12px; background:#111827; box-shadow:0 1px 2px rgba(0,0,0,0.4);}
 .panel h2 { font-size:16px; font-weight:600; margin-bottom:6px; color:#f3f4f6; }
-/* Ensure textbox uses dark bg + light fg */
-textarea, .gr-textbox textarea { background:#0b0f19 !important; color:#f9fafb !important; border-radius:8px !important; border:1px solid #374151 !important; font-size:15px !important; line-height:1.55; }
-/* Button styling */
-button, .gr-button { border-radius:8px !important; font-weight:600 !important; }
-button, .gr-button { color:#fff !important; background-color:#2563eb !important; border:none !important; }
-button.secondary, .gr-button.secondary { background-color:#374151 !important; }
-button:hover, .gr-button:hover { opacity:0.92; }
-/* Dropdowns & Selects */
-select, .gr-input select, .form-select, .gradio-dropdown { background:#0b0f19 !important; color:#f9fafb !important; border:1.5px solid #374151 !important; border-radius:8px !important; font-size:15px !important; font-weight:600 !important; }
-/* Make dropdown options clear (browsers may ignore some CSS here) */
-option { background:#0b0f19; color:#f9fafb; }
-/* Sliders and labels */
-input[type=range], .gr-slider input[type=range] { accent-color: #2563eb; }
-.gr-slider-label, .gradio-slider label, .gr-slider label,
-.gr-input label, label, .form-label, .block-label { color:#f9fafb !important; font-weight:600; font-size:15px !important; }
-.gradio-slider .value, .gr-slider .value { color:#f9fafb !important; font-weight:600 !important; }
-.gr-slider { background:#1e293b !important; border-radius:6px !important; }
-/* General form inputs */
-input, .gr-input input, .gradio-input { background:#0b0f19 !important; color:#f9fafb !important; border:1.5px solid #374151 !important; border-radius:8px !important; }
-/* Remove opacity on any label elements (for clarity) */
-label, .form-label, .block-label { opacity:1 !important; }
-/* Gradio fix: force all form text to be light */
-.gradio-container, .gr-block, .gr-form, .gr-form label, .gr-block label, .gradio-form label, .form-label, .block-label, .block-info {
-    color:#f9fafb !important;
+
+/* Inputs */
+textarea { background:#0b0f19 !important; color:#f9fafb !important; border-radius:8px !important; border:1px solid #374151 !important; font-size:15px !important; line-height:1.55; }
+button { border-radius:8px !important; font-weight:600 !important; }
+
+/* Make all component labels readable on dark bg */
+.gradio-container label,
+.gradio-container .label,
+.gradio-container .block-title,
+.gradio-container .prose h2,
+.gradio-container .prose h3 {
+  color:#e5e7eb !important;
+}
+
+/* --- Dropdown: dark text on white field/menu --- */
+#model_dd .wrap,
+#model_dd .container {
+  background:#ffffff !important;
+  border:1px solid #374151 !important;
+  border-radius:8px !important;
+}
+#model_dd input,
+#model_dd .value,
+#model_dd ::placeholder,
+#model_dd select,
+#model_dd option {
+  color:#111827 !important; /* dark text */
+  background:#ffffff !important;
+}
+#model_dd .options,
+#model_dd .options .item {
+  background:#ffffff !important;
+  color:#111827 !important;
+}
+#model_dd label { /* the component's own label */
+  color:#e5e7eb !important;
 }
-/* Added: dropdown arrow color for some UIs */
-select { background-image: linear-gradient(45deg, #f9fafb 50%, transparent 50%), linear-gradient(135deg, #f9fafb 50%, transparent 50%); background-position: right 16px top 14px, right 12px top 14px; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
-"""
 
+/* Sliders: keep labels visible */
+.gradio-container .range-block label,
+.gradio-container .gr-slider label {
+  color:#e5e7eb !important;
+}
+"""
 
 # --------------------- UI ---------------------
 with gr.Blocks(theme=THEME, css=CUSTOM_CSS, title="EN → HI/TE Translator") as demo:
@@ -218,8 +233,10 @@ with gr.Blocks(theme=THEME, css=CUSTOM_CSS, title="EN → HI/TE Translator") as
         gr.Markdown("<p>IndicTrans2 with batch sentence decomposition</p>")
 
     model_choice = gr.Dropdown(
-        label="Choose Model", choices=list(MODELS.keys()),
-        value="Default (Public)"
+        label="Choose Model",
+        choices=list(MODELS.keys()),
+        value="Default (Public)",
+        elem_id="model_dd"          # <-- for targeted styling
     )
 
     with gr.Row():