.notAssignable {
    opacity: 0.6;
    /* Make it look disabled */
}

body {
    font-family: 'Roboto', sans-serif;
    background-color: #121212;
    color: #fff;
    justify-content: center;
    align-items: center;
    margin: 0;
}

.navbar {
    z-index: 1060 !important;
    /* Set this higher than the modal's z-index */
    background-color: rgba(18, 18, 18, 0.467) !important;
}

.hide-nav {
    z-index: 1061 !important;
}

.cookie-popup {
    min-height: 100px;
    z-index: 1000;
    animation: slideIn 0.5s ease-out;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
    border-radius: 4px !important;
    background-color: #12121277 !important;
    backdrop-filter: blur(15px);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cookie-required {
    opacity: 0.6;
    /* Visually indicate disabled state */
    pointer-events: none;
    /* Prevent interaction */
}

.cookie-accepted {
    opacity: 1;
    /* Restore normal appearance */
    pointer-events: auto;
    /* Allow interaction */
}



@keyframes slideIn {
    from {
        transform: translateY(100%);
    }

    to {
        transform: translateY(0);
    }
}


.bg-custom {
    background-color: #121212;
}

.nav-link.dropdown-toggle::after {
    display: none;
    /* Hide the default arrow */
}

.position-relative .badge {
    font-size: 0.75rem;
    padding: 0.25em 0.5em;
    z-index: -1;
    left: 15px !important;
    top: 7px !important;
    background-color: #00FF99 !important;
    color: black !important;
    border: 3px solid black !important;
}

.notification-item {
    position: relative;
    white-space: normal;
    /* Allow text to wrap normally */
    padding: 10px;
    /* Add some padding */
    border-bottom: 1px solid #cccccc10;
}

.glowing-orb {
    width: 10px;
    /* Size of the orb */
    height: 10px;
    background-color: #ff5722;
    /* Orb color */
    border-radius: 50%;
    /* Makes it circular */
    box-shadow: 0 0 5px rgba(255, 87, 34, 0.8), 0 0 10px rgba(255, 87, 34, 0.6);
    position: absolute;
    left: 8px;
    /* Position the orb */
    top: 50%;
    transform: translateY(-50%);
}

/* Notification dropdown */
#notification-list {
    max-height: 59vh;
    /* Adjust this height based on how many notifications you want visible */
    overflow-y: auto;
    /* Enable vertical scrolling */
    width: 430px;
    overflow-wrap: break-word;
    /* Allow long words to break and wrap onto the next line */
    word-wrap: break-word;
}

.not-glowing-orb {
    width: 10px;
    /* Size of the orb */
    height: 10px;
    background-color: #75757525;
    /* Orb color */
    border-radius: 50%;
    /* Makes it circular */
    position: absolute;
    left: 8px;
    /* Position the orb */
    top: 50%;
    transform: translateY(-50%);
}

.unread-notification {
    background-color: rgba(255, 87, 34, 0.1);
    /* Light background for unread */
}

#notifDropdownMenu {
    max-width: 530px !important;
    left: -70% !important;
}

.dropdown-menu {
    display: none;
    position: absolute;
    z-index: 1000;
    background-color: #00000047;
    backdrop-filter: blur(44px);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    min-width: 200px;
    transition: all 0.3s ease-in-out;
}

.dropdown.show .dropdown-menu {
    display: block;
    /* Show the menu when the dropdown is open */
}

.dropdown-item {
    padding: 10px 15px;
    /* Padding around each item */
    color: #dfdfdf;
    /* Text color */
    text-decoration: none;
    /* Remove underline from links */
    display: block;
    /* Block display for full-width click area */
    transition: background-color 0.2s ease, color 0.2s ease;
}

.dropdown-item:hover {
    background-color: #0000001a;
    /* Background color on hover */
    color: #00FF99;
    /* Text color on hover */
}



.btn-custom-primary {
    --bs-btn-color: #fff !important;
    border-radius: 2px !important;
    --bs-btn-bg: #00FF99;
    --bs-btn-border-color: #00965A;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #00965A;
    --bs-btn-hover-border-color: #00FF99;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #00965A;
    --bs-btn-active-border-color: #00FF99;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.473);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #464646;
    --bs-btn-disabled-border-color: #464646;
}

.text-body-primary {
    color: #00FF99 !important;
}

.text-body-primary-nohover {
    color: #00FF99 !important;
}

.text-body-primary:hover {
    color: #00975B !important;
}

.text-body-secondary {
    color: #464646 !important;
}

#subBlocker {
    font-family: 'Roboto', sans-serif;
    z-index: 999 !important;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #12121259;
    backdrop-filter: blur(15px);
    color: white;
    justify-content: center;
    align-items: center;

}

.modal {
    font-family: 'Roboto', sans-serif;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #12121277;
    backdrop-filter: blur(15px);
    color: white;
    justify-content: center;
    align-items: center;
}

