@import "../base";

@main-background: #e0eaef;
@secondary-background: #c1d4df;

@text-color: #1d1e1e;
@variable-name-color: #1d1e1e;
@variable-type-color: #0092db;
@variable-type-color-hover: #5cb730;

@border-color: #b6cedb;
@border-color-hover: #0092db;

@caret-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAA8CAMAAACO5hB7AAAACVBMVEX///82b4tctzBls0NMAAAAQklEQVR42rWRIQ4AAAgCwf8/2qgER2BeuwJsgAqIzekMfMryPL9XQSkobE6vwKcsz/N7FfPvh09lnPf/b+7673+f0uHuAZ/EdkNQAAAAAElFTkSuQmCC");

.keyboard-caret() {
  box-shadow : 0 0 3px 2px #5cb730;
}

.kint {
  > dl > dt {
    background : linear-gradient(to bottom, #e3ecf0 0, #c0d4df 100%);
  }

  ul.kint-tabs {
    background : linear-gradient(to bottom, #9dbed0 0px, #b2ccda 100%);
  }

  & > dl:not(.kint-trace) > dd > ul.kint-tabs li {
    background : @main-background;
    &.kint-active-tab {
      background : @secondary-background;
    }
  }

  & > dl.kint-trace > dt {
    background : linear-gradient(to bottom, #c0d4df 0px, #e3ecf0 100%);
  }

  .kint-source .kint-highlight {
    background : #f0eb96;
  }
}