/* race media hulk Dashboard Styles */

/* Brand Colors:
 * Black:  #000000
 * Gray1:  #b2b2b2
 * Gray2:  #525252
 * White:  #ffffff
 * Red:    #e63728
 * Orange: #ff6b35 (gradient endpoint - verify with brand guidelines)
 */

/* Base Typography */
* {
  font-family: "Source Sans Pro", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.heading {
  font-family: "Source Sans Pro", sans-serif !important;
}

.brand-name {
  font-family: "BBH Bartle", "Source Sans Pro", sans-serif !important;
}

/* Base Theme */
body {
  background-color: #000000;
  color: #b2b2b2;
}

/* Brand Gradients */
.racing-gradient {
  /* Linear gradient at 20° angle: red to orange - USE FOR BUTTONS/ACCENTS ONLY */
  background: linear-gradient(20deg, #e63728 50%, #ff6b35 100%);
}

.panel-gradient {
  /* Subtle dark gradient for content panels */
  background: linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);
  border: 1px solid #525252;
}

.stat-card {
  /* Stats card styling with better contrast */
  background: linear-gradient(135deg, #262626 0%, #1a1a1a 100%);
  border: 1px solid #525252;
}

.gradient-subtle {
  /* Deprecated - use panel-gradient instead */
  background: linear-gradient(135deg, #000000 0%, #1a1a1a 100%);
}

.hero-gradient {
  /* Radial glow effect behind hero text */
  background: radial-gradient(
    circle at 50% 0%,
    rgba(230, 55, 40, 0.35) 0%,
    transparent 60%
  );
}

.feature-card {
  transition:
    transform 0.2s ease,
    border-color 0.2s ease;
}

.feature-card:hover {
  transform: translateY(-4px);
  border-color: rgba(230, 55, 40, 0.5);
}

/* Accents */
.racing-accent {
  border-left: 3px solid #e63728;
}

.logo-glow {
  filter: drop-shadow(0 0 8px rgba(230, 55, 40, 0.4));
}

/* Navigation Links */
.nav-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  color: #b2b2b2;
  transition: all 0.2s ease;
  text-decoration: none;
}

.nav-link:hover {
  color: #ffffff;
  background-color: rgba(230, 55, 40, 0.1);
}

.nav-link.active {
  color: #e63728;
  background-color: rgba(230, 55, 40, 0.15);
  font-weight: 600;
}

/* Layout */
.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 16rem;
  background: linear-gradient(180deg, #000000 0%, #1a1a1a 100%);
  border-right: 1px solid #525252;
  overflow-y: auto;
}

.main-content {
  margin-left: 16rem;
  min-height: 100vh;
  width: calc(100vw - 16rem);
  display: flex;
  flex-direction: column;
}

.topbar {
  background: linear-gradient(135deg, #000000 0%, #1a1a1a 100%);
  border-bottom: 1px solid #525252;
  padding: 1.25rem 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 10;
}

main {
  flex: 1;
  overflow-y: auto;
}

/* Login Page Tabs */
.uk-tab > * > a {
  color: #b2b2b2;
  transition: all 0.2s ease;
}

.uk-tab > * > a:hover {
  color: #ffffff;
}

.uk-tab > .uk-active > a {
  color: #e63728 !important;
  border-bottom-color: #e63728 !important;
}