/* Global Dark Theme Overrides for Bossy Bodies HQ */
:root {
  --bb-bg: #0f0f11; /* main surface */
  --bb-bg-alt: #16171a; /* cards / secondary */
  --bb-bg-accent: #1f2023; /* elevated */
  --bb-border: #2a2c30;
  --bb-border-soft: #202226;
  --bb-text: #f5f7fa;
  --bb-text-soft: #c2c8d2;
  --bb-primary: #ffffff;
  /* Baby pink accents */
  --bb-secondary: #f8d7e9; /* baby pink base */
  --bb-accent:  #fdeff5;  /* lighter baby pink */
  --bb-pink-deep: #e7b7cf; /* deeper baby pink */
  --bb-pink-hot:  #e1a6c6; /* strongest baby pink */
  --bb-focus:    #f3cdea;  /* focus ring */
  --bb-gradient-hero: linear-gradient(135deg,#050506 0%,#121317 45%,#1d1e23 100%);
  --bb-gradient-cta: linear-gradient(90deg,#111217,#1f2025);
  --bb-glow: 0 0 24px -4px rgba(248,187,217,0.35);
}

html { color-scheme: dark; }
body { background: var(--bb-bg); color: var(--bb-text); }

/* Typography adjustments */
body, p, a, span, li { color: var(--bb-text-soft); }
strong, h1, h2, h3, h4, h5, h6 { color: var(--bb-text); }

/* Utility helper classes */
.bb-surface { background: var(--bb-bg-alt); }
.bb-surface-accent { background: var(--bb-bg-accent); }
.bb-border { border-color: var(--bb-border) !important; }
.bb-border-soft { border-color: var(--bb-border-soft) !important; }

/* Header / Nav */
header, header.bg-white { background: rgba(18,19,23,0.85) !important; backdrop-filter: blur(10px); }
header a { color: var(--bb-text-soft); }
header a:hover { color: var(--bb-secondary); }
header .logo-glow { color: var(--bb-primary); text-shadow: 0 0 32px rgba(248,187,217,0.45); }

/* Dropdown menus */
header .group:hover > div, header .group:focus-within > div { background: var(--bb-bg-accent) !important; border: 1px solid var(--bb-border-soft); }
header .group a { color: var(--bb-text-soft) !important; }
header .group a:hover { background: #23252a !important; color: var(--bb-secondary) !important; }

/* Sections that were light */
.bg-white, .bg-gray-50, .bg-pink-light\/10, .bg-pink-light\/20 { background: var(--bb-bg-alt) !important; }
.bg-gradient-to-r, .bg-gradient-to-br { background-image: var(--bb-gradient-hero) !important; }

/* Cards / panels */
.shadow-lg, .shadow-md, .shadow-2xl { box-shadow: 0 4px 24px -4px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.03) !important; }
.bg-gray-50 { background: var(--bb-bg-accent) !important; }

/* Accent icon circles */
/* Keep legacy bg-* for general use, but introduce richer icon circle variants */
.bg-primary { background: #09090b !important; }
.bg-secondary { background: #b85f8b !important; }
.bg-accent { background: #7b335f !important; }

/* Vibrant icon circles */
.bb-icon-primary {
  background-image: linear-gradient(135deg, var(--bb-pink-deep), var(--bb-secondary)) !important;
  box-shadow: 0 8px 24px -8px rgba(248, 187, 217, 0.45), 0 0 0 1px rgba(255,255,255,0.06);
}
.bb-icon-secondary {
  background-image: linear-gradient(135deg, var(--bb-pink-hot), var(--bb-secondary)) !important;
  box-shadow: 0 8px 24px -8px rgba(255, 79, 163, 0.4), 0 0 0 1px rgba(255,255,255,0.06);
}
.bb-icon-accent {
  background-image: linear-gradient(135deg, #ebbfd3, var(--bb-pink-deep)) !important;
  box-shadow: 0 8px 24px -8px rgba(225, 166, 198, 0.45), 0 0 0 1px rgba(255,255,255,0.06);
}

/* CTAs */
button, .btn, a.inline-block, a[class*='rounded-full'] { transition: all .25s ease; }
.bg-white { background: #23252a !important; }
.bg-white:hover { background: #2e3035 !important; }

/* Gradient buttons using existing classes */
.bg-gradient-to-r.from-primary.to-secondary { background-image: linear-gradient(90deg,#1c1d21,#b85f8b) !important; }
.bg-gradient-to-r.from-primary.to-secondary:hover { filter: brightness(1.1); }
.bg-gradient-to-r.from-secondary.to-accent { background-image: linear-gradient(90deg,#b85f8b,#7b335f) !important; }
.bg-gradient-to-r.from-accent.to-primary { background-image: linear-gradient(90deg,#7b335f,#1c1d21) !important; }

/* New pink-focused gradient helpers */
.bb-btn-pink { background-image: linear-gradient(135deg,var(--bb-pink-deep), var(--bb-secondary)); color:#fff !important; }
.bb-btn-pink:hover { filter: brightness(1.08); box-shadow:0 4px 20px -4px rgba(248,187,217,0.45); }
.bb-btn-outline-pink { background:transparent; border:1px solid var(--bb-pink-deep); color:var(--bb-secondary) !important; }
.bb-btn-outline-pink:hover { background:var(--bb-pink-deep); color:#fff !important; }

/* Pink surfaces */
.bb-pink-card { background: radial-gradient(circle at 25% 20%, rgba(248,215,233,0.18), rgba(248,215,233,0.06)); border:1px solid rgba(248,215,233,0.25); box-shadow:0 2px 16px -4px rgba(248,215,233,0.25), 0 0 0 1px rgba(255,255,255,0.03); }
.bb-pink-card.bb-hover-card:hover { box-shadow:0 6px 30px -6px rgba(248,215,233,0.35),0 0 0 1px rgba(255,255,255,0.05); }

/* Accent text helpers */
.text-pink-hot { color: var(--bb-pink-hot) !important; }
.text-pink-deep { color: var(--bb-pink-deep) !important; }

/* Adjust hero gradient stronger pink bias */
section[id="home"], section.bg-gradient-to-br { background-image: linear-gradient(135deg,#09090b 0%, #1a0d15 30%, #2a1420 55%, #381a29 72%, #4a2235 88%, #5b2a40 100%) !important; }

/* Subtle hover card (replaces color flicker) */
.bb-hover-card { position: relative; background: var(--bb-bg-accent); transition: transform .35s cubic-bezier(.19,1,.22,1), box-shadow .35s ease, background .4s ease; }
.bb-hover-card:before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(circle at 30% 20%, rgba(248,215,233,0.18), transparent 60%); opacity: 0; transition: opacity .5s ease; pointer-events: none; }
.bb-hover-card:hover { transform: translateY(-3px) scale(1.005); box-shadow: 0 6px 26px -10px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.04); }
.bb-hover-card:hover:before { opacity: 1; }
.bb-hover-card:focus-within { outline: 2px solid var(--bb-secondary); outline-offset: 3px; }

/* Ensure pink cards keep their pink tint even with hover card base */
.bb-pink-card.bb-hover-card {
  background: radial-gradient(circle at 25% 20%, rgba(248,215,233,0.18), rgba(248,215,233,0.06)), rgba(248,215,233,0.05) !important;
}

/* Dropdown items: remove harsh bg swap, add underline accent */
.bb-menu-item { position: relative; transition: color .3s ease; }
.bb-menu-item:hover { color: var(--bb-secondary) !important; }
.bb-menu-item:after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 6px; height: 2px; background: linear-gradient(90deg,transparent, var(--bb-secondary), transparent); transform: scaleX(0); transform-origin: center; transition: transform .4s cubic-bezier(.65,.05,.36,1); }
.bb-menu-item:hover:after { transform: scaleX(1); }

/* Text colors overrides (tailwind utility classes used in markup) */
.text-gray-600, .text-gray-700, .text-gray-800 { color: var(--bb-text-soft) !important; }
.text-pink-light { color: var(--bb-secondary) !important; }
.text-black-deep { color: var(--bb-text) !important; }
.text-primary { color: var(--bb-primary) !important; }

/* Borders that were gray */
.border-gray-600, .border-gray-500, .border-gray-200 { border-color: var(--bb-border) !important; }

/* Forms */
form .border-gray-200 { border-color: var(--bb-border-soft) !important; background: #18191c; }
form .border-gray-200:focus { border-color: var(--bb-secondary) !important; box-shadow: 0 0 0 3px rgba(248,187,217,0.25); }
select, input, textarea { color: var(--bb-text); }

/* Footer */
footer { background: #090a0c !important; }
footer .border-gray-600, footer .border-purple-600 { border-color: #24262b !important; }
footer a { color: var(--bb-secondary); }
footer a:hover { color: #ffffff; }

/* Remap legacy yellow accents to brand pink */
.text-yellow-300, .text-yellow-400, .text-yellow-500 { color: var(--bb-secondary) !important; }
/* Star ratings container previously yellow */
.flex.text-yellow-400 i { color: var(--bb-secondary) !important; }

/* Carousel nav buttons */
.carousel-btn { background: rgba(0,0,0,0.55) !important; }
.carousel-btn:hover { background: rgba(0,0,0,0.8) !important; }
.carousel-dot { box-shadow: 0 0 0 1px rgba(255,255,255,0.25); }

/* Particles canvas behind hero retained; ensure z layering */
/* particles.js removed */

/* Animations subtle */
a:hover, button:hover { transform: translateY(-2px); }

/* Accessibility: focus */
:focus-visible { outline: 2px solid var(--bb-focus); outline-offset: 3px; }

/* Scrollbar (webkit) */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #111317; }
::-webkit-scrollbar-thumb { background: #2a2c30; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #34373c; }

/* Pricing page uses default .bb-pink-card and .bb-btn-pink styles for visual consistency */