/* ============================================================ PUREWAGER REWARDS — TEAM THEME ENGINE Maryland Sports Teams & Universities ============================================================ Each theme overrides the CSS custom properties defined in style.css via a [data-theme="..."] attribute on . ============================================================ */ /* ── DEFAULT (PureWager Gold) ──────────────────────────────── */ [data-theme="purewager"], :root { --pw-primary: #E8B84B; /* PW Gold */ --pw-primary-lt: #F5D07A; --pw-primary-dk: #C49A30; --pw-accent: #F4602A; --pw-bg: #0A1628; --pw-bg-mid: #0F2044; --pw-bg-card: #122550; --pw-bg-light: #1A3060; --pw-text: #E8EDF5; --pw-text-muted: #8AA0C0; --pw-border-col: rgba(232,184,75,0.18); --pw-glow: rgba(232,184,75,0.25); --pw-nav-bg: rgba(10,22,40,0.96); --pw-hero-grad: linear-gradient(135deg,#122550 0%,#1A3060 50%,#1A2E5E 100%); --pw-splash-grad: linear-gradient(160deg,#0A1628 0%,#0F2044 50%,#1a0a00 100%); --pw-btn-text: #0A1628; } /* ── BALTIMORE ORIOLES ─────────────────────────────────────── */ /* Orange: #DF4601 Black: #000000 White: #FFFFFF */ [data-theme="orioles"] { --pw-primary: #DF4601; --pw-primary-lt: #FF6B2B; --pw-primary-dk: #B83700; --pw-accent: #F5A623; --pw-bg: #0D0D0D; --pw-bg-mid: #1A0800; --pw-bg-card: #1E0A00; --pw-bg-light: #2E1200; --pw-text: #F5EDE8; --pw-text-muted: #9A7060; --pw-border-col: rgba(223,70,1,0.22); --pw-glow: rgba(223,70,1,0.28); --pw-nav-bg: rgba(13,8,3,0.96); --pw-hero-grad: linear-gradient(135deg,#1E0A00 0%,#2E1200 50%,#3A1600 100%); --pw-splash-grad: linear-gradient(160deg,#0D0D0D 0%,#1A0800 50%,#2E1000 100%); --pw-btn-text: #ffffff; } /* ── BALTIMORE RAVENS ──────────────────────────────────────── */ /* Purple: #241773 Gold: #9E7C0C Black: #000000 */ [data-theme="ravens"] { --pw-primary: #C9A84C; --pw-primary-lt: #E0C060; --pw-primary-dk: #9E7C0C; --pw-accent: #9B59B6; --pw-bg: #0A0618; --pw-bg-mid: #120D2E; --pw-bg-card: #1A1040; --pw-bg-light: #241773; --pw-text: #EDE8F5; --pw-text-muted: #8070A8; --pw-border-col: rgba(201,168,76,0.20); --pw-glow: rgba(201,168,76,0.28); --pw-nav-bg: rgba(10,6,24,0.96); --pw-hero-grad: linear-gradient(135deg,#1A1040 0%,#241773 50%,#2E1E88 100%); --pw-splash-grad: linear-gradient(160deg,#0A0618 0%,#120D2E 50%,#1A1040 100%); --pw-btn-text: #0A0618; } /* ── MARYLAND TERRAPINS (UMD) ──────────────────────────────── */ /* Red: #E03A3E Gold: #FFD520 Black: #000000 White: #FFFFFF */ [data-theme="terps"] { --pw-primary: #FFD520; --pw-primary-lt: #FFE55A; --pw-primary-dk: #D4AF00; --pw-accent: #E03A3E; --pw-bg: #0F0000; --pw-bg-mid: #1E0505; --pw-bg-card: #280808; --pw-bg-light: #3E0000; --pw-text: #F5EDED; --pw-text-muted: #A07070; --pw-border-col: rgba(255,213,32,0.20); --pw-glow: rgba(255,213,32,0.30); --pw-nav-bg: rgba(15,0,0,0.96); --pw-hero-grad: linear-gradient(135deg,#280808 0%,#3E0000 50%,#4A0000 100%); --pw-splash-grad: linear-gradient(160deg,#0F0000 0%,#1E0505 50%,#3E0000 100%); --pw-btn-text: #0F0000; } /* ── MORGAN STATE BEARS (HBCU) ─────────────────────────────── */ /* Blue: #0050A0 Orange: #F77F00 */ [data-theme="morgan"] { --pw-primary: #F77F00; --pw-primary-lt: #FF9F30; --pw-primary-dk: #CC6600; --pw-accent: #0070D0; --pw-bg: #001830; --pw-bg-mid: #002040; --pw-bg-card: #002850; --pw-bg-light: #003570; --pw-text: #EEF4FF; --pw-text-muted: #6090B8; --pw-border-col: rgba(247,127,0,0.22); --pw-glow: rgba(247,127,0,0.28); --pw-nav-bg: rgba(0,24,48,0.96); --pw-hero-grad: linear-gradient(135deg,#002850 0%,#003570 50%,#0050A0 100%); --pw-splash-grad: linear-gradient(160deg,#001830 0%,#002040 50%,#002850 100%); --pw-btn-text: #001830; } /* ── WASHINGTON CAPITALS (NHL) ─────────────────────────────── */ /* Red: #C8102E Navy: #041E42 White: #FFFFFF */ [data-theme="capitals"] { --pw-primary: #C8102E; --pw-primary-lt: #E83050; --pw-primary-dk: #A00020; --pw-accent: #4A9FFF; --pw-bg: #010A18; --pw-bg-mid: #041E42; --pw-bg-card: #062858; --pw-bg-light: #0A3570; --pw-text: #EDF2FF; --pw-text-muted: #6888B0; --pw-border-col: rgba(200,16,46,0.22); --pw-glow: rgba(200,16,46,0.28); --pw-nav-bg: rgba(1,10,24,0.96); --pw-hero-grad: linear-gradient(135deg,#062858 0%,#0A3570 50%,#0A3A80 100%); --pw-splash-grad: linear-gradient(160deg,#010A18 0%,#041E42 50%,#062858 100%); --pw-btn-text: #ffffff; } /* ── WASHINGTON COMMANDERS (NFL) ───────────────────────────── */ /* Burgundy: #5A1414 Gold: #FFB612 Navy: #003594 */ [data-theme="commanders"] { --pw-primary: #FFB612; --pw-primary-lt: #FFD050; --pw-primary-dk: #CC8E00; --pw-accent: #8B1E1E; --pw-bg: #1A0808; --pw-bg-mid: #2A0E0E; --pw-bg-card: #3C1212; --pw-bg-light: #5A1414; --pw-text: #FFF5EC; --pw-text-muted: #A07868; --pw-border-col: rgba(255,182,18,0.20); --pw-glow: rgba(255,182,18,0.30); --pw-nav-bg: rgba(26,8,8,0.96); --pw-hero-grad: linear-gradient(135deg,#3C1212 0%,#5A1414 50%,#6E1818 100%); --pw-splash-grad: linear-gradient(160deg,#1A0808 0%,#2A0E0E 50%,#3C1212 100%); --pw-btn-text: #1A0808; } /* ── LOYOLA MARYLAND GREYHOUNDS ────────────────────────────── */ /* Green: #006341 Grey: #A2AAAD */ [data-theme="loyola"] { --pw-primary: #00A86B; --pw-primary-lt: #00CC88; --pw-primary-dk: #006341; --pw-accent: #B0BEC5; --pw-bg: #001A0F; --pw-bg-mid: #002A18; --pw-bg-card: #003820; --pw-bg-light: #004A2C; --pw-text: #E8F5EE; --pw-text-muted: #5A9070; --pw-border-col: rgba(0,168,107,0.22); --pw-glow: rgba(0,168,107,0.28); --pw-nav-bg: rgba(0,26,15,0.96); --pw-hero-grad: linear-gradient(135deg,#003820 0%,#004A2C 50%,#006341 100%); --pw-splash-grad: linear-gradient(160deg,#001A0F 0%,#002A18 50%,#003820 100%); --pw-btn-text: #001A0F; } /* ── TOWSON TIGERS ─────────────────────────────────────────── */ /* Gold: #F0AB00 Black: #000000 */ [data-theme="towson"] { --pw-primary: #F0AB00; --pw-primary-lt: #FFCC30; --pw-primary-dk: #C08800; --pw-accent: #FF8C00; --pw-bg: #0D0900; --pw-bg-mid: #1A1200; --pw-bg-card: #261A00; --pw-bg-light: #352500; --pw-text: #FFF8E8; --pw-text-muted: #907850; --pw-border-col: rgba(240,171,0,0.22); --pw-glow: rgba(240,171,0,0.30); --pw-nav-bg: rgba(13,9,0,0.96); --pw-hero-grad: linear-gradient(135deg,#261A00 0%,#352500 50%,#403000 100%); --pw-splash-grad: linear-gradient(160deg,#0D0900 0%,#1A1200 50%,#261A00 100%); --pw-btn-text: #0D0900; } /* ── COPPIN STATE EAGLES (HBCU) ────────────────────────────── */ /* Blue: #003DA5 Gold: #B09A6C */ [data-theme="coppin"] { --pw-primary: #B09A6C; --pw-primary-lt: #D0BC90; --pw-primary-dk: #887850; --pw-accent: #3060C8; --pw-bg: #000B20; --pw-bg-mid: #001030; --pw-bg-card: #001840; --pw-bg-light: #003DA5; --pw-text: #E8F0FF; --pw-text-muted: #5878A8; --pw-border-col: rgba(176,154,108,0.22); --pw-glow: rgba(176,154,108,0.28); --pw-nav-bg: rgba(0,11,32,0.96); --pw-hero-grad: linear-gradient(135deg,#001840 0%,#003DA5 50%,#0040B0 100%); --pw-splash-grad: linear-gradient(160deg,#000B20 0%,#001030 50%,#001840 100%); --pw-btn-text: #000B20; } /* ============================================================ GLOBAL TOKEN APPLICATION All colors route through these mappings so every component updates automatically when a theme is switched. ============================================================ */ [data-theme] { --pw-gold: var(--pw-primary); --pw-gold-light: var(--pw-primary-lt); --pw-gold-dark: var(--pw-primary-dk); --pw-orange: var(--pw-accent); --pw-navy: var(--pw-bg); --pw-navy-mid: var(--pw-bg-mid); --pw-navy-card: var(--pw-bg-card); --pw-navy-light: var(--pw-bg-light); --pw-border: var(--pw-border-col); --shadow-gold: 0 4px 20px var(--pw-glow); } /* ── Per-theme gradient overrides ── */ [data-theme] .splash-bg { background: var(--pw-splash-grad); } [data-theme] .points-hero { background: var(--pw-hero-grad); } [data-theme] .bottom-nav { background: var(--pw-nav-bg); } [data-theme] .btn-primary { color: var(--pw-btn-text); } [data-theme] .user-avatar, [data-theme] .profile-avatar-lg { background: linear-gradient(135deg, var(--pw-primary), var(--pw-primary-dk)); color: var(--pw-btn-text); } [data-theme] .nav-center-icon { background: linear-gradient(135deg, var(--pw-primary), var(--pw-primary-dk)); } [data-theme] .nav-center-btn i { color: var(--pw-btn-text); } [data-theme] .tier-progress-fill { background: linear-gradient(90deg, var(--pw-primary), var(--pw-primary-lt)); } [data-theme] .redeem-btn-sm:not(.disabled) { background: var(--pw-primary); color: var(--pw-btn-text); } [data-theme] .pw-logo-icon { border-color: var(--pw-border-col); box-shadow: 0 8px 32px var(--pw-glow), inset 0 1px 0 rgba(255,255,255,0.05); } [data-theme] .qr-discount-badge { color: var(--pw-primary); text-shadow: 0 0 30px var(--pw-glow); } [data-theme] .qr-code-wrap { box-shadow: 0 8px 32px var(--pw-glow); } [data-theme] .qr-code-text { color: var(--pw-primary); background: rgba(0,0,0,0.15); border-color: var(--pw-border-col); } [data-theme] .map-ripple { border-color: var(--pw-border-col); } [data-theme] .pin-dot.featured { background: var(--pw-primary); } [data-theme] .active-tier-item { background: color-mix(in srgb, var(--pw-primary) 8%, transparent); border-color: var(--pw-border-col); }