/* =================================== */
/* ============ ALLGEMEIN ============ */
/* =================================== */

.background-cover {
    background-size: cover;
}

.background-contain {
    background-size: contain;
}

.background-inherit{
    background-size: inherit;
}

.background-no-repeat {
    background-repeat: no-repeat;
}

.background-center-center {
    background-position: center center;
}

.background-center-top {
    background-position: center top;
}

.background-center-bottom {
    background-position: center bottom;
}

.background-bottom-right {
    background-position: bottom right;
}

.background-right-top {
    background-position: right top;
}

.background-center-right{
    background-position: center right;
}

.background-center-left{
    background-position: center left;
}

.max-width {
    max-width: 1440px;
}

.cursor-pointer {
    cursor: pointer;
}

.cursor-default {
    cursor: default;
}

.cursor-grab{
    cursor: grab;
}

.image-hover .image-scale{
    transition: all 0.3s;
}

.image-hover:hover .image-scale{
    transform: scale(1.1);
}

.hyphens{
    hyphens: auto;
}

.min-vh-50{
    min-height: 50vh;
}

.background-fixed{
    background-attachment: fixed;
}

/* Icons */

.book{
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3332 14.6667H3.99984C3.2665 14.6667 2.6665 14.0667 2.6665 13.3333V2.66668C2.6665 1.93334 3.2665 1.33334 3.99984 1.33334H13.3332V14.6667Z' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13.3332 14.6667H3.99984C3.2665 14.6667 2.6665 14.0667 2.6665 13.3333C2.6665 12.6 3.2665 12 3.99984 12H13.3332V14.6667Z' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.3335 8H10.6668' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.3335 5.33334H10.6668' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    height: 1rem;
    width: 1rem;
}

.card-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.6668 6.66668H1.3335V4.33334C1.3335 3.78001 1.78016 3.33334 2.3335 3.33334H13.6668C14.2202 3.33334 14.6668 3.78001 14.6668 4.33334V6.66668Z' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.6668 12.6667H2.3335C1.78016 12.6667 1.3335 12.22 1.3335 11.6667V6.66666H14.6668V11.6667C14.6668 12.22 14.2202 12.6667 13.6668 12.6667Z' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M14.6668 6H1.3335V6.66667H14.6668V6Z' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/svg%3E%0A");
    height: 1.25rem;
    width: 1.25rem;
}

/* Discord */

.discord-button{
    border: 1px solid #ffffff50;
}

.servers-grid {
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr; 
    grid-template-rows: 1fr; 
    gap: 2rem 2rem; 
    grid-template-areas: 
      ". . . . ."; 
}

.partners-grid {
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr; 
    grid-template-rows: 1fr; 
    gap: 1.5rem 1.5rem; 
    grid-template-areas: 
      ". . ."; 
}

.homepage-server-icons{
    width: 70px;
    height: 70px;
}

.white-stroke{
    border: 1px solid #ffffff50;
}

.purple-stroke{
    border: 1px solid #A36EF7;
}

.overflow-x{
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

/* Header */

.hamburger-menu{
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 700'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; fill-rule: evenodd; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_1-2' data-name='Layer_1'%3E%3Cpath class='cls-1' d='M0,50C0,22.39,22.39,0,50,0h900c27.61,0,50,22.39,50,50s-22.39,50-50,50H50C22.39,100,0,77.61,0,50ZM0,350c0-27.61,22.39-50,50-50h900c27.61,0,50,22.39,50,50s-22.39,50-50,50H50c-27.61,0-50-22.39-50-50ZM0,650c0-27.61,22.39-50,50-50h900c27.61,0,50,22.39,50,50s-22.39,50-50,50H50c-27.61,0-50-22.39-50-50Z'/%3E%3C/g%3E%3C/svg%3E");
    width: 30px;
    height: 20px;
}

.language-dropdown ::after{
    display: none !important;
}

.language-dropdown-menu{
    background-color: var(--color-backend-dark-background);
    min-width: auto !important;
    transform: translate(-16px, 22px) !important;
}

.language-dropdown-offcanvas{
    background-color: var(--color-backend-dark-background);
    min-width: auto !important;
    transform: translate3d(-16px, 25px, 0px) !important;
    z-index: 9999 !important;
}

.dropdown-language-collapsed{
    z-index: 9999 !important;
}

/* Offcanvas */

#offcanvasRight{
    width: 100% !important;
    background-color: var(--color-backend-background);
}

.btn-close {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3E%3Cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3E%3C/svg%3E");
    opacity: 100 !important;
    filter: none !important;
}

/* Home */

.hero-screen{
    background-image: url('/uploads/home-screen.webp');
}

.intro-bg{
    background-image: url('/uploads/intro-bg-1.jpg');
}

.intro-2-bg{
    background-image: url('/uploads/intro-bg-2.jpg');
}

.gray-box-stroke{
    border: 1px solid #4e4e6433;
}

.home-form-field::placeholder{
    color: var(--color-white);
}

.green-dot{
    background-image: url("data:image/svg+xml,%3Csvg width='5' height='5' viewBox='0 0 5 5' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='2.5' cy='2.5' r='2.5' fill='%238BFF8F'/%3E%3C/svg%3E%0A");
    height: 4px;
    width: 4px;
}

.discord-bot-ill{
    animation: discordbot 4.5s ease-in-out infinite;    
}

@keyframes discordbot {
    0% {
        transform: translate(0px, 0px)
    }
    50% {
        transform: translate(10px, 10px);
    }  
    100% {
        transform: translate(0px, 0px);
    }
}

/* Premium */

.premium-screen{
    background-image: url('/uploads/premium.jpg');
}

.premium-grid {
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr; 
    grid-template-rows: 1fr; 
    gap: 1.5rem 1.5rem; 
    grid-template-areas: 
      ". . ."; 
}

.glow-background{
    background-image: url('/uploads/Glow.png');
    transition: all 0.3s;
}

.glow-background a{
    transition: all 0.3s;
}

.glow-background:hover{
    transform: scale(1.1);
}

.glow-background:hover a{
    background: #ffffff15;
}

/* Partner */

.partner-screen{
    background-image: url('/uploads/partner.jpg');
}

.partner-box{
    transition: all 0.3s;
}

.partner-box:hover{
    background-color: #0e0e10;
}

/* FAQ */

.faq-screen{
    background-image: url('/uploads/FAQ.jpg');
}

#accordionFAQ{
    background-color: transparent !important;
}

#accordionFAQ .accordion-button::after{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 5L8 11L14 5'/%3E%3C/svg%3E") !important;
}

#accordionFAQ .accordion-button:not(.collapsed){
    box-shadow: none !important;
    color: var(--color-white) !important;
}

#accordionFAQ .accordion-item{
    border-bottom: 1px solid var(--color-white9);
}

/* Footer */

.footer-smoke {
    background-image: url('/uploads/footer-smoke.jpg');
}

