/**
 *
 * You can write your CSS code here, DO NOT touch the default JavaScript file
 * because it will make it harder for you to update.
 * 
 */

/*# sourceMappingURL=custom.css.map */
/* Navbar biru ala Stisla */
/* =============================== */
/* Custom Primary Color Stisla      */
/* =============================== */

:root {
	--primary-color: #0c8599;
	--primary-color-hover: #0a6b7a; /* hover / active */
	--primary-gradient: linear-gradient(45deg, #0c8599, #06818a);
}

/* ------------------------------- */
/* Navbar */
.main-navbar {
	background-color: var(--primary-color);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
}

.main-navbar .nav-link,
.main-navbar .nav-link i {
	color: #fff;
}

.main-navbar .nav-link:hover {
	color: #e0e0e0;
}

/* Dropdown menu navbar */
.navbar .dropdown-menu a:hover {
	background-color: var(--primary-color-hover);
	color: #fff;
}

/* ------------------------------- */
/* Sidebar */
.navbar-bg {
	background-color: var(--primary-color);
}

.main-sidebar .sidebar-menu li a {
	color: #0c8599;
}

.main-sidebar .sidebar-menu li a:hover,
.main-sidebar .sidebar-menu li.active > a {
	background-color: var(--primary-color-hover);
	color: #fff;
}

/* Sidebar brand */
.sidebar-brand,
.sidebar-brand-sm {
	background-color: var(--primary-color);
	color: #fff;
}

/* ------------------------------- */
/* Buttons */
.btn-primary {
	background: var(--primary-gradient);
	border-color: var(--primary-color);
	color: #fff;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
	background-color: var(--primary-color-hover);
	border-color: var(--primary-color-hover);
	color: #fff;
}

/* ------------------------------- */
/* Badge */
.badge-primary {
	background-color: var(--primary-color);
	color: #fff;
}

/* ------------------------------- */
/* Card header */
.card.card-primary {
	border-top: 2px solid var(--primary-color);
}

/* ------------------------------- */
/* Progress bar */
.progress-bar.bg-primary {
	background-color: var(--primary-color);
}

/* ------------------------------- */
/* Pagination */
.pagination .page-item.active .page-link {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}

.pagination .page-item .page-link:hover {
	background-color: var(--primary-color-hover);
	border-color: var(--primary-color-hover);
}

/* ------------------------------- */
/* Text, background & border primary */
.text-primary {
	color: var(--primary-color) !important;
}

.bg-primary {
	background-color: var(--primary-color) !important;
}

.border-primary {
	border-color: var(--primary-color) !important;
}

/* ------------------------------- */
/* Form elements focus */
.form-control:focus {
	border-color: var(--primary-color);
	box-shadow: 0 0 0 0.2rem rgba(12, 133, 153, 0.25);
}

/* ------------------------------- */
/* Alerts */
.alert-primary {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
	color: #fff;
}

/* ------------------------------- */
/* Tables */
.table thead th.bg-primary,
.table thead th.bg-primary:hover {
	background-color: var(--primary-color);
	color: #fff;
}

/* Optional: active nav-tabs */
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
	background-color: var(--primary-color);
	color: #fff;
}

/* Optional: badges in nav-tabs */
.nav-tabs .nav-link .badge {
	background-color: var(--primary-color-hover);
	color: #fff;
}

/* ================================ */
/* Sidebar Active Colors             */
/* ================================ */

/* Sidebar Style-2 */
body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu li.active a {
	background-color: #0c8599; /* ganti dari #6777ef */
	color: #0c8599;
}

body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu li.active ul.dropdown-menu li a {
	color: #cde8eb; /* teks dropdown lebih terang agar kontras */
}

body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu li.active ul.dropdown-menu li a:hover {
	background-color: #0a6b7a; /* hover sesuai primary hover */
	color: #fff;
}

body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu li.active ul.dropdown-menu li.active a {
	color: #fff;
}

/* Sidebar Style-2 */
body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu > li.active > a {
	padding-left: 16px;
	background-color: transparent;
	position: relative;
}

body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu > li.active > a:before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	height: 25px;
	width: 4px;
	background-color: #0c8599; /* ganti dari #6777ef */
}

body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu li.active ul.dropdown-menu li a {
	padding-left: 61px;
	background-color: #0c8599;
}

/* ================================ */
/* Sidebar Mini Active Colors        */
/* ================================ */

/* Sidebar Style-2 - Mini */
body.sidebar-mini .sidebar-style-2 .sidebar-menu li.active a {
	background-color: #0c8599; /* warna primary baru */
	color: #fff;
}

body.sidebar-mini .sidebar-style-2 .sidebar-menu li.active ul.dropdown-menu li a {
	color: #cde8eb;
}

body.sidebar-mini .sidebar-style-2 .sidebar-menu li.active ul.dropdown-menu li a:hover {
	background-color: #0a6b7a; /* hover warna primary */
	color: #fff;
}

body.sidebar-mini .sidebar-style-2 .sidebar-menu li.active ul.dropdown-menu li.active a {
	color: #fff;
}

/* Sidebar Style-2 - Mini */
body.sidebar-mini .sidebar-style-2 .sidebar-menu > li.active > a:before {
	background-color: #0c8599; /* ganti dari #6777ef */
}
/* 
.iziToast.iziToast-color-red {
	background: linear-gradient(135deg, #ff4d4d, #ffb3b3) !important;
	border-color: #ff4d4d !important;
	color: #fff !important;
}
.iziToast.iziToast-color-orange {
	background: linear-gradient(135deg, #ff8800, #ffd1a3) !important;
	border-color: #ff8800 !important;
	color: #fff !important;
}
.iziToast.iziToast-color-yellow {
	background: linear-gradient(135deg, #ffd700, #fff5a3) !important;
	border-color: #ffd700 !important;
	color: #333 !important;
}
.iziToast.iziToast-color-blue {
	background: linear-gradient(135deg, #3399ff, #a3d8ff) !important;
	border-color: #3399ff !important;
	color: #fff !important;
}
.iziToast.iziToast-color-green {
	background: linear-gradient(135deg, #0c8599, #0a6b7a) !important;
	border-color: #0a6b7a !important;
	color: #fff !important;
} */

/* Biar semua text putih */
/* .iziToast > .iziToast-body,
.iziToast .iziToast-title,
.iziToast .iziToast-message {
	color: #fff !important;
} */