File size: 3,539 Bytes
f8ea28e
5bdb76d
f8ea28e
db9046a
f8ea28e
e409238
 
f8ea28e
 
 
 
db9046a
5bdb76d
 
 
 
 
db9046a
f8ea28e
e409238
5bdb76d
e409238
 
5bdb76d
 
f8ea28e
db9046a
f8ea28e
e409238
5bdb76d
f8ea28e
db9046a
e409238
 
 
5bdb76d
e409238
5bdb76d
f8ea28e
db9046a
e409238
 
 
5bdb76d
e409238
f8ea28e
db9046a
f8ea28e
e409238
f8ea28e
5bdb76d
f8ea28e
db9046a
e409238
 
 
 
f8ea28e
5bdb76d
 
 
 
f8ea28e
e409238
5bdb76d
f8ea28e
db9046a
e409238
 
 
5bdb76d
e409238
f8ea28e
db9046a
f8ea28e
e409238
 
f8ea28e
 
5bdb76d
 
f8ea28e
e409238
f8ea28e
 
 
db9046a
f8ea28e
e409238
 
5bdb76d
f8ea28e
db9046a
f8ea28e
e409238
f8ea28e
 
db9046a
f8ea28e
e409238
 
5559b34
e920d51
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
body, .gradio-container {
    font-family: 'Inter', 'Segoe UI', Arial, sans-serif !important;
}

#header, h1, .gradio-container h1 {
    color: #d72660 !important; /* Deep Pink */
    text-shadow: 0 2px 10px #f9a8d4cc;
    letter-spacing: 2px;
    font-size: 2.2rem !important;
    font-weight: 900 !important;
}

.markdown, .gr-markdown-content {
    background: none !important;
    font-size: 1.05em;
    border-radius: 1.2em !important;
}

.gr-block, .gr-box, .gradio-container .gr-panel, .gradio-container .gr-form {
    background: #fdf2f8 !important; /* Pink 50 */
    border-radius: 1.5em !important;
    box-shadow: 0 2px 12px #fbcfe888;
    border: 1.5px solid #fbcfe8 !important; /* Pink 200 */
    padding: 1em 1.3em !important;
    transition: box-shadow 0.16s, transform 0.16s;
}

.gr-block:hover, .gr-box:hover, .gradio-container .gr-panel:hover, .gradio-container .gr-form:hover {
    box-shadow: 0 8px 28px #f9a8d4bb;
    transform: translateY(-2px) scale(1.01);
}

.gr-file, .gr-textbox, .gradio-container .gr-input, .gradio-container input[type="text"], .gradio-container input[type="number"] {
    background: #fce7f3 !important; /* Pink 100 */
    border: 1.5px solid #f472b6 !important; /* Pink 400 */
    border-radius: 1em !important;
    color: #831843 !important; /* Pink 900 */
    transition: border 0.14s, box-shadow 0.14s;
}

.gr-file:focus-within, .gr-textbox:focus-within, .gradio-container .gr-input:focus-within, .gradio-container input[type="text"]:focus, .gradio-container input[type="number"]:focus {
    border: 1.5px solid #db2777 !important; /* Pink 600 */
    box-shadow: 0 0 0 3px #f9a8d4aa;
    background: #fff !important;
    color: #db2777 !important;
}

.gradio-container label, .gradio-container .label, .gradio-container .gr-label {
    color: #ec4899 !important; /* Pink 500 */
    font-weight: 700 !important;
    font-size: 1.08em !important;
}

/* Scoped to not break Gradio 6 tiny icons */
.button-row button, .button-row .gr-button {
    background: linear-gradient(90deg, #f472b6, #db2777 90%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 2em !important;
    font-size: 1.1em !important;
    padding: 0.7em 2.1em !important;
    font-weight: 800;
    letter-spacing: 1px;
    box-shadow: 0 2px 12px #fbcfe833;
    transition: transform 0.14s, box-shadow 0.14s, background 0.14s;
}

.button-row button:hover, .button-row .gr-button:hover {
    background: linear-gradient(93deg, #db2777, #f472b6 90%) !important;
    color: #ffffff !important;
    transform: scale(1.04);
    box-shadow: 0 5px 24px #f9a8d466;
}

input[type="file"]::file-selector-button {
    background: #fbcfe8 !important; /* Pink 200 */
    color: #831843 !important; /* Pink 900 */
    border: none;
    border-radius: 1em;
    padding: 0.5em 1.1em;
    font-weight: 700;
    font-size: 1em;
    box-shadow: 0 1px 8px #fbcfe833;
    margin-right: 0.8em;
    transition: background 0.18s, transform 0.18s;
}

input[type="file"]::file-selector-button:hover {
    background: #f9a8d4 !important; /* Pink 300 */
    color: #db2777 !important; /* Pink 600 */
    transform: scale(1.07);
}

.gr-output label, .gradio-container .gr-label {
    color: #ec4899 !important; /* Pink 500 */
    font-weight: 700 !important;
}

.gradio-container .gr-textbox[aria-disabled="true"], .gradio-container .gr-textbox[readonly] {
    background: #fdf2f8 !important; /* Pink 50 */
    color: #db2777 !important; /* Pink 600 */
    border: 1.5px solid #fbcfe8 !important; /* Pink 200 */ 
}