.footer-frame{
    background-image: url('/uploads/Footer-section.webp');
    border-top: 1px solid var(--color-white9);
}

.footer-icon-1{
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='19' viewBox='0 0 18 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3_930)'%3E%3Cpath d='M4.44557 11.9565C4.44557 12.872 3.70631 13.6118 2.79163 13.6118C1.87696 13.6118 1.1377 12.872 1.1377 11.9565C1.1377 11.0411 1.87696 10.3013 2.79163 10.3013H4.44557V11.9565ZM5.27253 11.9565C5.27253 11.0411 6.0118 10.3013 6.92647 10.3013C7.84115 10.3013 8.58041 11.0411 8.58041 11.9565V16.0946C8.58041 17.01 7.84115 17.75 6.92647 17.75C6.0118 17.75 5.27253 17.01 5.27253 16.0946V11.9565Z' fill='%23919191'/%3E%3Cpath d='M6.92631 5.31002C6.01164 5.31002 5.27237 4.57018 5.27237 3.65476C5.27237 2.73936 6.01164 1.99951 6.92631 1.99951C7.84099 1.99951 8.58025 2.73936 8.58025 3.65476V5.31002H6.92631ZM6.92631 6.15019C7.84099 6.15019 8.58025 6.89004 8.58025 7.80544C8.58025 8.72085 7.84099 9.4607 6.92631 9.4607H2.77894C1.86426 9.4607 1.125 8.72085 1.125 7.80544C1.125 6.89004 1.86426 6.15019 2.77894 6.15019H6.92631Z' fill='%23919191'/%3E%3Cpath d='M13.5547 7.80544C13.5547 6.89004 14.294 6.15019 15.2087 6.15019C16.1233 6.15019 16.8627 6.89004 16.8627 7.80544C16.8627 8.72085 16.1233 9.4607 15.2087 9.4607H13.5547V7.80544ZM12.7277 7.80544C12.7277 8.72085 11.9885 9.4607 11.0739 9.4607C10.1592 9.4607 9.41992 8.72085 9.41992 7.80544V3.65476C9.41992 2.73936 10.1592 1.99951 11.0739 1.99951C11.9885 1.99951 12.7277 2.73936 12.7277 3.65476V7.80544Z' fill='%23919191'/%3E%3Cpath d='M11.0739 14.4394C11.9885 14.4394 12.7277 15.1792 12.7277 16.0946C12.7277 17.01 11.9885 17.75 11.0739 17.75C10.1592 17.75 9.41992 17.01 9.41992 16.0946V14.4394H11.0739ZM11.0739 13.6118C10.1592 13.6118 9.41992 12.872 9.41992 11.9565C9.41992 11.0411 10.1592 10.3013 11.0739 10.3013H15.2212C16.1359 10.3013 16.8752 11.0411 16.8752 11.9565C16.8752 12.872 16.1359 13.6118 15.2212 13.6118H11.0739Z' fill='%23919191'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3_930'%3E%3Crect width='18' height='18' fill='white' transform='translate(0 0.875)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    width: 22px;
    height: 22px;
}

.footer-icon-2{
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='19' viewBox='0 0 18 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3_927)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.9518 3.08257C11.7451 2.36053 10.4289 1.99951 8.99939 1.99951C7.5711 1.99951 6.25365 2.36053 5.04645 3.08257C3.84107 3.80398 2.88523 4.78326 2.18138 6.01978C1.47631 7.25756 1.125 8.60731 1.125 10.0721C1.125 11.8307 1.62593 13.4119 2.62719 14.8169C3.62845 16.2196 4.92167 17.1944 6.50806 17.7321C6.6922 17.7673 6.82909 17.7428 6.91752 17.6585C7.00657 17.5737 7.05078 17.4699 7.05078 17.3441L7.04594 16.7749C7.04231 16.4177 7.03988 16.1063 7.03988 15.8396L6.80487 15.8812C6.65464 15.9095 6.46444 15.9214 6.23548 15.9176C6.00713 15.9145 5.76908 15.8899 5.52315 15.844C5.27905 15.7988 5.05069 15.6944 4.83868 15.5296C4.62669 15.3648 4.47646 15.149 4.38742 14.8831L4.28445 14.6403C4.21661 14.4792 4.10879 14.3006 3.9622 14.1056C3.81501 13.9081 3.66661 13.7748 3.51639 13.705L3.4437 13.6528C3.39647 13.6175 3.35285 13.576 3.31045 13.527C3.26987 13.4779 3.23957 13.4289 3.21959 13.3798C3.19899 13.3294 3.21535 13.2898 3.26987 13.2584C3.32437 13.2257 3.42371 13.2112 3.56667 13.2112L3.77261 13.2427C3.9083 13.2704 4.0779 13.3546 4.2796 13.4942C4.48131 13.6352 4.64727 13.8169 4.7763 14.0414C4.93379 14.3283 5.12337 14.5471 5.34567 14.6981C5.56797 14.8491 5.7921 14.9245 6.01803 14.9245C6.24214 14.9245 6.43779 14.9057 6.60194 14.8717C6.76549 14.8365 6.91995 14.7836 7.06229 14.7144C7.12529 14.2439 7.29246 13.8829 7.56504 13.6307C7.17617 13.588 6.82606 13.5251 6.51533 13.4408C6.20398 13.3571 5.88295 13.2206 5.55222 13.0307C5.21908 12.8421 4.94469 12.6081 4.72602 12.3263C4.50797 12.0483 4.32807 11.6785 4.18875 11.2256C4.04943 10.7684 3.97856 10.2445 3.97856 9.64822C3.97856 8.80102 4.2475 8.07898 4.78781 7.48273C4.53462 6.84497 4.55763 6.13048 4.86049 5.338C5.05735 5.2751 5.35113 5.32227 5.74121 5.47951C6.13069 5.63675 6.41538 5.77198 6.59649 5.8833C6.7782 5.99652 6.92359 6.09086 7.03261 6.16759C7.66681 5.98897 8.3222 5.89903 8.99939 5.89903C9.6766 5.89903 10.332 5.99023 10.968 6.172L11.3574 5.91915C11.624 5.75122 11.9389 5.59839 12.3012 5.45688C12.6646 5.31724 12.942 5.27888 13.1335 5.34178C13.4406 6.13425 13.4684 6.84812 13.2153 7.4865C13.7544 8.0815 14.0245 8.80354 14.0245 9.65136C14.0245 10.2464 13.9542 10.7741 13.8143 11.2332C13.6749 11.6923 13.4933 12.0621 13.2704 12.3383C13.0487 12.6149 12.7725 12.8477 12.4405 13.0376C12.1092 13.2264 11.7863 13.3628 11.4774 13.4464C11.1661 13.5308 10.8172 13.5937 10.4259 13.6352C10.7814 13.9496 10.9589 14.4466 10.9589 15.1276V17.346C10.9589 17.4718 11.0013 17.5762 11.0873 17.6605C11.1721 17.7442 11.3071 17.7692 11.492 17.734C13.0789 17.1931 14.3715 16.222 15.3728 14.8157C16.374 13.4131 16.875 11.8301 16.875 10.0721C16.875 8.60793 16.5224 7.25756 15.8186 6.02041C15.1142 4.78389 14.1589 3.80461 12.9536 3.08319L12.9518 3.08257Z' fill='%23919191'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3_927'%3E%3Crect width='18' height='18' fill='white' transform='translate(0 0.875)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    width: 22px;
    height: 22px;
}

