body {
  font-family: "Inter", sans-serif !important;
}

:root{
  --tdm-bg:#ffffff;
  --tdm-text:#0f172a;
  --tdm-muted:#64748b;
  --tdm-border:#e2e8f0;
  --tdm-accent:#2563eb;
  --tdm-sidebar-bg:#fff;
  --tdm-sidebar-text:#373a40;
  --tdm-sidebar-muted:#94a3b8;
  --tdm-code-bg:#0f172a;
  --tdm-code-text:#e5e7eb;
  --tdm-radius:14px;
  --tdm-shadow:0 8px 24px rgba(2,6,23,.08);
  --tdm-max:1100px;
  --tdm-sidebar-w:300px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{color:var(--tdm-text);background:var(--tdm-bg);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,Noto Sans,Apple Color Emoji,Segoe UI Emoji;line-height:1.65}
.tdm-wrap{display:grid;grid-template-columns:var(--tdm-sidebar-w) 1fr;min-height:60vh}
.tdm-sidebar{background:var(--tdm-sidebar-bg);color:var(--tdm-sidebar-text);position:sticky;top:0;align-self:start;height:100%;max-height:100vh;overflow:auto;}
.tdm-sidebar-inner{padding:20px 18px}
.tdm-brand{display:flex;align-items:center;gap:10px;margin-bottom:34px;font-weight:700;font-size:15px;letter-spacing:.2px;margin-top: 12px;}
.tdm-brand svg {
    height: auto;
    width: 180px;
}
.tdm-brand-icon{font-size:18px}
.tdm-search{position:relative;margin:10px 0 14px}
.tdm-search input {
    width: 100%;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid #e7e7e7;
    background: #ffffff;
    color: #4c5058;
    outline: none;
    cursor: pointer;
}
a:focus {
  outline: none !important;
}
.tdm-search input::placeholder{color: #4c505873}
.tdm-search-results{position:relative;margin-top:8px;border-radius:10px;border:1px solid #152243;background:#0b142b;display:none;max-height:320px;overflow:auto}
.tdm-search-results.active{display:block}
.tdm-search-item{display:block;padding:10px 12px;border-bottom:1px solid #152243;text-decoration:none;color:var(--tdm-sidebar-text)}
.tdm-search-item:last-child{border-bottom:0}
.tdm-search-item strong{color:#fff}
.tdm-search-empty{padding:10px 12px;color:var(--tdm-sidebar-muted)}
.tdm-tree ul{list-style:none;margin:0;padding:0;border-left: 1px solid #d9e0e7;}
.tdm-tree li{margin:2px 0}
.tdm-tree a{display:block;padding:2px 10px;color:var(--tdm-sidebar-text);text-decoration:none;font-size: 14px;padding-left: 15px;}
.tdm-tree a:hover{color:#0061FF}
.tdm-doc-link.active {
    color: #0061FF;
    outline: none !important;
    border-left: 1px solid #0061FF;
}
.tdm-tree li:not(:first-child) {
  margin-top: 6px;
}
.tdm-doc-link:focus {
  outline: none !important;
}
.tdm-sidebar-footer{padding:10px 18px;font-size:12px;color:var(--tdm-sidebar-muted)}
.tdm-content{padding:24px;display:block}
.tdm-container{max-width:var(--tdm-max);margin:0 auto}
.tdm-container h1{font-size:32px;line-height:1.2;margin:6px 0 18px}
.tdm-container h2{font-size:24px;margin:28px 0 8px}
.tdm-container h3{font-size:20px;margin:20px 0 6px}
.tdm-container p{margin:12px 0;color:#0b1220}
.tdm-container a{color:var(--tdm-accent);text-decoration:underline}
.tdm-container img{max-width:100%;height:auto;border-radius:4px;}
.tdm-container pre, .tdm-container code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace}
.tdm-container pre {
    background: #ebf0fd;
    color: #262728;
    padding: 16px;
    border-radius: 6px;
    overflow: auto;
    border: none;
    font-size: 14px;
    width: max-content;
}
.tdm-container code{color:#262728;}
.tdm-loading{opacity:.8}
blockquote{border-left:3px solid var(--tdm-border);padding:8px 14px;background:#f8fafc;border-radius:8px}
table{width:100%;border-collapse:collapse;margin:14px 0;border:1px solid var(--tdm-border);border-radius:10px;overflow:hidden}
th,td{border-bottom:1px solid var(--tdm-border);padding:10px 12px;text-align:left}
tr:nth-child(even){background:#f8fafc}
@media (max-width: 1024px){:root{--tdm-sidebar-w:260px}}
@media (max-width: 860px){
  .tdm-wrap{grid-template-columns:1fr}
  .tdm-sidebar{position:relative;max-height:none}
  .tdm-content{padding:18px}
  .tdm-container{max-width:780px}
}
/* Sticky sidebars */
.tdm-sidebar,
.tdm-right {
  position: sticky;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/* shimmer */
@keyframes tdm-shimmer {
  0% { background-position: 200% 0 }
  100% { background-position: -200% 0 }
}
.tdm-skeleton .tdm-skel,
.tdm-img-loading {
  background: linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 20%, #f1f5f9 40%);
  background-size: 200% 100%;
  animation: tdm-shimmer 1.2s infinite linear;
}
.tdm-skeleton{max-width:var(--tdm-max);margin:0 auto}
.tdm-skel{display:block;border-radius:10px;margin:10px 0}
.tdm-skel.tdm-skel-h1{height:34px;width:60%;margin:8px 0 16px}
.tdm-skel.tdm-skel-line{height:14px;width:100%}
.tdm-skel.tdm-skel-line.short{width:70%}
.tdm-skel.tdm-skel-img{height:220px;width:100%;border-radius:12px}
.tdm-img-loading{color:transparent}
.tdm-wrap{display:grid;grid-template-columns:var(--tdm-sidebar-w) 1fr 260px;height:100%}
.tdm-right{position:sticky;top:0;align-self:start;height:100%;max-height:100vh;overflow:auto;border-left:1px solid var(--tdm-border);background:#fff}
.tdm-right-inner{padding:18px 16px}
.tdm-right-title{font-weight:700;font-size:13px;color:var(--tdm-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}
.tdm-toc{font-size:14px;line-height:1.5}
.tdm-toc a{display:block;color:#0b1220;text-decoration:none;border-left:1px solid transparent;padding:6px 8px 6px 10px;}
.tdm-toc a:hover{background:#f8fafc}
.tdm-toc .lvl-2{padding-left:10px}
.tdm-toc .lvl-3{padding-left:20px}
.tdm-toc .lvl-4{padding-left:30px}
.tdm-toc a.active {
    color: #2e2e2e;
    border-left-color: #383838;
    background: #f1f1f1;
}
@media (max-width: 1200px){ .tdm-wrap{grid-template-columns:var(--tdm-sidebar-w) 1fr} .tdm-right{display:none} }
html{scroll-behavior:smooth}
.tdm-right.hidden{display:none}
.tdm-tree-group, .tdm-tax-badge {
    font-size: 11.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.3px;
    margin-bottom: 15px;
    margin-top: 30px;
    color: #858b9b;
}
.tdm-tax-badge {
    color: #636770ff;
}
/* Anchor scroll offset so sticky header does not hide the title */
.tdm-container h2[id],
.tdm-container h3[id],
.tdm-container h4[id] { scroll-margin-top: 88px; } /* adjust to your header height */
/* Mobile drawer for sidebar */
@media (max-width: 960px) {
  .tdm-wrap { grid-template-columns: 1fr; }
  .tdm-right { display: none; }

  .tdm-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    width: 88%;
    max-width: 320px;
    height: 100vh;
    transform: translateX(-100%);
    transition: transform .25s ease;
    background: #fff;
    box-shadow: 0 10px 30px rgba(0,0,0,.12);
    z-index: 1000;
  }
  .tdm-sidebar.is-open { transform: translateX(0); }


  body.tdm-menu-open { overflow: hidden; }
  .tdm-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.3);
    z-index: 999;
    display: none;
  }
  .tdm-overlay.is-open { display: block; }
  
.tdm-search {
    padding-top: 50px;
}
.tdm-brand {display: none !important;}
.tdm-tree  {
    padding-bottom: 80px;
}
}
/* Temporary highlight for a text match from search */
.tdm-hit {
  padding: 0 .15em;
  background: #fff59e;
  border-radius: 2px;
  transition: background 1.2s ease;
}
.tdm-hit-fade {
  background: transparent;
}

/* Hide any hamburger by default (desktop) */
.tdm-hamburger { display: none; }

/* Topbar base (hidden on desktop) */
.tdm-topbar { display: none; }

/* Optional: better logo spacing in sidebar brand */
.tdm-brand { display:flex; align-items:center; gap:10px; margin:0 0 34px; }

/* Mobile layout */
@media (max-width: 960px) {
  /* Show topbar */
  .tdm-topbar {
    display: block;
    position: sticky; /* keeps it at top when scrolling content area */
    top: 0;
    z-index: 1200;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
  }
  .tdm-topbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
  }
  .tdm-topbar-logo svg {
    width: 140px;
    height: auto;
    display: block;
  }

  /* Show the hamburger only on mobile (in topbar) */
  .tdm-topbar .tdm-hamburger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px; height: 44px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #fff;
  }

  /* Full-screen drawer for the sidebar */
  .tdm-wrap { grid-template-columns: 1fr; }
  .tdm-right { display: none; }

  .tdm-sidebar {
    position: fixed;
    left: 0;
    top: 0;           /* sit under the overlay; topbar is above due to z-index */
    width: 100%;      /* full screen width */
    max-width: none;  /* full width */
    height: 100vh;
    transform: translateX(-100%);
    transition: transform .25s ease;
    background: #fff;
    box-shadow: 0 10px 30px rgba(0,0,0,.12);
    z-index: 1000;    /* below topbar but above page content */
  }
  .tdm-sidebar.is-open { transform: translateX(0); }

  /* Overlay */
  body.tdm-menu-open { overflow: hidden; }
  .tdm-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.3);
    z-index: 999;         /* below topbar (1200) and sidebar (1000)? We want overlay below topbar but above content, so keep this 999 and sidebar 1000, topbar 1200 */
    display: none;
  }
  .tdm-overlay.is-open { display: block; }

  /* Push content below topbar */
  .tdm-content { padding-top: 8px; }
}


.tdm-sidebar{
  scrollbar-width: thin;
  scrollbar-color: #334155 #dfe6ee;
}

.tdm-sidebar::-webkit-scrollbar{
  width: 6px;
}

.tdm-sidebar::-webkit-scrollbar-track{
  background: transparent;
}

.tdm-sidebar::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, #334155 0%, #334155 100%);
  border-radius: 10px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

.tdm-sidebar::-webkit-scrollbar-thumb:hover{
  background: linear-gradient(180deg, #334155 0%, #334155 100%);
}

.tdm-sidebar::-webkit-scrollbar-corner{
  background: transparent;
}


/* modal */
.tdm-search-modal{position:fixed;inset:0;display:none;z-index:1000}
.tdm-search-modal.open{display:block}
.tdm-search-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.55);backdrop-filter:blur(2px)}
.tdm-search-dialog{position:relative;max-width:820px;margin:8vh auto;background:#fff;border-radius:14px;box-shadow:0 20px 60px rgba(2,6,23,.25);overflow:hidden}
.tdm-search-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #e2e8f0}
.tdm-search-header #tdm-search-title{font-weight:700;font-size:14px;color:#334155;letter-spacing:.02em}
.tdm-search-close{appearance:none;border:0;background:transparent;font-size:18px;line-height:1;padding:6px;cursor:pointer;color:#475569;border-radius:8px}
.tdm-search-close:hover{background:#f1f5f9}
.tdm-search-input-wrap{padding:14px 16px;border-bottom:1px solid #e2e8f0}
#tdm-search-input-modal{width:100%;padding:12px 14px;border:1px solid #cbd5e1;border-radius:10px;outline:none;font-size:15px}
#tdm-search-input-modal:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.15)}
.tdm-search-results-modal{max-height:60vh;overflow:auto}
.tdm-search-item-row{display:block;padding:12px 16px;border-bottom:1px solid #eef2f7;text-decoration:none;color:#0b1220}
.tdm-search-item-row:last-child{border-bottom:0}
.tdm-search-item-row .title{font-weight:600;margin-bottom:6px}
.tdm-search-item-row .snippet{font-size:13px;color:#475569}
.tdm-search-item-row mark{background:#fff2ac}
.tdm-search-item-row.is-active{background:#eef5ff}
@media (max-width:900px){
  .tdm-search-dialog{margin:0;border-radius:0;min-height:100vh;max-width:none}
}

/* ---------- Hamburger / Close (2 bars -> X) ---------- */
.tdm-hamburger{
  display: inline-grid;
  place-items: center;
  width: 44px; height: 44px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  padding: 0;
}

.tdm-hamburger:focus-visible{
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

/* the icon box */
.tdm-hamburger-box{
  position: relative;
  width: 22px;   /* bar length */
  height: 18px;  /* icon height */
  display: block;
}

/* we use ONLY pseudo-elements for two bars */
.tdm-hamburger-inner{
  position: absolute;
  inset: 0;
}

/* bars */
.tdm-hamburger-inner::before,
.tdm-hamburger-inner::after{
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;                 /* bar thickness */
  background: #0b142b;         /* bar color */
  border-radius: 2px;
  transform-origin: center center;
  transition:
    transform .25s ease,
    top .25s ease,
    bottom .25s ease,
    opacity .2s ease;
}

/* spacing for the two bars */
.tdm-hamburger-inner::before{ top: 4px; }
.tdm-hamburger-inner::after { bottom: 4px; }

/* --- Open state (turn into X) --- */
.tdm-hamburger[aria-expanded="true"] .tdm-hamburger-inner::before{
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.tdm-hamburger[aria-expanded="true"] .tdm-hamburger-inner::after{
  bottom: auto;
  top: 50%;
  transform: translateY(-50%) rotate(-45deg);
}

/* optional: smoother on high-DPI and reduce motion preference */
@media (prefers-reduced-motion: reduce){
  .tdm-hamburger-inner::before,
  .tdm-hamburger-inner::after{
    transition: none;
  }
}

.tdm-updated {
    font-size: 14px;
    color: #777777;
    margin: 35px 0;
}

.tdm-pager {
    padding-top: 25px;
    border-top: 1px solid #e7e7e7;
}

 .tdm-pager a {
    color: #334155;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
}
.tdm-pager a:hover {
      color: var(--tdm-accent);
}
.tdm-pager {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#tdm-app ol{
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-left: 20px;
}
#tdm-app hr {
    opacity: 0.3;
}

#tdm-app .tdm-content strong, #tdm-app .tdm-content b {
  font-weight: 500;
}
/* --- Improved Lightbox (scrollable + fixed close) --- */
#tdm-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.85);
  display: none;
  opacity: 0;
  transition: opacity 0.25s ease;
  z-index: 999999;
  overflow-y: auto;           /* make scrollable */
  overflow-x: hidden;
  padding: 60px 16px 40px;    /* leave space for close button */
}

#tdm-lightbox.is-open {
  display: block;
  opacity: 1;
}

#tdm-lightbox .tdm-lb-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  min-height: 100%;
}

#tdm-lightbox img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
  margin: auto;
}

#tdm-lightbox .tdm-lb-caption {
  color: #e5e7eb;
  font-size: 14px;
  margin-top: 1rem;
  text-align: center;
  max-width: 90ch;
  line-height: 1.5;
}

/* Fixed close button */
#tdm-lightbox .tdm-lb-close {
  position: fixed;
  top: 16px;
  right: 26px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  background: rgba(17, 24, 39, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
  border-radius: 8px;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  z-index: 1000000; /* above overlay */
}

#tdm-lightbox .tdm-lb-close:hover {
  background: rgba(255, 255, 255, 0.1);
}

/* Disable background scroll */
body.tdm-lightbox-open {
  overflow: hidden;
}