/*
 * Copyright (c) 2016-2017 Konstantin Baierer
 *
 * This software may be modified and distributed under the terms
 * of the MIT license.  See the LICENSE file for details.
 */

$selector-ocr-page: '.ocr_page';
$selector-ocr-classes: '*[class^="ocr"]';
$selector-ocr-line: '#{$selector-ocr-classes}[class*="line"]';
$selector-ocr-par: '.ocr_par';
$selector-ocr-carea: '.ocr_carea';
$selector-ocr-blank: '#{$selector-ocr-classes}.hocrjs-blank';
$selector-ocr-inline-not-blank: '.ocr_line #{$selector-ocr-classes}:not(.hocrjs-blank)';
$selector-ocr-inline-blank: '.ocr_line #{$selector-ocr-classes}.hocrjs-blank';
$selector-ocr-not-page: '#{$selector-ocr-classes}:not(.ocr_page)';

$border-width: 3px;
$color-transparent: rgba(0,0,0,0);
$color-unchecked: #ffcccc;
$color-checked: #ccffcc;
$color-toolbar-bg: rgba(180,180,190,0.85);
$color-toolbar-toggler: white;
$color-toolbar-border: #333;

$color-highlight-page: #8B4513;
$color-highlight-not-page: red;
$color-highlight-inline-not-blank: green;
$color-highlight-inline-blank: lighten(green, 30%);
$color-highlight-carea: blue;
$color-highlight-par: purple;
$color-highlight-line: gold;

@mixin transform($args) {
  -webkit-transform: $args;
  -ms-transform: $args;
  transform: $args;
}

@mixin tooltip {
  display: block;
  background: white;
  color: black !important;
  border: 1px solid black;
  font-family: monospace;
  position: absolute;
  font-size: 12px;
  font-weight: bold;
  line-height: 100%;
  height: 15px;
  top: -15px;
}

@mixin highlight-area($selector, $color) {
  #{$selector} {
    border: $border-width solid $color;
    &:hover {
      background: rgba(lighten($color, 30%), 0.2);
    }
  }
}