/* ========================================================================
   EventOga UI — Antigravity Design System for OrgTrust
   ======================================================================== */

:root {
  /* Brand Core */
  --ev-orange:       #ff6a00;
  --ev-orange-light: #f97316;
  --ev-purple:       #a855f7;

  /* Surfaces */
  --ev-bg-base:      #050505;
  --ev-bg-card:      #0b0b0b;
  --ev-bg-card2:     #090909;
  --ev-bg-card3:     #070707;
  --ev-bg-elevated:  #111111;
  --ev-bg-orange:    #120905;

  /* Text */
  --ev-text-primary:   #ffffff;
  --ev-text-secondary: #d1d5db;
  --ev-text-muted:     #9ca3af;
  --ev-text-dim:       #6b7280;

  /* Borders */
  --ev-border-subtle:  rgba(255,255,255,0.1);
  --ev-border-orange:  rgba(255,106,0,0.3);
  --ev-border-purple:  rgba(168,85,247,0.3);

  /* Radius */
  --ev-radius-lg:  0.5rem;
  --ev-radius-xl:  0.75rem;
  --ev-radius-2xl: 1rem;
  --ev-radius-3xl: 1.5rem;

  /* Font */
  --ev-font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;

  /* Transitions */
  --ev-ease-out:    cubic-bezier(0, 0, 0.2, 1);
  --ev-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

  /* Glow Shadows */
  --ev-glow-orange:      0 0 18px rgba(255,106,0,0.35), 0 0 45px rgba(255,106,0,0.12);
  --ev-glow-orange-soft: 0 0 14px rgba(255,106,0,0.24), 0 0 35px rgba(255,106,0,0.10);
  --ev-glow-purple:      0 0 18px rgba(168,85,247,0.35), 0 0 55px rgba(168,85,247,0.16);
  --ev-glow-purple-soft: 0 0 14px rgba(168,85,247,0.28), 0 0 35px rgba(168,85,247,0.12);
  --ev-glow-mix:         0 0 20px rgba(255,106,0,0.25), 0 0 55px rgba(168,85,247,0.22);
}

body {
  font-family: var(--ev-font-sans);
  background: var(--ev-bg-base);
  color: var(--ev-text-primary);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* === Ambient Background === */
.ev-ambient-bg {
  background:
    radial-gradient(circle at 18% 8%,   rgba(255,106,0,0.16),  transparent 24%),
    radial-gradient(circle at 82% 14%,  rgba(168,85,247,0.23), transparent 28%),
    radial-gradient(circle at 50% 45%,  rgba(168,85,247,0.12), transparent 34%),
    radial-gradient(circle at 18% 68%,  rgba(255,106,0,0.12),  transparent 28%),
    radial-gradient(circle at 88% 78%,  rgba(168,85,247,0.18), transparent 30%),
    var(--ev-bg-base);
  background-attachment: fixed;
}

/* === Glow Utilities === */
.glow-orange       { box-shadow: var(--ev-glow-orange) !important; }
.glow-orange-soft  { box-shadow: var(--ev-glow-orange-soft) !important; }
.glow-purple       { box-shadow: var(--ev-glow-purple) !important; }
.glow-purple-soft  { box-shadow: var(--ev-glow-purple-soft) !important; }
.glow-mix          { box-shadow: var(--ev-glow-mix) !important; }

/* === Cards === */
.ev-card, .card {
  background: var(--ev-bg-card) !important;
  border-radius: var(--ev-radius-2xl) !important;
  border: 1px solid var(--ev-border-subtle) !important;
  padding: 1.25rem;
  transition: all 0.3s var(--ev-ease-out);
  color: var(--ev-text-primary);
}
.ev-card:hover, .card:hover {
  transform: translateY(-4px);
  box-shadow: 0 0 35px rgba(255,106,0,0.25);
  border-color: rgba(255,106,0,0.5) !important;
}

.ev-card-purple {
  border-color: var(--ev-border-purple) !important;
  box-shadow: var(--ev-glow-purple) !important;
}

.ev-card-orange {
  background: var(--ev-bg-orange) !important;
  border-color: var(--ev-orange) !important;
  box-shadow: var(--ev-glow-orange) !important;
}

.ev-card-center {
  text-align: center;
  background: var(--ev-bg-card2) !important;
}

/* === Buttons === */
.ev-btn-primary, .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: var(--ev-orange) !important;
  color: #000 !important;
  font-weight: 900 !important;
  padding: 0.75rem 1.5rem !important;
  border-radius: var(--ev-radius-xl) !important;
  box-shadow: var(--ev-glow-orange) !important;
  transition: all 0.3s var(--ev-ease-out) !important;
  border: none !important;
  cursor: pointer;
  text-decoration: none;
}
.ev-btn-primary:hover, .btn-primary:hover {
  transform: scale(1.05) translateY(-2px) !important;
  box-shadow: 0 0 30px rgba(255,106,0,0.45), 0 0 60px rgba(255,106,0,0.15) !important;
  color: #000 !important;
}

