[data-theme="dark"] {
    --color-bg: #1f1f1f; /* Very dark gray */
    --color-text: #ffffff; /* Pure white for max contrast */
}

[data-theme="blue"] {
    --color-bg: #0998f6; /* Dark blue-gray (Tailwind slate-800) */
    --color-text: #ffffff; /* White for dark background */
}

[data-theme="red"] {
    --color-bg: #f60922; /* Dark muted red */
    --color-text: #ffffff; /* White for contrast */
}

[data-theme="black"] {
    --color-bg: #000000; /* Pure black */
    --color-text: #ffffff; /* White for highest contrast */
}

[data-theme="white"] {
    --color-bg: #ffffff; /* White */
    --color-text: #111111; /* Almost black text for readability */
}

[data-theme="yellow"] {
    --color-bg: #eef115; /* White */
    --color-text: #111111; /* Almost black text for readability */
}


/* === FONTS === */
[data-font="inter"] {
    --font-family: 'Inter', sans-serif;
}

[data-font="openSans"] {
    --font-family: 'Open Sans', sans-serif;
}

[data-font="roboto"] {
    --font-family: 'Roboto', sans-serif;
}

[data-font="lato"] {
    --font-family: 'Lato', sans-serif;
}

[data-font="montserrat"] {
    --font-family: 'Montserrat', sans-serif;
}

[data-font="oswald"] {
    --font-family: 'Oswald', sans-serif;
}

[data-font="sourceSansPro"] {
    --font-family: 'Source Sans Pro', sans-serif;
}

[data-font="slabo27px"] {
    --font-family: 'Slabo 27px', serif;
}

[data-font="raleway"] {
    --font-family: 'Raleway', sans-serif;
}

[data-font="merriweather"] {
    --font-family: 'Merriweather', serif;
}

[data-font="notoSans"] {
    --font-family: 'Noto Sans', sans-serif;
}

[data-font="nunitoSans"] {
    --font-family: 'Nunito Sans', sans-serif;
}

[data-font] *,
[data-font] h1,
[data-font] h2,
[data-font] h3,
[data-font] h4,
[data-font] h5,
[data-font] h6,
[data-font] p,
[data-font] span,
[data-font] div,
[data-font] a,
[data-font] li,
[data-font] button,
[data-font] input,
[data-font] textarea {
    font-family: var(--font-family) !important;
}

[data-theme] {
    background-color: var(--color-bg);
    color: var(--color-text);
}


.bg-bgbackground {
    background-color: var(--color-bg);
}

.text-bgtext {
    color: var(--color-text);
}

.swal2-confirm.custom-swal-confirm,
.swal2-cancel.custom-swal-cancel {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 2rem !important; /* h-8 */
    padding: 0 0.75rem !important; /* px-3 */
    border-radius: 0.375rem !important; /* rounded-md */
    font-size: 0.875rem !important; /* text-sm */
    font-weight: 500 !important; /* medium weight */
    transition: all 0.2s ease-in-out !important;
}

/* Confirm Button Colors */
.swal2-confirm.custom-swal-confirm {
    background-color: #000000 !important;
    color: #ffffff !important;
}

    .swal2-confirm.custom-swal-confirm:hover {
        background-color: #374151 !important;
    }   

/* Cancel Button Colors */
.swal2-cancel.custom-swal-cancel {
    background-color: #dc2626 !important;
    color: #ffffff !important;
}

    .swal2-cancel.custom-swal-cancel:hover {
        background-color: #b91c1c !important;
    }

@keyframes toast-progress {
    from {
        width: 100%;
    }

    to {
        width: 0%;
    }
}

.animate-toast-progress {
    animation: toast-progress 5s linear forwards;
}

.tooltip-arrow {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    position: absolute;
}

.tooltip[data-popper-placement^="top"] > .tooltip-arrow {
    border-top: 6px solid #1f2937; /* color of tooltip */
    bottom: -6px; /* position below tooltip */
}

.tooltip[data-popper-placement^="bottom"] > .tooltip-arrow {
    border-bottom: 6px solid #1f2937;
    top: -6px; /* position above tooltip */
}

/* Dark mode */
.dark .tooltip[data-popper-placement^="top"] > .tooltip-arrow {
    border-top-color: #374151;
}

.dark .tooltip[data-popper-placement^="bottom"] > .tooltip-arrow {
    border-bottom-color: #374151;
}

/* site.css or your main CSS */
.hide-scrollbar::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Edge */
}

.hide-scrollbar {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

.sidebarIcon {
    color: #97b1c3;
}
