@import url("lwarp.css");

/* =========================================================
   Global
   ========================================================= */
html, body{
  background: #ffffff !important;
}

/* =========================================================
   Minipages
   Goal: prevent float spill/wrap-around and keep side-by-side
   effect (your current 42% layout).
   ========================================================= */
div.minipage,
div.latex_minipage{
  float: none !important;
  display: inline-block !important;
  vertical-align: top !important;

  /* Your current “two columns-ish” look */
  width: 42% !important;
  box-sizing: border-box;
}

/* Make framed boxes contain their children cleanly */
div.fbox,
span.fbox{
  overflow: hidden;
}

/* /1* Full-width minipage override *1/ */
/* .fullwidth-block > div.minipage, */
/* .fullwidth-block > div.latex_minipage{ */
/*   width: 100% !important; */
/*   display: block !important; */
/* } */

/* /1* Make the framed figure occupy the full line *1/ */
/* .fullwidth-block span.fcolorbox{ */
/*   display: block !important; */
/*   width: 100% !important; */
/*   box-sizing: border-box; */
/* } */

/* /1* Remove TeX-style transform scaling wrapper (if present) *1/ */
/* .fullwidth-block span.fcolorbox > span[style*="transform:scale"]{ */
/*   transform: none !important; */
/*   -webkit-transform: none !important; */
/*   -ms-transform: none !important; */

/*   display: block !important; */
/*   width: 100% !important; */
/* } */

/* /1* THIS is the key: force the SVG img to scale with width *1/ */
/* .fullwidth-block img.lateximage{ */
/*   width: 100% !important;      /1* grow to container width *1/ */
/*   height: auto !important;     /1* keep aspect ratio *1/ */
/*   max-width: 80% !important; */
/*   display: block !important; */
/* } */
/* =========================================================
   Permalinks
   ========================================================= */
.permalink{
  margin-left: .4em;
  font-size: 0.85em;
  text-decoration: none;
  opacity: 0.0;
}

.explicit-permalink{
  opacity: 0.8;
  font-size: 0.8em;
}
.explicit-permalink:hover{ opacity: 1; }

h1:hover .permalink,
h2:hover .permalink,
h3:hover .permalink,
h4:hover .permalink,
h5:hover .permalink,
h6:hover .permalink{
  opacity: 0.65;
}

h1 .permalink:hover,
h2 .permalink:hover,
h3 .permalink:hover,
h4 .permalink:hover,
h5 .permalink:hover,
h6 .permalink:hover{
  opacity: 1.0;
}

/* =========================================================
   Code blocks (lwarp/listings)
   Consolidated: avoid duplication + keep your styling
   ========================================================= */
pre,
pre.programlisting{
  /* Behavior */
  white-space: pre !important;     /* don’t wrap */
  overflow-x: auto !important;     /* horizontal scroll */
  max-width: 100% !important;
  box-sizing: border-box;

  /* Typography */
  font-size: clamp(0.75rem, 0.15vw + 0.55rem, 0.8rem);
  line-height: 1.3;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    "Liberation Mono",
    monospace;

  /* Box styling */
  padding: 0.75rem 0.9rem;
  margin: 0;
  background: rgba(20, 200, 200, 0.08);
  border: 1px solid rgba(0,0,0,0.25);
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

/* =========================================================
   Sidebar TOC
   ========================================================= */
.sidetoc{
  position: sticky;
  top: 1rem;
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
  padding-right: 0.5rem;

  background: rgba(150, 150, 150, 0.1);

  /* “Calm it down visually” (merged from your duplicate block) */
  font-size: 1.4em;
  line-height: 1.05;
}

/* Highlighted TOC entry */
.toc-active{
  font-weight: 600;
  text-decoration: none;
  background: rgba(0, 120, 120, 0.12);
  border-radius: 4px;
  padding: 0.1rem 0.25rem;
}

/* =========================================================
   Footnotes + tooltip
   ========================================================= */
a.footnote-ref{ text-decoration: none; }
a.footnote-ref:hover{ text-decoration: underline; }
a.footnote-backref{ text-decoration: none; margin-left: .25em; }

.fn-tooltip{
  position: absolute;
  z-index: 9999;
  max-width: min(520px, calc(100vw - 24px));
  padding: 0.6em 0.8em;
  border: 1px solid rgba(0,0,0,0.25);
  border-radius: 8px;
  background: #FDF6B2;
  box-shadow: 0 8px 24px rgba(0,0,0,0.18);
  font-size: 0.95em;
  line-height: 1.35;
}
.fn-tooltip p{ margin: 0; }
.fn-tooltip a{ text-decoration: underline; }
.fn-tooltip kbd{ padding: 0.05em 0.35em; border-radius: 4px; }