.new-item {
    /* background-color: #fafafa; */
    border: 1px solid #ccc;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

.label {
    display: inline-block;
}

.parse-table td {
    font-size: 13px !important;
    padding: 3px 4px !important;
    /* width: auto !important; */
    /* text-align: left; */
    white-space: normal !important;
    border-bottom: 1px solid #efefef;
    border-right: 1px solid #f5f5f5;
}

/* Adds a hover effect to rows within the class */
.parse-table tbody tr:hover {
    background-color: #f7f7f7;
}

/* Styles the header row distinctly */
.parse-table thead th {
    background-color: #f5f5f5;
    padding: 2px 4px !important;
    font-weight: 500 !important;
}

.first\:ps-0 {
    &:first-child {
        font-weight: 600;
    }
}

.table-bordered th,
.table-bordered td {
    color: var(--color-zinc-600);
    border-color: #ebebeb;
    border-style: solid;
    border-width: 0.0625rem;
    padding: 0.4rem 0.5rem;
}

.bg-yellow-notes {
    background-color: #fffccc !important;
}

.bg-soft-notes {
    background-color: #fff4cf !important;
}

table a {
    /* color: #377dff; */
    color: var(--color-blue-600);
}

.featured {
    padding: 4px 20px;
    background-color: #f88379;
    border: 1px solid #efefef;
    border-radius: 2px;
    text-align: center;
    color: white;
    position: absolute;
    margin-left: 20px;
    opacity: 0.8;
    z-index: 1;
}

.new {
    padding: 4px 20px;
    background-color: #fff951;
    border: 1px solid #efefef;
    border-radius: 2px;
    text-align: center;
    color: black;
    position: absolute;
    margin-left: 20px;
    opacity: 0.8;
    z-index: 1;
}

@layer theme {
    .dark {
        table a {
            color: #6ea1ff !important;
        }

        .parse-table tbody tr:hover {
            background-color: #333 !important;
        }

        .parse-table thead th {
            background-color: #444 !important;
        }

        .bg-soft-notes {
            background-color: #6d5200 !important;
        }

        .table-bordered th,
        .table-bordered td {
            color: #ffffff !important;
            border-color: #777 !important;
            border-style: solid;
            border-width: 0.0625rem;
            padding: 0.4rem 0.5rem;
        }
    }
}

.scrollable-sticky-block {
    /* Give the block a fixed height */
    max-height: calc(100vh - 514px);
    overflow-y: auto;
    /* Adds a vertical scrollbar if content overflows */
    scrollbar-width: thin;
    /* makes the scrollbar thinner */
    scrollbar-color: #ccc #fff;
    /* thumb color, */
    /* then track color */
}

/* Optional: nicer dragging visuals */
.drag-ghost {
    opacity: 0.6;
    background: #eef5ff;
}

.row-handle:active {
    cursor: grabbing;
}