body {
	font-family: 'Montserrat', sans-serif;
}
* {
	box-sizing: border-box;
	transition: .25s all ease;
}

.login-container {
 	background-image: url();
	display: block;
	position: relative;
	z-index: 0;
  	padding: 5rem 4rem 0 4rem;
	width: 100%;
	max-width: 500px;
	min-height: 700px;
	box-shadow: 0 50px 70px -20px rgba(0, 0, 0, 0.85);
}

.login-container:after {
	content: '';
	display: inline-block;
	position: absolute;
	z-index: 0;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-image: radial-gradient(ellipse at left bottom, rgba(22, 24, 47, 1) 0%,rgba(62, 30, 122, 0.9) 59%, rgba(17, 27, 75, .9) 100%);
	box-shadow: 0 -20px 150px -20px rgba(0, 0, 0, 0.5);
}

.form-login {
  
	position: relative;
	z-index: 1;
  padding-bottom: 4.5rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}

.login-nav {
  font-size: 50%;
  text-align: center;
	position: relative;
	padding: 0;
	margin: 0 0 6em 1rem;
}

.login-nav__item {

	list-style: none;
	display: inline-block;
}

.login-nav__item + .login-nav__item {
	margin-left: 2.25rem;
}

.login-nav__item a {
	position: relative;
	color: rgb(255, 255, 255);
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 500;
	font-size: 1.70rem;
	padding-bottom: .5rem;
	transition: .20s all ease;
}

.login-nav__item.active a,
.login-nav__item a:hover{
	color: #ffffff;
	transition: .15s all ease;
}

.login-nav__item a:after {
	content: '';
  display: inline-block;
  height: 10px;
  background-color: rgb(255, 255, 255);
  position: absolute;
  right: 100%;
  bottom: -1px;
  left: 0;
  border-radius: 50%;
  transition: .15s all ease;
}

.login-nav__item a:hover:after,
.login-nav__item.active a:after{
	background-color: rgb(17, 97, 237);
	height: 2px;
	right: 0;
	bottom: 2px;
	border-radius: 0;
	transition: .20s all ease;
}
.login__label {
	display: block;
	padding-left: 1rem;
}

.login__label,
.login__label--checkbox {
	color: rgba(255, 255, 255, 0.5);
	text-transform: uppercase;
	font-size: .90rem;
	margin-bottom: 1rem;
}

.login__label--checkbox {
	display: inline-block;
	position: relative;
	padding-left: 1.5rem;
	margin-top: 2rem;
	margin-left: 1rem;
	color: #ffffff;
	font-size: .90rem;
	text-transform: inherit;
}

.login__input {
	color: white;
	font-size: 1.15rem;
	width: 100%;
	padding: .5rem 1rem;
	border: 2px solid transparent;
	outline: none;
	border-radius: 1.5rem;
	background-color: rgba(255, 255, 255, 0.25);
	letter-spacing: 1px;
}

.login__input:hover,
.login__input:focus{
	color: white;
	border: 2px solid rgba(255, 255, 255, 0.5);
	background-color: transparent;
}

.login__input + .login__label {
	margin-top: 1.5rem;
}

.login__input--checkbox {
	position: absolute;
	top: .1rem;
	left: 0;
	margin: 0;
}

.login__submit {
	color: #ffffff;
	font-size: 1rem;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-top: 3rem;
	padding: .75rem;
	border-radius: 2rem;
	display: block;
	width: 100%;
	background-color:transparent;
	border: none;
	cursor: pointer;
	border: 2px solid #000;

}

.login__submit:hover {
	background-color: rgb(110, 71, 216);
}

.login__forgot {
	display: block;
	margin-top: 3rem;
	text-align: center;
	color: rgba(255, 255, 255, 0.75);
	font-size: .75rem;
	text-decoration: none;
	position: relative;
	z-index: 1;
}

.login__forgot:hover {
	color: rgb(17, 97, 237);
}



/* modal comnunidad */

.barra-des::-webkit-scrollbar {
  width: 3px !important;
}

.barra-des::-webkit-scrollbar-track {
  background: transparent !important;
}

.barra-des::-webkit-scrollbar-thumb {
  background: white !important;
  border-radius: 2px !important;
}

.barra-des::-webkit-scrollbar-thumb:hover {
  background: white !important;
}

.input-field input[type=text]:focus + label {
    color: white !important;
}
.input-field input[type=text]:focus {
    border-bottom: 1px solid white !important;
    box-shadow: 0 1px 0 0 white !important;
}
.material-icons.active {
  color: white !important;
}

[type="radio"]:checked + span:after,
[type="radio"].with-gap:checked + span:before,
[type="radio"].with-gap:checked + span:after{
	border: 2px solid white;
}
[type="radio"]:checked + span:after,
[type="radio"].with-gap:checked + span:after{
	background-color: white;
}
.custom_checkbox[type="checkbox"]:checked + span:not(.lever)::before {
  border: 2px solid transparent;
  border-bottom: 3px solid white;
  border-right: 3px solid white;
  background: transparent;
}
.checked{
	margin-top: 3%;
	margin-bottom: 8%;
}
.btn-comunidad{
	background-color: white;
	color: #6323ac;
	font-weight: 600;
	width: 100%;
	border-radius: 10px;
}

.btn:hover{
	background: white !important ;
}

.btn-comunidad:hover{
	background: white ;

}

.sidenav{
 padding-top: 0;
  width: 35% !important;
  max-width: 400px;
  background-color: #141517 !important;
  height: 100vh !important;
  box-shadow: none !important;
  border: none !important;
  position: fixed !important;
  top: 0;
  left: 0;
  z-index: 9999;
  overflow-y: auto;
}


.sidenav-overlay {
  background-color: transparent !important; /* elimina ese fondo negro detrás */
}

ul#slide-out.sidenav.barra-des {
  width: 35% !important;            /* ancho lateral fijo */
  max-width: 500px !important;      /* ancho máximo */
  height: 100vh !important;         /* ocupa toda la altura visible */
  box-shadow: none !important;         /* sin sombra */
  margin: 0 !important;
  padding: 0 !important;
  overflow-y: auto !important;        /* scroll vertical */
}