@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');

.custom-bg {
    background-color: #0B1D47 !important;
    cursor: pointer !important;
}

.bg-custom-light {
    background-color: #DAF0F7 !important;
    cursor: pointer !important;
}

.bg-custom-mid {
    background-color: #09C3F1 !important;
    cursor: pointer !important;
}

.bg-custom-dark {
    background-color: #0B1D47 !important;
    cursor: pointer !important;
}

.fg-custom-light {
    color: #DAF0F7 !important;
}

.fg-custom-mid {
    color: #09C3F1 !important;
}

.fg-custom-dark {
    color: #0B1D47 !important;
}

html, body {
    font-family: 'Open Sans', 'Jost', sans-serif !important;
}

.scrollbar-thin::-webkit-scrollbar {
    width: 8px; /* Width of the scrollbar */
}

::-webkit-scrollbar-track {
    margin-top: 30px;
}

::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 6px;
    border-top: 100px solid #3F4D53 /*or any height and color you want*/;
}

.border-top {
    border-top: 1px solid rgb(224 230 233)
}

.border-left {
    border-right: 1px solid rgb(224 230 233)
}

:disabled {
    color: gray; /* Text color for disabled elements */
    background-color: lightgray; /* Background color for disabled elements */
    border: 1px solid darkgray; /* Border color for disabled elements */
    cursor: not-allowed; /* Cursor for disabled elements */
    opacity: 0.6; /* Opacity for disabled elements */
}

@font-face {
    font-family: 'Bahamas';
    src: url("./asset/fonts/bahamas.ttf");
}

.disabled {
    pointer-events: none; /* Prevent clicking */
    opacity: 0.5; /* Visually indicate it's disabled */
    cursor: not-allowed; /* Change the cursor to indicate it's disabled */
}

/* Simple tooltip styling */
[title] {
    position: relative;
    cursor: pointer;
}

    [title]:hover::after {
        content: attr(title);
        position: absolute;
        bottom: 100%;
        left: 50%;
        transform: translateX(-50%);
        background: rgba(0, 0, 0, 0.8);
        color: white;
        padding: 4px 8px;
        border-radius: 4px;
        font-size: 12px;
        white-space: nowrap;
        z-index: 1000;
        margin-bottom: 5px;
    }

    [title]:hover::before {
        content: '';
        position: absolute;
        bottom: 100%;
        left: 50%;
        transform: translateX(-50%);
        border: 4px solid transparent;
        border-top-color: rgba(0, 0, 0, 0.8);
        margin-bottom: 1px;
        z-index: 1000;
    }

/* Ensure all buttons show pointer cursor on hover */
button {
    cursor: pointer !important;
}

    button:hover {
        cursor: pointer !important;
    }

/* Specific styling for project form buttons */
.custom-bg:hover {
    cursor: pointer !important;
}