@import 'xterm/css/xterm.css';

body[kui-theme-style] .kui--tab-content {
  .xterm-terminated .xterm-rows > div {
    white-space: pre-wrap;
  }

  .repl-result-like > div.xterm-container {
    padding-right: 0;
  }

  .kui--scrollback:not(.xterm-alt-buffer-mode) .xterm-container .xterm-screen {
    height: auto !important;
  }

  /* alt buffer mode */
  &.visible.xterm-alt-buffer-mode,
  .xterm-alt-buffer-mode {
    /* no-splitTerminal and splitTerminal variants */
    .xterm-container .xterm-rows.xterm-focus .xterm-cursor.xterm-cursor-block {
      background-color: var(--color-base08);
      color: var(--color-base00);
    }

    .kui--session-init-done {
      display: none;
    }

    &,
    .repl-inner {
      overflow: hidden;
      display: flex;
      /* align-items: flex-start; */
      -webkit-app-region: drag; /* for emacs/vi, in case there is a top slice of repl-inner visible */

      /* when in alt-buffer mode, hide anything in the REPL not related to the current output */
      .repl-block:not(.processing),
      .kui--input-stripe,
      .repl-input,
      .repl-result,
      .repl-context,
      .repl-result-spinner {
        display: none;
      }

      .repl-block {
        & {
          flex: 1;
        }
        &.processing {
          padding: 0;
          margin: 0;
          -webkit-app-region: no-drag; /* but make sure the content of the blocks are not draggable */

          .bx--accordion__heading {
            /** accordion around input */
            display: none;
          }
        }
        .repl-output {
          &,
          .repl-result-like {
            flex: 1;
            display: flex;

            .xterm-container {
              &,
              .xterm {
                flex: 1;
                display: flex;
              }
            }
          }
        }
      }
    }
  }

  .xterm .xterm-rows .xterm-hidden-row {
    display: none;
  }

  .xterm-dim {
    opacity: 0.6;
  }

  .xterm-container .xterm-fg-7.xterm-dim {
    opacity: 1;
    color: var(--color-text-02);
  }

  .xterm-container .xterm-bold {
    font-weight: bold;
  }

  .xterm-container .xterm-rows .xterm-cursor.xterm-cursor-block {
    background-color: transparent;
    outline-color: transparent;
  }
  .xterm-container .xterm-rows.xterm-focus .xterm-cursor.xterm-cursor-block {
    background-color: var(--color-processing);
    outline-color: transparent;
    color: var(--color-base06);
  }
  .xterm-container .xterm-rows:not(.xterm-focus) .xterm-cursor.xterm-cursor-block {
    background-color: var(--color-base03);
    outline-color: var(--color-base04);
  }

  /* themes */
  .xterm-container .xterm-viewport,
  .xterm-rows {
    background-color: transparent !important;
  }
  .xterm-rows {
    font-size: 1em;
    font-family: var(--font-monospace);
    background-color: var(--color-repl-background);
    color: var(--color-text-01);
  }
  .xterm-rows .xterm-bg-0,
  .xterm-rows .xterm-bg-8 {
    background-color: var(--color-ui-01);
  }
  .xterm-rows .xterm-fg-0,
  .xterm-rows .xterm-fg-8 {
    color: var(--color-ui-01);
  }
  .xterm-rows .xterm-bg-1,
  .xterm-rows .xterm-bg-9 {
    background-color: var(--color-red);
  }
  .xterm-rows .xterm-fg-1,
  .xterm-rows .xterm-fg-9 {
    color: var(--color-red);
  }
  .xterm-rows .xterm-bg-2,
  .xterm-rows .xterm-bg-10 {
    background-color: var(--color-green);
  }
  .xterm-rows .xterm-fg-2,
  .xterm-rows .xterm-fg-10 {
    color: var(--color-green);
  }
  .xterm-rows .xterm-bg-3,
  .xterm-rows .xterm-bg-11 {
    background-color: var(--color-yellow-text);
  }
  .xterm-rows .xterm-fg-3,
  .xterm-rows .xterm-fg-11 {
    color: var(--color-yellow-text);
  }
  .xterm-rows .xterm-bg-4,
  .xterm-rows .xterm-bg-12 {
    background-color: var(--color-blue);
  }
  .xterm-rows .xterm-fg-4,
  .xterm-rows .xterm-fg-12 {
    color: var(--color-blue);
  }
  .xterm-rows .xterm-bg-5,
  .xterm-rows .xterm-bg-13 {
    background-color: var(--color-magenta);
  }
  .xterm-rows .xterm-fg-5,
  .xterm-rows .xterm-fg-13 {
    color: var(--color-magenta);
  }
  .xterm-rows .xterm-bg-6,
  .xterm-rows .xterm-bg-14 {
    background-color: var(--color-cyan);
  }
  .xterm-rows .xterm-fg-6,
  .xterm-rows .xterm-fg-14 {
    color: var(--color-cyan);
  }
  .xterm-rows .xterm-bg-7,
  .xterm-rows .xterm-bg-15 {
    background-color: var(--color-white);
  }
  .xterm-rows .xterm-fg-7,
  .xterm-rows .xterm-fg-15 {
    color: var(--color-text-01);
  }
  .xterm-rows .xterm-fg-257 {
    /* inverted default color */
    background-color: var(--color-text-01);
    color: var(--color-ui-01);
  }
}

/* selection */
body[kui-theme-style='light'] .xterm-container .xterm-screen .xterm-selection div {
  background-color: rgba(0, 0, 0, 0.3);
}