.footer-icon-3{
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='19' viewBox='0 0 18 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3_924)'%3E%3Cpath d='M18 4.72295C17.3794 4.99361 16.7128 5.1765 16.0119 5.25917C16.7269 4.8378 17.2754 4.16916 17.534 3.37324C16.8651 3.76388 16.1242 4.04772 15.3357 4.19989C14.704 3.53857 13.8047 3.12451 12.8088 3.12451C10.8973 3.12451 9.34697 4.65052 9.34697 6.53352C9.34697 6.79981 9.37819 7.05877 9.43615 7.30897C6.55776 7.16631 4.00786 5.80929 2.3 3.74778C2.00271 4.25256 1.83178 4.8378 1.83178 5.46107C1.83178 6.64325 2.44343 7.68717 3.37168 8.29802C2.80388 8.27973 2.27026 8.12684 1.80353 7.87153V7.91543C1.80353 9.56652 2.99637 10.944 4.58086 11.2571C4.28952 11.3347 3.98408 11.3756 3.66896 11.3756C3.446 11.3756 3.22824 11.3552 3.01717 11.3157C3.45789 12.6691 4.73618 13.6551 6.25157 13.6814C5.06617 14.596 3.57309 15.1409 1.95144 15.1409C1.672 15.1409 1.39627 15.1248 1.125 15.0934C2.65747 16.0613 4.47681 16.6246 6.43141 16.6246C12.8006 16.6246 16.2825 11.432 16.2825 6.92856C16.2825 6.78225 16.2787 6.63448 16.2721 6.48817C16.9483 6.00681 17.5355 5.40767 17.9985 4.72514L18 4.72295Z' fill='%23919191'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3_924'%3E%3Crect width='18' height='18' fill='white' transform='translate(0 0.875)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    width: 22px;
    height: 22px;
}





/* Backend - Homepage */

#v-pills-home .nav-link.active{
    background-color: var(--color-backend-background) !important;
}

#v-pills-home .nav-link{
    color: var(--color-nav-inactive);
}

#v-pills-home .nav-link.active{
    color: var(--color-nav);
}

#v-pills-home .nav-link .nav-icon-home{
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 8.00009C15 8.55321 14.5531 9.00009 14 9.00009C13.7156 9.00009 13.4562 8.88134 13.275 8.68759L13 8.41571V13.0001C13 13.5532 12.5531 14.0001 12 14.0001H10C9.44687 14.0001 9 13.5532 9 13.0001V10.0001H7V13.0001C7 13.5532 6.55312 14.0001 6 14.0001H4C3.44688 14.0001 3 13.5532 3 13.0001V8.39384L2.74062 8.67196C2.55625 8.87509 2.29375 9.00009 2 9.00009C1.44687 9.00009 1 8.55321 1 8.00009C1 7.73446 1.10312 7.49697 1.26875 7.31572L1.275 7.30946C1.28437 7.30009 1.29687 7.28759 1.30625 7.27821L7.275 1.3001C7.28438 1.29072 7.29375 1.28135 7.30625 1.26885C7.4875 1.09697 7.73125 0.990723 8 0.990723C8.28438 0.990723 8.54063 1.10947 8.72188 1.3001L14.6969 7.28134C14.7031 7.28759 14.7125 7.29697 14.7188 7.30322L14.7281 7.31259C14.8969 7.49384 15 7.73446 15 8.00009Z' fill='%2375798B'/%3E%3C/svg%3E%0A");
    width: 16px;
    height: 16px;
}

#v-pills-home .nav-link.active .nav-icon-home{
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 8.00009C15 8.55321 14.5531 9.00009 14 9.00009C13.7156 9.00009 13.4562 8.88134 13.275 8.68759L13 8.41571V13.0001C13 13.5532 12.5531 14.0001 12 14.0001H10C9.44687 14.0001 9 13.5532 9 13.0001V10.0001H7V13.0001C7 13.5532 6.55312 14.0001 6 14.0001H4C3.44688 14.0001 3 13.5532 3 13.0001V8.39384L2.74062 8.67196C2.55625 8.87509 2.29375 9.00009 2 9.00009C1.44687 9.00009 1 8.55321 1 8.00009C1 7.73446 1.10312 7.49697 1.26875 7.31572L1.275 7.30946C1.28437 7.30009 1.29687 7.28759 1.30625 7.27821L7.275 1.3001C7.28438 1.29072 7.29375 1.28135 7.30625 1.26885C7.4875 1.09697 7.73125 0.990723 8 0.990723C8.28438 0.990723 8.54063 1.10947 8.72188 1.3001L14.6969 7.28134C14.7031 7.28759 14.7125 7.29697 14.7188 7.30322L14.7281 7.31259C14.8969 7.49384 15 7.73446 15 8.00009Z' fill='%23747CDB'/%3E%3C/svg%3E%0A");
    width: 16px;
    height: 16px;
}

#v-pills-home .nav-link .nav-icon-message{
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.8 8.4H8.4V7H2.8V8.4ZM2.8 6.3H11.2V4.9H2.8V6.3ZM2.8 4.2H11.2V2.8H2.8V4.2ZM0 14V1.4C0 1.015 0.137083 0.685417 0.41125 0.41125C0.685417 0.137083 1.015 0 1.4 0H12.6C12.985 0 13.3146 0.137083 13.5887 0.41125C13.8629 0.685417 14 1.015 14 1.4V9.8C14 10.185 13.8629 10.5146 13.5887 10.7887C13.3146 11.0629 12.985 11.2 12.6 11.2H2.8L0 14ZM2.205 9.8H12.6V1.4H1.4V10.5875L2.205 9.8Z' fill='%2375798B'/%3E%3C/svg%3E%0A");
    width: 14px;
    height: 14px;
}

#v-pills-home .nav-link.active .nav-icon-message{
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.8 8.4H8.4V7H2.8V8.4ZM2.8 6.3H11.2V4.9H2.8V6.3ZM2.8 4.2H11.2V2.8H2.8V4.2ZM0 14V1.4C0 1.015 0.137083 0.685417 0.41125 0.41125C0.685417 0.137083 1.015 0 1.4 0H12.6C12.985 0 13.3146 0.137083 13.5887 0.41125C13.8629 0.685417 14 1.015 14 1.4V9.8C14 10.185 13.8629 10.5146 13.5887 10.7887C13.3146 11.0629 12.985 11.2 12.6 11.2H2.8L0 14ZM2.205 9.8H12.6V1.4H1.4V10.5875L2.205 9.8Z' fill='%23747CDB'/%3E%3C/svg%3E%0A");
    width: 14px;
    height: 14px;
}

