/**
 * Easy Equities — red + black + white reskin
 * Palette from brand flyer: #D32F2F primary red, black text, clean white surfaces
 */
:root {
  --nw-navy: #d32f2f;
  --nw-navy-dark: #b71c1c;
  --nw-navy-light: #ef5350;
  --nw-navy-muted: #e53935;
  --nw-gold: #d32f2f;
  --nw-gold-dark: #b71c1c;
  --nw-gold-light: #ff6659;
  --nw-gold-pale: #ffebee;
  --nw-bg: #ffffff;
  --nw-bg-alt: #fafafa;
  --nw-surface: #ffffff;
  --nw-text: #1a1a1a;
  --nw-text-muted: #616161;
  --nw-border: rgba(211, 47, 47, 0.42);
  --nw-border-soft: rgba(211, 47, 47, 0.28);
  --nw-shadow: 0 8px 32px rgba(211, 47, 47, 0.08);
  --nw-shadow-lg: 0 16px 48px rgba(26, 26, 26, 0.1);

  --ee-red: #d32f2f;
  --ee-red-dark: #b71c1c;
  --ee-red-light: #ef5350;
  --ee-red-pale: #ffebee;
  --ee-black: #1a1a1a;
  --ee-teal: #26a69a;
  --ee-orange: #ff9800;
  --ee-purple: #7b1fa2;

  --dt-gold: var(--ee-red);
  --dt-gold-bright: var(--ee-red-light);
  --dt-gold-deep: var(--ee-red-dark);
  --dt-gold-dark: var(--ee-red-dark);
  --dt-champagne: var(--ee-red-pale);
  --dt-sky: var(--nw-bg);
  --dt-tower: var(--nw-surface);
  --dt-glass: rgba(255, 255, 255, 0.98);
  --dt-border: var(--nw-border);
  --dt-border-soft: var(--nw-border-soft);
  --dt-glow: rgba(211, 47, 47, 0.35);
}

body {
  color: var(--ee-black);
  background-color: var(--nw-bg);
}

::selection {
  background: rgba(211, 47, 47, 0.18);
  color: var(--ee-red-dark);
}

.dt-tower-bg,
.auth-surface {
  background-color: #ffffff !important;
  background-image:
    radial-gradient(ellipse 90% 60% at 50% -20%, rgba(211, 47, 47, 0.05), transparent 55%),
    radial-gradient(ellipse 50% 40% at 100% 100%, rgba(211, 47, 47, 0.04), transparent 50%),
    linear-gradient(180deg, #ffffff 0%, #fafafa 100%) !important;
  color: var(--ee-black);
}

/* Brand wordmark */
.nw-brand__name--inline .nw-nova { color: var(--ee-red) !important; }
.nw-brand__name--inline .nw-wealth { color: var(--ee-black) !important; }
.nw-brand--dash:hover .nw-brand__name--inline .nw-nova {
  color: var(--ee-red-light) !important;
}
.nw-brand__mark {
  filter: drop-shadow(0 4px 12px rgba(211, 47, 47, 0.22));
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--ee-red-light), var(--ee-red));
}

.nw-btn-primary {
  background: linear-gradient(145deg, var(--ee-red-light), var(--ee-red) 45%, var(--ee-red-dark));
  box-shadow: 0 8px 24px rgba(211, 47, 47, 0.28);
}
.nw-btn-primary:hover {
  box-shadow: 0 12px 32px rgba(211, 47, 47, 0.35);
}

.nw-table-head {
  background: var(--ee-red);
}