.modal-content {
    background-color: transparent !important;
    border: 0px !important;
}

body.modal-open {
    padding-right: 0px !important;
    overflow-y: auto;
}

.tooltip-inner {
    background-color: #ffffff10;
    /* Dark background */
    color: #00FF99;
    /* White text */
    font-size: 16px;
    /* Custom font size */
    font-family: 'Roboto', sans-serif;
    /* Padding for the content */
    border-radius: 2px;
    /* Rounded corners */
    font-weight: bold;
}

.tooltip-arrow {
    bottom: 0;
    left: 50%;
    margin-left: -5px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #000
}

.tooltip-arrow::before {
    border-top-color: #00FF99 !important;
    /* Custom arrow color */
}

.custom-tooltip a {
    cursor: pointer;
    /* Change cursor when hovering over this element */

}

.card {
    background-color: #0000001a;
    backdrop-filter: blur(44px);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    transition: transform 0.3s, box-shadow 0.3s;
}

.card:hover {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
    /* Enhanced shadow on hover */
}

.card-header {
    background-color: #0000001a;
    backdrop-filter: blur(44px);
    /* Dark background for header */
    color: #fff;
    /* White text color */
    font-size: 1.25rem;
    /* Larger font size for headers */
    font-weight: bold;
    /* Bold header text */
    padding: 0.75rem 1.25rem;
    /* Padding */
}

.card-header a {
    color: inherit;
    /* Inherits the header color */
    text-decoration: none;
    /* No underline */
}

.card-header a:hover {
    text-decoration: underline;
    /* Underline on hover */
}

.card-body {
    padding: 1.25rem;
    /* Standard padding */
    font-size: 1rem;
    /* Standard font size */
    color: #00975B;
    /* Light text color */
    background-color: #0000001a;
    backdrop-filter: blur(44px);
}

/* Custom styles for nested collapsible sections */
.collapse .card-body {
    background-color: #0000001a;
    backdrop-filter: blur(44px);
}

.rotate-180 {
    transform: rotate(180deg);
    transition: transform 0.3s ease;
}

.rotate-0 {
    transform: rotate(0deg);
    transition: transform 0.3s ease;
}

.collapse {
    transition: height 0.3s ease;
    /* Adjust the duration to match chevron rotation */
}

@import url(//fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800);

.service-39 {
    font-family: "Montserrat", sans-serif;
    color: #8d97ad;
    font-weight: 300;
}

.service-39 h1,
.service-39 h2,
.service-39 h3,
.service-39 h4,
.service-39 h5,
.service-39 h6 {
    color: #3e4555;
}

.service-39 h5 {
    line-height: 26px;
    font-size: 21px;
}

.service-39 .subtitle {
    color: #8d97ad;
    line-height: 24px;
}

.service-39 .text-success-gradiant {
    background: #2cdd9b;
    background: -webkit-linear-gradient(legacy-direction(to right), #2cdd9b 0%, #1dc8cc 100%);
    background: -webkit-gradient(linear, left top, right top, from(#2cdd9b), to(#1dc8cc));
    background: -webkit-linear-gradient(left, #2cdd9b 0%, #1dc8cc 100%);
    background: -o-linear-gradient(left, #2cdd9b 0%, #1dc8cc 100%);
    background: linear-gradient(to right, #2cdd9b 0%, #1dc8cc 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.wrap-service39-box .col-lg-6>img {
    margin-left: -40px;
}

.service-39 .display-5 {
    font-size: 2.5rem;
}

.service-39 .btn-success-gradiant {
    background: #2cdd9b;
    background: -webkit-linear-gradient(legacy-direction(to right), #2cdd9b 0%, #1dc8cc 100%);
    background: -webkit-gradient(linear, left top, right top, from(#2cdd9b), to(#1dc8cc));
    background: -webkit-linear-gradient(left, #2cdd9b 0%, #1dc8cc 100%);
    background: -o-linear-gradient(left, #2cdd9b 0%, #1dc8cc 100%);
    background: linear-gradient(to right, #2cdd9b 0%, #1dc8cc 100%);
}

.service-39 .btn-success-gradiant:hover {
    background: #1dc8cc;
    background: -webkit-linear-gradient(legacy-direction(to right), #1dc8cc 0%, #2cdd9b 100%);
    background: -webkit-gradient(linear, left top, right top, from(#1dc8cc), to(#2cdd9b));
    background: -webkit-linear-gradient(left, #1dc8cc 0%, #2cdd9b 100%);
    background: -o-linear-gradient(left, #1dc8cc 0%, #2cdd9b 100%);
    background: linear-gradient(to right, #1dc8cc 0%, #2cdd9b 100%);
}

.service-39 .btn-md {
    padding: 15px 45px;
    font-size: 16px;
}