@import "@{schema}";
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: @primary[background];
    color: @primary[color];
    transition: all @shortTransition;
    width: 100;
    flex: 1;
    overflow: hidden;
    &.full-height {
        height: 100%;
    }
    &.drop-target {
        margin: @gutter;
        background: @primary[drop];
        transform: scale(.8);
    }
    &__ {
        &header {
            background: @secondary[background];
            color: @secondary[color];
            padding: @gutter;
            text-transform: uppercase;
            font-family: @font-family[subline];
            font-weight: @font-weight[subline];
            font-size: @font-size[subline];
        }
        &body {
            padding: @gutter/4;
            display: block;
            flex: 1;
            overflow: auto;
            &.drop-target{
              background: @secondary[background];
            }
        }
        &footer {
            background: @accent[background];
            color: @accent[color];
            padding: @gutter;
        }
    }
    & + .card {
        border-left: solid 1px darken(@primary[background],30%);
    }
}

.onDragenter {
  transition: all .4s;
  .card {
      &__header {
          opacity: .5;
      }
      &__body {
          padding: @gutter;
      }
      &__footer {
          opacity: .5;
      }
  }
}

/*
@media (min-width: 992px) {
  .card {
    flex-grow: 1;
    max-width: 25%;
    justify-content: flex-start; }
  .card__heading {
    writing-mode: horizontal-tb;
    border-bottom: 1px solid #05aef6;
    margin-left: 5px;
    margin-right: 5px;
    transform: translateZ(0); }
  .card--active {
    flex-grow: 5;
    max-width: 100%;
    justify-content: flex-start; }
  .body {
    display: flex;
    opacity: 1; }
  .card__search {
    display: flex; } 
}
*/