
.listView {
    display: grid;
    grid-template-columns: auto;
    grid-gap: 1rem;
}
.listViewLineItem.htmx-swapping {
  opacity: 0;
  transition: opacity 1s ease-out;
}
.listViewLineItem {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    /*grid-gap: 1rem;*/
}

.listViewItemBackground {
    /*z-index: 5;*/
    /*background-color: blue;*/
    border-radius: 1rem;
    margin: 1px;
}

.listViewItemBackgroundContent {
    text-align: center;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
    font-weight: bold;
}

/* Create two equal columns that floats next to each other */
.listView .listViewItem {


    transition-timing-function: ease-in;
}

/* Create two equal columns that floats next to each other */
.listView .listViewItem .listViewItemContent {
    /*float: left;*/
    /*width: 50%;*/
    padding: 1rem;
    /*background-color: #aaa;*/
    background-color: lightgray;
    /*width: 100%;*/
    border-radius: 5px;
}

/* Clear floats after the columns */
.listView .listViewItem:after {
    content: "";
    display: table;
    clear: both;
}


.prompt-action-left {
    /*background: rgba(255, 255, 150, 0.4);*/
    transform: translateX(-120px);
}

.prompt-action-right {
    /*background: rgba(255, 150, 255, 0.4);*/
    transform: translateX(120px);
}

.taskCard {
    display: grid;
    grid-template-columns: auto 70px;
}
.taskCard .taskCardOptionsText {
    border: thin solid black;
    margin-top: 0;
    margin-bottom: 0;

    display: inline-block;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    cursor: pointer;
    border-radius: 50px;
}

.taskCard h2, .taskCard p {
    margin-top: 0;
    margin-bottom: 0;
}

.taskCard .taskCardDescription {
    grid-column: 1;
    grid-row: 2;
}

.taskCard .taskCardTitle {
    grid-row: 1;
    grid-column: 1;
}

.taskCard .taskCardOptions {
    grid-row-start: 1;
    grid-row-end: 3;
    /*text-align: end;*/
    text-align: center;
}