/* ====== Load Open Sans ====== */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700;800&display=swap');

/* ====== LEGO-ish design tokens ====== */
:root{
  --lego-yellow:#FED200;
  --lego-red:#B91E24;
  --lego-blue:#034C7F;
  --lego-green:#00AD4C;
  --lego-header:#2A2A2A;
  --lego-dark:#111111;
  --lego-mid:#555;
  --lego-muted:#777;
  --lego-bg:#E1EFF7;       /* light sky */
  --lego-card:#FFFFFF;
  --lego-grey:#F5F5F5;
  --radius-xl:22px;        /* big, bubbly corners */
  --radius-lg:18px;
  --radius-sm:8px;
  --shadow-1:0 2px 6px rgba(17,17,17,.08);
  --shadow-2:0 8px 20px rgba(17,17,17,.12);
}

/* ====== Global font + base ====== */
html, body {
  background:var(--lego-bg);
  color:var(--lego-dark);
  line-height:1.4;
  margin:0;
  /* Quarto handles layout spacing; avoid global padding here */
}

body, .page-content, .quarto-container,
h1,h2,h3,h4,h5,h6,p,li,code,pre,table,th,td {
  font-family:"Open Sans", Arial, sans-serif !important; color:var(--lego-header)
}

a{ color:var(--lego-blue); text-decoration:underline; }
a:hover{ text-decoration:underline; }

/* Headings */
h1{ font-weight:800; font-size:2rem; margin:.5rem 0 1rem; }
h2{ font-weight:800; font-size:1.6rem; margin:.8rem 0 .7rem; }
h3{ font-weight:700; font-size:1.25rem; margin:1rem 0 .5rem; }
h4{ font-weight:700; font-size:1.05rem; color:var(--lego-mid); }

h1, h2 {
  border-bottom: none !important;
}

/* ====== Quarto Title Block ====== */
.quarto-title-block .quarto-title {
  font-weight:800;
}
.quarto-title-block .quarto-subtitle {
  color:var(--lego-mid);
}

/* ====== TOC (Quarto) ====== */
nav[role="doc-toc"], 
.toc, 
.toc-sidebar, 
.sidebar nav[role="doc-toc"] {
  font-family:"Open Sans", Arial, sans-serif !important;
  font-size:1.1rem;        /* bump up size */
  line-height:1.4;
}

nav[role="doc-toc"] .nav-link,
.toc .nav-link {
  color:var(--lego-blue);
  font-weight:600;
}

nav[role="doc-toc"] .nav-link:hover,
.toc .nav-link:hover {
  text-decoration:underline;
  color:var(--lego-blue);
}

nav[role="doc-toc"] .nav-link.active,
.toc .nav-link.active {
  color:var(--lego-blue);
  font-weight:800;
  border-left:4px solid var(--lego-blue);
/*  padding-left:12px; */
}

/* TOC: highlight “bookmark” headings */
nav[role="doc-toc"] a[href^="#bm-"] {
  color: var(--lego-red);
  font-weight: 700;
  border-left: 4px solid var(--lego-blue);
  padding-left: 8px;
}

/* Optional: add a bookmark icon in the ToC */
nav[role="doc-toc"] a[href^="#bm-"]::before {
  content: "";
  display: inline-block;
  width: 18px;     /* adjust size */
  height: 18px;
  margin-right: 6px;
  background-image: url("https://cdn3.emoji.gg/emojis/4559_Gold_Lego_Stud.gif");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
}

/* Optional: slightly larger TOC size for bookmarks only */
nav[role="doc-toc"] a[href^="#bm-"] {
  font-size: 1.05em;
}
/* ====== Navbar / Bootstrap 5 (Quarto) ====== */
.navbar, .dropdown-menu, .btn, .btn-secondary, .form-control {
  font-family:"Open Sans", Arial, sans-serif !important;
  border-radius:var(--radius-sm);
}

/* ====== Code + Code tools (Quarto) ====== */
/* Code blocks */
pre code, code {
  font-family: Consolas, "Courier New", Courier, monospace !important;
  font-size: .95em;
  line-height: 1.4;
}
/* Copy button */
.code-copy-button {
  border-radius:999px;
  background:var(--lego-grey);
  color:var(--lego-dark);
  box-shadow:var(--shadow-1);
}
/* Folded code uses <details class="code-fold"> in Quarto */
details.code-fold > summary {
  font:600 .9em Consolas, "Courier New", Courier, monospace;
  color:var(--lego-dark);
  background:var(--lego-grey);
  border:none;
  border-radius:999px;
  padding:6px 12px;
  box-shadow:var(--shadow-1);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:.35rem;
}
details.code-fold[open] > summary {
  filter:brightness(.98);
  
}
details.code-fold {
  margin-bottom:.75rem;
}