.nav-dropdown{
    border: 1px solid #5E65AD !important;
}

.nav-dropdown-collapsed{
    border: 1px solid var(--color-backend-background) !important;
}

.nav-dropdown-collapsed .dropdown-item:focus, .nav-dropdown-collapsed .dropdown-item:hover{
    background-color: var(--color-backend-background) !important;
}

.metric-box{
    padding: 1rem;
    width: 140px;
    height: 140px;
    padding: 3px;
}

.metrics-grid {
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr; 
    grid-template-rows: 1fr; 
    gap: 1.5rem 1.5rem; 
    grid-template-areas: 
      ". . ."; 
}

.users-box {
    background: linear-gradient(to right, #B7F87F, #1BC85D);
}

.users-box-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.25 25V21.5C1.25 20.7917 1.43229 20.1406 1.79688 19.5469C2.16146 18.9531 2.64583 18.5 3.25 18.1875C4.54167 17.5417 5.85417 17.0573 7.1875 16.7344C8.52083 16.4115 9.875 16.25 11.25 16.25C12.625 16.25 13.9792 16.4115 15.3125 16.7344C16.6458 17.0573 17.9583 17.5417 19.25 18.1875C19.8542 18.5 20.3385 18.9531 20.7031 19.5469C21.0677 20.1406 21.25 20.7917 21.25 21.5V25H1.25ZM23.75 25V21.25C23.75 20.3333 23.4948 19.4531 22.9844 18.6094C22.474 17.7656 21.75 17.0417 20.8125 16.4375C21.875 16.5625 22.875 16.776 23.8125 17.0781C24.75 17.3802 25.625 17.75 26.4375 18.1875C27.1875 18.6042 27.7604 19.0677 28.1562 19.5781C28.5521 20.0885 28.75 20.6458 28.75 21.25V25H23.75ZM11.25 15C9.875 15 8.69792 14.5104 7.71875 13.5312C6.73958 12.5521 6.25 11.375 6.25 10C6.25 8.625 6.73958 7.44792 7.71875 6.46875C8.69792 5.48958 9.875 5 11.25 5C12.625 5 13.8021 5.48958 14.7812 6.46875C15.7604 7.44792 16.25 8.625 16.25 10C16.25 11.375 15.7604 12.5521 14.7812 13.5312C13.8021 14.5104 12.625 15 11.25 15ZM23.75 10C23.75 11.375 23.2604 12.5521 22.2812 13.5312C21.3021 14.5104 20.125 15 18.75 15C18.5208 15 18.2292 14.974 17.875 14.9219C17.5208 14.8698 17.2292 14.8125 17 14.75C17.5625 14.0833 17.9948 13.3438 18.2969 12.5312C18.599 11.7188 18.75 10.875 18.75 10C18.75 9.125 18.599 8.28125 18.2969 7.46875C17.9948 6.65625 17.5625 5.91667 17 5.25C17.2917 5.14583 17.5833 5.07812 17.875 5.04688C18.1667 5.01562 18.4583 5 18.75 5C20.125 5 21.3021 5.48958 22.2812 6.46875C23.2604 7.44792 23.75 8.625 23.75 10ZM3.75 22.5H18.75V21.5C18.75 21.2708 18.6927 21.0625 18.5781 20.875C18.4635 20.6875 18.3125 20.5417 18.125 20.4375C17 19.875 15.8646 19.4531 14.7188 19.1719C13.5729 18.8906 12.4167 18.75 11.25 18.75C10.0833 18.75 8.92708 18.8906 7.78125 19.1719C6.63542 19.4531 5.5 19.875 4.375 20.4375C4.1875 20.5417 4.03646 20.6875 3.92188 20.875C3.80729 21.0625 3.75 21.2708 3.75 21.5V22.5ZM11.25 12.5C11.9375 12.5 12.526 12.2552 13.0156 11.7656C13.5052 11.276 13.75 10.6875 13.75 10C13.75 9.3125 13.5052 8.72396 13.0156 8.23438C12.526 7.74479 11.9375 7.5 11.25 7.5C10.5625 7.5 9.97396 7.74479 9.48438 8.23438C8.99479 8.72396 8.75 9.3125 8.75 10C8.75 10.6875 8.99479 11.276 9.48438 11.7656C9.97396 12.2552 10.5625 12.5 11.25 12.5Z' fill='%23B6F87F'/%3E%3C/svg%3E%0A");
    width: 30px;
    height: 30px;
}

.messages-box {
    background: linear-gradient(to right, #7DE2F5, #7398E8);
}

.messages-box-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.75 22.5V7.5H11.25V22.5H8.75ZM13.75 27.5V2.5H16.25V27.5H13.75ZM3.75 17.5V12.5H6.25V17.5H3.75ZM18.75 22.5V7.5H21.25V22.5H18.75ZM23.75 17.5V12.5H26.25V17.5H23.75Z' fill='%2380F1F8'/%3E%3C/svg%3E%0A");
    width: 30px;
    height: 30px;
}

.pink-box {
    background: linear-gradient(to right, #F67BF7, #BE2BC1);
}

.pink-box-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 27.5C12.1042 26.7708 9.71354 25.1094 7.82812 22.5156C5.94271 19.9219 5 17.0417 5 13.875V6.25L15 2.5L25 6.25V13.875C25 17.0417 24.0573 19.9219 22.1719 22.5156C20.2865 25.1094 17.8958 26.7708 15 27.5ZM15 24.875C17.1667 24.1875 18.9583 22.8125 20.375 20.75C21.7917 18.6875 22.5 16.3958 22.5 13.875V7.96875L15 5.15625L7.5 7.96875V13.875C7.5 16.3958 8.20833 18.6875 9.625 20.75C11.0417 22.8125 12.8333 24.1875 15 24.875Z' fill='%23FF88FF'/%3E%3C/svg%3E%0A");
    width: 30px;
    height: 30px;
}

.logs-border{
    border-bottom: 1px solid #262831;
}

.log-icon{
    max-width: 25px;
}

.date-container{
    min-width: 110px;
}

.time-container {
    min-width: 65px;
}

.icon-logs-container{
    min-width: 50px;
}

.nav-dropdown.btn.show, .nav-dropdown.btn:hover{
    background-color: var(--color-backend-dark-background) !important;
}

.dropdown-language-collapsed .dropdown-item:active{
    background-color: var(--color-backend-background) !important;
}

/* Mobile Navigation */

#v-pills-home-mobile .nav-link.active{
    background-color: var(--color-backend-dark-background) !important;
}

#v-pills-home-mobile .nav-link{
    color: var(--color-nav-inactive);
}

#v-pills-home-mobile .nav-link.active{
    color: var(--color-nav);
}

