/* =============================================================
   Portfolio color overrides — violet theme
   Loads AFTER main.css. Overrides Bootstrap 5 CSS vars + any
   compiled hardcoded blue values from _bootscore-variables.scss.
   SCSS source has also been updated; recompile main.css when
   Bootstrap SCSS source is available to make this file redundant.
   ============================================================= */

:root,
[data-bs-theme="dark"] {
  --bs-primary:                  #7c3aed;
  --bs-primary-rgb:              124, 58, 237;
  --bs-body-bg:                  #0f0c1a;
  --bs-body-bg-rgb:              15, 12, 26;
  --bs-card-bg:                  #1c1533;
  --bs-link-color:               #7c3aed;
  --bs-link-color-rgb:           124, 58, 237;
  --bs-link-hover-color:         #a78bfa;
  --bs-link-hover-color-rgb:     167, 139, 250;
  --bs-border-color:             rgba(124, 58, 237, 0.2);
  --bs-border-color-translucent: rgba(124, 58, 237, 0.15);
  --bs-tertiary-bg:              #1c1533;
  --bs-tertiary-bg-rgb:          28, 21, 51;
}

/* Bootstrap 5 buttons use per-component CSS vars */
.btn-primary {
  --bs-btn-color:              #fff;
  --bs-btn-bg:                 #7c3aed;
  --bs-btn-border-color:       #7c3aed;
  --bs-btn-hover-color:        #fff;
  --bs-btn-hover-bg:           #6d28d9;
  --bs-btn-hover-border-color: #6d28d9;
  --bs-btn-active-bg:          #5b21b6;
  --bs-btn-active-border-color:#5b21b6;
}

.btn-outline-primary {
  --bs-btn-color:              #7c3aed;
  --bs-btn-border-color:       #7c3aed;
  --bs-btn-hover-color:        #fff;
  --bs-btn-hover-bg:           #7c3aed;
  --bs-btn-hover-border-color: #7c3aed;
  --bs-btn-active-color:       #fff;
  --bs-btn-active-bg:          #7c3aed;
}

/* Navbar active/hover — Bootstrap compiles these as hardcoded hex */
.navbar-dark .nav-link.active,
.navbar-dark .nav-link:focus {
  color: #a78bfa !important;
}

/* Body bg — Bootstrap 5 uses var(--bs-body-bg) on body so the
   :root override above should suffice, but belt-and-suspenders: */
body {
  background-color: #0f0c1a;
}

/* Card borders compiled as hardcoded rgba(59,130,246,...) */
.card {
  border-color: rgba(124, 58, 237, 0.2);
  background-color: #1c1533;
}

/* Hero gradient — also updated in _bootscore-custom.scss source */
.hero-section .hero-title {
  background-image: linear-gradient(120deg, #7c3aed 0%, #a78bfa 55%, #c4b5fd 100%);
}

/* Header bg — compiled main.css has hardcoded value that wins over --bs-tertiary-bg var */
#masthead,
.site-header {
  background-color: #1c1533 !important;
}

/* About section bg — compiled SCSS uses --color-bg-secondary: #1a2233 (blue-dark).
   Override to Bootstrap tertiary surface so it stays in the purple theme system. */
:root {
  --color-bg-secondary: var(--bs-tertiary-bg);
}


/* Navbar shrinks smoothly on scroll — .is-scrolled added by custom.js at scrollY > 60 */
.site-header .navbar {
  transition: padding 0.3s ease;
}

.site-header.is-scrolled {
  background-color: rgba(28, 21, 51, 0.96) !important;
  border-bottom: 1px solid rgba(124, 58, 237, 0.28);
  box-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
}

.site-header.is-scrolled .navbar {
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
}

/* Navbar logo — CSS text, Syne 800, C white + H violet */
/* NOTE: compiled main.css has .navbar-brand span { color: var(--bs-primary) } which
   explicitly overrides inherited color on all spans — must counter with explicit rules */
.navbar-logo {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif !important;
  font-weight: 800;
  font-size: 2.2rem !important;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #e5e7eb;
}

.navbar-brand .navbar-logo span:first-child {
  color: #e5e7eb !important;
}

.navbar-brand .navbar-logo .ch-accent {
  color: #7c3aed !important;
}

/* Shrink on scroll */
.site-header .navbar-logo {
  transition: font-size 0.3s ease;
}

.site-header.is-scrolled .navbar-logo {
  font-size: 1.7rem;
}