/* Dashboard hero — red header strip (flyer style) */
.inv-dash .dash-hero > .absolute.inset-0 > .absolute.inset-0.bg-gradient-to-br,
.inv-dash .dash-hero .bg-gradient-to-br.from-nova-navy {
  background: linear-gradient(135deg, #ef5350 0%, #d32f2f 45%, #b71c1c 100%) !important;
}

.inv-dash .dash-cta {
  background: linear-gradient(145deg, #ef5350, #d32f2f 48%, #b71c1c) !important;
  border: 0 !important;
  box-shadow: 0 8px 24px rgba(211, 47, 47, 0.32) !important;
  color: #fff !important;
}
.inv-dash .dash-cta:hover {
  filter: brightness(1.05);
  box-shadow: 0 12px 32px rgba(211, 47, 47, 0.38) !important;
}

/* Plan cards — red accents */
.inv-dash .plan-section__eyebrow { color: var(--ee-red) !important; }
.inv-dash .plan-section__title { color: var(--ee-black) !important; }
.inv-dash .plan-card__icon {
  background: linear-gradient(145deg, var(--ee-red-light), var(--ee-red)) !important;
  border-color: rgba(211, 47, 47, 0.35) !important;
}
.inv-dash .plan-card__profit { color: var(--ee-red) !important; }
.inv-dash .plan-tag--good {
  color: var(--ee-red-dark) !important;
  background: var(--ee-red-pale) !important;
  border-color: rgba(211, 47, 47, 0.35) !important;
}
.inv-dash .plan-card__highlight {
  background: linear-gradient(135deg, rgba(255, 235, 238, 0.9), rgba(255, 255, 255, 0.95)) !important;
  border-color: rgba(211, 47, 47, 0.3) !important;
}
.inv-dash .plan-card__cta {
  background: linear-gradient(145deg, #ef5350, #d32f2f 48%, #b71c1c) !important;
  box-shadow: 0 6px 20px rgba(211, 47, 47, 0.28) !important;
}

/* Bottom nav */
.app-navbar__dock {
  background: #ffffff !important;
  border-color: rgba(211, 47, 47, 0.25) !important;
  box-shadow: 0 -4px 24px rgba(26, 26, 26, 0.08) !important;
}
.app-navbar .nav-item.active .icon,
.app-navbar .nav-item.active .label {
  color: var(--ee-red) !important;
}
.app-navbar .center-button {
  background: linear-gradient(145deg, #ef5350, #d32f2f 48%, #b71c1c) !important;
  border-color: #ffffff !important;
  box-shadow:
    0 0 0 1px rgba(211, 47, 47, 0.35),
    0 10px 28px rgba(211, 47, 47, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
.app-navbar .nav-item-center.active .center-button {
  box-shadow:
    0 0 0 2px rgba(255, 235, 238, 0.9),
    0 0 0 1px rgba(211, 47, 47, 0.55),
    0 12px 32px rgba(211, 47, 47, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
}
.app-navbar .nav-item-center .label {
  color: rgba(26, 26, 26, 0.55) !important;
}
.app-navbar .nav-item-center.active .label {
  color: var(--ee-red) !important;
}
.app-navbar .icon-center {
  color: #ffffff !important;
}

/* Auth screens */
.auth-tabs .auth-tab-active {
  background: linear-gradient(145deg, #ef5350, #d32f2f 48%, #b71c1c) !important;
  box-shadow: 0 4px 20px rgba(211, 47, 47, 0.28) !important;
}
.auth-tabs .auth-tab-link:hover {
  color: var(--ee-red) !important;
  background: rgba(211, 47, 47, 0.06) !important;
}
.auth-btn-primary {
  background: linear-gradient(145deg, #ef5350, #d32f2f 48%, #b71c1c) !important;
  box-shadow: 0 8px 28px rgba(211, 47, 47, 0.32) !important;
}
.auth-label,
.auth-label i,
.auth-ref strong,
.auth-row a {
  color: var(--ee-red-dark) !important;
}
.auth-inset:focus-within {
  border-color: rgba(211, 47, 47, 0.65) !important;
  box-shadow: 0 0 0 2px rgba(211, 47, 47, 0.18) !important;
  background: rgba(255, 235, 238, 0.5) !important;
}
.auth-logo {
  border-color: rgba(211, 47, 47, 0.3) !important;
}
.auth-logo::before {
  background: radial-gradient(circle, rgba(211, 47, 47, 0.25) 0%, transparent 68%) !important;
}

/* Red gradient utilities (icons/buttons that used navy gradients) */
.inv-dash .from-nova-navy-light,
.auth-surface .from-nova-navy-light {
  --tw-gradient-from: #ef5350 var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgb(239 83 80 / 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.inv-dash .via-nova-navy-dark,
.auth-surface .via-nova-navy-dark {
  --tw-gradient-via: #b71c1c var(--tw-gradient-via-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-via), var(--tw-gradient-to) !important;
}
.inv-dash .to-nova-navy-dark,
.auth-surface .to-nova-navy-dark {
  --tw-gradient-to: #b71c1c var(--tw-gradient-to-position) !important;
}
.inv-dash .from-nova-navy,
.auth-surface .from-nova-navy {
  --tw-gradient-from: #d32f2f var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgb(211 47 47 / 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.inv-dash .to-\[\#0f1f38\],
.auth-surface .to-\[\#0f1f38\] {
  --tw-gradient-to: #8b0000 var(--tw-gradient-to-position) !important;
}
.inv-dash .from-nova-gold.to-nova-navy,
.inv-dash .from-nova-gold {
  --tw-gradient-from: #ef5350 var(--tw-gradient-from-position) !important;
}
.inv-dash .to-nova-navy {
  --tw-gradient-to: #b71c1c var(--tw-gradient-to-position) !important;
}

/* Balance card — red accent strip */
.dash-balance-card {
  border-color: rgba(211, 47, 47, 0.35) !important;
}
.dash-balance-card__accent {
  background: linear-gradient(90deg, #d32f2f, #ef5350, #d32f2f) !important;
}
.dash-balance-btn--gold {
  background: linear-gradient(145deg, #ef5350, #d32f2f 48%, #b71c1c) !important;
  color: #fff !important;
  border: 0 !important;
}
.dash-balance-btn--outline {
  border-color: rgba(211, 47, 47, 0.45) !important;
  color: var(--ee-red-dark) !important;
}
.dash-balance-split__val--gold {
  color: var(--ee-red) !important;
}

/* Profile CTA */
.profile-cta-navy {
  background: linear-gradient(90deg, #ef5350, #d32f2f, #b71c1c) !important;
  color: #fff !important;
}

/* Flyer-style table headers on dashboard plans */
.inv-dash .plan-card__table-head,
.inv-dash thead tr {
  background: var(--ee-red) !important;
  color: #fff !important;
}