#v-pills-home-mobile .nav-link .nav-icon-home{
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 8.00009C15 8.55321 14.5531 9.00009 14 9.00009C13.7156 9.00009 13.4562 8.88134 13.275 8.68759L13 8.41571V13.0001C13 13.5532 12.5531 14.0001 12 14.0001H10C9.44687 14.0001 9 13.5532 9 13.0001V10.0001H7V13.0001C7 13.5532 6.55312 14.0001 6 14.0001H4C3.44688 14.0001 3 13.5532 3 13.0001V8.39384L2.74062 8.67196C2.55625 8.87509 2.29375 9.00009 2 9.00009C1.44687 9.00009 1 8.55321 1 8.00009C1 7.73446 1.10312 7.49697 1.26875 7.31572L1.275 7.30946C1.28437 7.30009 1.29687 7.28759 1.30625 7.27821L7.275 1.3001C7.28438 1.29072 7.29375 1.28135 7.30625 1.26885C7.4875 1.09697 7.73125 0.990723 8 0.990723C8.28438 0.990723 8.54063 1.10947 8.72188 1.3001L14.6969 7.28134C14.7031 7.28759 14.7125 7.29697 14.7188 7.30322L14.7281 7.31259C14.8969 7.49384 15 7.73446 15 8.00009Z' fill='%2375798B'/%3E%3C/svg%3E%0A");
    width: 16px;
    height: 16px;
}

#v-pills-home-mobile .nav-link.active .nav-icon-home{
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 8.00009C15 8.55321 14.5531 9.00009 14 9.00009C13.7156 9.00009 13.4562 8.88134 13.275 8.68759L13 8.41571V13.0001C13 13.5532 12.5531 14.0001 12 14.0001H10C9.44687 14.0001 9 13.5532 9 13.0001V10.0001H7V13.0001C7 13.5532 6.55312 14.0001 6 14.0001H4C3.44688 14.0001 3 13.5532 3 13.0001V8.39384L2.74062 8.67196C2.55625 8.87509 2.29375 9.00009 2 9.00009C1.44687 9.00009 1 8.55321 1 8.00009C1 7.73446 1.10312 7.49697 1.26875 7.31572L1.275 7.30946C1.28437 7.30009 1.29687 7.28759 1.30625 7.27821L7.275 1.3001C7.28438 1.29072 7.29375 1.28135 7.30625 1.26885C7.4875 1.09697 7.73125 0.990723 8 0.990723C8.28438 0.990723 8.54063 1.10947 8.72188 1.3001L14.6969 7.28134C14.7031 7.28759 14.7125 7.29697 14.7188 7.30322L14.7281 7.31259C14.8969 7.49384 15 7.73446 15 8.00009Z' fill='%23747CDB'/%3E%3C/svg%3E%0A");
    width: 16px;
    height: 16px;
}

#v-pills-home-mobile .nav-link .nav-icon-message{
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.8 8.4H8.4V7H2.8V8.4ZM2.8 6.3H11.2V4.9H2.8V6.3ZM2.8 4.2H11.2V2.8H2.8V4.2ZM0 14V1.4C0 1.015 0.137083 0.685417 0.41125 0.41125C0.685417 0.137083 1.015 0 1.4 0H12.6C12.985 0 13.3146 0.137083 13.5887 0.41125C13.8629 0.685417 14 1.015 14 1.4V9.8C14 10.185 13.8629 10.5146 13.5887 10.7887C13.3146 11.0629 12.985 11.2 12.6 11.2H2.8L0 14ZM2.205 9.8H12.6V1.4H1.4V10.5875L2.205 9.8Z' fill='%2375798B'/%3E%3C/svg%3E%0A");
    width: 14px;
    height: 14px;
}

#v-pills-home-mobile .nav-link.active .nav-icon-message{
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.8 8.4H8.4V7H2.8V8.4ZM2.8 6.3H11.2V4.9H2.8V6.3ZM2.8 4.2H11.2V2.8H2.8V4.2ZM0 14V1.4C0 1.015 0.137083 0.685417 0.41125 0.41125C0.685417 0.137083 1.015 0 1.4 0H12.6C12.985 0 13.3146 0.137083 13.5887 0.41125C13.8629 0.685417 14 1.015 14 1.4V9.8C14 10.185 13.8629 10.5146 13.5887 10.7887C13.3146 11.0629 12.985 11.2 12.6 11.2H2.8L0 14ZM2.205 9.8H12.6V1.4H1.4V10.5875L2.205 9.8Z' fill='%23747CDB'/%3E%3C/svg%3E%0A");
    width: 14px;
    height: 14px;
}

.server-einfuegen{
    border: 1px solid var(--color-server-green);
    transition: all 0.3s;
    background-color: transparent !important;
}

.server-einfuegen:hover{
    background-color: var(--color-server-green) !important;
    border: 1px solid var(--color-server-green) !important;
}

.servers-grid {
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr; 
    grid-template-rows: 1fr; 
    gap: 1.5rem 1.5rem; 
    grid-template-areas: 
      ". . ."; 
}

.color-picker{
    height: 35px;
    width: 35px;
    border: none !important;
    padding: 0px !important;
}

.color-picker-container{
    border: 2px dotted #75798B;
}

.emojy-picker-container{
    border: 2px dotted #75798B;
}

.form-control:focus{
    background-color: var(--color-backend-dark-background) !important;
    color: var(--color-white) !important;
}

.form-floating>.form-control:focus~label{
    background-color: transparent !important;
    color: var(--color-white) !important;
}

.form-floating>.form-control:focus~label::after,
.form-floating>.form-control:not(:placeholder-shown)~label::after{
    background-color: transparent !important;
    color: var(--color-white) !important;
}

.form-floating>.form-control:not(:placeholder-shown)~label{
    color: #555658 !important;
}

