/*
 * Penguin Common Theme
 * 
 * @author: Dorian Pula (dorian.pula@amber-penguin-software.ca)
 * @company: Amber Penguin Software
 * @note: The common elements of both the Penguin Daytime and Evening CSS themes.
 * @version: 0.5.0
 * @license: AGPL v3
 */
// Bootstrap - Needs to be imported first.
@import (inline) "../../node_modules/bootstrap/dist/css/bootstrap.css";
@import (inline) "../../node_modules/bootstrap/dist/css/bootstrap-theme.css";

/*** Declare font-faces from openfontlibrary ***/
@font-face {
  font-family: 'LavoirRegular';
  src: url('/static/fonts/openfonts/lavoir/Lavoir.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'LavoirSmallCaps';
  src: url('/static/fonts/openfonts/lavoir/Lavoir%20Small%20Caps.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'BonvenoCFLight';
  src: url('/static/fonts/openfonts/benveno/BonvenoCF-Light.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'ConsolaMonoBold';
  src: url('/static/fonts/openfonts/consolamono/ConsolaMono-Bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'ConsolaMono';
  src: url('/static/fonts/openfonts/consolamono/ConsolaMono.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

/*** Fonts ***/
@header-title-font-family: "BonvenoCFLight", sans-serif;
@console-font-family: "ConsolaMono", monospace;

@amber-penguin-yellow: #FFC200;

/*** General containers ***/
.sea-header {
  text-align: center;
  vertical-align: middle;

  color: @amber-penguin-yellow;
  padding: 15px 0;

  margin-bottom: 15px;
  margin-right: -30px;
  margin-top: 5px;

  .shadowed_border;
}

.ice-floe {
  .shadowed_border;
  padding: 15px 30px 15px 30px;
  margin-left: 15px;
  margin-right: 5px;
}

.ice-menu {
  .shadowed_border;
  padding: 10px;
  margin-bottom: 15px;
}

/*** Header ***/
.header_logo {
  height: 128px;
}

h1, h2 {
  font-family: @header-title-font-family;
}

.sea-header .header_title {
  color: @amber-penguin-yellow;
  vertical-align: middle;
  text-align: center;

  font-family: "LavoirRegular", sans-serif;
  font-size: 32pt;
  font-weight: normal;
  font-style: normal;
}

.sea-header .header_tagline {
  font-size: 12pt;
  font-family: @console-font-family;
  text-align: center;
  color: #eeeeee;
}

/*** Navigation ***/
a,
.hoverable {
  text-decoration: none;
  .small_bordered;
}

a:hover,
.hoverable:hover {
  font-weight: bold;
  .small_bordered;
}

ul.navigation-bar {
  display: inline;
  list-style: none;

  text-align: center;
  font-weight: bold;
  font-family: @header-title-font-family;
  font-size: 18px;
}

ul.navigation-bar > li > a {
  .small_bordered;
}

/*** Navigation overrides. ***/
.nav {
  text-align: center;
  font-weight: bold;
  font-family: @header-title-font-family;
  font-size: 18px;
}

.nav > li {
  .small_bordered;
}

/*** Footer ***/
footer {
  font-family: @console-font-family;
  font-size: small;
  font-weight: bold;
  text-align: center;

  padding: 5px;
  margin-top: 12pt;
}

form > ul > li {
  display: list-item;
  list-style: none;
  padding: 5px 15px;
}

/*** Mixins for borders. ***/
.small_bordered {
  border-radius: 5px;
  padding: 5px;
}

.shadowed_border {
  border-radius: 25px;
  border-style: solid;
  border-width: 1px;
  border-color: #111111;
  box-shadow: 5px 5px #111111;
}

/* Borrowed from https://github.com/JedWatson/react-codemirror/blob/master/example/src/example.less */
.ReactCodeMirror {
  border: 1px solid #ccc;
}

table {
  border-style: dashed;
  border-color: #999999;
}

td {
  padding: 10px;
  margin: 5px;
  border-style: dashed;
  border-color: #999999;
}
