*, *:hover, *:active, *:focus{
  outline: none;
}

@import '../node_modules/bulmaswatch/lumen/variables';
@import "../node_modules/bulma/bulma";
@import '../node_modules/bulmaswatch/lumen/overrides';

@import url('/fonts/fonts.css');

*, *:focus, *:active{
  outline: none;
}

body {
  background: url('../public/images/llama.svg') no-repeat bottom right fixed darken(#fff, 7%);
  min-height: 100vh;
}

h1,h2,h3,h4,h5,h6{
  font-family: 'Quicksand', sans-serif;
  font-weight: 400 !important;
}

/* Logout-icon */
.logout-icon {
  padding-right: 2em !important;
}

/* Logo */
.logo {

  padding-left: 2rem !important;

  img {
    max-height: 3rem !important;
    margin-right: 1rem;
  }
}

/* Buttons icons */
.button .icon.is-small {
  margin-right: 0.05rem !important;
}

/* List active link */
.menu-list a.router-link-active{
  background: darken(#fff, 5%);
}

/* menu buttons */
.button-bottom {
  margin-bottom: 1rem;
}

/* Namespaces list */
.namespaces-lists{
  .menu-label {
    font-size: 1em;
    font-weight: 400;
    min-height: 2.5em;
    padding-top: 0.3em;
  }

  /* Namespace settings */
  .nsettings{
    vertical-align: middle;
    float: right;
    margin-left: 0.5rem;
    min-width: 2.648em;
    color: rgb(74, 74, 74);
  }
}

.bigbuttons{
  margin-top: 0.5rem;
}

.card{
  margin-bottom: 1rem;
}

.buttonright {
  margin-right: 0.5rem;
}

.tasks {
  margin-top: 1rem;
  padding: 0;
  text-align: left;

  .task {
    display: block;
    padding: 0.5rem 1rem;
    border-bottom: 1px solid darken(#fff, 10%);

    label{
      width: 96%;
      display: inline-block;
      cursor: pointer;
    }

    input[type="checkbox"] {
      vertical-align: middle;
    }

    .settings{
      float: right;
      width: 4%;
      cursor: pointer;
    }
  }

  .task:last-child {
    border-bottom: none;
  }
}

.taskedit{
  min-height: calc(100% - 1rem);
  margin-top: 1rem;

  .reminder-input{
    margin: 0;

    &:last-child {
      margin-bottom: 0.75rem;
    }

    a {
      color: $red;
      vertical-align: sub;
    }

    input {
      width: 90%;
      border: none;

      &:focus {
        border: none;
        box-shadow: none;
      }
    }
  }
}

.settings{
  float: right;
  color: rgb(74, 74, 74);
}

.column.container {
  padding:0;

  .box.shadow {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    box-shadow: 2px 2px 5px lighten(#000, 85%);
  }
}

/* Loading spinner */
.loader-container {
  &.is-loading {
    position: relative;
    pointer-events: none;
    opacity: 0.5;
    &:after {
      @include loader;
      position: absolute;
      top: calc(50% - 2.5em);
      left: calc(50% - 2.5em);
      width: 5em;
      height: 5em;
      border-width: 0.25em;
    }
  }
}