@charset "utf-8";

*{margin:0px; padding:0px;}

:root {
  --body-bg: #ffffff;
  --bod-text-color: #000000;
  --bs-border-color: #313131;
}

[data-theme="dark"] {
  --body-bg: #000000;
  --bod-text-color: #ffffff;
}

body {
  background: var(--body-bg) url(../img/left-bg.png); background-repeat: no-repeat; background-position: left bottom; background-attachment: fixed;
  color: var(--bod-text-color);
  transition: 0.3s ease;
  font-size: 14px;
  font-family: "Manrope", sans-serif;
}


a, a:active, a:focus, a:hover {outline: none; transition: all 0.5s ease; text-decoration: none;}
button, button:active, button:focus, button:hover {outline: none; box-shadow: none !important; transition: all 0.5s ease; text-decoration: none;}

.theme_btn{background: linear-gradient(90deg, rgb(117, 214, 251) 0%, rgb(175, 248, 158) 100%); border-radius: 5px; font-weight: 600; color: #fff; border: none; padding: 1.5px;}
.theme_btn span{background: #17171A; padding: 10px 22px; display: block; border-radius: inherit;}
.theme_btn:hover span, .theme_btn.active span{background: #17171a00; color: #000;}
.btn-sm{padding: 4px 20px !important; font-size: 12px;}
.border-btn{border: 1px solid #313131; background: transparent; color: #fff; padding: 11px 10px; border-radius: 10px;}
.border-btn:hover{background: #0000005c;}

.pointer{cursor: pointer;}
.opacity-10{opacity: .10;}
.opacity-20{opacity: .20;}
.fw-300{font-weight: 300 !important;}
.fw-400{font-weight: 400 !important;}
.fw-500{font-weight: 500 !important;}
.fw-600{font-weight: 600 !important;}
.fw-700{font-weight: 700 !important;}
.fw-800{font-weight: 800 !important;}
.fw-900{font-weight: 900 !important;}

.max-200{max-width: 200px;}
.max-300{max-width: 300px;}
.max-400{max-width: 400px;}
.max-450{max-width: 450px;}
.max-500{max-width: 500px;}
.max-600{max-width: 600px;}
.max-600{max-width: 600px;}
.max-700{max-width: 700px;}
.max-800{max-width: 800px;}
.max-900{max-width: 900px;}
.max-1000{max-width: 1000px;}
.max-1200{max-width: 1200px;}

.fs-7{font-size: .9rem !important;}
.fs-8{font-size: .8rem !important;}

.gradient_text{
 background: linear-gradient(rgb(255, 255, 255) 0%, rgb(74, 222, 128) 100%) padding-box text;
  -webkit-text-fill-color: transparent;}

.gradient_bg{background: linear-gradient(90deg, rgb(117, 214, 251) 0%, rgb(175, 248, 158) 100%); color: #000;}
.gradient_bg_shadow{box-shadow: 11px 11px 0px -2px #393838;}

.header_logo{width: 200px; }
.header_padding{padding-top: 100px;}
.left_menu{list-style: none; padding: 0; margin: 0;}
.left_menu li{display: block;}
.left_menu li a{display: block; font-size: 14px; color: #dfdede; padding: 12px 16px; border-radius: 12px;}
.left_menu li a.active{background: #000000 !important; font-weight: 600;}
.left_menu li a:hover{background: #262627;}
.left_menu li a.active .menu_gradient_text{
  background: linear-gradient(90deg, rgb(117, 214, 251) 0%, rgb(175, 248, 158) 100%) padding-box text;
  -webkit-text-fill-color: transparent;}

.left_menu li a img{filter: brightness(0) invert(1); opacity: .6; width: 16px; margin-right: 10px;}
.left_menu li a.active img{filter: unset; opacity: 1;}

.mobile_menu.left_menu li a{font-size: 12px;}
.mobile_menu.left_menu li img{width: 14px; margin-right: 5px;}
.mobile_menu.left_menu li{flex-grow: 1;}

.ticker-wrapper {  overflow: hidden; width: 100%;}
.ticker-track { display: flex; width: max-content; animation: tickerScroll 20s linear infinite;}
.ticker-content { display: flex; margin-right: 50px; gap: 50px;font-size: 13px;}

@keyframes tickerScroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.ticker-wrapper:hover .ticker-track {animation-play-state: paused;}

.box-glass-grid {display: grid; gap: 15px; grid-template-columns: repeat(auto-fit, minmax(250px, 5fr));}
.box_bg{background: #17171799; border: 1px solid #313131;}
.icon_box{width: 50px; height: 50px; display: flex; align-items: center; justify-content: center;}
.invite_link_bg{background: #000000c2; color:#fff}
.bg-patten{z-index: 1; overflow: hidden; min-height: 200px; position: relative; background: url(../img/bg-patten.png); background-size: cover; background-color: #1C1C1C;}
.box-shap1{width: 100px; z-index: -1; position: absolute; top: -28px; left:25px;}
.box-shap2{width: 200px; z-index: -1; position: absolute; opacity: .5; top: -28px; right: 0px;}
.box-shap3{width: 350px; z-index: -1; position: absolute; opacity: .4; bottom: -28px; left: 0px;}

.Calculator_box{border: 1px solid #313131; padding: 7px; border-radius: 10px; background-color: #17171799;}
.Calculator_box.box_hover{cursor: pointer;}
.Calculator_box.active, .Calculator_box.box_hover:hover{background: linear-gradient(90deg, rgb(117, 214, 251) 0%, rgb(175, 248, 158) 100%); color: #000;}
.Calculator_box.active .gradient_text, .Calculator_box.box_hover:hover .gradient_text{-webkit-text-fill-color: unset;}


.neon-effect {animation: text-glow-shadow 2s infinite alternate; transition: box-shadow .3s ease,filter .3s ease;}
@keyframes text-glow-shadow {
  0% {
    filter:drop-shadow(0 0 2.5px rgb(117, 214, 251)) drop-shadow(0 0 4px rgb(117, 214, 251))
  }
  50% {
    filter:drop-shadow(0 0 8px rgb(117, 214, 251)) drop-shadow(0 0 10px rgb(117, 214, 251))
  }
  to {
    filter:drop-shadow(0 0 2.5px rgb(117, 214, 251)) drop-shadow(0 0 4px rgb(117, 214, 251))
  }
}

.form-control, .form-select {background-color: #acabab1f;border: 1px solid #acabab1f; color: #EFEFEF; font-size: 14px; font-weight: 400; border-radius: 5px; height: unset; padding: 12px 15px;}
.form-control:focus, .form-select:focus {color: #EFEFEF; background-color: #acabab1f; border: 1px solid #313131; box-shadow: none;}
.form-control::placeholder{color: #ffffff78;}
.cus_tab_style .nav-link{color: #fff; font-weight: 600; padding: 11px 10px;}

.cus_tab_style.nav-pills .nav-link.active, .cus_tab_style.nav-pills .show > .nav-link{color: #000; background: linear-gradient(90deg, rgb(117, 214, 251) 0%, rgb(175, 248, 158) 100%);}
.cus_tab_style{background: #131315; border-radius: 10px; border: 1px solid rgb(34, 34, 37);}
.sm_bedge{font-size: 12px; padding: 3px 14px; border-radius: 20px; font-weight: 600;}

table thead tr{ white-space: nowrap !important; background-size: 200% 100%; background-image: linear-gradient(90deg, rgb(117, 214, 251) 0%, rgb(175, 248, 158) 100%); border-radius: 10px !important;  align-items: center !important;}
table thead tr th{font-weight: 600 !important; color: #000 !important;}
table tbody tr{background-color: transparent !important; }
table > :not(caption) > * > * {border-bottom: 1px solid #ffffff1f !important; padding: 13px 15px !important; background-color: transparent !important; color: #fff !important; }


.modal-content{border: 1px solid #313131; border-radius: 10px; background-color: #1C1C1C;}
.modal-title{font-size: 18px;}
.btn-close{border: 1px solid #313131; opacity: .3; filter: brightness(0) invert(1);}
.max-position{position: absolute; right: 15px; top: 14px;}
.modal-footer > * {margin: unset;}
.coin_position_img{position: absolute; top: 23px; left: -10px;}
.progress{height: 10px; background: #3f3f40;}
.progress-bar{background: linear-gradient(90deg, rgb(117, 214, 251) 0%, rgb(175, 248, 158) 100%);}

.lien_tab.nav-tabs .nav-item.show .nav-link, .lien_tab.nav-tabs .nav-link.active{background: linear-gradient(90deg, rgb(117, 214, 251) 0%, rgb(175, 248, 158) 100%);
  color: #000; border-color: transparent;}

.lien_tab.nav-tabs .nav-link{color: #fff;}
.lien_tab.nav-tabs .nav-link:focus, .lien_tab.nav-tabs .nav-link:hover { border-color: #313131;}

.header-glow{
  height: 2px; position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(90deg, transparent, rgb(74, 222, 128), transparent);
}
.header-glow::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 2px;

  background: linear-gradient(
    90deg,
    transparent 0%,
    #00ffa6 30%,
    #00ffcc 50%,
    #00ffa6 70%,
    transparent 100%
  );

  filter: blur(6px);
}
.shadow_box{ backdrop-filter: blur(8px);
  position: relative;
 border: 1px solid rgb(26, 42, 26);
}

.shadow_box::after{ content: "";
 height: 3px; position: absolute; left: 0; right: 0; bottom: -1px;
  background: linear-gradient(90deg, transparent, rgb(74, 222, 128), transparent);
}

/* Chrome, Safari, Edge */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}