app 7

app.py

@@ -997,7 +997,7 @@ h4 {
 }
 
 /* =====================================================
-   LABELS / TEXT
+   LABELS / TEXT — GLOBAL
 ===================================================== */
 label, .gr-label span, p, li {
     font-family: 'Rajdhani', sans-serif !important;
@@ -1007,16 +1007,100 @@ label, .gr-label span, p, li {
     letter-spacing: 1px !important;
 }
 
-/* Gradio component labels */
-.svelte-1ipelgc, span.svelte-1ipelgc,
-div[class*="label"] > span,
-.block > label > span {
-    color: var(--neon-cyan) !important;
+/* =====================================================
+   GRADIO COMPONENT LABELS (Video Input, Transcribed Speech etc.)
+   Target every possible selector Gradio uses across versions
+===================================================== */
+
+/* The label text above each component */
+label > span,
+label span,
+.block label span,
+.block > label > span,
+fieldset > span,
+fieldset span,
+div[class*="label"] span,
+span[data-testid*="label"],
+.wrap > span,
+span.svelte-1ipelgc,
+.svelte-1ipelgc,
+/* catch-all: any span that is a direct child of a label */
+label > span:first-child {
+    color: #00f5ff !important;
     font-family: 'Share Tech Mono', monospace !important;
-    font-size: 12px !important;
-    letter-spacing: 2px !important;
+    font-size: 11px !important;
+    font-weight: 600 !important;
+    letter-spacing: 2.5px !important;
+    text-transform: uppercase !important;
+    opacity: 1 !important;
+    visibility: visible !important;
+    display: inline-block !important;
+}
+
+/* Gradio wraps Video label differently — target via data-testid */
+div[data-testid="video"] label span,
+div[data-testid="video"] > div > label > span,
+div[data-testid="textbox"] label span,
+div[data-testid="textbox"] > div > label > span,
+div[data-testid="label"] label span,
+div[data-testid="label"] > div > label > span {
+    color: #00f5ff !important;
+    font-family: 'Share Tech Mono', monospace !important;
+    font-size: 11px !important;
+    letter-spacing: 2.5px !important;
     text-transform: uppercase !important;
     opacity: 1 !important;
+    visibility: visible !important;
+}
+
+/* =====================================================
+   TEXTAREA / TEXTBOX CONTENT TEXT
+===================================================== */
+textarea,
+div[data-testid="textbox"] textarea,
+div[data-testid="textbox"] input {
+    font-family: 'Share Tech Mono', monospace !important;
+    font-size: 13px !important;
+    background: #071828 !important;
+    border: 1px solid rgba(0, 245, 255, 0.3) !important;
+    border-radius: 4px !important;
+    color: #cff4ff !important;
+    caret-color: #00f5ff !important;
+    transition: all 0.3s !important;
+    letter-spacing: 0.5px !important;
+    line-height: 1.7 !important;
+    opacity: 1 !important;
+    visibility: visible !important;
+    -webkit-text-fill-color: #cff4ff !important;
+}
+
+textarea:focus,
+div[data-testid="textbox"] textarea:focus {
+    border-color: #00f5ff !important;
+    box-shadow: 0 0 15px rgba(0, 245, 255, 0.2), inset 0 0 10px rgba(0, 245, 255, 0.03) !important;
+    outline: none !important;
+}
+
+textarea::placeholder,
+div[data-testid="textbox"] textarea::placeholder {
+    color: rgba(0, 200, 220, 0.35) !important;
+    -webkit-text-fill-color: rgba(0, 200, 220, 0.35) !important;
+    font-style: italic !important;
+}
+
+/* The outer textbox wrapper */
+div[data-testid="textbox"] {
+    background: transparent !important;
+}
+
+div[data-testid="textbox"] > label {
+    background: transparent !important;
+}
+
+div[data-testid="textbox"] > label > textarea {
+    background: #071828 !important;
+    color: #cff4ff !important;
+    -webkit-text-fill-color: #cff4ff !important;
 }
 
 /* =====================================================
@@ -1130,32 +1214,36 @@ button[aria-selected="true"] {
 }
 
 /* =====================================================
-   INPUT / TEXTAREA
+   INPUT / TEXTAREA (fallback for non-testid elements)
 ===================================================== */
 textarea,
 input[type="text"],
-input {
+input[type="search"],
+input:not([type="range"]) {
     font-family: 'Share Tech Mono', monospace !important;
     font-size: 13px !important;
-    background: #071020 !important;
-    border: 1px solid rgba(0, 245, 255, 0.25) !important;
-    border-radius: 3px !important;
+    background: #071828 !important;
+    border: 1px solid rgba(0, 245, 255, 0.3) !important;
+    border-radius: 4px !important;
     color: #cff4ff !important;
+    -webkit-text-fill-color: #cff4ff !important;
     transition: all 0.3s !important;
     letter-spacing: 0.5px !important;
+    line-height: 1.7 !important;
 }
 
 textarea:focus,
 input:focus {
-    border-color: var(--neon-cyan) !important;
-    box-shadow: 0 0 15px rgba(0, 245, 255, 0.25) !important;
+    border-color: #00f5ff !important;
+    box-shadow: 0 0 15px rgba(0, 245, 255, 0.2) !important;
     outline: none !important;
 }
 
-/* placeholder */
 textarea::placeholder,
 input::placeholder {
-    color: rgba(127, 184, 204, 0.45) !important;
+    color: rgba(0, 200, 220, 0.35) !important;
+    -webkit-text-fill-color: rgba(0, 200, 220, 0.35) !important;
+    font-style: italic !important;
 }
 
 /* =====================================================
@@ -1169,6 +1257,33 @@ video {
         inset 0 0 30px rgba(0, 0, 0, 0.5) !important;
 }
 
+/* "Video Input" label text */
+div[data-testid="video"] > div > label > span,
+div[data-testid="video"] label span,
+div[data-testid="video"] span {
+    color: #00f5ff !important;
+    font-family: 'Share Tech Mono', monospace !important;
+    font-size: 11px !important;
+    letter-spacing: 2.5px !important;
+    text-transform: uppercase !important;
+    opacity: 1 !important;
+    -webkit-text-fill-color: #00f5ff !important;
+}
+
+/* "Click to Access Webcam" / "Drop Video Here" upload text */
+div[data-testid="video"] .wrap span,
+div[data-testid="video"] [class*="wrap"] span,
+div[data-testid="video"] p,
+div[data-testid="video"] [class*="upload"] span,
+div[data-testid="video"] [class*="upload"] p {
+    color: #7bc8d8 !important;
+    font-family: 'Share Tech Mono', monospace !important;
+    font-size: 12px !important;
+    letter-spacing: 1.5px !important;
+    -webkit-text-fill-color: #7bc8d8 !important;
+    opacity: 1 !important;
+}
+
 /* Upload zone */
 .upload-zone,
 div[class*="upload"] {