diff --git a/web/static/themes/dawn.css b/web/static/themes/dawn.css index 93b2f52..4f50715 100644 --- a/web/static/themes/dawn.css +++ b/web/static/themes/dawn.css @@ -1,17 +1,63 @@ -/* Dawn: light, low-glare */ +/* =============================== + Theme: Dawn (bolder sunrise look) + =============================== */ + :root { - --bg: #f3f6f7; - --bg-elev: #ffffff; - --text: #1f2a36; - --muted: #64748b; + --bg: #fef9f6; /* very light warm base */ --card: #ffffff; - --border: #d7dee6; - --accent: #2f6cab; /* keep your brand blue */ - --accent-contrast: #ffffff; - --accent-soft: rgba(47,108,171,.12); - --success: #2da46f; - --warning: #c78b2b; - --danger: #c74c5f; - --shadow: 0 6px 20px rgba(31,42,54,.07); - --radius: 14px; + --ink: #2c2c2c; /* dark gray text */ + --ink-muted: #6b7280; /* muted gray */ + + --border: #e0d9d5; + + --brand: #e67e5c; /* warm orange */ + --brand-800: #c45d3d; /* darker orange/red */ + + --danger: #c53030; + + --btn-bg: #ffffff; + --btn-border: #e5dedb; + --btn-hover: #f9ece6; +} + +/* ----- Background gradient ----- */ +html[data-theme="dawn"] body { + min-height: 100vh; + background: linear-gradient( + 135deg, + #ffd9a0 0%, /* sunrise peach */ + #ffb6b9 40%, /* rosy pink */ + #a3d5ff 100% /* clear sky blue */ + ); + background-attachment: fixed; + color: var(--ink); +} + +/* Keep cards floating nicely */ +html[data-theme="dawn"] .card, +html[data-theme="dawn"] .result-card, +html[data-theme="dawn"] .search-form, +html[data-theme="dawn"] .form-card { + background: var(--card); + border: 1px solid var(--border); + box-shadow: 0 8px 24px rgba(0,0,0,.06); +} + +/* Translucent topbar over gradient */ +html[data-theme="dawn"] .topbar-wrap { + background: rgba(255, 255, 255, 0.85); + backdrop-filter: blur(6px); + -webkit-backdrop-filter: blur(6px); + border-bottom: 1px solid rgba(229,231,235,.8); +} + +/* Buttons */ +html[data-theme="dawn"] .btn-primary { + background: var(--brand); + border-color: var(--brand); + color: #fff; +} +html[data-theme="dawn"] .btn-primary:hover { + background: var(--brand-800); + border-color: var(--brand-800); } \ No newline at end of file