/* ================================================================
   CERIA PATI — Custom Global Overrides
   File ini di-load setelah bundle utama Vite untuk override spesifik
   tanpa menyentuh template SCSS asli.
   ================================================================ */

/* ---------------------------------------------------------------
   1. FONT SIZE GLOBAL — naik dari 13px (0.8125rem) ke 14px
   --------------------------------------------------------------- */
body {
    font-size: 0.875rem !important; /* 14px */
}

/* Kompensasi elemen yang ukurannya di-set eksplisit di SCSS */
.sidebar-left #sidebar-menu ul > li > a {
    font-size: 14px !important;
}

.sidebar-left #sidebar-menu ul > li ul.sub-menu li a {
    font-size: 13.5px !important;
}

/* ---------------------------------------------------------------
   2. SIDEBAR MENU — pertegas warna teks
   --------------------------------------------------------------- */

/* Override CSS variable utama sidebar */
:root,
[data-bs-theme="light"] {
    --bs-sidebar-menu-item-color: #3d4a57;
}

/* Menu item utama (level 1) */
.sidebar-left #sidebar-menu ul > li > a {
    color: #3d4a57 !important;
    font-weight: 500 !important;
}

/* Sub-menu item (level 2 & 3) */
.sidebar-left #sidebar-menu ul > li ul.sub-menu li a {
    color: #4a5568 !important;
    font-weight: 500 !important;
}

/* Sub-menu item aktif */
.sidebar-left #sidebar-menu ul > li ul.sub-menu li a.active,
.sidebar-left #sidebar-menu ul > li ul.sub-menu li.mm-active a {
    color: var(--bs-primary) !important;
    font-weight: 600 !important;
}

/* Hover state sub-menu */
.sidebar-left #sidebar-menu ul > li ul.sub-menu li a:hover {
    color: var(--bs-primary) !important;
}

/* ---------------------------------------------------------------
   3. MENU TITLE (section label) — lebih terlihat
   --------------------------------------------------------------- */
.sidebar-left #sidebar-menu .menu-title {
    font-size: 11px !important;
    opacity: 0.75 !important;          /* naik dari 0.5 */
    color: #3d4a57 !important;
    letter-spacing: 0.06em !important;
}

/* ---------------------------------------------------------------
   4. ICON SIDEBAR — sesuaikan dengan warna teks
   --------------------------------------------------------------- */
.sidebar-left #sidebar-menu ul > li > a i,
.sidebar-left #sidebar-menu ul > li > a svg {
    color: #506070 !important;
    opacity: 0.85;
}

.sidebar-left #sidebar-menu ul > li > a:hover i,
.sidebar-left #sidebar-menu ul > li > a:hover svg,
.sidebar-left #sidebar-menu .mm-active > a i,
.sidebar-left #sidebar-menu .mm-active > a svg {
    color: var(--bs-primary) !important;
    opacity: 1;
}

/* ---------------------------------------------------------------
   5. TEKS UMUM — slightly sharpen teks muted & secondary
   --------------------------------------------------------------- */
.text-muted {
    color: #6b7a8d !important;     /* sedikit lebih gelap dari default #74788d */
}

/* ---------------------------------------------------------------
   6. TABS UNDERLINE — perpanjang garis aktif di tab nav-pills
   --------------------------------------------------------------- */
.nav.custom-tab .nav-link:before {
    width: 100% !important;
    left: 0 !important;
    transform: none !important;
    border-radius: 0 0 4px 4px !important;
    margin-right: 0 !important;
}

/* ---------------------------------------------------------------
   7. APEXCHARTS TOOLTIP — Force Tooltip text to be black
   --------------------------------------------------------------- */
.apexcharts-tooltip.apexcharts-theme-light {
    background: #fff !important;
    color: #000 !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}
.apexcharts-tooltip-text-y-value, .apexcharts-tooltip-text-y-label, .apexcharts-tooltip-series-group {
    color: #000 !important;
}

/* ---------------------------------------------------------------
   8. BADGE FONT SIZE — Override Bootstrap's 0.75em limitation
   --------------------------------------------------------------- */
body .badge {
    --bs-badge-font-size: inherit;
    font-size: 14px !important;
}

/* ---------------------------------------------------------------
   9. TABLE & SMALL BUTTON FONT SIZE — Ensure readability
   --------------------------------------------------------------- */
body .table td, 
body .table th,
body .table tbody tr td {
    font-size: 14px !important;
}

body .btn-sm {
    font-size: 14px !important;
}

body small, body .small {
    font-size: 13.5px !important;
}

/* ---------------------------------------------------------------
   10. FORM ELEMENTS FONT SIZE — Ensure readability in forms
   --------------------------------------------------------------- */
body .form-control,
body .form-select,
body .form-label,
body .input-group-text {
    font-size: 14px !important;
}

/* ---------------------------------------------------------------
   11. INVOICE STAMP — Responsive positioning
   --------------------------------------------------------------- */
.invoice-stamp {
    position: absolute;
    top: 35px;
    right: 200px;
    transform: rotate(-10deg);
    opacity: 0.85;
    font-size: 20px;
    letter-spacing: 3px;
    font-family: 'Courier New', Courier, monospace;
    border-style: double !important;
    border-width: 6px !important;
    z-index: 10;
}

@media (max-width: 768px) {
    .invoice-stamp {
        top: 20px;
        right: 20px;
        font-size: 14px;
        border-width: 4px !important;
    }
}