/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* spellbook/style.css
 *
 * copyright (c) 2017-2021 drow <drow@bin.sh>
 * all rights reserved.
*/

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* spellbook style */

  body {
    margin: 0px; padding: 0px;
    background: #f3e3c0;
    background-image: url('/assets/parchment.jpg');
    color: black;
    font-family: 'Marker Felt', sans-serif; font-size: 12pt;
  }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* panel */

  div.panel { margin: 0px; padding: 0px; }

  div.login_panel div.flexrow {
    display: block;
    text-align: center;
  }
  div.login_panel div.flexrow.error {
    padding: 0.5ex 0.5em; border-radius: 0.5ex;
    color: #ff0000;
  }
  div.login_panel input {
    text-align: center;
  }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* nav */

  div.nav {
    position: -webkit-sticky; position: sticky; top: 0px;
  }
  div.nav ul {
    display: block; width: 100%; margin: 0px; padding: 0px;
    background: #000040; color: white; list-style: none;
    text-align: right;
  }
  div.nav ul.subnav {
    background: #404080;
  }
  div.nav ul.info {
    background: #f3e3c0;
    background-image: url('/assets/parchment.jpg');
    color: black;
    border-bottom: 3px double #000040;
  }
  div.nav li { display: inline-block; margin: 0px; padding: 2ex 0.5em; }
  div.nav li:last-child { padding-right: 2em; }
  div.nav select { font-size: 9pt; }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* content */

  div.content { margin: 0px; padding: 1ex 1em; text-align: center; }
  div.content table { margin-left: auto; margin-right: auto; }
  div.list table { width: 100%; }
  div.spell_card { text-align: left; }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* forms */

  div.flexform {
  }
  div.flexgroup {
    margin: 1ex 1em;
    border: 1px solid; border-radius: 0.5ex;
  }
  div.flexrow {
    padding: 1ex 1em;
    display: flex;
    flex-flow: row nowrap; align-items: top;
  }
  div.flexrow > div {
    flex-basis: 25%;
    flex-grow: 1;
    text-align: left;
  }
  div.flexrow > div.label_column {
    flex-grow: 0.25;
    margin-top: 0.5ex;
    margin-right: 1em;
    text-align: right;
    font-weight: bold;
  }

  input {
    width: 10em; margin: 0px; padding: 0.25ex 0.25em;
    font-family: 'Marker Felt', sans-serif; font-size: 12pt;
  }
  input[type="number"] {
    width: 3em;
  }
  select {
    width: 8em; margin: 0px; padding: 0.25ex 0.25em;
    font-family: 'Marker Felt', sans-serif; font-size: 12pt;
  }
  button {
    width: 10em; margin: 0px; padding: 0.5ex 0.5em;
    border: none; border-radius: 1ex;
    background: #000040; color: white;
    text-align: center;
    font-family: 'Marker Felt', sans-serif; font-size: 12pt;
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* table */

  table {
    margin: 0px; padding: 0px;
    border: none; border-collapse: collapse;
  }
  th, td {
    margin: 0px; padding: 1ex 0.5em;
    text-align: left; vertical-align: top;
  }
  th {
    background: #404080; color: white;
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* select list */

  li.selected { background: #dedeff; color: black; }
  tr.selected td { background: #dedeff; }
  li.bonus { background: #ffdeff; color: black; }
  tr.bonus td { background: #ffdeff; }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* recovery */

  tr.recover td { background: #ffffde; }
  tr.cant td { background: #dedede; }
  tr.full td { background: #deffde; }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* print style */

  @media print {
    body { background: white }
    div.nav { display: none; }
    th { background: #404040; }
  }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */