/* Gold Desk — XAU/USD dashboard styles * * Builds on Bootstrap 5.3 color modes (data-bs-theme). Only app-specific * tokens and components live here; layout, typography, tables, badges, * cards, alerts, modals, etc. come from Bootstrap. */ :root { --xau-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; --xau-font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Consolas, Menlo, monospace; } html, body { font-family: var(--xau-font-sans); letter-spacing: -0.005em; -webkit-font-smoothing: antialiased; } .num, .xau-price, .xau-symbol { font-family: var(--xau-font-mono); font-variant-numeric: tabular-nums; } .xau-symbol { font-size: 0.95rem; font-weight: 700; letter-spacing: 0.08em; color: var(--bs-primary); } .xau-price { line-height: 1; color: var(--bs-primary-text-emphasis); } .live-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--bs-success); margin-right: 5px; animation: pulse 2.4s ease-in-out infinite; } .live-dot.closed { background: var(--bs-warning); animation: none; } @keyframes pulse { 50% { opacity: 0.35; } } /* signal-coloured accents */ .sig-buy { --xau-signal: var(--bs-success); } .sig-sell { --xau-signal: var(--bs-danger); } .sig-neutral { --xau-signal: var(--bs-secondary); } .border-signal { border-left: 3px solid var(--xau-signal, var(--bs-secondary)) !important; } .text-signal { color: var(--xau-signal, var(--bs-secondary)) !important; } /* timeframe cards */ .tf-card { cursor: pointer; transition: border-color 0.15s ease, box-shadow 0.15s ease; } .tf-card:hover, .tf-card:focus-visible { border-color: var(--bs-primary); box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.15); } .tf-name { font-family: var(--xau-font-mono); font-weight: 700; font-size: 1.1rem; color: var(--bs-primary); letter-spacing: 0.05em; } /* score bar: zero-centered diverging with midpoint tick */ .scorebar { display: flex; align-items: center; gap: 0.75rem; } .scorebar .track { position: relative; flex: 1; height: 9px; border-radius: 5px; background: var(--bs-secondary-bg); overflow: hidden; } .scorebar .track::after { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; background: var(--bs-secondary); transform: translateX(-1px); } .scorebar .fill { position: absolute; top: 0; bottom: 0; border-radius: 4px; transition: width 0.5s ease; } .scorebar .fill.pos { left: 50%; background: var(--bs-success); } .scorebar .fill.neg { right: 50%; background: var(--bs-danger); } .scorebar .val { width: 58px; text-align: right; font-size: 0.95rem; font-weight: 500; } .scorebar .lbl { font-size: 0.8rem; color: var(--bs-secondary); width: 44px; } /* rail chips in hero */ .rail-chip { cursor: pointer; font-family: var(--xau-font-mono); font-size: 0.9rem; } .rail-chip:hover { border-color: var(--bs-primary) !important; } /* detail dialog sections */ .d-stat .k { display: block; font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--bs-secondary); font-weight: 600; } .d-stat .v { font-size: 1.15rem; font-weight: 600; } .d-table { font-size: 0.9rem; } .d-table .ind-k { font-family: var(--xau-font-mono); font-weight: 600; white-space: nowrap; } .wbar { display: block; height: 4px; border-radius: 2px; background: var(--bs-secondary-bg); margin-top: 3px; } .wbar > i { display: block; height: 100%; border-radius: 2px; background: var(--bs-primary); } /* news */ .wire-item { cursor: pointer; border-radius: var(--bs-border-radius); } .wire-item:hover { background: rgba(var(--bs-primary-rgb), 0.08); } .wire-score { font-family: var(--xau-font-mono); font-size: 0.85rem; font-weight: 700; padding: 2px 7px; border-radius: 5px; white-space: nowrap; } /* calendar highlight for next upcoming event */ .cal-next-up td:first-child { box-shadow: inset 4px 0 0 var(--bs-primary); padding-left: 0.75rem !important; } /* reduced motion */ @media (prefers-reduced-motion: reduce) { .live-dot { animation: none; } .scorebar .fill { transition: none; } * { transition: none !important; } }