Delete style.css

style.css

@@ -1,360 +0,0 @@
-/* --- Target the Gradio app wrapper for backgrounds --- */
-gradio-app,
-.gradio-app,
-.main,
-#app,
-[data-testid="app"] {
-  background-color: #eaeefc !important;
-  background-image:
-    url('https://huggingface.co/spaces/ESCP/F2_Salary_Prediction_Model/resolve/main/background_top.png'),
-    url('https://huggingface.co/spaces/ESCP/F2_Salary_Prediction_Model/resolve/main/background_mid.png'),
-    url('https://huggingface.co/spaces/ESCP/F2_Salary_Prediction_Model/resolve/main/background_bottom.png') !important;
-  background-position:
-    top center,
-    0 440px,
-    bottom center !important;
-  background-repeat:
-    no-repeat,
-    repeat-y,
-    no-repeat !important;
-  background-size:
-    100% auto,
-    100% auto,
-    100% auto !important;
-  min-height: 100vh !important;
-}
-
-/* --- Fallback on html/body --- */
-html, body {
-  background-color: #eaeefc !important;
-  margin: 0 !important;
-  padding: 0 !important;
-  min-height: 100vh !important;
-}
-
-/* --- Main container --- */
-.gradio-container {
-  max-width: 100% !important;
-  width: 100% !important;
-  margin: 0 !important;
-  padding: 0 24px 150px 24px !important;
-  background: transparent !important;
-}
-
-/* --- Title in deep blue --- */
-#escp_title h1 {
-  color: #0d1b5e !important;
-  font-size: 3.2rem !important;
-  font-weight: 900 !important;
-  text-align: center !important;
-  margin: 0 0 10px 0 !important;
-  letter-spacing: -0.5px !important;
-  text-shadow: 0 2px 12px rgba(74,110,224,0.15) !important;
-}
-
-/* --- Subtitle in blue --- */
-#escp_title p, #escp_title em {
-  color: #3a4888 !important;
-  text-align: center !important;
-  font-size: 1.05rem !important;
-  font-weight: 500 !important;
-}
-
-/* --- Tab bar background --- */
-.tabs > .tab-nav,
-.tab-nav,
-div[role="tablist"],
-.svelte-tabs > .tab-nav {
-  background: rgba(26,40,104,0.75) !important;
-  border-radius: 10px 10px 0 0 !important;
-  padding: 4px !important;
-  backdrop-filter: blur(8px) !important;
-}
-
-/* --- ALL tab buttons: bigger, bolder --- */
-.tabs > .tab-nav button,
-.tab-nav button,
-div[role="tablist"] button,
-button[role="tab"],
-.svelte-tabs button,
-.tab-nav > button,
-.tabs button {
-  color: #ffffff !important;
-  font-weight: 700 !important;
-  font-size: 1rem !important;
-  border: none !important;
-  background: transparent !important;
-  padding: 14px 28px !important;
-  border-radius: 8px 8px 0 0 !important;
-  opacity: 1 !important;
-  letter-spacing: 0.3px !important;
-}
-
-/* --- Selected tab: ESCP gold --- */
-.tabs > .tab-nav button.selected,
-.tab-nav button.selected,
-button[role="tab"][aria-selected="true"],
-button[role="tab"].selected,
-div[role="tablist"] button[aria-selected="true"],
-.svelte-tabs button.selected {
-  color: rgb(242,198,55) !important;
-  background: rgba(255,255,255,0.15) !important;
-}
-
-/* --- Unselected tabs: ensure visibility --- */
-.tabs > .tab-nav button:not(.selected),
-.tab-nav button:not(.selected),
-button[role="tab"][aria-selected="false"],
-button[role="tab"]:not(.selected),
-div[role="tablist"] button:not([aria-selected="true"]) {
-  color: #ffffff !important;
-  opacity: 1 !important;
-}
-
-/* --- White card panels --- */
-.gradio-container .gr-block,
-.gradio-container .gr-box,
-.gradio-container .gr-panel,
-.gradio-container .gr-group {
-  background: #ffffff !important;
-  border-radius: 10px !important;
-}
-
-/* --- Tab content area --- */
-.tabitem {
-  background: rgba(255,255,255,0.96) !important;
-  border-radius: 0 0 10px 10px !important;
-  padding: 16px !important;
-}
-
-/* --- Inputs --- */
-.gradio-container input,
-.gradio-container textarea,
-.gradio-container select {
-  background: #ffffff !important;
-  border: 1px solid #d1d5db !important;
-  border-radius: 8px !important;
-}
-
-/* --- Buttons: ESCP purple primary --- */
-.gradio-container button:not([role="tab"]) {
-  font-weight: 600 !important;
-  padding: 10px 16px !important;
-  border-radius: 10px !important;
-}
-
-button.primary {
-  background-color: rgb(40,9,109) !important;
-  color: #ffffff !important;
-  border: none !important;
-}
-
-button.primary:hover {
-  background-color: rgb(60,20,140) !important;
-}
-
-button.secondary {
-  background-color: #ffffff !important;
-  color: rgb(40,9,109) !important;
-  border: 2px solid rgb(40,9,109) !important;
-}
-
-button.secondary:hover {
-  background-color: rgb(240,238,250) !important;
-}
-
-/* --- Dataframes --- */
-[data-testid="dataframe"] {
-  background-color: #ffffff !important;
-  border-radius: 10px !important;
-}
-
-table {
-  font-size: 0.85rem !important;
-}
-
-/* --- Chatbot --- */
-.gr-chatbot {
-  min-height: 380px !important;
-  background-color: #ffffff !important;
-  border-radius: 12px !important;
-}
-
-.gr-chatbot .message.user {
-  background-color: rgb(232,225,250) !important;
-  border-radius: 12px !important;
-}
-
-.gr-chatbot .message.bot {
-  background-color: #f3f4f6 !important;
-  border-radius: 12px !important;
-}
-
-/* --- Gallery --- */
-.gallery {
-  background: #ffffff !important;
-  border-radius: 10px !important;
-}
-
-/* --- Log textbox --- */
-textarea {
-  font-family: monospace !important;
-  font-size: 0.8rem !important;
-}
-
-/* --- Markdown headings inside tabs --- */
-.tabitem h3 {
-  color: rgb(40,9,109) !important;
-  font-weight: 700 !important;
-}
-
-.tabitem h4 {
-  color: #374151 !important;
-}
-
-/* --- Examples row --- */
-.examples-row button {
-  background: rgb(240,238,250) !important;
-  color: rgb(40,9,109) !important;
-  border: 1px solid rgb(40,9,109) !important;
-  border-radius: 8px !important;
-  font-size: 0.85rem !important;
-}
-
-.examples-row button:hover {
-  background: rgb(232,225,250) !important;
-}
-
-/* --- Header / footer: transparent over banner --- */
-header, header *,
-footer, footer * {
-  background: transparent !important;
-  box-shadow: none !important;
-}
-
-footer a, footer button,
-header a, header button {
-  background: transparent !important;
-  border: none !important;
-  box-shadow: none !important;
-}
-
-#footer, #footer *,
-[class*="footer"], [class*="footer"] *,
-[class*="chip"], [class*="pill"], [class*="chip"] *, [class*="pill"] * {
-  background: transparent !important;
-  border: none !important;
-  box-shadow: none !important;
-}
-
-section footer {
-  background: transparent !important;
-}
-
-section footer button,
-section footer a {
-  background: transparent !important;
-  background-color: transparent !important;
-  border: none !important;
-  box-shadow: none !important;
-  color: white !important;
-}
-
-section footer button,
-section footer button * {
-  background: transparent !important;
-  background-color: transparent !important;
-  background-image: none !important;
-  box-shadow: none !important;
-  filter: none !important;
-}
-
-section footer button::before,
-section footer button::after {
-  background: transparent !important;
-  background-color: transparent !important;
-  background-image: none !important;
-  box-shadow: none !important;
-  filter: none !important;
-}
-
-section footer a,
-section footer a * {
-  background: transparent !important;
-  background-color: transparent !important;
-  box-shadow: none !important;
-}
-
-.gradio-container footer button,
-.gradio-container footer button *,
-.gradio-container .footer button,
-.gradio-container .footer button * {
-  background: transparent !important;
-  background-color: transparent !important;
-  background-image: none !important;
-  box-shadow: none !important;
-}
-
-.gradio-container footer button::before,
-.gradio-container footer button::after,
-.gradio-container .footer button::before,
-.gradio-container .footer button::after {
-  background: transparent !important;
-  background-color: transparent !important;
-  background-image: none !important;
-  box-shadow: none !important;
-}
-
-/* --- Blue slider thumbs & tracks --- */
-input[type="range"] {
-  accent-color: #2a4fd4 !important;
-}
-input[type="range"]::-webkit-slider-thumb {
-  background: #2a4fd4 !important;
-  border: 2px solid #ffffff !important;
-  box-shadow: 0 0 0 3px rgba(42,79,212,0.2) !important;
-}
-input[type="range"]::-moz-range-thumb {
-  background: #2a4fd4 !important;
-  border: 2px solid #ffffff !important;
-}
-input[type="range"]::-webkit-slider-runnable-track {
-  background: linear-gradient(to right, #2a4fd4, #6a8ef8) !important;
-}
-
-/* --- Bigger section headings inside tabs --- */
-.tabitem h3 {
-  color: #0d1b5e !important;
-  font-weight: 800 !important;
-  font-size: 1.25rem !important;
-}
-.tabitem h4 {
-  color: #1a2868 !important;
-  font-weight: 700 !important;
-  font-size: 1.05rem !important;
-}
-
-/* --- Bold markdown content headings --- */
-.tabitem p strong,
-.tabitem label {
-  font-weight: 700 !important;
-  color: #1a2868 !important;
-}
-
-/* --- Primary button bigger --- */
-button.primary,
-.gradio-container button.primary {
-  background-color: #1a2868 !important;
-  color: #ffffff !important;
-  font-size: 1.05rem !important;
-  padding: 14px 24px !important;
-  border-radius: 12px !important;
-  font-weight: 700 !important;
-  letter-spacing: 0.3px !important;
-  box-shadow: 0 4px 14px rgba(26,40,104,0.25) !important;
-}
-button.primary:hover,
-.gradio-container button.primary:hover {
-  background-color: #2a3d8e !important;
-  box-shadow: 0 6px 20px rgba(26,40,104,0.35) !important;
-}