:root {
    --primary-green: rgb(0, 151, 136);
}

.bg-blue {
    background-color: rgb(223, 246, 255);
}

article span {
    text-decoration: none !important;
}

.dark\:ring-yellow:is(.dark *) {
    --tw-ring-color: rgba(227 160 8 / 0.4);
}

.ring-blue {
    --tw-ring-color: rgba(118 169 250 / 0.4);
}

.ring-green {
    --tw-ring-color: rgba(107 114 128 / 0.4);
}

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

.article:last-child .border-b-2 {
    border-bottom: none;
}

#nprogress .bar {
    height: 4px !important;
}

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

.floating {
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
@keyframes floating {
    0% {
        transform: translate(0, 0px);
    }
    50% {
        transform: translate(0, 8px);
    }
    100% {
        transform: translate(0, -0px);
    }
}
.floating-4 {
    animation-name: floating;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
@keyframes floating-4 {
    0% {
        transform: translate(0, 0px);
    }
    50% {
        transform: translate(0, 8px);
    }
    100% {
        transform: translate(0, -0px);
    }
}

.aspect-4x3 {
    aspect-ratio: 4/3 !important;
}

:is(.dark .dark\:bg-dark) {
    --tw-bg-opacity: 1;
    background-color: rgb(30 30 30 / var(--tw-bg-opacity));
}

:is(.dark .dark\:bg-dark-gray) {
    --tw-bg-opacity: 1;
    background-color: rgb(40 42 58 / var(--tw-bg-opacity));
}

::-webkit-scrollbar {
    width: 8px;
    cursor: pointer;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: var(--primary-green) !important;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: silver;
}

.overflow-x-auto::-webkit-scrollbar {
    display: none; /* Hides scrollbar in Webkit browsers (Chrome, Safari, Edge) */
}

.overflow-x-auto {
    -ms-overflow-style: none; /* Hides scrollbar in Internet Explorer */
    scrollbar-width: none; /* Hides scrollbar in Firefox */
}

.prose {
    --tw-prose-bullets: inherit !important;
    --tw-prose-counters: inherit !important;
}

@media (min-width: 640px) {
    .border-640px-none {
        border-style: none !important;
    }
}

@media (min-width: 768px) {
    .md\:bg-transparent {
        background-color: transparent !important;
    }
}

@media (min-width: 1024px) {
    .border-desktop-none {
        border-style: none !important;
    }
}

@media print {
    @page {
        margin-top: 2.5cm; /* Atas */
        margin-right: 2cm; /* Kanan */
        margin-bottom: 2.5cm; /* Bawah */
        margin-left: 3cm; /* Kiri */
    }
}