.page-link {
	width: auto !important;
	padding: 5px;
}

@keyframes floating {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-10px);
	}
}

.whatsapp-float {
	position: fixed;
	bottom: 20px;
	left: 20px;
	/* Tombol di kiri */
	z-index: 1000;
	background-color: #25d366;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
	display: flex;
	justify-content: center;
	align-items: center;
	animation: floating 3s ease-in-out infinite;
	/* Tambahkan animasi floating */
	transition: transform 0.3s ease-in-out;
}

.whatsapp-float img {
	width: 35px;
	height: 35px;
}

.whatsapp-float:hover {
	transform: scale(1.1);
	/* Efek zoom saat hover */
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
}

/* Dark Mode Hack */
/* .content-wrapper agar hanya diterapkan dalam konten halaman */
.dark-mode .content-wrapper {
	background-color: #212529;
	color: white;
}

.dark-mode /*.content-wrapper*/ .bg-light {
	background-color: #212529 !important;
	color: white !important;
}

.header-shape {
	color: #fff !important;
}

.dark-mode .header-shape {
	color: #212529 !important;
}

/* Heading */
.dark-mode .content-wrapper h1,
.dark-mode .content-wrapper h2,
.dark-mode .content-wrapper h3,
.dark-mode .content-wrapper h4,
.dark-mode .content-wrapper h5,
.dark-mode .content-wrapper h6 {
	color: #b5d0ff !important;
}

.dark-mode /*.content-wrapper*/ .text-dark:not(.no-dark-mode),
.dark-mode /*.content-wrapper*/ .link-dark,
.dark-mode /*.content-wrapper*/ .link-body {
	color: #b5d0ff !important;
}

/* .post-header h1 untuk heading halaman */
.dark-mode .content-wrapper .post-header h1 {
	color: #fff !important;
}

/* .modal-dialog untuk heading dalam modal */
.dark-mode .content-wrapper .modal-dialog h1,
.dark-mode .content-wrapper .modal-dialog h2,
.dark-mode .content-wrapper .modal-dialog h3,
.dark-mode .content-wrapper .modal-dialog h4,
.dark-mode .content-wrapper .modal-dialog h5,
.dark-mode .content-wrapper .modal-dialog h6 {
	color: #343f52 !important;
}

.dark-mode .content-wrapper .modal-dialog .text-dark {
	color: #343f52 !important;
}

/* Navbar */
.dark-mode .navbar.fixed {
	background-color: #212529 !important;
	color: white !important;
}

.dark-mode .navbar.fixed .hamburger {
	filter: brightness(0) invert(1);
}

.dark-mode .nav-link {
	color: white !important;
}

/* min-width agar hanya diterapkan saat navbar-expand-lg */
@media (min-width: 992px) {
	.dark-mode .nav-item .dropdown-menu {
		background-color: #212529 !important;
	}
	.dark-mode .nav-item .dropdown-item {
		color: white;
	}
	.dark-mode .nav-item .dropdown-item:hover {
		color: #3f78e0;
	}
}

/* Counter */
.dark-mode .content-wrapper .bg-soft-primary {
	background-color: #202227 !important;
}

.dark-mode .content-wrapper .wrapper.bg-soft-primary.angled.lower-start::after,
.dark-mode
	.content-wrapper
	.wrapper.bg-soft-primary.angled.upper-start::before {
	border-left-color: #3c3d40;
}

/* Card */
.dark-mode .content-wrapper .card {
	background-color: #212529 !important;
	color: white !important;
}

/* Icon */
.dark-mode .content-wrapper .icon-svg {
	filter: invert(1) sepia(1) saturate(5) hue-rotate(180deg);
}

.dark-mode .content-wrapper .social:not(.no-dark-mode) .uil,
.dark-mode .content-wrapper .social:not(.no-dark-mode) svg {
	filter: invert(1) sepia(1) saturate(5) hue-rotate(180deg);
}

/* Background Decoration */
.dark-mode .content-wrapper .bg-decoration {
	background-color: #373531 !important;
}

/* Post */
.post .post-content {
	color: black !important;
}

.dark-mode .content-wrapper .post .post-content {
	color: white !important;
}

/* Hashtag */
.dark-mode .content-wrapper .btn-soft-ash {
	background-color: #eeeff0;
}

/* Input */
.dark-mode .content-wrapper .form-control {
	background-color: #212529 !important;
	color: white !important;
	border-color: #495057;
}

.dark-mode .content-wrapper .form-control:focus {
	border-color: #9fbcf0;
}

.dark-mode .content-wrapper .form-control option {
	color: white !important;
}

.dark-mode .content-wrapper .form-select {
	background-color: #212529 !important;
	color: white !important;
	border-color: #495057;
	background-image: url("data:image/svg+xml,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='45' height='32' viewBox='0 0 45 32'%3e%3cpath fill='%23fff' d='M26.88 29.888c-1.076 1.289-2.683 2.103-4.48 2.103s-3.404-0.814-4.472-2.093l-0.008-0.009-5.12-7.040-8.192-10.048-3.52-4.608c-0.646-0.848-1.036-1.922-1.036-3.087 0-2.828 2.292-5.12 5.12-5.12 0.139 0 0.277 0.006 0.413 0.016l-0.018-0.001h33.664c0.118-0.010 0.256-0.015 0.396-0.015 2.828 0 5.12 2.292 5.12 5.12 0 1.165-0.389 2.239-1.045 3.1l0.009-0.013-3.52 4.608-7.872 10.048z'/%3e%3c/svg%3e");
}

/* Pagination */
.dark-mode .content-wrapper .pagination .page-link {
	background-color: #212529 !important;
	border-color: #212529 !important;
}

/* Table */
.dark-mode .content-wrapper table th,
.dark-mode .content-wrapper table td {
	color: white !important;
}

/* .span_wrapper untuk panah sort */
.dark-mode .content-wrapper table th[data-sortby] .span_wrapper {
	filter: invert(1);
}

/* Social Media */
.dark-mode .content-wrapper .artikel .post-card,
.dark-mode .content-wrapper .berita .post-card,
.dark-mode .content-wrapper .skema .post-card,
.dark-mode .content-wrapper .ig-card,
.dark-mode .content-wrapper .youtube-card {
	border-color: #1b1f22 !important;
}

.dark-mode .content-wrapper .artikel .post-caption,
.dark-mode .content-wrapper .berita .post-caption,
.dark-mode .content-wrapper .skema .post-card,
.dark-mode .content-wrapper .ig-caption,
.dark-mode .content-wrapper .youtube-caption {
	background-color: #1b1f22 !important;
}

.dark-mode .content-wrapper .post-title {
	color: #b5d0ff !important;
}

.dark-mode .content-wrapper .title-link {
	color: white;
}

.dark-mode .content-wrapper .title-link:hover {
	color: #3f78e0;
}

/* Share */
.dark-mode .content-wrapper .dropdown-menu {
	background-color: #212529 !important;
}

.dark-mode .content-wrapper .dropdown-item {
	color: white;
}

.dark-mode .content-wrapper .dropdown-item:hover {
	color: #3f78e0;
}

/* Video */
.video-text {
	color: black !important;
}

.dark-mode .content-wrapper .video-text {
	color: white !important;
}

/* Logo */
.dark-mode .navbar img,
/* .dark-mode .sambutan img, */
.dark-mode .kontak img,
.dark-mode footer img {
	filter: grayscale(100%) brightness(1000%);
}