i.theme-sun {
    display: none !important;
}

i.theme-moon {
    display: inline-block !important;
}

html[data-theme="dark"] i.theme-sun {
    display: inline-block !important;
}

html[data-theme="dark"] i.theme-moon {
    display: none !important;
}

/* ===================== Sidebar icon alignment fix ===================== */
/* Align icons + labels the same for links AND collapsible summaries */
.menu li > a,
.menu li > details > summary {
    display: flex !important;
    align-items: center;
    gap: 0.5rem;
    line-height: 1.25;
}

/* Normalize icon box so different glyphs don’t shift text */
.menu i[class*="fa-"] {
    width: 1.25rem; /* equal horizontal slot */
    text-align: center;
    font-size: 1.05rem; /* uniform size */
    flex-shrink: 0;
}

.navbar .btn-ghost.btn-active {
    background-color: #b7bed2 !important; /* neutral-focus */
    color: black !important; /* neutral-content */
}

/* DataTables v2 theme-aware pagination (works with DaisyUI tokens) */
html[data-theme="dark"] .dt-container .dt-paging .dt-paging-button {
    color: var(--color-base-content) !important;
    background-color: var(--color-base-100) !important;
    border: 1px solid var(--color-base-300) !important;
    border-radius: .5rem !important;
    padding: .35rem .6rem !important;
    margin: 0 .15rem !important;
    box-shadow: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

html[data-theme="dark"] .dt-container .dt-paging .dt-paging-button:hover {
    background-color: var(--color-base-200) !important;
    border-color: var(--color-base-300) !important;
}

html[data-theme="dark"] .dt-container .dt-paging .dt-paging-button.current,
html[data-theme="dark"] .dt-container .dt-paging .dt-paging-button[aria-current="page"] {
    background-color: var(--color-primary) !important;
    color: var(--color-primary-content) !important;
    border-color: var(--color-primary) !important;
}

html[data-theme="dark"] .dt-container .dt-paging .dt-paging-button.disabled,
html[data-theme="dark"] .dt-container .dt-paging .dt-paging-button.disabled:hover {
    background: transparent !important;
    color: color-mix(in oklab, var(--color-base-content) 45%, transparent) !important;
    border-color: var(--color-base-300) !important;
    cursor: default !important;
    pointer-events: none !important;
}

/* Optional: unify other DT v2 controls in dark */
html[data-theme="dark"] .dt-container .dt-info,
html[data-theme="dark"] .dt-container .dt-length label,
html[data-theme="dark"] .dt-container .dt-search label {
    color: var(--color-base-content) !important;
}

html[data-theme="dark"] .dt-container .dt-length select,
html[data-theme="dark"] .dt-container .dt-search input {
    background: var(--color-base-100) !important;
    color: var(--color-base-content) !important;
    border: 1px solid var(--color-base-300) !important;
    border-radius: .5rem !important;
    padding: .25rem .5rem !important;
}

/* (Nice to have) row hover */
html[data-theme="dark"] .dt-container table.dataTable.display tbody tr:hover {
    background-color: var(--color-base-200) !important;
}