
/* light mode hotfix only - keep dark theme untouched */

/* 1) header and nav pills readable */
body:not(.theme-dark):not(.dark) .header{
  background: linear-gradient(180deg, #ffffff 0%, #f5f7fb 100%) !important;
  border-bottom: 1px solid rgba(15,23,42,.08) !important;
  box-shadow: none !important;
}
body:not(.theme-dark):not(.dark) .brand{
  color:#0f172a !important;
}
body:not(.theme-dark):not(.dark) .navlinks a,
body:not(.theme-dark):not(.dark) .theme-toggle-btn{
  background:#ffffff !important;
  color:#0f172a !important;
  border:1px solid rgba(15,23,42,.08) !important;
  box-shadow:0 6px 14px rgba(15,23,42,.08) !important;
}
body:not(.theme-dark):not(.dark) .nav-icon-badge{
  background:rgba(37,99,235,.10) !important;
  border:1px solid rgba(37,99,235,.08) !important;
}
body:not(.theme-dark):not(.dark) .nav-icon path,
body:not(.theme-dark):not(.dark) .nav-icon circle{
  stroke:#1d4ed8 !important;
}

/* 2) getting started / career / about hero readable */
body:not(.theme-dark):not(.dark) .hero,
body:not(.theme-dark):not(.dark) .section.hero{
  background:linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%) !important;
  border:1px solid rgba(15,23,42,.07) !important;
  box-shadow:0 12px 28px rgba(15,23,42,.05) !important;
}

