/* eyhadu_thema/src/themes/landingTheme.ts (2026-08-08) — Eyhadu tanıtım sitesinin renk/tipografi dili. Bootstrap 5.3'ün data-bs-theme="dark"'ı (bkz. index.html ) temel koyu görünümü veriyor, burada sadece landingTheme.ts'in kendi token'ları (dark/cardBg/border/accentCyan/ accentPurple) üstüne bindiriliyor. GAME_DESIGN.md §13.4'teki Unity/Admin paletiyle aynı aile. */ :root { --eyhadu-primary: #0d6efd; --eyhadu-secondary: #6c757d; --eyhadu-success: #198754; --eyhadu-info: #0dcaf2; --eyhadu-warning: #ffc107; --eyhadu-danger: #dc3545; --eyhadu-dark: #0a0e1a; --eyhadu-card-bg: #13192b; --eyhadu-border: #212d4a; --eyhadu-accent-cyan: #00f2ff; --eyhadu-accent-purple: #a855f7; /* landingTheme.ts Bootstrap token'larını gerçek Bootstrap bileşenlerine bağla. */ --bs-primary: var(--eyhadu-primary); --bs-secondary: var(--eyhadu-secondary); --bs-success: var(--eyhadu-success); --bs-info: var(--eyhadu-info); --bs-warning: var(--eyhadu-warning); --bs-danger: var(--eyhadu-danger); --bs-dark: var(--eyhadu-dark); --bs-primary-rgb: 13, 110, 253; --bs-secondary-rgb: 108, 117, 125; --bs-success-rgb: 25, 135, 84; --bs-info-rgb: 13, 202, 242; --bs-warning-rgb: 255, 193, 7; --bs-danger-rgb: 220, 53, 69; --bs-dark-rgb: 10, 14, 26; --bs-body-bg: var(--eyhadu-dark); --bs-border-color: var(--eyhadu-border); } .btn-info { --bs-btn-bg: var(--eyhadu-info); --bs-btn-border-color: var(--eyhadu-info); --bs-btn-hover-bg: #0bb6da; --bs-btn-hover-border-color: #0bb6da; } body { background-color: var(--eyhadu-dark); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; } .navbar { background-color: rgba(10, 14, 26, 0.85); backdrop-filter: blur(6px); border-bottom: 1px solid var(--eyhadu-border); } .accent-cyan { color: var(--eyhadu-accent-cyan); } .feature-card { background-color: var(--eyhadu-card-bg); border: 1px solid var(--eyhadu-border); transition: transform 0.15s ease, border-color 0.15s ease; } .feature-card:hover { transform: translateY(-4px); border-color: var(--eyhadu-accent-cyan); } .icon-wrap { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 0.75rem; font-size: 1.4rem; } .accent-cyan-bg { background-color: rgba(0, 242, 255, 0.12); } .accent-purple-bg { background-color: rgba(168, 85, 247, 0.12); } .accent-gold-bg { background-color: rgba(251, 191, 36, 0.12); } .accent-teal-bg { background-color: rgba(52, 211, 153, 0.12); } /* Cihaz önizleme çerçevesi — landingTheme.ts deviceMockup spec'i (border-3, rounded-4, siyah zemin) */ .phone-frame { width: 100%; max-width: 300px; aspect-ratio: 9 / 16; background: #000; border: 3px solid var(--eyhadu-border); border-radius: 2rem; padding: 0.5rem; box-shadow: 0 0 60px rgba(0, 242, 255, 0.15); display: flex; flex-direction: column; } .phone-statusbar { display: flex; justify-content: space-between; padding: 0.35rem 0.75rem; font-size: 0.65rem; font-family: monospace; color: rgba(255, 255, 255, 0.5); } .phone-screen { flex: 1; background: linear-gradient(180deg, #0d0e14 0%, #050507 100%); border-radius: 1.5rem; padding: 1rem; display: flex; flex-direction: column; justify-content: space-between; } .phone-hud { text-align: center; } .target-number { display: block; font-size: 2rem; font-weight: 800; color: var(--eyhadu-accent-cyan); } .operation-icon { display: block; font-size: 3rem; font-weight: 800; color: #fbbf24; line-height: 1; } .bubble-field { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; place-items: center; padding: 1rem 0; } .bubble { width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--c, var(--eyhadu-accent-cyan)); display: flex; align-items: center; justify-content: center; font-weight: 700; color: #0a0e1a; box-shadow: 0 0 12px color-mix(in srgb, var(--c, var(--eyhadu-accent-cyan)) 60%, transparent); } .phone-footer { text-align: center; font-size: 0.75rem; color: rgba(255, 255, 255, 0.6); }