@import '../theme';

.card{
  min-height: 5rem;
  text-align: left;
  padding: 0.5rem;
  border-radius: 0.5rem;
  background: $bg-3;
  outline: $fg-3 solid 0.1rem;
  @media (prefers-color-scheme: light) {
    background: $bga-3;
    outline-color: $fga-3;
  }

  .card-button{
    background: transparent;
    border: none;
    float: right;

    color: $fg-4;
    &:hover{
      color: $fg-2;
    }
    @media (prefers-color-scheme: light) {
      color: $fga-5;
      &:hover{
        color: $fga-3;
      }
    }
  }

  p{
    margin: 0;
  }
  .card-edit-textarea{
    box-sizing: border-box;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    height: 7rem;
    min-height: 7rem;
    max-height: 15rem;
    border-radius: 0.5rem;
    border: none;
    background: $bg-4;
    color: $fg-2;
    @media (prefers-color-scheme: light) {
      background: $bga-4;
      color: $fga-2;
    }
  }
}