:root {
  --bg-body: #f4f6f9; 
  --bg-wrapper: #ffffff; 
  --bg-light: #ffffffaa; 
	--alert-light: rgba(150, 160, 200, 0.1);
	--alert-success: rgba(0, 245, 115, 0.2);
	--alert-warning: rgba(255, 225, 0, 0.2);
	--alert-danger: rgba(253, 4, 78, 0.2);
  --text-body: #333333; 
  --border-color: rgba(50, 60, 70, 0.2);
} 
[data-bs-theme="dark"] {
  --bg-body: #181927;  
  --bg-wrapper: #20222f; 
  --bg-light: #20222faa; 
	--alert-light: rgba(150, 160, 200, 0.1);
	--alert-success: rgba(0, 245, 115, 0.1);
	--alert-warning: rgba(255, 205, 0, 0.1);
	--alert-danger: rgba(215, 15, 70, 0.1);
  --text-body: #e0e0e0; 
  --border-color: rgba(255,255,255,0.1);
}  
body{
	overflow-y: scroll; 
	color: var(--text-body);
	font-family: 'Inter', sans-serif; 
	margin: 0; padding: 0;
	background-color:  var(--bg-body);
	background-repeat: repeat !important;
	font-size: 0.95rem !important;
	line-height: 1.35;  
} 
.text-danger {
	color: #f70451 !important;
}
.text-pink {
	color: #ff3595 !important;
}
.text-success { 
	color: #77cf50 !important;
}
.navmenu {
	padding: 3px 0; 
	margin-bottom: -10px !important;
	opacity: 0.99;
	background: #23253b;
	border: 0px solid #23253b !important;	
	box-shadow: 0 5px 5px 0 rgba(25, 25, 25,0.1) !important;
	box-shadow: 0 0 2px 1px rgba(25, 30, 35,0.3), inset 0 0 0 1px rgba(180, 185, 190, 0.1) !important;
}

.navbar-brand {
	color: #ff3595 !important;
	font-size: 32px;
	line-height: 26px;
}
.navbar-brand:hover {
	color: #fff !important;
}
.navbar-dark {
	background: none;
}
.navbar-nav {
	font-weight: 600;
}
.navbar {
	padding-top: .1rem;
	padding-bottom: .1rem;
}
.navbar-nav a{
	font-size: 1.1em;
	color: #d8d8e6 !important;
	padding: 3px 7px;
	border-radius: 2em;
	margin: 1px 2px;
	position: relative;
}
.navbar-nav a:hover{
	color: #fff !important;
	background: #2f3145; 
	box-shadow: 0 0 2px 1px rgba(25, 30, 35,0.3), inset 0 0 0 1px rgba(180, 185, 190, 0.1) !important;
}

.m-burger {
	margin-left: 5px; 
} 
.m-collapse {
	order: 10;
	width: 100%;
} 
.m-auth {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
} 
.m-auth-mobile {
	display: none;
	width: 100%;
	margin-top: 10px;
	gap: 8px;
}

@media (min-width: 992px) { 
	.m-collapse {
		order: 0;
		width: auto; 
	} 
	.m-burger {
		display: none;
	} 
	.m-auth-desktop {
		margin-left: auto;
		display: flex;
	} 
	.m-auth-mobile {
		display: none !important;
	}
}

@media (min-width: 768px) and (max-width: 991.98px) { 
	.m-collapse {
		order: 10;
		width: 100%;
	} 
	.m-burger {
		order: 10;
	} 
	.m-auth-desktop { 
		margin-left: auto;
		display: flex;
	}
	.m-auth-mobile {
		display: none !important;
	}
	
body{ 
	font-size: 0.85rem !important; 
} 
}

@media (max-width: 767.98px) { 
	.m-burger {
		margin-left: auto;
	} 
	.is-auth {
		display: block !important;
	}
	.m-auth-desktop {
		display: none;
	} 
	.m-collapse {
		order: 10;
		width: 100%;
	}  
	.m-auth-mobile {
		display: flex;
	} 
	.m-auth-mobile .btn {
		flex: 1;
	}
	
body{ 
	font-size: 0.8rem !important; 
} 
}


