@import url('https://fonts.googleapis.com/css2?family=Merriweather+Sans:ital,wght@0,300..800;1,300..800&display=swap');

:root {
    --bs-body-font-family: 'Merriweather Sans', sans-serif !important;
    --bs-font-sans-serif: 'Merriweather Sans', sans-serif !important;
}

/* Apply Merriweather Sans font globally across text elements */
html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
li,
label,
strong,
b,
small,
code,
input,
button,
select,
textarea,
.btn,
.nav-link,
.dropdown-item,
.card,
.table,
.badge,
.menu-title,
#sidebar-menu,
.vertical-menu,
.navbar,
.topbar {
    font-family: 'Merriweather Sans', sans-serif !important;
}

span:not([class*="uil"]):not([class*="fa"]):not([class*="ti"]):not([class*="bx"]):not([class*="icon"]),
a:not([class*="uil"]):not([class*="fa"]):not([class*="ti"]):not([class*="bx"]):not([class*="icon"]) {
    font-family: 'Merriweather Sans', sans-serif !important;
}

/* PRESERVE ICON FONTS - Do not override font-family for icon elements */
i,
.uil,
[class^="uil-"],
[class*=" uil-"],
.fa,
.fas,
.far,
.fab,
[class^="fa-"],
[class*=" fa-"],
.ti,
[class^="ti-"],
[class*=" ti-"],
.bx,
[class^="bx-"],
[class*=" bx-"] {
    font-family: initial;
}

/* Global Reset for Link Underline (Normal, Hover, Focus, Active) */
a,
a:hover,
a:focus,
a:active,
a:visited,
.btn,
.nav-link,
.sidebar-link,
.dropdown-item,
.card a,
.table a {
    text-decoration: none !important;
}

/* GLOBAL FIX: Sembunyikan panah ganda ::after pada seluruh tombol split dropdown di aplikasi */
.dropdown-toggle-split::after,
.btn-group .dropdown-toggle-split::after,
.table-core-actions .dropdown-toggle-split::after,
.dropdown-toggle-no-caret::after {
    display: none !important;
    content: none !important;
}

/* SUBMENU DOT ICON (MODERNIZE STYLE FOR ALL SUBMENUS) */
#sidebar-menu .sub-menu li a,
.sidebar-nav ul .collapse li a,
#sidebarnav ul li a {
    display: flex !important;
    align-items: center !important;
}

#sidebar-menu .sub-menu li a::before,
.sidebar-nav ul .collapse li a::before {
    content: '' !important;
    display: inline-block !important;
    width: 7px !important;
    height: 7px !important;
    min-width: 7px !important;
    min-height: 7px !important;
    border-radius: 50% !important;
    background-color: #94a3b8 !important;
    margin-right: 12px !important;
    transition: all 0.2s ease !important;
}

#sidebar-menu .sub-menu li a:hover::before,
#sidebar-menu .sub-menu li.active>a::before,
#sidebar-menu .sub-menu li a.active::before,
.sidebar-nav ul .collapse li a:hover::before,
.sidebar-nav ul .collapse li a.active::before {
    background-color: #5d87ff !important;
    transform: scale(1.3) !important;
    box-shadow: 0 0 6px rgba(93, 135, 255, 0.6) !important;
}

/* Mapping Bootstrap 4/5.1 legacy soft classes to Bootstrap 5.3.3 subtle classes */
.bg-soft-primary {
    background-color: var(--bs-primary-bg-subtle, #ebf5ff) !important;
    color: var(--bs-primary, #0284c7) !important;
}

.bg-soft-secondary {
    background-color: var(--bs-secondary-bg-subtle, #f1f5f9) !important;
    color: var(--bs-secondary, #475569) !important;
}

.bg-soft-success {
    background-color: var(--bs-success-bg-subtle, #f0fdf4) !important;
    color: var(--bs-success, #16a34a) !important;
}

.bg-soft-info {
    background-color: var(--bs-info-bg-subtle, #f0f9ff) !important;
    color: var(--bs-info, #0284c7) !important;
}

.bg-soft-warning {
    background-color: var(--bs-warning-bg-subtle, #fffbeb) !important;
    color: var(--bs-warning, #d97706) !important;
}

.bg-soft-danger {
    background-color: var(--bs-danger-bg-subtle, #fef2f2) !important;
    color: var(--bs-danger, #dc2626) !important;
}

.bg-soft-dark {
    background-color: var(--bs-dark-bg-subtle, #f8fafc) !important;
    color: var(--bs-dark, #0f172a) !important;
}

/* Soft Text Utilities */
.text-soft-primary {
    color: var(--bs-primary) !important;
}

.text-soft-success {
    color: var(--bs-success) !important;
}

.text-soft-warning {
    color: var(--bs-warning) !important;
}

.text-soft-danger {
    color: var(--bs-danger) !important;
}

/* Hover baris tabel diseragamkan via table-core.css (#f2f8ff) — blok duplikate #e2eaf4 dihapus */

/* FIX FOOTER OVERLAPPING ISSUE */
.main-content {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.page-content {
    flex: 1 0 auto;
    padding-bottom: 30px !important;
}

footer.footer {
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    margin-top: auto !important;
    background-color: var(--bs-body-bg, #ffffff) !important;
    border-top: 1px solid var(--bs-border-color, #e2e8f0) !important;
    padding: 16px 0 !important;
    z-index: 100 !important;
    clear: both !important;
}

/* Override app.min.css min-height 1450px / 1300px on collapsed sidebar
   to prevent relative footer from floating/rising up */
body.vertical-collpsed,
body[data-sidebar=dark].vertical-collpsed,
body[data-sidebar=colored].vertical-collpsed,
.vertical-collpsed {
    min-height: 100vh !important;
}

/* ============================================================
   COLLAPSED SIDEBAR MOBILE STYLE (HIDDEN COMPLETELY)
   ============================================================ */

/* Enable smooth slide transition for sidebar toggle */
.vertical-menu,
.main-content,
#page-topbar,
footer.footer {
    transition: all 0.2s ease-in-out !important;
}

/* Hide sidebar completely offscreen when collapsed */
body.vertical-collpsed .vertical-menu {
    left: -250px !important;
    width: 250px !important;
    position: fixed !important;
}

/* Expand main content, topbar, and footer to full width when collapsed */
body.vertical-collpsed .main-content {
    margin-left: 0 !important;
}

body.vertical-collpsed #page-topbar {
    left: 0 !important;
}

body.vertical-collpsed footer.footer {
    left: 0 !important;
}

/* Show topbar hamburger menu button on left when sidebar is collapsed */
body.vertical-collpsed .ovn-topbar-left {
    display: flex !important;
}

body.vertical-collpsed .ovn-topbar-menu-btn {
    display: inline-flex !important;
    align-items: center;
    gap: 0.4rem;
}

body.vertical-collpsed #page-topbar .navbar-header {
    justify-content: space-between !important;
}