/*
| ----------------------------------------------------------------------------
| ------------> Page Pre Loader
| ----------------------------------------------------------------------------
|
*/
    #preloader {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 9999;
        background-color: #ffffff;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #preloader img {
        position: fixed;
        left: 50%;
        top: 50%;
    }
/* END Pre-loader */


/* Sweet Alert
/* Default (desktop): use standard SweetAlert size */
.swal2-popup {
    width: auto !important;
    max-width: 500px !important;
}

/* Tablets (max 768px) */
@media (max-width: 768px) {
    .swal2-popup {
        width: 90% !important;
        max-width: 380px !important;
    }
}

/* Mobile (max 480px) */
@media (max-width: 480px) {
    .swal2-popup {
        width: 95% !important;
        max-width: 320px !important;
    }
}
/* END Sweet alert*/


/* Offline Blinker Text */
   /* Clean Fade-In / Fade-Out Animation */
.offline-badge {
    /* 1.2s total cycle (0.6s out, 0.6s in) */
    animation: fade-breathing 1.2s ease-in-out infinite alternate;
    /* Optional: ensures it looks crisp on high-res screens */
    -webkit-backface-visibility: hidden;
}

@keyframes fade-breathing {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
/* Black and light logo switcher */
/* Default: Hide the dark-theme logo */
.logo-dark-theme {
  display: none;
}

/* When the theme is dark, hide the light logo and show the dark logo */
[data-bs-theme="dark"] .logo-light-theme {
  display: none !important;
}

[data-bs-theme="dark"] .logo-dark-theme {
  display: inline !important;
}
/* /CONTROL THE padding and font SIZE OF DATA TABLE / */
/* Compact DataTables style (Accounting / ERP style) */

.table.dataTable {
    font-size: 15px;
}

.table.dataTable th {
    font-weight: 600;
    padding: 8px 12px;
}

.table.dataTable td {
    padding: 6px 12px;
    vertical-align: middle;
}

/* Reduce badge size slightly */
.table.dataTable .badge {
    font-size: 11px;
    padding: 4px 8px;
}

/* Make action buttons smaller */
.table.dataTable .btn {
    padding: 3px 6px;
}

/* Reduce dropdown icon spacing */
.table.dataTable .btn-icon {
    width: 28px;
    height: 28px;
}

/* Hover highlight for better readability */
.table.dataTable tbody tr:hover {
    background-color: #f8f9fa;
}

/* Slight zebra striping */
.table.dataTable tbody tr:nth-child(even) {
    background-color: #fbfbfb;
}
/* /END REDUCE THE SIZE OF DATA TABLE / */
/* Bridge */
    /* Solve the clipping issue */
    .dropdown-safe-card, 
    .dropdown-safe-card .card-body, 
    .dropdown-safe-card .list-group,
    .transaction-item {
        overflow: visible !important;
    }

    /* Force the Hover Effect */
    .transaction-item {
        transition: all 0.2s ease-in-out;
        cursor: pointer;
        background-color: transparent; /* Ensure it's clear by default */
    }

    /* Use a slightly darker color and specific selector to override theme defaults */
    .list-group-item.transaction-item:hover {
        background-color: #f4f5f7 !important; 
        transform: translateY(-1px);
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
        z-index: 1; /* Brings the hovered item slightly forward */
    }

    .dropdown-menu {
        z-index: 2000 !important;
    }

    .border-bottom-dashed { border-bottom: 1px dashed #ebedef !important; }
    .bg-lighter { background-color: #f8f9fa !important; }
/* END Bridge */