.url-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='17' height='16' viewBox='0 0 17 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3812_55)'%3E%3Cpath d='M5.89392 4.54645C5.95266 4.46092 5.9927 4.38608 6.04877 4.32727C6.63345 3.71785 7.21813 3.10575 7.81349 2.50435C8.34745 1.96443 8.88141 1.4245 9.44473 0.916647C10.0428 0.37672 10.7663 0.0933927 11.5672 0.0185514C12.2587 -0.0429254 12.9315 0.0345888 13.5615 0.3393C14.795 0.935357 15.636 1.88156 15.935 3.22604C16.1833 4.33262 15.975 5.39109 15.3236 6.33195C15.118 6.62864 14.851 6.88257 14.5947 7.13917C13.7511 7.99449 12.9021 8.84715 12.0504 9.69179C11.4471 10.2905 10.7102 10.6246 9.87723 10.7342C8.63846 10.8999 7.55719 10.5498 6.63879 9.69981C6.47059 9.54478 6.3291 9.36569 6.28638 9.13315C6.21696 8.73222 6.36647 8.41681 6.68952 8.18962C6.99654 7.97044 7.32759 7.95173 7.65331 8.1522C7.78947 8.23506 7.90961 8.3393 8.03776 8.43552C8.75326 8.9701 9.51948 9.05296 10.3124 8.64936C10.5393 8.53175 10.7342 8.33663 10.9211 8.1522C11.8235 7.25677 12.7125 6.34799 13.6149 5.44989C14.0368 5.03024 14.1329 4.52239 14.1382 3.95307C14.1462 2.8946 13.0463 1.94571 12.1839 1.88156C11.5752 1.83613 11.0279 1.98314 10.5821 2.42149C9.94131 3.0523 9.30056 3.6831 8.65981 4.31391C8.54768 4.4235 8.43555 4.53041 8.32876 4.64535C8.28071 4.6988 8.23265 4.70415 8.16857 4.68544C7.63462 4.53576 7.08998 4.44488 6.53467 4.47428C6.36647 4.4823 6.19828 4.50903 6.03008 4.52774C5.99537 4.53041 5.96067 4.53576 5.89926 4.5411L5.89392 4.54645Z' fill='%2375798B'/%3E%3Cpath d='M10.1522 11.5012C10.1015 11.5653 10.0561 11.6348 10 11.6936C9.24447 12.4768 8.49426 13.2653 7.73071 14.0431C7.35694 14.4226 6.97516 14.7969 6.56935 15.139C5.982 15.6335 5.29053 15.9088 4.5243 15.9756C4.02772 16.021 3.5258 16.0104 3.05058 15.8527C1.43269 15.3101 0.380799 14.2329 0.0924627 12.5222C-0.11845 11.2766 0.228622 10.162 1.10431 9.23989C2.13218 8.15469 3.19208 7.09889 4.28936 6.08586C4.67648 5.72769 5.14903 5.50851 5.64828 5.37754C7.03923 5.01135 8.28869 5.29735 9.37529 6.24891C9.57285 6.42265 9.74372 6.61777 9.78911 6.89041C9.85051 7.26996 9.70634 7.572 9.40733 7.79652C9.11632 8.0157 8.79595 8.05579 8.47024 7.87938C8.31806 7.79652 8.17656 7.68426 8.0404 7.572C7.32757 6.98396 6.29436 6.93852 5.56818 7.48112C5.2665 7.70564 4.99952 7.98362 4.73254 8.25091C3.99301 8.98864 3.26416 9.73972 2.52463 10.4774C2.13485 10.8677 1.92927 11.3301 1.91325 11.878C1.89456 12.4821 2.13752 12.9846 2.54599 13.4123C2.84501 13.725 3.1814 13.9843 3.62191 14.0591C4.12116 14.1447 4.61774 14.1473 5.07961 13.8907C5.18907 13.8293 5.29053 13.7517 5.3813 13.6635C6.17155 12.8964 6.95914 12.124 7.74406 11.3515C7.79478 11.3007 7.84017 11.2873 7.90958 11.3087C8.31272 11.4317 8.72386 11.5145 9.14569 11.5199C9.43136 11.5225 9.71702 11.4985 10.0027 11.4851C10.0454 11.4851 10.0881 11.4798 10.1308 11.4771C10.1362 11.4851 10.1415 11.4931 10.1469 11.5012H10.1522Z' fill='%2375798B'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3812_55'%3E%3Crect width='16' height='16' fill='white' transform='translate(0.036377)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    height: 16px;
    width: 16px;
}

.form-select:focus, .form-control:focus{
    box-shadow: 0 0 0 .25rem rgb(36 40 51) !important;
}

.form-check{
    padding: 1rem .75rem;
}

.form-check .form-check-input{
    margin-left: 0px !important;
}

.form-check-input{
    background-color: transparent !important;
    border: 1px solid var(--color-nav-inactive) !important;
}

.message-fields{
    list-style-type: none;
}

.add-button-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='7' height='7' viewBox='0 0 7 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.72443 6.5625V0H3.83807V6.5625H2.72443ZM0 3.83807V2.72443H6.5625V3.83807H0Z' fill='%23747CDB'/%3E%3C/svg%3E%0A");
    width: 7px;
    height: 7px;
}

.add-button{
    border: 1px dotted #75798B;
}

.add-container{
    padding: 1rem .75rem;
    border: 1px dotted #75798B !important;
}

.added-container{
    padding: 1rem .75rem;
}

.delete-icon{
    width: 33px;
    height: 33px;
    right: -3rem;
}

.drag-icon{
    width: 10px;
    height: 16px;
    left: -1.5rem;
    top: 0.3rem;
}

.roles-content-container{
    border-left: 1px solid var(--color-backend-background);
}

.cancel-button{
    border: 1px solid #75798B;
    color: #75798B !important;
    background-color: transparent !important;
    transition: all 0.3s;
}

.cancel-button:hover{
    background-color: #75798B !important;
    border: 1px solid #75798B;
    color: #ffffff !important;
}

.alert-icon{
    max-width: 25px;
    max-height: 25px;
}

.alert-danger{
    --bs-alert-color: #ea868f !important;
    --bs-alert-bg: #2c0b0e !important;
    --bs-alert-border-color: #842029 !important;
    --bs-alert-link-color: #ea868f !important;
}

.danger-icon{
    fill: #ea868f !important;
}

.alert-warning {
    --bs-alert-color: #ffda6a !important;
    --bs-alert-bg: #332701 !important;
    --bs-alert-border-color: #997404;
    --bs-alert-link-color: #ffda6a;
}

.warning-icon{
    fill: #ffda6a !important;
}

.alert-success {
    --bs-alert-color: #75b798 !important;
    --bs-alert-bg: #051b11 !important;
    --bs-alert-border-color: #0f5132 !important;
    --bs-alert-link-color: #75b798 !important;
}

.succes-icon{
    fill: #75b798 !important;
}

.metrics-box{
    transition: all 0.3s;
}

.metrics-box:hover{
    -webkit-box-shadow: 0px 0px 25px 0px rgb(52, 55, 65);
    -moz-box-shadow: 0px 0px 25px 0px rgb(52, 55, 65);
    box-shadow: 0px 0px 25px 0px rgb(52, 55, 65);
}

.server-box{
    transition: all 0.3s;
}

.server-box:hover{
    -webkit-box-shadow: 0px 0px 25px 0px rgb(62 65 75);
    -moz-box-shadow: 0px 0px 25px 0px rgb(62 65 75);
    box-shadow: 0px 0px 25px 0px rgb(62 65 75);
}

.emojies-grid{
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr; 
    grid-template-rows: 1fr; 
    gap: 1rem 1rem; 
    grid-template-areas: 
      ". . . . . . ."; 
}

.emojis-icons{
    width: 33px;
    height: 33px;
}

input[type=color] {
    border-radius: 50%;
    overflow: hidden;
}

input[type=color]::-webkit-color-swatch {
    border: none;
    border-radius: 50%;
    padding: 0;
}
  
input[type=color]::-webkit-color-swatch-wrapper {
      border: none;
      border-radius: 50%;
      padding: 0;
}

