/*
 * TLC for Kids Knowledge Hub layout
 * One authoritative public layout for Elementor and non-Elementor rendering.
 */

:root {
  --tlc-knowledge-sticky-gap: 18px;
}

.tlc-is-knowledge .tlc-main,
.single-tlc_knowledge .tlc-main,
body.post-type-tlc_knowledge .tlc-main {
  overflow: visible;
}

.tlc-knowledge-builder-layout.e-con,
.tlc-knowledge-builder-layout {
  width: min(calc(100% - 48px), var(--tlc-master-knowledge-width, 1260px)) !important;
  max-width: var(--tlc-master-knowledge-width, 1260px) !important;
  margin-inline: auto !important;
  padding-block: clamp(56px, 6vw, 88px) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(270px, var(--tlc-master-knowledge-sidebar, 310px)) !important;
  gap: clamp(34px, 4.5vw, var(--tlc-master-knowledge-gap, 58px)) !important;
  align-items: start !important;
  overflow: visible !important;
}

.tlc-knowledge-builder-main.e-con,
.tlc-knowledge-builder-main,
.tlc-knowledge-builder-aside.e-con,
.tlc-knowledge-builder-aside {
  min-width: 0 !important;
  width: 100% !important;
}

.tlc-knowledge-builder-main.e-con,
.tlc-knowledge-builder-main {
  max-width: var(--tlc-master-knowledge-main, 850px) !important;
  display: flex !important;
  flex-direction: column !important;
}

.tlc-knowledge-builder-aside.e-con,
.tlc-knowledge-builder-aside {
  position: relative !important;
  top: auto !important;
  align-self: stretch !important;
  min-height: 100% !important;
  max-width: var(--tlc-master-knowledge-sidebar, 310px) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 18px !important;
  overflow: visible !important;
}

.tlc-knowledge-builder-aside > .elementor-element,
.tlc-knowledge-builder-aside > .tlc-knowledge-toc-fallback {
  width: 100% !important;
  min-width: 0 !important;
}

.tlc-knowledge-builder-aside > .elementor-widget-tlc_knowledge_toc,
.tlc-knowledge-builder-aside > .tlc-knowledge-toc-fallback {
  position: sticky !important;
  top: calc(var(--tlc-sticky-stack-offset, var(--tlc-sticky-header-offset, 128px)) + var(--tlc-knowledge-sticky-gap)) !important;
  z-index: 4;
  align-self: start;
}

.tlc-knowledge-toc {
  width: 100%;
  padding: 22px 22px 18px;
  overflow: hidden;
  color: #003057;
  background: #fff;
  border: 1px solid rgba(0,48,87,.13);
  border-top: 5px solid #008fc5;
  border-radius: var(--tlc-master-card-radius, 20px);
  box-shadow: 0 12px 34px rgba(0,48,87,.08);
}
.tlc-knowledge-toc__heading { margin: 0 0 12px; color: #003057; font-size: .78rem; font-weight: 900; letter-spacing: .12em; line-height: 1.2; text-transform: uppercase; }
.tlc-knowledge-toc__list { display: grid; gap: 2px; padding: 0; margin: 0; list-style: none; counter-reset: tlc-toc; }
.tlc-knowledge-toc__list li { min-width: 0; counter-increment: tlc-toc; }
.tlc-knowledge-toc a { position: relative; display: block; padding: 8px 8px 8px 14px; color: #38596d; border-radius: 9px; text-decoration: none; font-size: .86rem; font-weight: 750; line-height: 1.32; overflow-wrap: anywhere; transition: color .16s ease, background .16s ease, transform .16s ease; }
.tlc-knowledge-toc a::before { content: ""; position: absolute; inset: 10px auto 10px 0; width: 3px; background: transparent; border-radius: 99px; }
.tlc-knowledge-toc a:hover,
.tlc-knowledge-toc a:focus-visible,
.tlc-knowledge-toc a.is-active { color: #006f9f; background: #edf7fb; }
.tlc-knowledge-toc a:hover,
.tlc-knowledge-toc a:focus-visible { transform: translateX(2px); }
.tlc-knowledge-toc a.is-active::before { background: #008fc5; }
.tlc-knowledge-toc .is-subheading a { padding-left: 24px; font-size: .8rem; font-weight: 650; }
.tlc-knowledge-toc__empty { margin: 0; color: #607788; font-size: .82rem; line-height: 1.5; }
.tlc-knowledge-toc.is-empty { display: none; }

.tlc-knowledge-builder-aside .tlc-knowledge-evidence,
.tlc-knowledge-builder-aside .tlc-knowledge-support {
  width: 100% !important;
  max-width: none !important;
  padding: 22px !important;
  border-radius: var(--tlc-master-card-radius, 20px) !important;
}
.tlc-knowledge-builder-aside .tlc-knowledge-support h2 { margin-bottom: 9px; font-size: 1.3rem; line-height: 1.08; }
.tlc-knowledge-builder-aside .tlc-knowledge-support p { margin-bottom: 14px; font-size: .88rem; line-height: 1.52; }
.tlc-knowledge-builder-aside .tlc-knowledge-support .tlc-actions { display: grid; gap: 8px; }
.tlc-knowledge-builder-aside .tlc-knowledge-support .tlc-button { width: 100%; min-height: 44px; padding: 10px 13px; font-size: .8rem; }

@media (max-width: 920px) {
  .tlc-knowledge-builder-layout.e-con,
  .tlc-knowledge-builder-layout {
    width: min(calc(100% - 40px), var(--tlc-master-knowledge-width, 1260px)) !important;
    grid-template-columns: 1fr !important;
    gap: 38px !important;
  }
  .tlc-knowledge-builder-main.e-con,
  .tlc-knowledge-builder-main { max-width: 100% !important; }
  .tlc-knowledge-builder-aside.e-con,
  .tlc-knowledge-builder-aside {
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
  }
  .tlc-knowledge-builder-aside > .elementor-widget-tlc_knowledge_toc,
  .tlc-knowledge-builder-aside > .tlc-knowledge-toc-fallback {
    position: static !important;
    top: auto !important;
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .tlc-knowledge-builder-layout.e-con,
  .tlc-knowledge-builder-layout {
    width: min(calc(100% - 28px), var(--tlc-master-knowledge-width, 1260px)) !important;
    padding-block: 42px !important;
  }
  .tlc-knowledge-builder-aside.e-con,
  .tlc-knowledge-builder-aside { grid-template-columns: 1fr !important; }
  .tlc-knowledge-builder-aside > .elementor-widget-tlc_knowledge_toc,
  .tlc-knowledge-builder-aside > .tlc-knowledge-toc-fallback { grid-column: auto; }
  .tlc-knowledge-toc,
  .tlc-knowledge-builder-aside .tlc-knowledge-evidence,
  .tlc-knowledge-builder-aside .tlc-knowledge-support { padding: 20px !important; }
}
