/* .forms-insert-btn {
    background-color: black;
} */
:root {
	--base-color: #00bf63;
	--base-color-hover: #00bf6360;
}

section.login-image {
	height: 737px;
	background-image: url('../images/hidroponik.jpg');
	background-size: cover;
	filter: blur(5px);
	-webkit-filter: blur(5px);
	background-repeat: no-repeat;
}

section.login {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	padding: 20px;
}

section.login .container {
	padding: 20px !important;
	z-index: 99;
}

section.login .container .row {
	padding: 4rem;
	border-radius: 10px;
}
/* 
h1.login-text {
    font-size: 3rem;
    color: var(--base-color);
    font-family: 'Poppins', sans-serif;
} */

.login-field {
	border-radius: 0.5rem;
}

.login-field:focus {
	border: 1px solid var(--base-color);
	font-family: 'Poppins', sans-serif;
}

.btn-login {
	color: #fff;
	background-color: var(--base-color);
	border-color: var(--base-color);
}

.btn-login:hover {
	color: #fff;
	background-color: var(--base-color-hover);
	border-color: var(--base-color-hover);
}

.btn-login:focus,
.btn-login.focus {
	box-shadow: 0 0 0 0.2rem var(--base-color-hover);
}

.btn-login.disabled,
.btn-login:disabled {
	color: #fff;
	background-color: var(--base-color);
	border-color: var(--base-color);
}

.btn-login:not(:disabled):not(.disabled):active,
.btn-login:not(:disabled):not(.disabled).active,
.show > .btn-login.dropdown-toggle {
	color: #fff;
	background-color: var(--base-color-hover);
	border-color: var(--base-color-hover);
}

.btn-login:not(:disabled):not(.disabled):active:focus,
.btn-login:not(:disabled):not(.disabled).active:focus,
.show > .btn-login.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem var(--base-color);
}

.ruang-sayur-editor {
    height: 1000px;
}
.bg-sayur {
	height: 100%;
	border-radius: 1rem;
	background-color: white;
}

.wrapper-editor {
	padding: 1rem;
	height: 10rem!important;
	width: 100%;
}

.wrapper-editor #editor{
	width: 1000px!important;
}

div.detail-ruang-belajar {
	background-color: var(--base-color);
	border-radius: .5rem;
	padding: 1rem;
	color: white;
	margin-bottom: 5px;
}

.title-ruang-sayur {
	color: white;
}

/* Card */
.card-dashboard {
	height: 8rem;
	border-radius: 10px;
}

.card-header-dashboard {
	border-radius: 5px;
}

.card-header-dashboard .icon {
	width: 4rem;
	height: 4rem;
	/* background-color: green; */
	border-radius: 10px;
	top: -5% ;
	color: white;
}

.card-header-dashboard .icon span {
	position: relative;
	top: 25%;
}

.list-kelas {
	background-color: #eaeaea;
	padding: 5px;
	color: black;
	text-decoration: none;
}

.list-kelas {
	border-bottom: 1px solid white;
}

.list-kelas:hover{
	color: black;
}