/* =========================================================
   Bargainn Shop — Nexmart brand tokens
   Change hex values here to recolor the whole frontend.
   ========================================================= */
:root {
  /* Primary solid — text, borders, icons (CSS color/border cannot be a gradient) */
  --bn-primary: #1554C0;
  --bn-primary-hover: #1248A8;

  /* Logo-inspired header fill — royal blue with a soft indigo close, no bright cyan */
  --bn-primary-gradient: linear-gradient(105deg, #1248A8 0%, #1554C0 42%, #2F5FDB 78%, #090d6e 100%);
  --bn-primary-gradient-hover: linear-gradient(105deg, #0E3F9A 0%, #1248A8 42%, #2654C9 78%, #3E42B8 100%);

  /* Secondary / accent — active nav, hero tint */
  --bn-secondary: #7136D9;
  --bn-accent: #19A7E0;

  /* Sale / offer / notification only */
  --bn-sale: #E53935;

  /* Surfaces */
  --bn-bg: #F5F8FF;
  --bn-card: #FFFFFF;
  --bn-text: #172033;
  --bn-muted: #6B7280;
  --bn-border: #E5EAF3;

  --bn-hero-gradient: var(--bn-primary-gradient);
  --bn-primary-soft: color-mix(in srgb, var(--bn-primary) 10%, transparent);
  --bn-primary-tint: color-mix(in srgb, var(--bn-primary) 28%, transparent);

  /* Legacy theme hooks — existing CSS follows these */
  --theme-color: var(--bn-primary);
  --theme-color-3: var(--bn-primary);
  --title-color: var(--bn-text);
  --text-color: var(--bn-text);
  --secondary-color: var(--bn-text);
}

/* Primary surfaces use the logo gradient */
.header-top,
.home_3 .header-top,
.theme-btn.btn-one,
.home_3 .theme-btn.btn-one,
.bn-m-search-form .bn-m-search-btn,
.home_3 .highlights-section,
.home_3 .main-footer .subscribe-widget .form-inner .form-group button[type="submit"] {
  background: var(--bn-primary-gradient);
}

.theme-btn.btn-one:hover,
.home_3 .theme-btn.btn-one:hover {
  background: var(--bn-primary-gradient-hover);
}

.header-top .bn-header-search__btn,
.header-top .search-box .form-group button[type='submit'],
.bn-m-search-form .bn-m-search-btn {
  background: var(--bn-primary);
}

.header-top .bn-header-search__btn:hover,
.header-top .search-box .form-group button[type='submit']:hover,
.bn-m-search-form .bn-m-search-btn:hover {
  background: var(--bn-primary-hover);
}