/* 3) force light cards readable */
body:not(.theme-dark):not(.dark) .step-card,
body:not(.theme-dark):not(.dark) .card,
body:not(.theme-dark):not(.dark) .page-card,
body:not(.theme-dark):not(.dark) .journey-card,
body:not(.theme-dark):not(.dark) .learning-card,
body:not(.theme-dark):not(.dark) .related-card{
  background:#ffffff !important;
  color:#0f172a !important;
  border:1px solid #e2e8f0 !important;
  box-shadow:0 4px 14px rgba(0,0,0,.06) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
body:not(.theme-dark):not(.dark) .step-card::before,
body:not(.theme-dark):not(.dark) .card::before,
body:not(.theme-dark):not(.dark) .page-card::before{
  display:none !important;
}
body:not(.theme-dark):not(.dark) .step-card h3,
body:not(.theme-dark):not(.dark) .card h3,
body:not(.theme-dark):not(.dark) .page-card h3,
body:not(.theme-dark):not(.dark) .journey-card h3{
  color:#0f172a !important;
}
body:not(.theme-dark):not(.dark) .step-card p,
body:not(.theme-dark):not(.dark) .card p,
body:not(.theme-dark):not(.dark) .page-card p,
body:not(.theme-dark):not(.dark) .journey-card p,
body:not(.theme-dark):not(.dark) .related-card p{
  color:#475569 !important;
}
body:not(.theme-dark):not(.dark) .step-num,
body:not(.theme-dark):not(.dark) .journey-card .num{
  background:rgba(37,99,235,.10) !important;
  color:#1d4ed8 !important;
  box-shadow:none !important;
}

/* 4) home page readability */
body:not(.theme-dark):not(.dark)[data-page="home"]{
  background:#fbfdff !important;
}
body:not(.theme-dark):not(.dark)[data-page="home"] .hero{
  background:#ffffff !important;
  border:none !important;
  box-shadow:none !important;
}
body:not(.theme-dark):not(.dark)[data-page="home"] .hero h1,
body:not(.theme-dark):not(.dark)[data-page="home"] .hero p{
  color:#0f172a !important;
}
body:not(.theme-dark):not(.dark)[data-page="home"] .hero-sub,
body:not(.theme-dark):not(.dark)[data-page="home"] .hero-reflection-top{
  color:#4b5c72 !important;
}
body:not(.theme-dark):not(.dark)[data-page="home"] .hero-image-wrap{
  background:#ffffff !important;
  border:1px solid rgba(15,23,42,.08) !important;
  box-shadow:0 16px 36px rgba(15,23,42,.10) !important;
}

/* 5) search centered + in-flow + readable */
.top-jump-wrap{
  width:min(980px, calc(100% - 32px)) !important;
  margin:18px auto 18px !important;
  position:relative !important;
}
.topic-search{
  width:min(860px, 92%) !important;
  position:relative !important;
  margin:0 auto !important;
}
.topic-search-input{
  width:100% !important;
  min-height:56px !important;
}
.topic-search.open,
.topic-search.results-expanded{
  margin-bottom:0 !important;
}
.topic-search-panel{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  width:100% !important;
  margin-top:10px !important;
  max-height:280px !important;
  overflow-y:auto !important;
  z-index:1 !important;
}
.topic-search.open .topic-search-panel{
  display:block !important;
}
.topic-search-panel.panel-expanded{
  max-height:460px !important;
}
body:not(.theme-dark):not(.dark) .topic-search-input{
  background:#ffffff !important;
  border:1px solid #cbd5e1 !important;
  color:#0f172a !important;
  box-shadow:0 10px 24px rgba(15,23,42,.05) !important;
}
body:not(.theme-dark):not(.dark) .topic-search-input::placeholder{
  color:#64748b !important;
}
body:not(.theme-dark):not(.dark) .topic-search-panel{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  box-shadow:0 6px 18px rgba(0,0,0,.08) !important;
}
body:not(.theme-dark):not(.dark) .topic-filter-row{
  border-bottom:1px solid rgba(15,23,42,.06) !important;
}
body:not(.theme-dark):not(.dark) .topic-filter-chip{
  background:#ffffff !important;
  border:1px solid rgba(15,23,42,.08) !important;
  color:#334155 !important;
}
body:not(.theme-dark):not(.dark) .topic-filter-chip.active{
  background:rgba(37,99,235,.10) !important;
  border-color:rgba(37,99,235,.16) !important;
  color:#1d4ed8 !important;
}
body:not(.theme-dark):not(.dark) .topic-result-group{
  color:#64748b !important;
}
body:not(.theme-dark):not(.dark) .topic-result-label,
body:not(.theme-dark):not(.dark) .topic-empty{
  color:#0f172a !important;
}
body:not(.theme-dark):not(.dark) .topic-result:hover,
body:not(.theme-dark):not(.dark) .topic-result.active{
  background:#eff6ff !important;
}
body:not(.theme-dark):not(.dark) .topic-results-toggle{
  background:rgba(37,99,235,.08) !important;
  border:1px solid rgba(37,99,235,.12) !important;
  color:#1d4ed8 !important;
}

/* 6) footer light theme */
body:not(.theme-dark):not(.dark) .site-footer{
  background:linear-gradient(180deg, rgba(236,242,252,.98), rgba(224,233,248,.98)) !important;
  border-top:1px solid rgba(15,23,42,.08) !important;
}
body:not(.theme-dark):not(.dark) .footer-links--premium a{
  color:#334155 !important;
}
body:not(.theme-dark):not(.dark) .footer-links--premium a::after{
  background:rgba(15,23,42,.10) !important;
}
body:not(.theme-dark):not(.dark) .footer-copy--premium{
  color:#64748b !important;
}
body:not(.theme-dark):not(.dark) .footer-copy--premium strong{
  color:#0f172a !important;
}



/* light theme dropdown centered fix */
.top-jump-wrap{
  width:min(980px, calc(100% - 32px)) !important;
  margin:18px auto 18px !important;
}

.top-jump-wrap [data-topic-search],
.top-jump-wrap .topic-search{
  width:min(860px, 92%) !important;
  max-width:860px !important;
  margin:0 auto !important;
  display:block !important;
}

.top-jump-wrap [data-topic-search] .topic-search-input,
.top-jump-wrap .topic-search .topic-search-input{
  width:100% !important;
}

.top-jump-wrap [data-topic-search] .topic-search-panel,
.top-jump-wrap .topic-search .topic-search-panel{
  width:100% !important;
  left:0 !important;
  right:auto !important;
  margin-top:10px !important;
}

body:not(.theme-dark):not(.dark) .top-jump-wrap [data-topic-search],
body:not(.theme-dark):not(.dark) .top-jump-wrap .topic-search{
  width:min(860px, 92%) !important;
  margin:0 auto !important;
}



/* FINAL FIX - dropdown alignment issue */
.top-jump-wrap{
  display:flex !important;
  justify-content:center !important;
}

.topic-search{
  position:relative !important;
  width:800px !important;
  max-width:90% !important;
  margin:0 auto !important;
}

.topic-search-panel{
  position:absolute !important;
  top:60px !important;
  left:0 !important;
  width:100% !important;
  z-index:999 !important;
}

/* prevent weird left stretch */
.topic-search-panel{
  transform:none !important;
}

/* ensure it does not shift */
body:not(.theme-dark):not(.dark) .topic-search-panel{
  left:0 !important;
}



/* title container fix: keep long internal page titles inside wrapper */
body:not([data-page="home"]) .hero h1,
body:not([data-page="home"]) .page-hero h1,
body:not([data-page="home"]) .article-hero h1{
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
  font-size:clamp(34px, 5vw, 72px) !important;
  line-height:1.06 !important;
}

@media (max-width: 1200px){
  body:not([data-page="home"]) .hero h1,
  body:not([data-page="home"]) .page-hero h1,
  body:not([data-page="home"]) .article-hero h1{
    font-size:clamp(32px, 4.4vw, 58px) !important;
  }
}

@media (max-width: 900px){
  body:not([data-page="home"]) .hero h1,
  body:not([data-page="home"]) .page-hero h1,
  body:not([data-page="home"]) .article-hero h1{
    font-size:clamp(28px, 7vw, 44px) !important;
    line-height:1.08 !important;
  }
}


/* v187 search cleanup: hidden until interaction, single scrollbar, proper theme on Getting Started */
.top-jump-wrap{
  position:relative !important;
  z-index:30 !important;
}
.topic-search{
  position:relative !important;
  width:min(860px, 92%) !important;
  margin:0 auto !important;
}
.topic-search.open,
.topic-search.results-expanded{
  margin-bottom:0 !important;
}
.topic-search-panel{
  display:none !important;
  position:absolute !important;
  top:58px !important;
  left:0 !important;
  width:100% !important;
  max-height:none !important;
  overflow:visible !important;
  z-index:60 !important;
}
.topic-search.open .topic-search-panel,
.topic-search:focus-within .topic-search-panel{
  display:block !important;
}
.topic-filter-row{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  margin-bottom:12px !important;
}
.topic-results{
  max-height:280px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
.topic-search-panel.panel-expanded .topic-results{
  max-height:440px !important;
}
body:not(.theme-dark):not(.dark) .topic-search-panel{
  background:rgba(255,255,255,0.98) !important;
  border:1px solid rgba(15,23,42,0.08) !important;
  border-radius:18px !important;
  box-shadow:0 16px 34px rgba(15,23,42,0.08) !important;
}
body.theme-dark .topic-search-panel,
body.dark .topic-search-panel{
  background:rgba(8,15,33,0.96) !important;
  border:1px solid rgba(191,219,254,0.12) !important;
  border-radius:18px !important;
  box-shadow:0 18px 36px rgba(2,8,23,0.30) !important;
}
