:root {
    --bs-purple-rgb: 111, 66, 193;
}

body {
    font-family: 'Montserrat' !important;
}

body::-webkit-scrollbar {
    height: 5px;
    width: 5px;
    border-radius: 4px;
    transition: 0.7s;
}

body::-webkit-scrollbar-track {
    background: #000 !important;
    border-radius: 4px;
}

body::-webkit-scrollbar-thumb {
    background: #222 !important;
    border-radius: 4px;
}

body::-webkit-scrollbar-thumb:hover {
    background: var(--bs-purple) !important;
    border-radius: 4px;
    height: 10px;
    width: 10px;
}

.bg-planet {
    height: 100%;
    width: 100%;
    object-fit: cover;
    position: fixed;
    z-index: 3 !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.planet-cover {
    height: 100%;
    width: 100%;
    object-fit: cover;
    position: fixed;
    z-index: 7 !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.front-context {
    position: relative;
    z-index: 10;
}

.logo-name {
    font-size: 120px;
    font-weight: 600;
}

.team-card {
    border-radius: 0.7rem;
    border: 1px solid #333;
    transition: 0.3s;
    position: relative;
}

.team-card:hover {
    background-color: var(--bs-purple);
    cursor: pointer;
}

.text-purple {
    color: var(--bs-purple);
}

.bg-purple {
    background-color: var(--bs-purple);
}

.purple-text-button {
    font-weight: 400;
    transition: 0.3s;
}

.purple-text-button.active {
    font-weight: 700;
    border-bottom: #eee solid 1px;
}

.purple-text-button:hover {
    font-weight: 700;
    color: var(--bs-purple);
    cursor: pointer;
}

.purple-text-button.active:hover {
    cursor: default;
    border-bottom: var(--bs-purple) solid 1px;
}

.areas-card {
    background-color: rgba(1, 1, 1, 0.1);
    border-radius: 1rem;
    border: 1px solid #222;
    transition: 0.3s;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.behinder-blur {
    top: 0;
    left: 0;
    position: absolute;
    height: 100% !important;
    width: 100% !important;
    background-color: rgba(255, 255, 255, 0.05);
    z-index: -1;
    backdrop-filter: blur(12px);
}

.behinder-blur-dark {
    top: 0;
    left: 0;
    position: absolute;
    height: 100% !important;
    width: 100% !important;
    background-color: rgba(0, 0, 0, 0.25);
    z-index: -1;
    backdrop-filter: blur(12px);
}

.behinder-blur-light {
    top: 0;
    left: 0;
    position: absolute;
    height: 100% !important;
    width: 100% !important;
    background-color: rgba(255, 255, 255, 0.25);
    z-index: -1;
    backdrop-filter: blur(12px);
}

.areas-card i.icon-card-areas {
    font-size: 25px;
    border-radius: 100%;
    padding: 1rem 1.2rem;
}

.areas-card i.icon-card-areas.text-success {
    background-color: rgba(var(--bs-success-rgb), 0.15);
}

.areas-card i.icon-card-areas.text-primary {
    background-color: rgba(var(--bs-primary-rgb), 0.15);
}

.areas-card i.icon-card-areas.text-secondary {
    background-color: rgba(var(--bs-secondary-rgb), 0.15);
}

.areas-card i.icon-card-areas.text-info {
    background-color: rgba(var(--bs-info-rgb), 0.15);
}

.areas-card i.icon-card-areas.text-danger {
    background-color: rgba(var(--bs-danger-rgb), 0.15);
}

.areas-card i.icon-card-areas.text-warning {
    background-color: rgba(var(--bs-warning-rgb), 0.15);
}

.areas-card i.icon-card-areas.text-light {
    background-color: rgba(var(--bs-light-rgb), 0.15);
}

.areas-card i.icon-card-areas.text-dark {
    background-color: rgba(var(--bs-dark-rgb), 0.15);
}

.areas-card.hovered:hover {
    scale: 1.05;
}

a {
    text-decoration: none;
}

a:hover {
    color: var(--bs-purple) !important;
}

.table-planet tr:hover td {
    background-color: rgba(var(--bs-purple-rgb), 0.4);
}

.table-planet tr.active td {
    background-color: rgba(var(--bs-purple-rgb), 0.8);
}

.table-planet thead {
    position: sticky;
    top: 0;
    background-color: rgba(0, 0, 0, 0.9);
}

.table-planet-owner.scroll-table {
    max-height: 50vh;
    overflow-y: scroll;
}

.table-planet-owner.scroll-table::-webkit-scrollbar {
    height: 5px;
    width: 5px;
    border-radius: 4px;
    transition: 0.7s;
}

.table-planet-owner.scroll-table::-webkit-scrollbar-track {
    background: #0e131f !important;
    border-radius: 4px;
}

.table-planet-owner.scroll-table::-webkit-scrollbar-thumb {
    background: #222 !important;
    border-radius: 4px;
}

.table-planet-owner.scroll-table::-webkit-scrollbar-thumb:hover {
    background: var(--bs-purple) !important;
    border-radius: 4px;
    height: 10px;
    width: 10px;
}

#chatbot-container {
    position: fixed;
    bottom: 8rem;
    right: 1rem;
    width: 30vw;
    max-width: 100%;
    height: 60vh;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    overflow: hidden;
    z-index: 9999;
    transition: 0.6s;
    transition-timing-function: ease-in-out;
}

#chatbot-container.bot-hidden {
    right: -100rem;
    bottom: 50rem;
}

#nandi-bot {
    position: fixed;
    overflow: hidden;
    border-radius: 100%;
    bottom: 1rem;
    right: 1rem;
    width: 5rem;
    height: 5rem;
    z-index: 99999999;
    transition: 0.3s;
    transition-timing-function: ease-in-out;
}

