@import './root.css';
@import './markdown.css';
@import './markup.css';
@import './styles.css';

:host {
  /* color-scheme: light dark; */
}

span[token-type],
tt[token-type] {
  display: contents;
}

pre.markup.code[markup-syntax='tsv'],
pre.markup.code[markup-syntax='log'] {
  -webkit-tab-size: 12 !important;
  -moz-tab-size: 12 !important;
  tab-size: 12 !important;
}

pre.markup > .markup-line {
  /* display: inline-block; */
  min-width: max-content;
}

samp.url {
  word-break: break-all;
  letter-spacing: -0.1ex;
}

a:any-link > samp.url:hover {
  color: inherit;
}

:host {
  font-family: var(--markout--body-font-family);
}

@media screen {
  [media~='print']:not([media~='screen']) {
    display: none;
  }

  li[type='checkbox']::before {
    box-shadow: inset 0 1px 1px #0000001e, inset 0 1px 0.5ex #00000016, inset 0 0 1px #0006, 0 1px 0 #fffc;
  }
}

@media screen and (prefers-color-scheme: dark) {
  mark {
    background-blend-mode: luminosity;
    background-image: linear-gradient(45deg, #9999, #9999);
    text-rendering: optimizeLegibility;
    /* text-shadow: 0 0 6px #333; */
    /* opacity: 0.5; */
  }

  li[type='checkbox']::before {
    box-shadow: none;
    box-shadow: 0 0 0 1px var(--shade, #999);
    background-color: transparent;
    color: var(--shade, #999);
    border-color: var(--shade, #999);
    /* background-color: #9990; */
    /* box-shadow: inset 0 1px 1px #0000001e, inset 0 1px 0.5ex #00000016, inset 0 0 1px #0006, 0 1px 0 #fffc; */
  }

  kbd {
    color: var(--switch-color-active);
    text-shadow: 0 0.125ch 0.25ch #0009;
  }
}

@media print {
  [media~='screen']:not([media~='print']) {
    display: none;
  }
  [media~='print'][hidden]:not([media~='screen']) {
    display: initial;
  }
}