/* Copyright 2017-2019 @polkadot/ui-app authors & contributors
/* This software may be modified and distributed under the terms
/* of the Apache-2.0 license. See the LICENSE file for details. */

html {
  height: 100%;
}

body {
  height: 100%;
  margin: 0;
}

#root {
  color: #4e4e4e;
  font-family: sans-serif;
  height: 100%;
}

a {
  cursor: pointer;
}

h1, h2, h3, h4, h5 {
  color: rgba(0, 0, 0, .6);
  font-family: sans-serif;
  font-weight: 100;
}

h1 {
  text-transform: lowercase;
}

h3, h4, h5 {
  margin-bottom: 0.25rem;
}

label {
  box-sizing: border-box;
  color: rgba(78,78,78,.75);
  display: block;
  font-family: sans-serif;
  font-size: 1rem;
  font-weight: 100;
  /* margin: 0.25rem; */
}

/*
a:hover {
  color: #D75EA1;
}
*/

br {
  line-height: 1.5rem;
}

main {
  min-height: 100vh;
}

main > section {
  margin-bottom: 2em;
}

header > article {
  background: transparent;
}

article {
  background: white;
  border: 1px solid #f2f2f2;
  border-radius: 0.25rem;
  box-sizing: border-box;
  margin: 0.25rem;
  padding: 1.25rem 1.5rem;
  position: relative;
  text-align: left;

  &:hover {
    /* box-shadow: 0 4px 8px rgba(0,0,0,0.1); */
    /* box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    border-color: transparent; */
  }

  &.padded {
    padding: 0.75rem 2.5rem;

    > div {
      margin: 0.25rem;
    }
  }

  &.error {
    background: #fff6f6;
    border-color: #e0b4b4;
    color: #9f3a38;
  }

  &.warning {
    background: #ffffe0;
    border-color: #eeeeae;
  }

  > ul {
    margin: 0;
    padding: 0;
  }

  &:not(:hover) {
    .ui.button {
      background: #eee !important;
      color: #555 !important;
    }

    .ui.button.mini {
      visibility: hidden;
    }
  }
}

details {
  cursor: pointer;

  &[open] > summary {
    white-space: normal;
  }

  > summary {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    outline: none;
  }
}