body {
  font-family: "Georgia", serif;
  line-height: 1.85;
  font-size: 12pt;
  background-color: #fff;
  color: #000;
  max-width: 70%;
  margin: 0 auto;
  text-align: justify;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

hr {
  border-top: 1px solid #aaa;
  margin-bottom: 2rem;
}

.chapter-title {
  font-family: "Georgia", serif;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.5px;
}

.content p {
  margin-bottom: 1.5rem;
}

.metadata {
  font-family: "Georgia", serif;
  font-size: 0.95rem;
  color: #555;
  margin-top: 1rem;
  margin-bottom: 2rem;
  text-align: center;
}

.metadata span {
  display: inline-block;
  margin-right: 1rem;
  margin-bottom: 0.5rem;
}

.metadata em {
  font-style: italic;
}

.metadata a {
  text-decoration: underline;
  color: inherit;
}

h1,
h2,
h3,
h4 {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: normal;
  margin-bottom: 0pt;
  line-height: 1.45;
  /* margin: 60px 0 30px; */
  margin-top: 18pt;
  padding: 10px 0;
}

h1 {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  text-align: center;
  font-size: 1.5rem;
  letter-spacing: 1px;
}

h2 {
  font-weight: bold;
  text-align: left;
  font-size: 1.2rem;
  letter-spacing: 1px;
}

h3 {
  font-weight: 10;
}

.full-width-image {
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -43vw;
  width: 86vw;
  max-width: 86vw;
  overflow: hidden;
}

.caption {
  font-style: italic;
  font-size: 10pt;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -40%;
  width: 80%;
  overflow: hidden;

  margin-top: 0.7rem;
}

.countGraphJS {
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -43vw;
  width: 86vw;
  max-width: 86vw;
  overflow: hidden;
}

.full-width-image img,
.full-width-image script {
  width: 100%;
  height: auto;
  display: block;
}

.plotly-map {
    /* position: relative;
  left: 50%;
  right: 50%;
  margin-left: -40vw;
  margin-right: -40vw;
  width: 80vw;
  max-width: 80vw;
  overflow: hidden; */
  margin-top: 10px;
  margin-bottom: 10px;
}

.jp-OutputArea-executeResult {
  max-width: 100%;
  overflow-x: auto;
  background-color: #f5f5f5;
  border-radius: 5px;
  max-height: 200px;        /* or whatever height you want */
  overflow-y: auto;         /* enables vertical scrolling */
}

.jp-OutputArea-executeResult .dataframe {
  margin-top: 5px;
  font-family: sans-serif;
  font-size: 8pt;
  min-width: 100%; /* or however wide you want your table to be */
  width: max-content; /* makes table expand only as wide as it needs */
  border-collapse: collapse;
  border-radius: 5px;
  background-color: #efefef;
}

.jp-OutputArea-executeResult table.dataframe th,
.jp-OutputArea-executeResult table.dataframe td{
  max-width: 50px; /* adjust per your needs */
  overflow-wrap: break-word; /* Wrap long words (like Crime IDs) */
  word-break: break-word; /* Ensure long strings don't overflow */
}

/* ======= Jupyter Conversion CSS ======== */
pre {
  line-height: 125%;
}
td.linenos .normal {
  color: inherit;
  background-color: transparent;
  padding-left: 5px;
  padding-right: 5px;
}
span.linenos {
  color: inherit;
  background-color: transparent;
  padding-left: 5px;
  padding-right: 5px;
}
td.linenos .special {
  color: #000000;
  background-color: #ffffc0;
  padding-left: 5px;
  padding-right: 5px;
}
span.linenos.special {
  color: #000000;
  background-color: #ffffc0;
  padding-left: 5px;
  padding-right: 5px;
}
.highlight .hll {
  background-color: var(--jp-cell-editor-active-background);
}
.highlight {
  background: var(--jp-cell-editor-background);
  color: var(--jp-mirror-editor-variable-color);
}
.highlight .c {
  color: var(--jp-mirror-editor-comment-color);
  font-style: italic;
} /* Comment */
.highlight .err {
  color: var(--jp-mirror-editor-error-color);
} /* Error */
.highlight .k {
  color: var(--jp-mirror-editor-keyword-color);
  font-weight: bold;
} /* Keyword */
.highlight .o {
  color: var(--jp-mirror-editor-operator-color);
  font-weight: bold;
} /* Operator */
.highlight .p {
  color: var(--jp-mirror-editor-punctuation-color);
} /* Punctuation */
.highlight .ch {
  color: var(--jp-mirror-editor-comment-color);
  font-style: italic;
} /* Comment.Hashbang */
.highlight .cm {
  color: var(--jp-mirror-editor-comment-color);
  font-style: italic;
} /* Comment.Multiline */
.highlight .cp {
  color: var(--jp-mirror-editor-comment-color);
  font-style: italic;
} /* Comment.Preproc */
.highlight .cpf {
  color: var(--jp-mirror-editor-comment-color);
  font-style: italic;
} /* Comment.PreprocFile */
.highlight .c1 {
  color: var(--jp-mirror-editor-comment-color);
  font-style: italic;
} /* Comment.Single */
.highlight .cs {
  color: var(--jp-mirror-editor-comment-color);
  font-style: italic;
} /* Comment.Special */
.highlight .kc {
  color: var(--jp-mirror-editor-keyword-color);
  font-weight: bold;
} /* Keyword.Constant */
.highlight .kd {
  color: var(--jp-mirror-editor-keyword-color);
  font-weight: bold;
} /* Keyword.Declaration */
.highlight .kn {
  color: var(--jp-mirror-editor-keyword-color);
  font-weight: bold;
} /* Keyword.Namespace */
.highlight .kp {
  color: var(--jp-mirror-editor-keyword-color);
  font-weight: bold;
} /* Keyword.Pseudo */
.highlight .kr {
  color: var(--jp-mirror-editor-keyword-color);
  font-weight: bold;
} /* Keyword.Reserved */
.highlight .kt {
  color: var(--jp-mirror-editor-keyword-color);
  font-weight: bold;
} /* Keyword.Type */
.highlight .m {
  color: var(--jp-mirror-editor-number-color);
} /* Literal.Number */
.highlight .s {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String */
.highlight .ow {
  color: var(--jp-mirror-editor-operator-color);
  font-weight: bold;
} /* Operator.Word */
.highlight .pm {
  color: var(--jp-mirror-editor-punctuation-color);
} /* Punctuation.Marker */
.highlight .w {
  color: var(--jp-mirror-editor-variable-color);
} /* Text.Whitespace */
.highlight .mb {
  color: var(--jp-mirror-editor-number-color);
} /* Literal.Number.Bin */
.highlight .mf {
  color: var(--jp-mirror-editor-number-color);
} /* Literal.Number.Float */
.highlight .mh {
  color: var(--jp-mirror-editor-number-color);
} /* Literal.Number.Hex */
.highlight .mi {
  color: var(--jp-mirror-editor-number-color);
} /* Literal.Number.Integer */
.highlight .mo {
  color: var(--jp-mirror-editor-number-color);
} /* Literal.Number.Oct */
.highlight .sa {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Affix */
.highlight .sb {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Backtick */
.highlight .sc {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Char */
.highlight .dl {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Delimiter */
.highlight .sd {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Doc */
.highlight .s2 {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Double */
.highlight .se {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Escape */
.highlight .sh {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Heredoc */
.highlight .si {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Interpol */
.highlight .sx {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Other */
.highlight .sr {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Regex */
.highlight .s1 {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Single */
.highlight .ss {
  color: var(--jp-mirror-editor-string-color);
} /* Literal.String.Symbol */
.highlight .il {
  color: var(--jp-mirror-editor-number-color);
} /* Literal.Number.Integer.Long */

:root {
  --md-light-blue-50: #e1f5fe;
  --md-grey-100: #f5f5f5;
  --md-grey-300: #e0e0e0;
}

.jp-RenderedText {
  text-align: left;
  padding-left: var(--jp-code-padding);
  line-height: var(--jp-code-line-height);
  font-family: var(--jp-code-font-family);
}

/* Tables */

.jp-RenderedHTMLCommon table {
  border-collapse: collapse;
  border-spacing: 0;
  border: none;
  color: var(--jp-ui-font-color1);
  font-size: var(--jp-ui-font-size1);
  table-layout: fixed;
  margin-left: auto;
  margin-right: auto;
}

.jp-RenderedHTMLCommon td,
.jp-RenderedHTMLCommon th,
.jp-RenderedHTMLCommon tr {
  vertical-align: middle;
  padding: 0.5em;
  line-height: normal;
  white-space: normal;
  max-width: none;
  border: none;
}

:not(.jp-RenderedMarkdown).jp-RenderedHTMLCommon td,
:not(.jp-RenderedMarkdown).jp-RenderedHTMLCommon th,
:not(.jp-RenderedMarkdown).jp-RenderedHTMLCommon tr {
  text-align: right;
}

.jp-RenderedHTMLCommon th {
  font-weight: bold;
}

.jp-RenderedHTMLCommon tbody tr:nth-child(even) {
  background: var(--jp-rendermime-table-row-background);
}

.jp-RenderedHTMLCommon tbody tr:hover {
  background: var(--jp-rendermime-table-row-hover-background);
}

.jp-RenderedHTMLCommon kbd {
  background-color: var(--jp-rendermime-table-row-background);
  border: 1px solid var(--jp-border-color0);
  border-bottom-color: var(--jp-border-color2);
  border-radius: 5px;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
  display: inline-block;
  font-size: var(--jp-ui-font-size0);
  line-height: 1em;
  padding: 0.2em 0.5em;
}

/* Most direct children of .jp-RenderedHTMLCommon have a margin-bottom of 1.0.
 * At the bottom of cells this is a bit too much as there is also spacing
 * between cells. Going all the way to 0 gets too tight between markdown and
 * code cells.
 */
.jp-RenderedHTMLCommon > *:last-child {
  margin-bottom: 0.5em;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.cm-editor {
  line-height: var(--jp-code-line-height);
  font-size: var(--jp-code-font-size);
  font-family: var(--jp-code-font-family);
  border: 0;
  border-radius: 0;
  height: auto;

  /* Changed to auto to autogrow */
}

.cm-editor pre {
  padding: 0 var(--jp-code-padding);
}

/* Scrollable input area wrapper */
.jp-InputArea {
  display: block; /* NOT flex/table; use block to allow scroll */
  overflow-x: auto; /* Allow horizontal scroll */
  width: 100%;
  margin-bottom: -5pt;
  padding-bottom: 4px; /* Optional: space for scrollbar */
  border: var(--jp-border-width) solid var(--jp-cell-editor-border-color);
  border-radius: 2px;
  background: var(--jp-cell-editor-background);
}

/* Inner editor grows horizontally */
.jp-InputArea-editor {
  min-width: max-content; /* Allow editor to grow as wide as needed */
  overflow: visible; /* Let it break container if needed */
}

/*-----------------------------------------------------------------------------
| Cell
|----------------------------------------------------------------------------*/

.jp-Cell {
  padding: var(--jp-cell-padding);
  margin: 0;
  border: none;
  outline: none;
  background: transparent;
  /* background-color: #F0F0F0; */
}

/* Put a space between input and output when there IS output */
.jp-Cell:not(.jp-mod-noOutputs) .jp-Cell-outputWrapper {
  margin-top: 10px;
  font-size: var(--jp-code-font-size);
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

:root {
  --jp-shadow-base-lightness: 0;
  --jp-shadow-umbra-color: rgba(
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    0.2
  );
  --jp-shadow-penumbra-color: rgba(
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    0.14
  );
  --jp-shadow-ambient-color: rgba(
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    0.12
  );
  --jp-elevation-z0: none;
  --jp-elevation-z1: 0 2px 1px -1px var(--jp-shadow-umbra-color),
    0 1px 1px 0 var(--jp-shadow-penumbra-color),
    0 1px 3px 0 var(--jp-shadow-ambient-color);
  --jp-elevation-z2: 0 3px 1px -2px var(--jp-shadow-umbra-color),
    0 2px 2px 0 var(--jp-shadow-penumbra-color),
    0 1px 5px 0 var(--jp-shadow-ambient-color);
  --jp-elevation-z4: 0 2px 4px -1px var(--jp-shadow-umbra-color),
    0 4px 5px 0 var(--jp-shadow-penumbra-color),
    0 1px 10px 0 var(--jp-shadow-ambient-color);
  --jp-elevation-z6: 0 3px 5px -1px var(--jp-shadow-umbra-color),
    0 6px 10px 0 var(--jp-shadow-penumbra-color),
    0 1px 18px 0 var(--jp-shadow-ambient-color);
  --jp-elevation-z8: 0 5px 5px -3px var(--jp-shadow-umbra-color),
    0 8px 10px 1px var(--jp-shadow-penumbra-color),
    0 3px 14px 2px var(--jp-shadow-ambient-color);
  --jp-elevation-z12: 0 7px 8px -4px var(--jp-shadow-umbra-color),
    0 12px 17px 2px var(--jp-shadow-penumbra-color),
    0 5px 22px 4px var(--jp-shadow-ambient-color);
  --jp-elevation-z16: 0 8px 10px -5px var(--jp-shadow-umbra-color),
    0 16px 24px 2px var(--jp-shadow-penumbra-color),
    0 6px 30px 5px var(--jp-shadow-ambient-color);
  --jp-elevation-z20: 0 10px 13px -6px var(--jp-shadow-umbra-color),
    0 20px 31px 3px var(--jp-shadow-penumbra-color),
    0 8px 38px 7px var(--jp-shadow-ambient-color);
  --jp-elevation-z24: 0 11px 15px -7px var(--jp-shadow-umbra-color),
    0 24px 38px 3px var(--jp-shadow-penumbra-color),
    0 9px 46px 8px var(--jp-shadow-ambient-color);

  /* Borders
   *
   * The following variables, specify the visual styling of borders in JupyterLab.
   */

  --jp-border-width: 1px;
  --jp-border-color0: var(--md-grey-400);
  --jp-border-color1: var(--md-grey-400);
  --jp-border-color2: var(--md-grey-300);
  --jp-border-color3: var(--md-grey-200);
  --jp-inverse-border-color: var(--md-grey-600);
  --jp-border-radius: 2px;

  /* UI Fonts
   *
   * The UI font CSS variables are used for the typography all of the JupyterLab
   * user interface elements that are not directly user generated content.
   *
   * The font sizing here is done assuming that the body font size of --jp-ui-font-size1
   * is applied to a parent element. When children elements, such as headings, are sized
   * in em all things will be computed relative to that body size.
   */

  --jp-ui-font-scale-factor: 1.2;
  --jp-ui-font-size0: 0.83333em;
  --jp-ui-font-size1: 13px; /* Base font size */
  --jp-ui-font-size2: 1.2em;
  --jp-ui-font-size3: 1.44em;
  --jp-ui-font-family: system-ui, -apple-system, blinkmacsystemfont, "Segoe UI",
    helvetica, arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
    "Segoe UI Symbol";

  /*
   * Code Fonts
   *
   * Code font variables are used for typography of code and other monospaces content.
   */

  --jp-code-font-size: 13px;
  --jp-code-line-height: 1.3077; /* 17px for 13px base */
  --jp-code-padding: 10px; /* 5px for 13px base, codemirror highlighting needs integer px value */
  --jp-code-font-family-default: menlo, consolas, "DejaVu Sans Mono", monospace;
  --jp-code-font-family: var(--jp-code-font-family-default);

  /* Cell specific styles */

  --jp-cell-padding: 5px;
  --jp-cell-editor-background: var(--md-grey-100);
  --jp-cell-editor-border-color: var(--md-grey-300);
  --jp-cell-editor-box-shadow: inset 0 0 2px var(--md-blue-300);
  --jp-cell-editor-active-background: var(--jp-layout-color0);
  --jp-cell-editor-active-border-color: var(--jp-brand-color1);
  --jp-cell-prompt-font-family: var(--jp-code-font-family-default);
  --jp-cell-prompt-letter-spacing: 0;
  --jp-cell-prompt-opacity: 1;
  --jp-cell-prompt-not-active-opacity: 0.5;
  --jp-cell-prompt-not-active-font-color: var(--md-grey-700);

  /* Rendermime styles */

  --jp-rendermime-error-background: #fdd;
  --jp-rendermime-table-row-background: var(--md-grey-100);
  --jp-rendermime-table-row-hover-background: var(--md-light-blue-50);

  /* Code mirror specific styles */

  --jp-mirror-editor-keyword-color: #008000;
  --jp-mirror-editor-atom-color: #88f;
  --jp-mirror-editor-number-color: #080;
  --jp-mirror-editor-def-color: #00f;
  --jp-mirror-editor-variable-color: var(--md-grey-900);
  --jp-mirror-editor-variable-2-color: rgb(0, 54, 109);
  --jp-mirror-editor-variable-3-color: #085;
  --jp-mirror-editor-punctuation-color: #05a;
  --jp-mirror-editor-property-color: #05a;
  --jp-mirror-editor-operator-color: #a2f;
  --jp-mirror-editor-comment-color: #408080;
  --jp-mirror-editor-string-color: #ba2121;
  --jp-mirror-editor-string-2-color: #708;
  --jp-mirror-editor-meta-color: #a2f;
  --jp-mirror-editor-qualifier-color: #555;
  --jp-mirror-editor-builtin-color: #008000;
  --jp-mirror-editor-bracket-color: #997;
  --jp-mirror-editor-tag-color: #170;
  --jp-mirror-editor-attribute-color: #00c;
  --jp-mirror-editor-header-color: blue;
  --jp-mirror-editor-quote-color: #090;
  --jp-mirror-editor-link-color: #00c;
  --jp-mirror-editor-error-color: #f00;
  --jp-mirror-editor-hr-color: #999;
}
