/* =====================================================
   LIGHT MODE — Anna Bayón Orcajo
   Applied via html.light class
   ===================================================== */

html.light {
  --bg:   #f5f5f5;
  --bg2:  #ffffff;
  --line: rgba(0,0,0,.1);
  --t:    #111111;
  --m:    rgba(0,0,0,.5);
  --m2:   rgba(0,0,0,.72);
  --card: rgba(255,255,255,.9);
  color-scheme: light;
}

html.light body {
  background: #f5f5f5;
  color: #111;
}

/* ---- NAV ---- */
html.light nav {
  background: rgba(245,245,245,.95) !important;
  border-bottom-color: rgba(0,0,0,.1) !important;
}
html.light nav.sc { background: rgba(245,245,245,.98) !important; }

html.light .nav-links a,
html.light .nav-links li a,
html.light .nav-item { color: rgba(0,0,0,.55) !important; }

html.light .nav-links a:hover,
html.light .nav-links a.active,
html.light .nav-item:hover,
html.light .nav-item.active { color: #111 !important; }

/* underline bar on active nav item */
html.light .nav-item::after { background: #111 !important; }

/* Burger lines */
html.light .nav-burger span { background: rgba(0,0,0,.6) !important; }

/* Mobile drawer */
html.light .drawer,
html.light .nav-drawer {
  background: rgba(245,245,245,.98) !important;
  border-bottom-color: rgba(0,0,0,.1) !important;
}
html.light .drawer a,
html.light .nav-drawer-item {
  color: rgba(0,0,0,.6) !important;
  border-bottom-color: rgba(0,0,0,.08) !important;
}
html.light .drawer a:hover,
html.light .nav-drawer-item:hover { color: #111 !important; }

/* ---- TYPOGRAPHY ---- */
html.light h1,html.light h2,html.light h3,html.light h4 { color: #111; }

/* Headings set explicitly to #fff */
html.light .sttl,
html.light .cta-title,
html.light .about-headline,
html.light .qtext,
html.light .faq-q,
html.light .ms-text strong,
html.light .loom-author-name,
html.light .urgency-text strong,
html.light .r-title,
html.light .dl-title,
html.light .gate-title { color: #111 !important; }

html.light .faq-a { color: rgba(0,0,0,.6) !important; }
html.light .faq-q:hover,html.light .faq-q[aria-expanded="true"] { color: #f38bba !important; }

/* ---- PAGE HERO TAGS ---- */
html.light .ptag { color: #d4608e !important; border-color: rgba(212,96,142,.3) !important; }

/* ---- BADGES / TAGS ---- */
html.light .badge {
  background: rgba(0,0,0,.06) !important;
  color: rgba(0,0,0,.65) !important;
  border-color: rgba(0,0,0,.12) !important;
}
html.light .bpost-badge.pub { background: rgba(74,222,128,.1) !important; }
html.light .bpost-badge.draft { background: rgba(0,0,0,.05) !important; color: rgba(0,0,0,.45) !important; }

/* ---- CARDS (generic dark bg overrides) ---- */
html.light .blog-card,
html.light .bcard,
html.light .bpost-item,
html.light .mcard,
html.light .rec-card,
html.light .cred-card,
html.light .author-card,
html.light .gate,
html.light .dl-box {
  background: #fff !important;
  border-color: rgba(0,0,0,.1) !important;
}

html.light .bcard-title,
html.light .bcard-excerpt,
html.light .rec-card-title,
html.light .cred-title { color: #111 !important; }

html.light .bcat {
  background: rgba(243,139,186,.1) !important;
  border-color: rgba(243,139,186,.25) !important;
}

/* ---- SKILL BARS ---- */
html.light .skill-track { background: rgba(0,0,0,.1) !important; }

/* ---- TIMELINE ---- */
html.light .tl-dot {
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(0,0,0,.12) !important;
}
html.light .tl-item.vis .tl-dot {
  background: rgba(243,139,186,.1) !important;
  border-color: rgba(243,139,186,.4) !important;
  box-shadow: 0 0 20px rgba(243,139,186,.12) !important;
}
html.light .tl-era { color: #d4608e !important; }
html.light .tl-title { color: #111 !important; }
html.light .tl-text { color: rgba(0,0,0,.65) !important; }

/* ---- METRICS (mbox) ---- */
html.light .mbox { background: rgba(0,0,0,.04) !important; border-color: rgba(0,0,0,.1) !important; }
html.light .mn { color: #111 !important; }

/* ---- QUOTE ---- */
html.light .qblock { background: rgba(0,0,0,.03) !important; border-color: rgba(0,0,0,.1) !important; }
html.light .qmark { color: #f38bba !important; }
html.light .qsrc { color: rgba(0,0,0,.5) !important; }

/* ---- SERVICES ---- */
html.light .sc,
html.light .srv-card { background: #fff !important; border-color: rgba(0,0,0,.1) !important; }
html.light .sc-title,
html.light .srv-title { color: #111 !important; }

/* ---- RESOURCES public pages ---- */
html.light .rec-card-excerpt,
html.light .r-excerpt { color: rgba(0,0,0,.68) !important; }
html.light .r-content { color: rgba(0,0,0,.72) !important; }
html.light .r-content h2,
html.light .r-content h3 { color: #111 !important; }
html.light .gate-input {
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(0,0,0,.12) !important;
  color: #111 !important;
}
html.light .gate-input::placeholder { color: rgba(0,0,0,.35) !important; }
html.light .gate-privacy { color: rgba(0,0,0,.45) !important; }
html.light .dl-sub { color: rgba(0,0,0,.65) !important; }
html.light .flt {
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(0,0,0,.1) !important;
  color: rgba(0,0,0,.55) !important;
}
html.light .flt:hover,html.light .flt.active {
  background: rgba(243,139,186,.1) !important;
  border-color: rgba(243,139,186,.35) !important;
  color: #d4608e !important;
}

/* ---- FORMS (modal / lead gate) ---- */
html.light input[type=text],
html.light input[type=email],
html.light input[type=tel],
html.light select,
html.light textarea {
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(0,0,0,.12) !important;
  color: #111 !important;
}
html.light input::placeholder,
html.light textarea::placeholder { color: rgba(0,0,0,.35) !important; }

/* ---- FOOTER ---- */
html.light footer {
  border-top-color: rgba(0,0,0,.1) !important;
  color: rgba(0,0,0,.4) !important;
}
html.light footer a { color: rgba(0,0,0,.4) !important; }
html.light footer a:hover { color: #111 !important; }

/* ---- SCROLL-TO-TOP ---- */
html.light #stt { box-shadow: 0 4px 16px rgba(0,0,0,.15) !important; }

/* ---- COOKIE BANNER ---- */
html.light #cookieBanner {
  background: rgba(245,245,245,.98) !important;
  border-top-color: rgba(0,0,0,.1) !important;
  color: rgba(0,0,0,.65) !important;
}

/* ---- THEME TOGGLE BUTTON ---- */
.theme-toggle {
  background: none;
  border: 1px solid transparent;
  border-radius: 9999px;
  cursor: pointer;
  font-size: .95rem;
  line-height: 1;
  padding: .3rem .55rem;
  color: var(--m);
  transition: color .2s, border-color .2s;
  flex-shrink: 0;
}
.theme-toggle:hover {
  color: var(--t);
  border-color: var(--line);
}

/* ---- PERSONA CHIPS (light mode) ---- */
html.light .persona-label { color: rgba(0,0,0,.45) !important; }
html.light .persona-chip {
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(0,0,0,.12) !important;
  color: rgba(0,0,0,.5) !important;
}
html.light .persona-chip:hover,
html.light .persona-chip.active {
  background: rgba(243,139,186,.12) !important;
  border-color: rgba(243,139,186,.4) !important;
  color: #c9507a !important;
}