/* Import Geist font */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* Use Inter font family across the app */
body {
    font-family: 'Inter', sans-serif;
    color: #111;
}

/* Geist Color Scheme */
:root {
    --geist-foreground: #111;
    --geist-background: #fff;
    --geist-primary: #0070f3;
    --geist-secondary: #666;
    --geist-success: #0070f3;
    --geist-error: #e00;
    --geist-warning: #f5a623;
    --geist-cyan: #50e3c2;
    --geist-violet: #7928ca;
}

/* Style the Gradio container to match Geist's light theme */
.gradio-container {
    background-color: var(--geist-background);
    color: var(--geist-foreground);
    padding: 20px;
}

/* Button styling to match Geist */
button, input, textarea, select {
    font-family: 'Inter', sans-serif;
    color: var(--geist-foreground);
    border: 1px solid var(--geist-secondary);
    padding: 8px 12px;
    border-radius: 4px;
    transition: border-color 0.2s;
}

button:hover {
    border-color: var(--geist-primary);
    color: var(--geist-primary);
}

.gr-button {
    background-color: var(--geist-primary);
    color: white;
    border: none;
}

.gr-button:hover {
    background-color: #005bb5;
}

/* Dashboard box styling */
.dashboard-box {
    border: 1px solid #ddd;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 5px;
    background-color: #f9f9f9;
}

.dashboard-icon {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin-right: 8px;
}