/* ====== Tables / DataTables ====== */
table{ width:100%; border-collapse:collapse; margin:16px 0; background:var(--lego-card); }
th,td{ padding:10px; }
td{ border-bottom:1px solid #E5E5E5; }
th{
  background:#ECE7FA;
  color:#231942;
  font-weight:700;
}
.dataTables_wrapper,
.dataTables_wrapper table,
.dataTables_wrapper table th,
.dataTables_wrapper table td,
.dataTables_wrapper .dt-button,
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .paginate_button {
  font-family:"Open Sans", Arial, sans-serif !important;
}
.dataTables_wrapper table.dataTable thead th{
  background:#4A2D91 !important;
  color:#fff !important;
  font-weight:700;
}

/* ====== Plotly ====== */
.js-plotly-plot, .plotly, .plotly .main-svg, .plotly .hoverlayer text {
  font-family:"Open Sans", Arial, sans-serif !important;
}
.js-plotly-plot .legend{ max-height:500px; overflow-y:auto !important; }

/* ====== LEGO panel (fenced div: ::: {.lego-panel}) ====== */
.lego-panel{
  background:var(--lego-yellow);
  border-radius:var(--radius-sm);
  padding: 16px 16px 0px;  /* top:16px, sides:16px, bottom:8px */
  /*box-shadow:var(--shadow-2);*/
  position:relative;
  margin-bottom: 8px;   /* reduced bottom margin */
}
.lego-panel::before,
.lego-panel::after{
  content:"";
  position:absolute;
  top:-12px;
  width:40px;
  height:12px;
  background:#FDC100;
  border-radius:8px 8px 0 0;
  /*box-shadow:inset 0 -2px 0 rgba(0,0,0,.1);*/
}
.lego-panel::before{ right:18px; }
.lego-panel::after{  right:72px; }

/* ====== Speech bubble card ====== */
.speech{
  background:var(--lego-card);
  border-radius:var(--radius-xl);
  padding:22px 24px;
  box-shadow:var(--shadow-2);
  position:relative;
}
.speech::after{
  content:"";
  position:absolute; left:38px; bottom:-16px;
  width:28px; height:16px; background:var(--lego-card);
  border-radius:0 0 12px 12px;
  box-shadow:var(--shadow-1);
}

/* ====== Chips / badges ====== */
.badge{ display:inline-block; padding:4px 10px; border-radius:999px; font-weight:700; font-size:.85em; }
.badge-blue{  background:#D7ECFF; color:var(--lego-blue); }
.badge-green{ background:#DDF5E6; color:var(--lego-green); }

.badge-red {
  --icon:40px;
  --gap:16px;
  --pad-x:12px;

  display:grid;
  grid-template-columns: var(--icon) minmax(0,1fr);
  align-items:center;
  column-gap:var(--gap);

  background:#FFD7DA;
  color:var(--lego-red);
  padding:10px var(--pad-x);
  border-radius:var(--radius-sm);
  font-weight:600;
  font-size:.95em;
  line-height:1.4;
  margin:12px 0;
  min-height:var(--icon);
}

.badge-red::before {
  content:"";
  width:var(--icon);
  height:var(--icon);
  background:url("assets/eye.png") center/contain no-repeat;
}


/* ====== Metrics ====== */
.financial-metric{ font-weight:700; margin:12px 0 4px; }
.financial-value{ font-size:1.6rem; font-weight:800; }
.financial-change{ font-size:1.1rem; font-weight:700; color:var(--lego-green); }
.financial-change.neg{ color:var(--lego-red); }

/* ====== Utility cards ====== */
.card{ background:var(--lego-card); border-radius:var(--radius-lg); padding:18px; box-shadow:var(--shadow-1); }
.highlight{ background:#EEF7FF; border-left:6px solid var(--lego-blue); padding:14px 16px; border-radius:var(--radius-sm); }

/* ====== Simple bar ====== */
.bar-chart{ background:#ECECEC; height:20px; border-radius:10px; overflow:hidden; }
.bar{ height:100%; background:var(--lego-blue); }

/* ====== Footer ====== */
.footer{
  margin-top:40px; padding-top:16px;
  border-top:1px solid #E7E7E7;
  font-size:.9rem; color:var(--lego-muted);
}

/* Images get playful corners */
img{ border-radius:12px; }

/* ====== Optional: constrain content width a touch (Quarto main column) ====== */
/* .quarto-container .page-columns .content { max-width: 1100px; } */

/* === Margin footnotes / citations container === */
.margin-references,
.margin-caption {
  padding: 10px 12px;
  font-size: .80rem;
  color: var(--lego-dark);
}

/* spacing inside */
.margin-references > * + *,
.margin-caption > * + * {
  margin-top: .5rem;
}

/* links */
.margin-references a,
.margin-caption a {
  color: var(--lego-blue);
  text-decoration: underline;
}
.margin-references a:hover,
.margin-caption a:hover {
  text-decoration: underline;
}

/* note refs in main text */
a[role="doc-noteref"] {
  color: var(--lego-blue);
  font-weight: 700;
  text-decoration: none;
}
a[role="doc-noteref"]:hover {
  text-decoration: underline;
}

/* paragraphs tidy */
.margin-references p,
.margin-caption p {
  margin: 0;
  line-height: 1.35;
}

.scroll-output {
  max-height: 600px;
  overflow-y: scroll;
  background-color: #E1EFF7;
  padding: 0.5em;
  border: 1px solid #FFFFFF;
  margin-bottom: 1.5em; /* adds spacing below */
}