.ev-btn-outline, .btn-outline-light, .btn-outline-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: transparent !important;
  color: var(--ev-text-primary) !important;
  padding: 0.75rem 1.25rem !important;
  border-radius: var(--ev-radius-xl) !important;
  border: 1px solid rgba(255,106,0,0.4) !important;
  transition: all 0.3s var(--ev-ease-out) !important;
  cursor: pointer;
  text-decoration: none;
}
.ev-btn-outline:hover, .btn-outline-light:hover, .btn-outline-primary:hover {
  border-color: var(--ev-orange) !important;
  color: var(--ev-orange) !important;
  box-shadow: 0 0 20px rgba(255,106,0,0.3) !important;
}

.ev-btn-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.8) !important;
  color: var(--ev-text-primary) !important;
  padding: 0.75rem 1.25rem !important;
  border-radius: 9999px !important;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.3) !important;
  backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(255,106,0,0.3) !important;
  transition: all 0.3s var(--ev-ease-out) !important;
  cursor: pointer;
  text-decoration: none;
}
.ev-btn-pill:hover { transform: scale(1.05) !important; }

/* === Badges === */
.ev-badge, .badge {
  display: inline-block;
  border-radius: var(--ev-radius-xl) !important;
  background: rgba(255,106,0,0.2) !important;
  padding: 0.375rem 0.75rem !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  color: var(--ev-orange-light) !important;
  border: 1px solid rgba(255,106,0,0.3) !important;
}

.ev-badge-purple {
  background: transparent !important;
  box-shadow: inset 0 0 0 1px rgba(168,85,247,0.3) !important;
  color: #c084fc !important;
}

/* === Gradient Text === */
.ev-text-gradient, .text-gradient {
  background: linear-gradient(to right, var(--ev-orange), var(--ev-purple)) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* === Navigation (Glass) === */
.ev-nav, .navbar {
  background: rgba(5,5,5,0.85) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-bottom: 1px solid var(--ev-border-subtle) !important;
  padding: 0.85rem 1.5rem !important;
}

.navbar .brand-icon {
  color: var(--ev-orange) !important;
  filter: drop-shadow(0 0 10px rgba(255,106,0,0.5));
}

.navbar .brand-text {
  font-weight: 900 !important;
  background: linear-gradient(to right, var(--ev-orange), var(--ev-purple)) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* === Scrollbar === */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #050505; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(#ff6a00bf, #a855f7bf);
  border: 2px solid #06060699;
  border-radius: 9999px;
}

/* === Form Inputs === */
.form-control, .form-select {
  background-color: #0e0e0e !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: var(--ev-radius-xl) !important;
  padding: 0.65rem 1rem !important;
}

.form-control:focus, .form-select:focus {
  background-color: #120905 !important;
  color: #ffffff !important;
  border-color: var(--ev-orange) !important;
  box-shadow: 0 0 18px rgba(255, 106, 0, 0.35) !important;
}

/* === Tables === */
.table {
  color: #ffffff !important;
  --bs-table-bg: transparent !important;
  --bs-table-hover-bg: rgba(255, 106, 0, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

.table th {
  color: var(--ev-text-muted) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.05em;
}

/* === Dropdown Menu & Modals === */
.dropdown-menu, .modal-content {
  background-color: #0d0d0d !important;
  border: 1px solid rgba(168, 85, 247, 0.3) !important;
  box-shadow: var(--ev-glow-purple) !important;
  border-radius: var(--ev-radius-2xl) !important;
  color: #ffffff !important;
}

.dropdown-item {
  color: #d1d5db !important;
}
.dropdown-item:hover {
  background-color: rgba(255, 106, 0, 0.15) !important;
  color: var(--ev-orange-light) !important;
}