.emojis-padding{
    padding: 12px;
    transition: 0.75s ease;
    border: 1px solid var(--color-backend-background);
}

.emojis-padding:hover{
    border: 1px solid var(--color-nav);
    transition: all 0s ease;
}

.active-emoji{
    border: 1px solid var(--color-nav) !important;
    background-color: var(--color-nav) !important;
}

.form-check-input:focus{
    box-shadow: 0 0 0 .25rem rgb(36 40 51) !important;
}

.navigation-dropdown-width{
    max-width: 200px;
    text-overflow: ellipsis;
}

.dropdown-item.active, dropdown-item:active {
    background-color: var(--color-nav)
}


/* Backend Administratoren */

.status-box{
    width: 18px;
    height: 18px;
}

#user-status .form-check-input {
    background-color: transparent !important;
    border: 1px solid #ffbf81 !important;
}

#user-status.form-switch .form-check-input{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23ffbf81'/%3E%3C/svg%3E") !important;
}

#user-status .form-check-input:checked{
    border: 1px solid var(--color-server-green) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%2363BB73'/%3E%3C/svg%3E") !important;
}

.bootstrap-table .fixed-table-container .table thead th .th-inner{
    font-family: 'Inter Light';
    font-size: 1rem !important;
    line-height: 1.5rem !important;
    padding: 1rem 1rem 0rem 1rem !important;
    font-weight: 400 !important;
}

.bootstrap-table .fixed-table-container .table th{
    padding: 0px !important;
}

.bootstrap-table .fixed-table-container .table thead tr{
    border-top: 0px !important;
}

.table thead>:not(caption)>*>*{
    background-color: var(--color-backend-dark-background) !important;
}

.fht-cell{
    padding: 0px !important;
}

.table>:not(caption)>*>*{
    background-color: var(--color-dark-box) !important;
    box-shadow: none !important;
    color: var(--color-nav-inactive) !important;
    border: 0px !important;
    padding: 1rem 1rem !important;
    font-family: 'Inter Light';
}

.table-bordered>:not(caption)>*>*{
    border-bottom: 15px solid var(--color-backend-dark-background) !important;
    border-top: 0px !important;
}

.table-bordered>:not(caption)>*{
    border-radius: 1rem !important;
}

.table{
    border: none !important;
}

.table-check-icon{
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1139.99 866.18'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %2362ba72; fill-rule: evenodd; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_1-2' data-name='Layer_1'%3E%3Cpath class='cls-1' d='M383.05,639.56L1015.86,6.75c9-9,23.62-9,32.62,0l84.75,84.75c9,9,9,23.58,0,32.62L399.32,859.4c-9,9-23.58,9.05-32.62.05L6.79,500.81c-9.05-9-9.05-23.62-.05-32.62l86.16-86.16c9-9,23.63-9,32.63,0l257.53,257.53Z'/%3E%3C/g%3E%3C/svg%3E");
    width: 15px;
    height: 10px;
}

.table-inactive-icon{
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='1200pt' height='1200pt' version='1.1' viewBox='0 0 1200 1200' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1200 113.3-113.3-113.3-484.12 484.12-489.27-484.12-113.3 113.3 484.12 489.27-484.12 484.12 113.3 113.3 489.27-484.12 484.12 484.12 113.3-113.3-484.12-484.12z' fill='%2375788b' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
    width: 15px;
    height: 10px;
}

.bootstrap-table .fixed-table-container .table thead th .both{
    background-size: 16px 16px;
    background-position: bottom 4px right 0px;
}

.bootstrap5 .form-control{
    background-color: var(--color-dark-box);
    border: 0px !important;
    color: var(--color-nav-inactive);
}

.bootstrap5 .form-control::placeholder{
    color: var(--color-nav-inactive);
}

.bootstrap5 .form-control:focus{
    background-color: var(--color-dark-box) !important;
    border: 0px !important;
    color: var(--color-nav-inactive);
}

.add-icon{
    width: 33px;
    height: 33px;
    right: -3rem;
    top: 10px !important;
}

.dropdown-roles:hover{
    background-color: var(--color-dark-box) !important;
}

.ellipsis-text{
    text-overflow: ellipsis;
}


/* Footer */

.instagram-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3907_1269)'%3E%3Cpath d='M12.5 2.25098C15.8398 2.25098 16.2354 2.26562 17.5488 2.32422C18.7695 2.37793 19.4287 2.58301 19.8682 2.75391C20.4492 2.97852 20.8691 3.25195 21.3037 3.68652C21.7432 4.12598 22.0117 4.54102 22.2363 5.12207C22.4072 5.56152 22.6123 6.22559 22.666 7.44141C22.7246 8.75977 22.7393 9.15527 22.7393 12.4902C22.7393 15.8301 22.7246 16.2256 22.666 17.5391C22.6123 18.7598 22.4072 19.4189 22.2363 19.8584C22.0117 20.4395 21.7383 20.8594 21.3037 21.2939C20.8643 21.7334 20.4492 22.002 19.8682 22.2266C19.4287 22.3975 18.7646 22.6025 17.5488 22.6563C16.2305 22.7148 15.835 22.7295 12.5 22.7295C9.16016 22.7295 8.76465 22.7148 7.45117 22.6563C6.23047 22.6025 5.57129 22.3975 5.13184 22.2266C4.55078 22.002 4.13086 21.7285 3.69629 21.2939C3.25684 20.8545 2.98828 20.4395 2.76367 19.8584C2.59277 19.4189 2.3877 18.7549 2.33398 17.5391C2.27539 16.2207 2.26074 15.8252 2.26074 12.4902C2.26074 9.15039 2.27539 8.75488 2.33398 7.44141C2.3877 6.2207 2.59277 5.56152 2.76367 5.12207C2.98828 4.54102 3.26172 4.12109 3.69629 3.68652C4.13574 3.24707 4.55078 2.97852 5.13184 2.75391C5.57129 2.58301 6.23535 2.37793 7.45117 2.32422C8.76465 2.26562 9.16016 2.25098 12.5 2.25098ZM12.5 0C9.10645 0 8.68164 0.0146484 7.34863 0.0732422C6.02051 0.131836 5.10742 0.34668 4.31641 0.654297C3.49121 0.976563 2.79297 1.40137 2.09961 2.09961C1.40137 2.79297 0.976562 3.49121 0.654297 4.31152C0.34668 5.10742 0.131836 6.01563 0.0732422 7.34375C0.0146484 8.68164 0 9.10645 0 12.5C0 15.8936 0.0146484 16.3184 0.0732422 17.6514C0.131836 18.9795 0.34668 19.8926 0.654297 20.6836C0.976562 21.5088 1.40137 22.207 2.09961 22.9004C2.79297 23.5938 3.49121 24.0234 4.31152 24.3408C5.10742 24.6484 6.01562 24.8633 7.34375 24.9219C8.67676 24.9805 9.10156 24.9951 12.4951 24.9951C15.8887 24.9951 16.3135 24.9805 17.6465 24.9219C18.9746 24.8633 19.8877 24.6484 20.6787 24.3408C21.499 24.0234 22.1973 23.5938 22.8906 22.9004C23.584 22.207 24.0137 21.5088 24.3311 20.6885C24.6387 19.8926 24.8535 18.9844 24.9121 17.6563C24.9707 16.3232 24.9854 15.8984 24.9854 12.5049C24.9854 9.11133 24.9707 8.68652 24.9121 7.35352C24.8535 6.02539 24.6387 5.11231 24.3311 4.32129C24.0234 3.49121 23.5986 2.79297 22.9004 2.09961C22.207 1.40625 21.5088 0.976563 20.6885 0.65918C19.8926 0.351563 18.9844 0.136719 17.6563 0.078125C16.3184 0.0146484 15.8936 0 12.5 0Z' fill='%234E515E'/%3E%3Cpath d='M12.5 6.0791C8.95508 6.0791 6.0791 8.95508 6.0791 12.5C6.0791 16.0449 8.95508 18.9209 12.5 18.9209C16.0449 18.9209 18.9209 16.0449 18.9209 12.5C18.9209 8.95508 16.0449 6.0791 12.5 6.0791ZM12.5 16.665C10.2002 16.665 8.33496 14.7998 8.33496 12.5C8.33496 10.2002 10.2002 8.33496 12.5 8.33496C14.7998 8.33496 16.665 10.2002 16.665 12.5C16.665 14.7998 14.7998 16.665 12.5 16.665Z' fill='%234E515E'/%3E%3Cpath d='M20.6738 5.8252C20.6738 6.65528 20 7.32422 19.1748 7.32422C18.3447 7.32422 17.6758 6.65039 17.6758 5.8252C17.6758 4.99512 18.3496 4.32617 19.1748 4.32617C20 4.32617 20.6738 5 20.6738 5.8252Z' fill='%234E515E'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3907_1269'%3E%3Crect width='25' height='25' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    height: 25px;
    width: 25px;
}   

