.editable {
    border-bottom: 1px dotted #aaa;
    background: #fffceb;
    padding: 2px;
}
.editable:focus {
    background: #ffffcc;
    outline: none;
}

.editable.needs-input {
    position: relative;
    border-bottom: 2px dashed red;
    background: #fff0f0;
    display: inline-block; /* Force block context so ::before appears above */
    padding: 2px;
    margin-bottom: 1em;
}

.editable.needs-input::before {
    content: '⬅ Please fill this field';
    position: absolute;
    left: 0;
    top: -1.5em;
    font-size: 12px;
    color: red;
    white-space: nowrap;
} 
.rejected {
    background: #ffe0e0 !important;
    border-bottom: 2px solid red !important;
    display: inline-block; /* 👈 add this */
    position: relative;
}

.rejected-no-note {
    background: #ffe0e0 !important;
}

.rejected::after {
    content: '✖';
    color: red;
    font-size: 12px;
    position: absolute;
    top: -1.2em;
    left: 0;
    background: #fff0f0;
    padding: 1px 4px;
    border: 1px solid #f00;
    border-radius: 3px;
    height: 18px;
    line-height: 13px !important;
}     

#contract-template .rejected {
  position: relative;
  background: #fff0f0;
  border-bottom: 2px dashed red;
  cursor: help;
}

 .tooltip-doc {
    position: absolute;
    bottom: 100%;
    left: 0;
    transform: translateY(-5px);
    background: #f44336;
    color: white;
    padding: 6px 8px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 999;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

.editable-wrapper:hover .tooltip-doc {
    opacity: 1!important;
}

.editable-wrapper {
    position: relative;
    display: inline-block;
}

.editable.approved {
    background: #dbffe0;
    color: #555;
    cursor: not-allowed;
}
.editable.approved[contenteditable] {
    pointer-events: none;
}

span.clickable-for-rejection {
    background: #dbffe0;
    color: #555;
}

div#tab-annotations {
    padding: 0px!important;
    border: solid 0px!important;
}

.project-card.in.progress {border-color: #f6ad55;background: #fffaf0;}
.in.progress svg.lucide.lucide-file-text.h-6.w-6.flex-shrink-0 {color: orange;}
.in.progress span,.in.progress h3 {color: orange;}