.wrapper {
	padding: 1rem 0;
	border1: 1px solid var(--border-color) !important;	
	background-color1: var(--bg-wrapper); 
	border-radius1: 0 0 1em 1em;
} 
.title{ 
	font-size: 1.4em;
	color: var(--text-body);
	display:inline-block;
	padding: 3px 7px 5px;
	font-weight: 800;
}
.title::after {
	position: relative;
	bottom: 0; left: 0;right: 0;
	display: block;
	content: "";
	background: #ff3595;
	border-radius: 4px;
	padding: 0;margin: 0 auto;
	width: 55px;height: 6px;
} 
.home {
	position: relative;
	border-radius: 1em; 
	box-shadow: inset 0 0 0 4px rgba(99, 78, 147, 0.1),0 0 0 1px rgba(61, 46, 95, 0.2);
	border: 1px rgba(114, 135, 164, 0.2) solid;  
  overflow: visible;
  z-index: 1;  
} 
.home::after {
  content: "";
  position: absolute; top: 0; right: 0;
  width: 100%; height: 100%;
	background: linear-gradient(90deg, transparent, transparent, #8500ff); 
  border-radius: 1em; 
  pointer-events: none;
	z-index: -1;  
} 
.home-text {
  position: relative;
  z-index: 2;
}  
.home .title{
  font-size: 2.3em;
	text-align: left; 
	padding: 0;
}
.home .title::after {
	position: relative;
	bottom: 0; left: 0;
	content: "";
	margin: 0;
} 
.home p {
  font-size: 1.6em; 
}

.alert {
	box-shadow: inset 0 0 0 2px var(--bg-wrapper) !important;
}
.bg-light {
	background-color: var(--alert-light) !important;
} 
.alert-success {
	background-color: var(--alert-success) !important;
}
.alert-warning {
	background-color: var(--alert-warning) !important;
}
.alert-danger {
	background-color: var(--alert-danger) !important;
} 

.footer {
	padding: 0.7rem 0; 
	margin: 1rem auto 0;
	border-radius: 6px 6px 0 0;
	border-top: 4px solid #8500ff;
	background: #222335;
} 

.footer .nav a { color: #d8d8e6;margin: 0.2rem; padding: 0.2rem 0.5rem; border-radius: 2em;}
.footer .nav a:hover { color: #fff; background: #3b3d5772;  }


.gold {
    background: url(/img/gold.png) no-repeat center center;
    background-size: cover;padding: 1px;
    width: 20px;height:20px;
    display: inline-block;
} 
.silver {
    background: url(/img/silver.png) no-repeat center center;
    background-size: cover;padding: 1px;
    width: 20px;height:20px;
    display: inline-block;
} 
.s1 {
    width: 22px;height:22px;
}
.s2 {
    width: 24px;height:24px;
}
.s3 {
    width: 28px;height:28px;
}
.s4 {
    width: 32px;height:32px;
}
.s5 {
    width: 44px;height:44px;
}




.banlink div {
	max-width: 100% !important;
	height: auto !important;
}
.banlink div img {
	max-width: 100% !important;
	height: auto !important;
}
.banlink div div {
	max-width: 100% !important;
	height: auto !important;
}
.banlink div div img {
	max-width: 100% !important;
	height: auto !important;
}
  
.blocklinks {
	position: relative;
	margin-bottom: 3px;
	padding-bottom: 3px;
}
  
.buylink{
	color: #fff; 
	  position: absolute; right: -5px; top: -5px;
	  text-decoration:none;
	  text-align:center;
	  width: 24px;height: 24px;	
	  font-size:14px; font-weight: bold;
	  padding: 1px;
	  border-radius: 4px;
	  border: rgba(255,255,255,0.3) 1px solid;
  }
  .linklist {
	  padding: 3px 2px;
  }
  .linklist a{
	  display:block;
	  color: var(--text-body); 
	  background-color:  var(--alert-light) !important;
	  text-decoration:none;
	  line-height:35px;
	  font-size:0.9em;
	  font-weight:600;
	  text-align:center;border-radius: 1em;
	  border: #73739d4f 1px solid;
  }
  
  .linklist a:hover {
	  color: #ff3595;
  }
  .bylnklabel{
	  display:block;
	  width:100px;
	  margin:0 auto;
	  text-align:center;
	  background: #669966;
	  color:#ffffff;
	  line-height:26px;
	border-radius: 10px;
  }
  .lnkrools{
	  display:block;
	  color:#666666;
	  padding:10px;
  }
  
  .floatopacity {
	  position: absolute;
	  right: 10px; top: 10px;
	  font-size: 44px;
	  opacity: 0.1;
  }
  .panel {
	  borde1r: 1px solid #ff3595 !important;	 
	  border-width: 2px;
	  padding: 10px;
  }
  .panel b {
	  font-weight: 800;
	  font-size: 1.2em;
	  opacity: 0.9;
  }
  .panel:hover .floatopacity {
	  font-size: 46px;
  }

.stat {
	background-color:  var(--bg-body) !important;
	border: 2px solid #9889cd4c;
	border-radius: 1rem !important; 
	padding: 0px 0.25rem 0;
	position: relative;
	box-shadow1: 4px 4px 0px 0px rgba(59, 45, 93, 0.1);
} 

.stat-count {  
	background-color:  var(--bg-wrapper) !important;
	border: 1px solid #9889cd4c;
	font-size: 1.9em;
	font-weight: 700;
	line-height: 1;
	border-radius: 2em;
	padding: 3px;margin: 0px 10px 10px;
	display: block;
	position:relative;
}
.stat-count span {
	position: absolute;
	top: 5px;
	font-size: 0.8rem;
	line-height: 0.6; margin-left:5px;
	border-radius: 2em;
}
.stat-count small {
	font-size: 70%;
}
.stat-title{ 
	padding: 1px;
	font-size: 100%;
	font-weight: 500;
}

.stat i {
	color: #8500ff;
	font-size: 2.2em;
	transition-duration: 180ms;
	transform: scale(0.9);
  }
.stat:hover i {
	  transform: scale(1);
	}

	.stats {
		background-color:  var(--bg-body) !important;
		border: 1px solid #9889cd4c;
		border-radius: 0.5em;
		margin-bottom: 5px;
		padding: 2px 4px 0;
	} 
	.stats2 {
		border: 1px solid #9889cd4c !important;
		overflow: hidden; 
	  }
	  .stats2.table-striped > tbody > tr:nth-of-type(2n+1) > * {
  --bs-table-accent-bg: #e1e6ff;
}
	  .stats2 tr:last-child td{
		  border-bottom: 0;
		}
	

.alert.bg-light { 
	background-color: rgba(150, 162, 198, 0.1) !important;
	border: 1px rgba(91, 109, 134, 0.2) solid;  
}

.card-header {
	background-color: rgba(60, 20, 33, 0.03);
}

a.card {
	text-decoration: none; 
	color: var(--text-body) !important;
}
a.card .badge {
	font-size: 12px;
	font-weight: 600;
}
a.card:hover {
	background: #8d95b428;
}

.badge-sum {
	font-size: 100%; 
}
 
/* Buttons */
.btn-lg {
	-webkit-transition-duration: 180ms;
	transition-duration: 180ms;
	border: 1px solid #fff !important;
	border-radius: 10px;
	font-weight: bold;
}
.btn {  
	box-shadow: inset 0 0 0 1px #ffffff88 !important;
}
.btn-danger {   
	background-color: #f70451;
}
.btn-danger:hover {
	background-color: #f33546;
}
.btn-warning {
	background-color: #fee31a;
}
.btn-warning:hover {
	background-color: #f9d716;
}

.btn-success {
	color: #111;
	background-color: #a7fc00;
}
.btn-success:hover {
	color: #222;
	background-color: #b2ff17;
}
.btn-primary {
	background-color: #8500ff;
	border-color: #8500ff !important;
}
.btn-primary:hover {
	background-color: #7a09e6;
}

.btn-avatar { 
	color: #222;
	font-weight: bold;
	text-align: center;
	background: #fee31a;
	text-transform:uppercase;
	border-radius: 2em !important;  
	box-shadow:  0 0 0 0 #fee31a !important;  
	height: 38px; width: 38px; 
	padding: 0px;
} 
.btn-avatar span {
	margin: 0 auto;
	scale: 1;
}
.btn-avatar:hover span {
	margin: 0 auto;
	scale: 0.9;
}

.btn2 { 
	font-weight: bold;
	text-transform:uppercase;
	border-radius: 2em !important;
	padding: 5px 10px;
	border: 0px solid #ffffff !important;	 
	box-shadow: inset 0 0 0 0.1em rgba(26,26,26,0.9) !important; 
}
.btn-lg:hover {
    border: 2px solid #fff;
	box-shadow: 0px 0px 8px 3px rgba(26,26,26,0.1);
}
 
.btn-outline-dark {
	color: #333a4d;
	border: 1px #435a6d solid !important;
}
 

.check-row span{
	display: block; text-align: center;
	padding: 2px 0;
}
.check-row div:hover div{
	position: relative;
}
.check-row .check-card { 
	text-align: center;
	font-size: 0.9rem;
	background-color: var(--bg-light) !important;
	border: 1px solid #5d5d7f57;
	position: relative;
	display: block; 
	padding: 0.3rem 0 0;
	border-radius: 10px;
}
.check-row div .check-card img{
	width: 56px;
}
.check-row div:hover .check-card img{ 
	transform: scale(1.1);
}
 
@media (max-width: 576px) {  
.check-row .check-card {
	scale: 0.95;
	font-size: 0.8rem;
	font-weight: 600;
}
.check-row div .check-card img{
	width: 48px;
}
} 

.ps-list .badge {
	color: var(--color-body); 
	font-size: 0.9rem;
	background-color: var(--bg-body) ;
	border-radius: 2em;
	border: 1px solid  var(--border-color) !important; 
	opacity: 0.9; 
	display: inline-block;
	margin: 2px;
}
.ps-list .badge:hover {
	opacity: 1;
}

/* ACCOUNT STYLE */
.content {
	float: left;
	display: block;
	width: calc(100% - 300px);
}
.content > div { 
	margin: 0; padding: 0 15px;
}

.serf {
	background-color: rgba(150, 162, 198, 0.1) !important;
	border-radius: 12px;margin: 7px 5px !important; 
	border: 2px solid #a9a9dd41 !important;
	line-height: 1.5;
}
.serf-link {
	font-size: 18px;
	font-weight: 700; 
	color: #ff3595 !important;
	text-decoration: none !important;
}
.serf .serf-footer { 
	font-weight: 500 !important; 
}
.serf:hover {
	border-color: #8500ff !important;
}
.bg-price {
	border: 1px solid #afafcb71 !important;
	border-radius: 8px;
}
.serf .bg-danger {
	background: #8500ff !important;
}
.serf:hover .bg-danger {
	background: #ff3595 !important;
} 
.serf .bg-primary {
	background: #3f415d !important;
}
.serf:hover .bg-primary {
	background: #ff3595 !important;
} 
.serf-link:hover {color: #8500ff !important;}



.tarif .card {
	border-radius: 0.5em;
	border: 2px solid #00a88a !important;
	background: #00a89a url("/img/bg-dark.png") top center;
	background-size: 24px;
}
.tarif .card-img {
	padding: 5px 23% 15px;
}
.tarif .card .card-img {
	transition-duration: 180ms;
	transform: scale(0.9);
	opacity: 0.95;
  }
  .tarif .card:hover .card-img{
	  transform: scale(1);
	  opacity: 1;
	  filter: drop-shadow(0 0 8px #05493d);
	}

.tarif .p-2 {
	border-radius: 0 0 0.5em 0.5em;
	background-color: rgba(245, 255, 250,0.9);
	border-top: 2px solid #00a88a !important;
}
.tarif .btn {
	margin-botto1m:-50px;
}
.titlec {
	color: #fff; font-weight: bold;
	text-shadow: 1px 1px 1px rgba(26,26,26,0.7);
	background1: linear-gradient(-90deg, transparent, #d49503, transparent);
	border-radius: 0; padding: 0px 0 5px;
	margin: -20px 0px 0px 0px;
}


.leftbar {
	width: 280px;
	margin: 5px 5px 5px 10px;
	display: block;
	float: left;
}
.leftbar .menubar {
	border-radius: 1em;
	background: #23253b;
	box-shadow: 0 0 2px 1px rgba(25, 30, 35,0.3), inset 0 0 0 1px rgba(180, 185, 190, 0.1) !important;
	padding-bottom: 5px;
}
.leftbar__menu {
	padding: 5px;
}
.leftbar__menu li {
	display: block;
}
.leftbar_head {
	font-weight: 700;
	text-transform:uppercase;
	padding: 5px 0 7px 14px;
}
.leftbar__menu li a {
	color: #fff;
	font-size: 18px;
	display: block;text-transform1:uppercase;
	text-decoration: none;
	padding: 2px 4px 2px 7px;
	margin: 1px 2px;  
	position: relative;
	z-index: 2;
} 
 
.leftbar__menu li a:hover {
	color: #a7fc00; 
	background: #2f3145; 
	box-shadow: 0 0 2px 1px rgba(25, 30, 35,0.3), inset 0 0 0 1px rgba(180, 185, 190, 0.1) !important;
	border-radius: 2em;
}

.leftbar__menu li a i {
	color: #ff3595;
	background: #242639; 
	box-shadow: 0 0 0 2px rgba(185, 195, 205, 0.1) !important;
	position: relative;
	font-size: 20px;text-align: center;
	line-height: 1.2;
	margin-right: 7px;
	width: 34px; padding: 4px; border-radius: 10px;
	transform: scale(0.8); 
}

.leftbar__menu li a:hover i{
	color: #a7fc00 !important;
	background: #2f3145; 
	box-shadow: 0 0 0 0 rgba(185, 195, 205, 0.1) !important;
	transform: scale(1); 
}

/*MENU V KABINE*/
.divide {
	border-top: 1px dashed rgba(70, 60, 50, 0.2);
}
.menu-title {
	padding: 5px 10px;
	color: #6e8;
}

.menu-user {  
	font-weight:600; 
	cursor: pointer;
} 

.menub{
	width: 96.8%;margin: -3px; margin-left: 5px; 
	border-top: 1px dashed rgba(70, 60, 50, 0.2) !important;
	padding: 4px 5px 4px 5px; 
}
.topbar{
  padding: 5px;
  margin: 5px;  
  position: relative; 
  text-align: center;
}  
.balance {
	display: block;
	text-decoration: none !important;
	background-color: rgba(245,250,255,0.05) !important;
	box-shadow: 0 0 2px 1px rgba(25, 30, 35,0.3), inset 0 0 0 1px rgba(180, 185, 190, 0.1) !important;
	padding: 0.3em ;
	margin-bottom: 5px;
	border-radius: 0.5em;
	letter-spacing: .75px; 
	line-height: 1.1em;
}
.balance:hover { 
	border-radius: 2em;
}
.balance .text-success { 
	color: #a7fc00 !important; 
} 
.balance .text-warning { 
	color: #fee31a !important; 
} 
.balance .balance-s {  
	padding: 2px 3px;
}  
.balance .balance-s b{
	font-size: 1.7rem;
	font-weight: 800;
}
.balance .icon {
	width: 48px;
}
.balance .icon i { 
	color: #222;
	background: #a7fc00; 
	width: 38px; height:38px;
	border-radius: 2rem;
	font-size: 1.5rem;
	padding: 6px; margin: 5px;
	box-shadow: 0 0 0 2px rgba(26, 28, 30, 0.1) !important;
}
.balance .balance-t {
	font-size: 14px; 
	text-transform:uppercase; 
	color: #eaeaea;
	padding: 1px 3px;
	border-radius: 10px;
	background: none !important; 
}

.balance:hover .bg-success { 
	color: #222;
	background: #a7fc00 !important; 
} 
.balance:hover .bg-warning { 
	color: #222;
	background: #fee31a !important; 
} 
.leftbar__menu li a span {
	padding-right: 13px;position: relative; top:-2px;
	display: inline;
} 
.menu-user {
	display: none;
}

@media only screen and (max-width: 768px) {
.content, .leftbar {
	width: 100%;
	float: none;
	margin: 0;margin-bottom: 5px; 
	background: none !important; 
}
.menu-wrapper {
	max-height: 0;
	overflow: hidden;
	transition: 0.2s ease;
}
.menu-user {
	display: block;
}
html.min-menu .content {
	width: 100%;
	float: none;
	margin-left: 0;
}
html.min-menu .menu-user span {
	opacity: 1;
}
html.min-menu .leftbar {
	float: none;
	width: 100%;
}
html.min-menu .topbar {
	display: block;
}
html.min-menu .menu-wrapper {
	max-height: 1300px;
}
html.min-menu .leftbar__menu li a span {
	display: inline;
}
html.min-menu .leftbar_head {
	display: block;
}
html.min-menu .leftbar__menu li a:hover {
	width: 100%;
}
}

/* Theme Toggler */
.theme-toggle {
    text-align: center;
    background-color: none !important; 
    border: none !important;
} 

html[data-bs-theme="dark"] .theme-toggle .fa-sun,
html[data-bs-theme="light"] .theme-toggle .fa-moon {
    cursor: pointer; 
		vertical-align: middle !important;
		width: 22px;
}

html[data-bs-theme="dark"] .theme-toggle .fa-moon {
    display: none;
}

html[data-bs-theme="light"] .theme-toggle .fa-sun {
    display: none;
}