@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300..700&display=swap');

body,
html {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #333;
  background-color: #fff;
  margin: 1rem 2rem;
  padding: 0;
}

h1 {
  font-size: 1.5rem;
  margin: 0 0 1rem;
}

h2 {
  font-size: 1.1rem;
  margin: 0 0 1rem;
}

.script-plus-log :is(script, .script),
#log {
  /* Show the content of the script tag */
  display: block;
  white-space: pre-wrap;
  width: 50%;
  font-family: ui-monospace, Menlo, Monaco, 'Cascadia Mono', 'Segoe UI Mono',
    'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace', 'Source Code Pro',
    'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace;
}

.script-plus-log > :is(script, .script) {
  padding: 1rem;
}

.script-plus-log > .scripts,
#log {
  width: 50%;
  padding: 1rem;
}

.script-plus-log > .scripts > :is(script, .script) {
  width: 100%;
}

.script-plus-log > .scripts,
.script-plus-log > :is(script, .script) {
  background-color: #eee;
}

script:not([src]):first-line {
  line-height: 0px;
}

.log-entry {
  border-bottom: 1px solid #eee;
}

.script-plus-log {
  display: flex;
  flex-direction: row;
  background-color: #f9f9f9;
  border: 1px solid #eee;
  border-radius: 0.5rem;
  overflow: hidden;
}

.scripts h2 {
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid #ddd;
}

.scripts h2:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
