.no-dropdown-arrow.dropdown-toggle::after {
    border-color: transparent;
}
.stripe-1 {
    background: repeating-linear-gradient(
        45deg,
        #efefef,
        #efefef 10px,
        #fafafa 10px,
        #fafafa 20px
    );
    border: 1px solid #ddd;
}

a.text-no-underline,
button.text-no-underline {
    text-decoration: none;
}

.rotate-cw-90 {
    transform: rotate(90deg);
}

.time-entry {
    /* font-size: 2em; */
}
.time-entry input[type=number] {
    font-size: 2em;
    width: 2.7em;
}
.time-entry input[type=number]::-webkit-inner-spin-button {
    opacity: 1;
}

/* editable table styles */
.editable tbody tr[data-id]:hover {
    cursor: pointer;
}

/* disclosure triangle */
/* to use, put .has-toggle on the parent class that contains both the .disclosure triangle and the content that is toggled */
target-toggler svg,
button[data-action=toggle] svg {
    width: 24px;
    height: 24px;
}

.has-toggle:has(div[hidden]) .disclosure-triangle {
    transform: rotate(0deg);
}

.has-toggle .disclosure-triangle {
    transform: rotate(90deg);
}

.has-toggle .dataTables_wrapper table {
    width: 100% !important;
}

.card:has(h2) {
    scroll-margin-top: 5rem;
}

/* css for growing textareas */
/* from: https://css-tricks.com/the-cleanest-trick-for-autogrowing-textareas/ */

.input-sizer {
    display: inline-grid;
    vertical-align: top;
    align-items: center;
    position: relative;
    /* border: solid 1px; */
    padding: .25em .5em;
    margin: 5px;
    min-width: 99%;

    &.stacked {
        padding: .5em;
        align-items: stretch;

        &::after,
        input,
        textarea {
            grid-area: 2 / 1;
        }
    }

    &::after,
    input,
    textarea {
        min-width: 99%;
        /* width: auto; */
        /* min-width: 1em; */
        grid-area: 1 / 2;
        font: inherit;
        padding: 0.25em;
        margin: 0;
        resize: none;
        background: none;
        appearance: none;
        border: none;
    }

    span {
        padding: 0.25em;
    }

    &::after {
        content: attr(data-value) ' ';
        visibility: hidden;
        white-space: pre-wrap;
    }

    &:focus-within {
        outline: solid 1px lightgray;
        /* box-shadow: 4px 4px 0px blue; */

        >span {
            color: blue;
        }

        textarea:focus,
        input:focus {
            outline: none;
        }
    }
}

.input-sizer {

    /* box-shadow: 4px 4px 0px #000; */
    >span {
        text-transform: uppercase;
        font-size: 0.8em;
        font-weight: bold;
        text-shadow: 2px 2px 0 rgba(0, 0, 0, .15);
    }
}

.dataTables_empty {
    pointer-events: none;
}

.text-danger.dropdown-item.active,
.text-danger.dropdown-item:active  {
    background-color: var(--bs-danger-bg-subtle);
}

/* table.dataTable {
    width: 100% !important;
} */

.priority-1-low {
    border-left: 5px solid var(--bs-secondary);
    padding-left: .5rem;
}
.priority-2-normal {
    border-left: 5px solid var(--bs-success);
    padding-left: .5rem;
}
.priority-3-high {
    border-left: 5px solid var(--bs-warning);
    padding-left: .5rem;
}
.priority-4-critical {
    border-left: 5px solid var(--bs-danger);
    padding-left: .5rem;
}