/* Shared styles for BitFlinger website with light/dark theme support */ :root { --bg: #fbfcfc; --text: #212529; --muted: #6c757d; --footer-bg: #e9ecef; --footer-text: #495057; --link: #0d6efd; } /* Default to OS preference if no manual override is set */ @media (prefers-color-scheme: dark) { :root { --bg: #0f0e23; --text: #e6e6e6; --muted: #a0a7b1; --footer-bg: #1a1d23; --footer-text: #cbd3dc; --link: #6ea8fe; } } /* Manual light mode override using .light on or */ .light { --bg: #fbfcfc; --text: #212529; --muted: #6c757d; --footer-bg: #e9ecef; --footer-text: #495057; --link: #0d6efd; } /* Manual dark mode override using .dark on or */ .dark { --bg: #0f0e23; --text: #e6e6e6; --muted: #a0a7b1; --footer-bg: #1a1d23; --footer-text: #cbd3dc; --link: #6ea8fe; } /* Base page layout */ body { font-family: 'Poppins', sans-serif; background-color: var(--bg); color: var(--text); display: flex; flex-direction: column; min-height: 100vh; } .main-content { flex: 1; } /* Logo */ .logo { max-width: 100%; height: auto; } /* Smaller logo used on policy pages can use .logo-sm */ .logo-sm { max-width: 200px; height: auto; } h1 { font-weight: 600; } h2 { font-weight: 600; color: var(--text); margin-top: 2rem; margin-bottom: 1rem; } /* Platforms text on home page */ .platforms { font-size: 1.1rem; font-weight: 300; color: var(--muted); } /* Footer */ footer { background-color: var(--footer-bg); color: var(--footer-text); font-size: 0.9rem; } footer a { color: var(--link); text-decoration: none; } footer a:hover { text-decoration: underline; } /* Policy page helpers */ .policy-content { text-align: left; max-width: 800px; margin: 0 auto; } .effective-date { font-size: 0.9rem; color: var(--muted); font-style: italic; } .back-link { margin-bottom: 2rem; } .back-link a { color: var(--link); text-decoration: none; font-weight: 400; } .back-link a:hover { text-decoration: underline; } /* Theme toggle styles */ .theme-toggle { border: 1px solid transparent; border-radius: .375rem; padding: .375rem .75rem; background: transparent; color: var(--footer-text); } .theme-toggle:hover { background-color: rgba(0, 0, 0, 0.05); } .dark .theme-toggle:hover { background-color: rgba(255, 255, 255, 0.08); } /* Utility: center container padding is from Bootstrap; keep compatibility */