/* Dynamic CSS from Site Settings */
:root {
    --color-primary: #408080;
    --color-secondary: #f3f4f6;
    --color-accent: #f59e0b;
    --font-family: Inter, sans-serif;
}

body {
    font-family: var(--font-family), system-ui, sans-serif;
}

.bg-primary {
    background-color: var(--color-primary) !important;
}

.text-primary {
    color: var(--color-primary) !important;
}

.border-primary {
    border-color: var(--color-primary) !important;
}

.bg-secondary {
    background-color: var(--color-secondary) !important;
}

.text-secondary {
    color: var(--color-secondary) !important;
}

.bg-accent {
    background-color: var(--color-accent) !important;
}

.text-accent {
    color: var(--color-accent) !important;
}

.hover\:bg-primary:hover {
    background-color: var(--color-primary) !important;
}

.hover\:text-primary:hover {
    color: var(--color-primary) !important;
}

.focus\:ring-primary:focus {
    --tw-ring-color: var(--color-primary) !important;
}

.focus\:border-primary:focus {
    border-color: var(--color-primary) !important;
}

/* Gradient backgrounds using dynamic colors */
.from-primary {
    --tw-gradient-from: var(--color-primary) !important;
}

.to-accent {
    --tw-gradient-to: var(--color-accent) !important;
}