:root {
    --sibeka-yellow: #e9eb22;
    --sibeka-green: #078f3c;
    --green-dark: #0d6e2d;
}

* {
    font-family: "Poppins", sans-serif;
}

html,
body {
    height: 100%;
    overflow-y: auto; /* Pastikan scroll hanya muncul jika diperlukan */
}

body {
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Mencegah scroll horizontal */
}

.curosr-pointer {
    cursor: pointer;
}

.text-sibeka-green {
    color: var(--sibeka-green);
}

.text-sibeka-yellow {
    color: var(--sibeka-yellow);
}

.text-green-dark {
    color: var(--green-dark);
}

.bg-sibeka-yellow {
    background-color: var(--sibeka-yellow);
}

.bg-sibeka-green {
    background-color: var(--sibeka-green);
}

.bg-green-dark {
    background-color: var(--green-dark);
}

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

/* Hover effect */
.hover-effect-konseling {
    transition: background-color 0.1s ease, color 0.1s ease; /* Animasi transisi */
}

.hover-effect-konseling:hover {
    background-color: var(--sibeka-green); /* Warna hijau saat hover */
    color: #fff !important; /* Teks menjadi putih */
    border-color: var(--sibeka-green); /* Pastikan border tetap hijau */
}

.fw-extra-bold {
    font-weight: 900;
}

.nav-item .navbar-sibeka:hover {
    color: var(--sibeka-green) !important;
}

.btn-sibeka-primary {
    background-color: var(--sibeka-green) !important;
    color: #fff !important;
    border-color: var(--sibeka-green) !important;
}

.btn-sibeka-primary:hover {
    background-color: var(--green-dark) !important;
    color: #fff !important;
    border-color: var(--sibeka-green) !important;
}

.margin-section {
    margin-top: 100px;
    margin-bottom: 100px;
}

.card-sibeka-countup {
    background-color: var(--sibeka-yellow) !important;
}

.card-sibeka-countup .card-body .number-total {
    font-size: 3rem;
    font-weight: 800;
}

.card-sibeka-countup .card-body .number-description {
    font-size: 16px;
    font-weight: 500;
}

.card .card-body .iconify-service {
    font-size: 5rem;
}

.custom-accordion .accordion-button {
    color: var(--sibeka-green);
    font-weight: 600;
}

.custom-accordion .accordion-button:not(.collapsed) {
    background-color: var(--sibeka-green); /* Hijau */
    color: #ffffff; /* Putih */
}

.custom-accordion .accordion-button::after {
    content: none;
}

/* Default plus icon */
.custom-accordion .accordion-button .icon::after {
    content: "+";
    color: #000; /* Blue for default */
    font-weight: bold;
    font-size: 1.25rem;
    transition: transform 0.3s ease, color 0.3s ease;
}

/* Change to minus icon when accordion is open */
.custom-accordion .accordion-button:not(.collapsed) .icon::after {
    content: "-";
    color: #fff; /* Red when open */
}

/* Align the icon properly */
.custom-accordion .icon {
    display: inline-block;
    width: 1.25rem;
    text-align: center;
}

.custom-accordion .accordion-button:hover {
    background-color: var(--sibeka-green);
    color: #ffffff; /* Putih */
}

.custom-accordion .accordion-body {
    background-color: var(--sibeka-green); /* Warna hijau */
    color: #ffffff; /* Putih */
}

/* accordion item first make it rounded top left right */
.custom-accordion .accordion-item:first-child .accordion-button {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}

/* hover */
.custom-accordion .accordion-item:first-child .accordion-button:hover {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}

/* Last item rounded bottom-left and bottom-right on hover */
.custom-accordion .accordion-item:last-child .accordion-button {
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}

/* Remove hover effect when accordion is open */
.custom-accordion .accordion-item:last-child .accordion-button:not(.collapsed) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

/* Apply rounded corners to the accordion body when open (last item only) */
.custom-accordion .accordion-item:last-child .accordion-collapse.show {
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
    overflow: hidden; /* Prevent content overflow from rounded corners */
}

.card .card-body .img-help {
    position: absolute;
    top: -26%;
    right: 0;
}

/* hidden in mobile */
@media (max-width: 768px) {
    .card .card-body .img-help {
        display: none;
    }
}

.bg-login {
    background-image: url("../images/bg-login.png");
    background-size: cover;
    background-position: center;
}

.custom-nav-item .nav-link {
    transition: all 0.1s ease; /* Efek transisi */
}

.custom-nav-item .nav-link:hover {
    color: white !important; /* Warna teks saat hover */
    background-color: #28a745; /* Warna background saat hover */
}

.custom-nav-item .nav-link:hover .nav-link-icon {
    color: white !important; /* Warna ikon saat hover */
}

.custom-active {
    color: white !important; /* Warna teks untuk item aktif */
    background-color: #28a745; /* Warna background untuk item aktif */
}

.custom-active .nav-link-icon {
    color: white !important; /* Warna ikon untuk item aktif */
}

.table-sibeka-green {
    background: var(--sibeka-green) !important;
    color: white !important;
}


.fixed-label {
    display: inline-block;
    width: 180px; /* Sesuaikan lebar label */
    font-weight: bold; /* Tebalkan teks label */
  }