@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

:root {
    --color-brand-gold: #B58840;
    --color-brand-gold-light: #D4A859;
    --color-brand-gold-dark: #8C6221;
    --color-brand-navy: #0D2346;
    --color-brand-navy-light: #163567;
    --color-brand-navy-dark: #071328;
    --color-bg-dark: #0B1120;
    --color-card-dark: #131C31;
}

body {
    font-family: 'Plus Jakarta Sans', sans-serif;
}

html.light body {
    background-color: #F8FAFC !important;
    color: #0F172A !important;
}

html.light .glass-nav {
    background-color: rgba(255, 255, 255, 0.97) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.06) !important;
    border-bottom: 1px solid #E2E8F0 !important;
}

html.dark .glass-nav {
    background-color: rgba(11, 17, 32, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

html.light .glass-panel {
    background-color: #ffffff !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05) !important;
    backdrop-filter: none !important;
}

html.dark .glass-panel {
    background-color: rgba(19, 28, 49, 0.7);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(148, 163, 184, 0.1);
}

html.light [class*="bg-cardDark"] {
    background-color: #ffffff !important;
    border-color: #E2E8F0 !important;
}

html.light [class*="bg-bgDark"] {
    background-color: #F8FAFC !important;
}

html.light .bg-navy-gradient {
    background: linear-gradient(135deg, #ffffff 0%, #F1F5F9 100%) !important;
}

html.dark .bg-navy-gradient {
    background: linear-gradient(135deg, #071328 0%, #0D2346 100%);
}

html.light .bg-gradient-to-b.from-brandNavyDark.to-bgDark,
html.light .bg-gradient-to-br.from-brandNavyDark.to-bgDark,
html.light [class*="from-brandNavyDark"] {
    background: linear-gradient(135deg, #F1F5F9 0%, #F8FAFC 100%) !important;
}

html.light .bg-gradient-to-r.from-brandNavyDark {
    background: linear-gradient(to right, #F1F5F9, #F8FAFC, #F1F5F9) !important;
}

html.light .text-white { color: #0D2346 !important; }
html.light .text-slate-100 { color: #0F172A !important; }
html.light .text-slate-200 { color: #1E293B !important; }
html.light .text-slate-300 { color: #334155 !important; }
html.light .text-slate-400 { color: #475569 !important; }
html.light .text-slate-500 { color: #64748B !important; }

html.light [class*="bg-slate-900"] {
    background-color: #ffffff !important;
    color: #0F172A !important;
    border-color: #CBD5E1 !important;
}

html.light [class*="bg-slate-950"] {
    background-color: #F1F5F9 !important;
}

html.light .bg-slate-800 {
    background-color: #E2E8F0 !important;
}

html.light [class*="border-slate-8"],
html.light [class*="border-slate-7"] {
    border-color: #E2E8F0 !important;
}

html.light input,
html.light textarea,
html.light select {
    background-color: #F8FAFC !important;
    color: #0F172A !important;
    border-color: #CBD5E1 !important;
}

html.light input::placeholder,
html.light textarea::placeholder {
    color: #94A3B8 !important;
}

html.light input:focus,
html.light textarea:focus,
html.light select:focus {
    border-color: var(--color-brand-gold) !important;
}

html.light .hover\:bg-brandGold\/10:hover {
    background-color: rgba(181, 136, 64, 0.1) !important;
}

html.light .hover\:bg-slate-500\/10:hover {
    background-color: rgba(0, 0, 0, 0.05) !important;
}

html.light .bg-brandGold\/10 {
    background-color: rgba(181, 136, 64, 0.08) !important;
}

html.light .bg-brandGold\/20 {
    background-color: rgba(181, 136, 64, 0.1) !important;
}

html.light .bg-gradient-to-br.from-brandNavy {
    background: linear-gradient(to bottom right, #E2E8F0, rgba(181,136,64,0.05)) !important;
}

html.light .border-brandGold\/30 {
    border-color: rgba(181, 136, 64, 0.4) !important;
}

html.light .text-brandGold {
    color: #8C6221 !important;
}

html.light [class*="bg-brandNavy"] {
    background-color: #F1F5F9 !important;
    background-image: none !important;
}
html.light footer[class*="bg-brandNavy"] {
    background-color: #F8FAFC !important;
    border-top-color: #E2E8F0 !important;
}

html.light .btn-secondary {
    background-color: #ffffff !important;
    color: var(--color-brand-navy) !important;
    border: 1px solid var(--color-brand-navy) !important;
}
html.light .btn-secondary:hover {
    background-color: var(--color-brand-navy-light) !important;
    color: #ffffff !important;
}

html.light [class*="bg-cardDark"].border {
    background-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}

html.light .hover\:border-brandGold\/50:hover {
    border-color: rgba(181, 136, 64, 0.5) !important;
}

html.light .faq-item[class*="bg-cardDark"] {
    background-color: #ffffff !important;
    border-color: #E2E8F0 !important;
}

html.light .bg-slate-900\/95 {
    background-color: rgba(255,255,255,0.97) !important;
}

html.light #cookie-banner {
    background-color: rgba(255,255,255,0.97) !important;
    border-top-color: #E2E8F0 !important;
}

html.light #cookie-banner .text-slate-300 {
    color: #475569 !important;
}

html.light #cookie-banner .bg-slate-800 {
    background-color: #E2E8F0 !important;
    color: #334155 !important;
}

.text-gold { color: var(--color-brand-gold); }
.bg-gold { background-color: var(--color-brand-gold); }
.bg-gold-gradient {
    background: linear-gradient(135deg, var(--color-brand-gold-light) 0%, var(--color-brand-gold) 50%, var(--color-brand-gold-dark) 100%);
}

.bg-card-gradient {
    background: linear-gradient(180deg, rgba(19, 28, 49, 0.8) 0%, rgba(11, 17, 32, 0.9) 100%);
}

.border-gold-subtle { border-color: rgba(181, 136, 64, 0.3); }

.glow-gold {
    box-shadow: 0 0 20px rgba(181, 136, 64, 0.4);
}
.glow-gold-sm {
    box-shadow: 0 0 10px rgba(181, 136, 64, 0.3);
}

.btn-primary {
    background: linear-gradient(135deg, var(--color-brand-gold) 0%, var(--color-brand-gold-dark) 100%);
    color: var(--color-brand-navy-dark);
    font-weight: 700;
    transition: all 0.3s ease;
    border: none;
}
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(181, 136, 64, 0.4);
    background: linear-gradient(135deg, var(--color-brand-gold-light) 0%, var(--color-brand-gold) 100%);
}

.btn-secondary {
    background-color: var(--color-brand-navy);
    color: #ffffff;
    border: 1px solid var(--color-brand-gold);
    font-weight: 600;
    transition: all 0.3s ease;
}
.btn-secondary:hover {
    background-color: var(--color-brand-navy-light);
    color: var(--color-brand-gold-light);
}

.wa-float {
    position: fixed;
    bottom: 30px;
    right: 30px;
    background-color: #25D366;
    color: #ffffff;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    z-index: 100;
    transition: all 0.3s ease;
}
.wa-float:hover {
    transform: scale(1.1);
}

.modal-backdrop {
    background-color: rgba(11, 17, 32, 0.9);
    backdrop-filter: blur(5px);
}

.ticker-wrap {
    width: 100%;
    overflow: hidden;
    background-color: var(--color-bg-dark);
    padding: 10px 0;
    box-sizing: border-box;
}
html.light .ticker-wrap {
    background-color: #ffffff !important;
    border-bottom: 1px solid #E2E8F0 !important;
}

.ticker-move {
    display: inline-flex;
    white-space: nowrap;
    animation: tickerMarquee 35s linear infinite;
}
.ticker-move:hover {
    animation-play-state: paused;
}

.ticker-item {
    display: inline-flex;
    align-items: center;
    padding: 0 20px;
    gap: 10px;
}

.ticker-symbol {
    font-weight: 700;
    color: #ffffff;
    font-size: 0.875rem;
}
html.light .ticker-symbol {
    color: #0F172A !important;
}

.ticker-label {
    font-size: 0.75rem;
    color: #94A3B8;
}
html.light .ticker-label {
    color: #64748B !important;
}

.ticker-value {
    font-family: monospace;
    font-weight: 600;
}

@keyframes tickerMarquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

@keyframes pulseSlow {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.8; transform: scale(1.02); }
}

@keyframes floatAnim {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

.animate-pulse-slow {
    animation: pulseSlow 4s ease-in-out infinite;
}
.animate-float {
    animation: floatAnim 6s ease-in-out infinite;
}

.tv-lightweight-charts {
    display: none !important;
}

::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--color-bg-dark);
}
::-webkit-scrollbar-thumb {
    background: var(--color-brand-gold-dark);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--color-brand-gold);
}

html.light ::-webkit-scrollbar-track {
    background: #F1F5F9 !important;
}
html.light ::-webkit-scrollbar-thumb {
    background: #CBD5E1 !important;
}
html.light ::-webkit-scrollbar-thumb:hover {
    background: var(--color-brand-gold) !important;
}

/* LIGHT MODE SPECIFIC FIXES */
html.light .bg-brandNavy, html.light .bg-brandNavyDark { background-color: #F8FAFC !important; background-image: none !important; }
html.light .bg-brandNavy .text-white, html.light .bg-brandNavyDark .text-white { color: #0D2346 !important; }
html.light .bg-brandNavy .text-slate-300, html.light .bg-brandNavyDark .text-slate-300 { color: #475569 !important; }
html.light .bg-brandNavy .text-slate-400, html.light .bg-brandNavyDark .text-slate-400 { color: #64748B !important; }
html.light footer.bg-brandNavyDark { background-color: #ffffff !important; border-top-color: #E2E8F0 !important; color: #475569 !important; }
html.light footer.bg-brandNavyDark a { color: #475569 !important; }
html.light footer.bg-brandNavyDark a:hover { color: var(--color-brand-gold) !important; }
html.light .bg-brandNavy.text-brandGold { background-color: #E2E8F0 !important; color: #8C6221 !important; }
html.light section.bg-brandNavy { background-color: #F1F5F9 !important; border-bottom: 1px solid #E2E8F0 !important; }
html.light section.bg-brandNavy .opacity-10 { opacity: 0.05 !important; }