| custom_css = """ |
| .gr-button-primary { |
| background-color: #4B5EAA !important; |
| color: white !important; |
| font-size: 1.1em !important; |
| padding: 10px 20px !important; |
| border-radius: 8px !important; |
| } |
| .gr-button-primary:hover { |
| background-color: #6B7280 !important; |
| } |
| .gr-textbox { |
| border-radius: 8px !important; |
| background-color: #2D3748 !important; |
| color: white !important; |
| } |
| .gr-card { |
| background-color: #1A202C !important; |
| border-radius: 12px !important; |
| box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important; |
| padding: 20px !important; |
| } |
| .gr-markdown h1, .gr-markdown h2, .gr-markdown h3 { |
| color: #E2E8F0 !important; |
| } |
| .modal { |
| position: fixed; |
| top: 50%; |
| left: 50%; |
| transform: translate(-50%, -50%); |
| background-color: #1A202C; |
| border-radius: 12px; |
| padding: 20px; |
| box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3); |
| z-index: 1000; |
| max-width: 600px; |
| width: 90%; |
| } |
| .input-row { |
| margin-bottom: 10px; |
| } |
| .gr-blocks, .gr-app, .gr-container { |
| overflow: auto !important; |
| } |
| html, body, .gr-blocks, .gr-app, .gr-container { |
| height: auto !important; |
| min-height: 100vh !important; |
| max-height: none !important; |
| overflow-y: auto !important; |
| } |
| * { |
| overflow: visible !important; |
| } |
| """ |
|
|
