/**
 * CarSoci Theme Overrides
 * Neon-blue automotive look (built on top of the default Sngine theme)
 */

:root {
  --fz-neon: #00d1ff;
  --fz-neon-2: #00a3ff;
  --fz-dark: #0a0f1f;
  --fz-dark-2: #0e1633;

  --link-color: var(--fz-neon);
  --plyr-color-main: var(--fz-neon);
  --body-bg-color: #f1f6ff;
  --header-bg-color: var(--fz-dark);
}

body {
  background-image:
    radial-gradient(circle at 20% -10%, rgba(0, 209, 255, 0.14), transparent 45%),
    radial-gradient(circle at 90% 0%, rgba(0, 123, 255, 0.10), transparent 50%);
}

/* Header */
.main-header {
  background: linear-gradient(90deg, rgba(10, 15, 31, 0.98) 0%, rgba(14, 22, 51, 0.98) 100%) !important;
  border-bottom: 1px solid rgba(0, 209, 255, 0.18);
  box-shadow: 0 16px 40px rgba(0, 20, 60, 0.18);
}

.main-header .logo {
  color: #e6f4ff;
  font-weight: 800;
  letter-spacing: 0.3px;
}

.fz-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.fz-brand i {
  color: var(--fz-neon);
}

.fz-brand-mark {
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  filter: drop-shadow(0 10px 18px rgba(0, 209, 255, 0.20));
}

.main-header .logo img {
  filter: drop-shadow(0 8px 18px rgba(0, 209, 255, 0.25));
}

.main-header .header-icon,
.main-header .header-icon * {
  color: #e6f4ff !important;
  fill: #e6f4ff !important;
}

.main-header .header-icon.active,
.main-header .header-icon.active * {
  color: var(--fz-neon) !important;
  fill: var(--fz-neon) !important;
}

.main-header #search-input {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(0, 209, 255, 0.25);
  color: #e6f4ff;
}

.main-header #search-input::placeholder {
  color: rgba(230, 244, 255, 0.6);
}

.main-header #search-input:focus {
  border-color: var(--fz-neon);
  box-shadow: 0 0 0 4px rgba(0, 209, 255, 0.15);
}

/* Primary buttons + links */
.btn-primary,
.btn-primary.disabled,
.btn-primary:disabled,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
  border-color: transparent !important;
  background-image: linear-gradient(135deg, var(--fz-neon) 0%, var(--fz-neon-2) 55%, #5b5dff 100%) !important;
}

.btn-primary:hover {
  border-color: transparent !important;
  background-image: linear-gradient(135deg, #2de0ff 0%, var(--fz-neon) 55%, #6f71ff 100%) !important;
  transform: translateY(-1px);
}

.btn-primary:focus,
.btn-primary.focus {
  box-shadow: 0 0 0 4px rgba(0, 209, 255, 0.18) !important;
}

a:hover {
  color: var(--fz-neon-2);
}

/* Inputs */
.form-control:focus,
.form-select:focus {
  border-color: rgba(0, 209, 255, 0.55) !important;
  box-shadow: 0 0 0 4px rgba(0, 209, 255, 0.12) !important;
}

/* Cards */
.card {
  border-radius: 16px;
  border-color: rgba(10, 15, 31, 0.06);
  box-shadow: 0 10px 30px rgba(0, 16, 48, 0.06);
}

.card:hover {
  box-shadow: 0 14px 40px rgba(0, 16, 48, 0.09);
}

/* Landing (login/register) */
.fr_welcome_bg:after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 20%, rgba(0, 209, 255, 0.25), transparent 45%);
  pointer-events: none;
}

.fr_welcome_sign_head h5 {
  color: rgba(230, 244, 255, 0.9);
}

.fr_welcome_sign {
  border: 1px solid rgba(0, 209, 255, 0.10);
  box-shadow: 0 20px 60px rgba(0, 16, 48, 0.20);
}

/* Night mode tweaks */
body.night-mode {
  background-image:
    radial-gradient(circle at 20% -10%, rgba(0, 209, 255, 0.10), transparent 45%),
    radial-gradient(circle at 90% 0%, rgba(0, 123, 255, 0.08), transparent 50%);
}

/* Vehicle custom fields (Make/Model/Year) */
.fz-vehicle-make {
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: 0.4px;
}

.fz-vehicle-model {
  font-weight: 500;
}

.fz-vehicle-year {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.6px;
}

.fz-vehicle-loading {
  background-image: linear-gradient(90deg, rgba(0, 209, 255, 0.10), rgba(0, 209, 255, 0.04)) !important;
}

.fz-vehicle-error {
  border-color: rgba(255, 80, 80, 0.55) !important;
  box-shadow: 0 0 0 4px rgba(255, 80, 80, 0.12) !important;
}