.youtube-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24.751 7.5C24.751 7.5 24.5068 5.77637 23.7549 5.01953C22.8027 4.02344 21.7383 4.01855 21.25 3.95996C17.7539 3.70605 12.5049 3.70605 12.5049 3.70605H12.4951C12.4951 3.70605 7.24609 3.70605 3.75 3.95996C3.26172 4.01855 2.19727 4.02344 1.24512 5.01953C0.493164 5.77637 0.253906 7.5 0.253906 7.5C0.253906 7.5 0 9.52637 0 11.5479V13.4424C0 15.4639 0.249023 17.4902 0.249023 17.4902C0.249023 17.4902 0.493164 19.2139 1.24023 19.9707C2.19238 20.9668 3.44238 20.9326 3.99902 21.04C6.00098 21.2305 12.5 21.2891 12.5 21.2891C12.5 21.2891 17.7539 21.2793 21.25 21.0303C21.7383 20.9717 22.8027 20.9668 23.7549 19.9707C24.5068 19.2139 24.751 17.4902 24.751 17.4902C24.751 17.4902 25 15.4687 25 13.4424V11.5479C25 9.52637 24.751 7.5 24.751 7.5ZM9.91699 15.7422V8.71582L16.6699 12.2412L9.91699 15.7422Z' fill='%234E515E'/%3E%3C/svg%3E%0A");
    height: 25px;
    width: 25px;
}

.facebook-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3907_1268)'%3E%3Cpath d='M12.5 0C5.5965 0 0 5.5965 0 12.5C0 18.362 4.036 23.281 9.4805 24.632V16.32H6.903V12.5H9.4805V10.854C9.4805 6.5995 11.406 4.6275 15.583 4.6275C16.375 4.6275 17.7415 4.783 18.3005 4.938V8.4005C18.0055 8.3695 17.493 8.354 16.8565 8.354C14.807 8.354 14.015 9.1305 14.015 11.149V12.5H18.098L17.3965 16.32H14.015V24.9085C20.2045 24.161 25.0005 18.891 25.0005 12.5C25 5.5965 19.4035 0 12.5 0Z' fill='%234E515E'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3907_1268'%3E%3Crect width='25' height='25' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    height: 25px;
    width: 25px;
}

.x-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.0898 1.9834H22.6039L14.9267 10.7579L23.9583 22.6979H16.8867L11.3479 15.4564L5.01032 22.6979H1.49416L9.70562 13.3127L1.04163 1.9834H8.29278L13.2993 8.60249L19.0898 1.9834ZM17.8565 20.5946H19.8037L7.23475 3.97624H5.14523L17.8565 20.5946Z' fill='%234E515E'/%3E%3C/svg%3E%0A");
    height: 25px;
    width: 25px;
}

.footer-border{
    border: 1px solid #2c2e39;
}



@media only screen and (max-width: 1500px) and (min-width: 1400px)  {

}

@media (max-width: 1600px) {

}

@media (max-width: 1440px) {

}

@media (max-width: 1200px) {
    .servers-grid {
        display: grid; 
        grid-template-columns: 1fr 1fr; 
        grid-template-rows: 1fr; 
        gap: 1.5rem 1.5rem; 
        grid-template-areas: 
          ". ."; 
    }

    .card-view{
        margin-bottom: 0.5rem !important;
    }
    
}

@media (max-width: 992px) {
    
    .metrics-grid {
        display: grid; 
        grid-template-columns: 1fr; 
        grid-template-rows: 1fr; 
        gap: 1rem 1.5rem; 
        grid-template-areas: 
          "."; 
    }

    .servers-grid {
        display: grid; 
        grid-template-columns: 1fr; 
        grid-template-rows: 1fr; 
        gap: 1.5rem 1.5rem; 
        grid-template-areas: 
          "."; 
    }

    .add-icon{
        position:  relative !important;
        right: 0 !important;
        top: 0 !important;
    }

}

@media (max-width: 768px) {

    .message-header{
        position: sticky;
        bottom: 0;
        z-index: 1020;
    }

    .language-dropdown-offcanvas{
        background-color: var(--color-backend-dark-background);
        min-width: auto !important;
        transform: translate3d(-1px, 25px, 0px) !important;
    }

    .profile-dropdown{
        transform: translate3d(1px, 32px, 0px);
    }
}

@media (max-width: 576px) {

    .delete-icon{
        position: relative !important;
        right: 0 !important;
        margin-bottom: 1rem !important;
    }
    
    .drag-icon{
        position: relative !important;
        left: 0 !important;
        top: 0 !important;
        margin-bottom: 1rem !important;
        width: 15px;
        height: 33px;
    }

    .roles-container{
        flex-wrap: wrap !important;
    }

    .roles-image{
        width: 100% !important;
    }

    .roles-content-container{
        border-left: none !important;
    }

    .message-header{
        position: relative !important;
    }

    .emojies-grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
        grid-template-rows: 1fr;
        gap: 1rem 1rem;
        grid-template-areas:
            ". . . . .";
    }

}