/* =====================================================
   SIGNALSOLID DARK BRAND SYSTEM – V1
   Non-destructive override layer
   ===================================================== */

/* ===============================
   1. ROOT BRAND VARIABLES
   =============================== */

:root {
  --ss-bg-main: #0B0F1A;
  --ss-bg-elevated: #121826;
  --ss-surface-glass: rgba(18, 24, 38, 0.78);

  --ss-accent-primary: #7C5CFF;     /* Royal Violet */
  --ss-accent-secondary: #00C2FF;   /* Tech Blue */
  --ss-accent-glow: rgba(124, 92, 255, 0.35);

  --ss-text-primary: #EAF0FF;
  --ss-text-muted: #9CA8C6;
  --ss-border-soft: rgba(124, 92, 255, 0.18);
}

/* ===============================
   2. GLOBAL BACKGROUND
   =============================== */

body {
  background: var(--ss-bg-main) !important;
  color: var(--ss-text-primary);
}

/* Kill any background gradients from main theme */
body,
.section-alt,
.features-section {
  background-image: none !important;
}

/* ===============================
   3. GLASS CARD UPGRADE
   =============================== */

.glass-card-2026,
.ss-panel {
  position: relative;
  background: var(--ss-surface-glass) !important;
  border: 1px solid var(--ss-border-soft) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-radius: 22px !important;
  transition: all .3s ease;
}

/* Subtle brand glow layer */
.glass-card-2026::before,
.ss-panel::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 22px;
  pointer-events: none;
  background:
    radial-gradient(800px 300px at 15% 15%, rgba(124,92,255,.18), transparent 60%),
    radial-gradient(800px 300px at 85% 20%, rgba(0,194,255,.12), transparent 60%);
  z-index: 0;
}

/* Hover lift */
.glass-card-2026:hover,
.ss-panel:hover {
  transform: translateY(-4px);
  box-shadow: 0 25px 70px var(--ss-accent-glow);
}

/* ===============================
   4. PRIMARY CTA BUTTON (VIOLET)
   =============================== */

.btn-primary-2026 {
  background: var(--ss-accent-primary) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 600;
  letter-spacing: .4px;
  border-radius: 14px;
  padding: .7rem 1.2rem;
  transition: all .25s ease;
  box-shadow: 0 10px 30px rgba(124,92,255,.35);
}

.btn-primary-2026:hover {
  background: #6846f0 !important;
  transform: translateY(-2px);
  box-shadow: 0 14px 40px rgba(124,92,255,.55);
}

/* Secondary button glow option (if needed later) */
.btn-2026:not(.btn-primary-2026) {
  border: 1px solid rgba(124,92,255,.4);
  color: var(--ss-text-primary);
  background: transparent;
}

/* ===============================
   5. TABLE PREMIUM TUNING
   =============================== */

.ss-table,
.ss-livefeed-table {
  background: transparent !important;
  border-color: rgba(255,255,255,.05) !important;
}

.ss-livefeed-table thead th {
  color: var(--ss-text-muted) !important;
  text-transform: uppercase;
  font-size: .75rem;
  letter-spacing: 1px;
}

.ss-livefeed-table tbody tr:hover {
  background: rgba(124,92,255,.08) !important;
  box-shadow: inset 0 0 0 1px rgba(124,92,255,.25);
}

/* ===============================
   6. KPI CARD ACCENT INJECTION
   =============================== */

.kpi-card-2026 .kpi-top-2026 i {
  color: var(--ss-accent-primary);
  background: rgba(124,92,255,.18);
  padding: 10px;
  border-radius: 12px;
}

.kpi-value-2026 {
  font-weight: 700;
  font-size: 1.8rem;
  color: var(--ss-text-primary);
}

/* ===============================
   7. FORM INPUT POLISH
   =============================== */

.form-control,
.input-group-text {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  color: var(--ss-text-primary) !important;
}

.form-control:focus {
  border-color: var(--ss-accent-primary) !important;
  box-shadow: 0 0 0 3px rgba(124,92,255,.25) !important;
}

/* ===============================
   8. TEXT HIERARCHY
   =============================== */

.section-heading,
.contact-card__title {
  color: #FFFFFF;
  font-weight: 700;
  letter-spacing: -.5px;
}

.text-muted {
  color: var(--ss-text-muted) !important;
}
.ss-panel-neo {
  background: #161a1e;
  border: 1px solid #232a32;
  border-radius: 14px;
  padding: 1.8rem;
  box-shadow: 0 8px 28px rgba(0,0,0,0.6);
  transition: all 0.25s ease;
}
.ss-trade-surface {
  background: #12161c;
  border: 1px solid #1f252c;
  border-radius: 12px;
  padding: 1.2rem;
}
.ss-trade-surface table {
  color: #e6edf3;
}

.ss-trade-surface thead {
  background: #1e2329;
}

.ss-trade-surface tbody tr {
  border-top: 1px solid #232a32;
}

.ss-trade-surface tbody tr:hover {
  background: #1a1f26;
}
.ss-form-block {
  background: #15181d;
  border: 1px solid #232a32;
  border-radius: 16px;
  padding: 2rem;
}
.ss-form-block .form-control {
  background: #0f1318;
  border: 1px solid #232a32;
  color: #e6edf3;
}

.ss-form-block .form-control:focus {
  border-color: #7c3aed;
  box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.25);
}
.ss-selected {
  border: 1px solid #7c3aed !important;
  box-shadow:
      0 0 0 1px rgba(124, 58, 237, 0.6),
      0 0 12px rgba(124, 58, 237, 0.4);
}
.ss-panel-neo:hover,
.ss-trade-surface:hover,
.ss-form-block:hover {
  border-color: #7c3aed;
  box-shadow:
      0 0 0 1px rgba(124, 58, 237, 0.5),
      0 0 16px rgba(124, 58, 237, 0.35);
}
body::before,
body::after {
  display: none !important;
}

[class*="glow"],
[class*="gradient-bg"],
[class*="radial"] {
  background: none !important;
}
