/* style.css */

.custom-scrollbar::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #475569;
    border-radius: 4px;
    border: 2px solid #0F172A;
    /* bg color to create padding effect */
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}

/* Hide scrollbar for meta info bar */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Modals */
[id^="modal-"]:not(.hidden) {
    opacity: 1;
}

[id^="modal-"]:not(.hidden)>div {
    transform: scale(1);
}

/* Diff Highlighting */
.diff-add {
    background-color: rgba(74, 222, 128, 0.15);
    /* green-400 */
    color: #4ade80;
    text-decoration: none;
    padding: 0 2px;
    border-radius: 2px;
}

.diff-del {
    background-color: rgba(248, 113, 113, 0.15);
    /* red-400 */
    color: #f87171;
    text-decoration: line-through;
    opacity: 0.7;
    padding: 0 2px;
    border-radius: 2px;
}

/* Split Pane */
#pane-resizer {
    width: 4px;
    margin: 0 -2px;
    /* overlap to make grab area bigger */
}

/* Active tab styling */
.side-tab.active {
    background-color: #0F172A;
    /* bg */
    border-top: 1px solid #475569;
    /* border */
    border-left: 1px solid #475569;
    border-right: 1px solid #475569;
    color: white;
}

.side-tab:not(.active) {
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
}