#nandi-bot span.visible {
    position: fixed;
    bottom: -30rem;
    right: 7rem;
    background-color: #000;
    color: #ddd;
    padding: 0.5rem;
    border-radius: 0.5rem;
    transition: 0.3s;
    transition-timing-function: ease-in-out;
    z-index: 99;
}

#nandi-bot:hover {
    bottom: 1rem;
    right: 1rem;
    width: 6rem;
    height: 6rem;
    cursor: pointer;
}

#nandi-bot:hover span.visible {
    bottom: 3rem;
}

#nandi-bot img {
    width: 100%;
    height: auto;
    z-index: 99999;
}

@media (max-width: 767px) {
    #chatbot-container {
        height: 70vh;
        width: 90%;
    }
}

textarea::-webkit-scrollbar {
    height: 5px;
    width: 5px;
    border-radius: 4px;
    transition: 0.7s;
}

textarea::-webkit-scrollbar-track {
    background: #222 !important;
    border-radius: 4px;
}

textarea::-webkit-scrollbar-thumb {
    background: #000 !important;
    border-radius: 4px;
}

textarea::-webkit-scrollbar-thumb:hover {
    background: var(--bs-purple) !important;
    border-radius: 4px;
    height: 10px;
    width: 10px;
}

.cursor-pointer {
    cursor: pointer;
}

.repositorio-collapse:hover {
    background-color: var(--bs-purple);
}

@media (max-width: 767px) {
    .logo-name {
        font-size: 50px;
    }
}

.echart-graphic {
    height: 70vh;
}








.role-timeline {
    overflow-x: scroll;
    border: 1px solid #ddd;
    border-radius: 10px 10px 0 0;
    position: relative;
}

.role-timeline::-webkit-scrollbar {
    height: 4px;
    border-radius: 2px;
}

.role-timeline::-webkit-scrollbar-track {
    background: #eee;
}

.role-timeline::-webkit-scrollbar-thumb {
    background: #ddd;
}

.role-timeline::-webkit-scrollbar-thumb:hover {
    background: #ccc;
}

.min-scroll-bar::-webkit-scrollbar {
    height: 4px;
    width: 4px;
    border-radius: 2px;
}

.min-scroll-bar::-webkit-scrollbar-track {
    background: #eee;
}

.min-scroll-bar::-webkit-scrollbar-thumb {
    background: #ddd;
}

.min-scroll-bar::-webkit-scrollbar-thumb:hover {
    background: #ccc;
}

.min-scroll-bar-blue::-webkit-scrollbar {
    height: 5px;
    width: 5px;
    border-radius: 4px;
}

.min-scroll-bar-blue::-webkit-scrollbar-track {
    background: var(--color-blue) !important;
    border-radius: 4px;
}

.min-scroll-bar-blue::-webkit-scrollbar-thumb {
    background: var(--color-light-blue) !important;
    border-radius: 4px;
}

.min-scroll-bar-blue::-webkit-scrollbar-thumb:hover {
    background: var(--color-dark-blue) !important;
    border-radius: 4px;
}

.hidden-scroll-bar::-webkit-scrollbar {
    display: none;
}

.show-on-small {
    display: none;
}