/* =============================================================================
   Shannen brand + sidebar sync (lebar sidebar = margin + width konten)
   ============================================================================= */

:root {
    --shannen: #ed8967;
    --shannen-dark: #c96847;
    --shannen-darker: #a8523a;
    --shannen-light: #fdf0eb;
    --shannen-soft: #f9ddd2;
    --sidebar-width-expanded: 250px;
    --sidebar-width-mini: 72px;
    --sidebar-current-width: 250px;
}

@media (min-width: 1200px) {
    body.g-sidenav-pinned {
        --sidebar-current-width: 250px;
    }

    body.g-sidenav-mini {
        --sidebar-current-width: 72px;
    }

    /* Matikan hover-expand Argon */
    .sidenav:hover {
        max-width: var(--sidebar-current-width) !important;
    }

    .sidenav.navbar-vertical.navbar-expand-xs.fixed-left,
    .sidenav.fixed-left {
        width: var(--sidebar-current-width) !important;
        max-width: var(--sidebar-current-width) !important;
        min-width: var(--sidebar-current-width) !important;
        transition: width 0.25s ease, max-width 0.25s ease, min-width 0.25s ease;
        overflow-x: hidden;
        overflow-y: auto;
        z-index: 1050;
    }

    /* ~ bukan + : edge toggle button ada di antara nav dan main-content */
    .navbar-vertical.navbar-expand-xs.fixed-left ~ .main-content,
    .navbar-vertical.navbar-expand-xl.fixed-left ~ .main-content,
    .sidenav.navbar-vertical.fixed-left ~ .main-content,
    .sidenav.fixed-left ~ .main-content {
        margin-left: var(--sidebar-current-width) !important;
        width: calc(100% - var(--sidebar-current-width)) !important;
        max-width: calc(100% - var(--sidebar-current-width)) !important;
        transition: margin-left 0.25s ease, width 0.25s ease, max-width 0.25s ease;
        box-sizing: border-box;
    }

    body.g-sidenav-mini .sidenav .nav-link-text,
    body.g-sidenav-mini .sidenav .navbar-brand span,
    body.g-sidenav-mini .sidenav hr.my-3 {
        opacity: 0 !important;
        visibility: hidden !important;
        width: 0 !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        pointer-events: none !important;
    }

    body.g-sidenav-mini .sidenav .navbar-brand-img {
        opacity: 1 !important;
        visibility: visible !important;
        max-width: 36px;
        margin: 0 auto;
    }

    body.g-sidenav-mini .sidenav-header {
        justify-content: center !important;
    }

    body.g-sidenav-mini .sidenav-header .navbar-brand {
        display: flex !important;
        justify-content: center;
        padding: 1rem 0.5rem;
    }

    body.g-sidenav-mini .sidenav .nav-link {
        justify-content: center;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    body.g-sidenav-mini .sidenav .nav-link i,
    body.g-sidenav-mini .sidenav .nav-link .ni {
        margin-right: 0 !important;
    }

    body.g-sidenav-mini .sidenav .nav-item .collapse {
        display: none !important;
    }

    .sidenav-edge-toggle {
        position: fixed;
        top: 50%;
        margin-top: -15px;
        z-index: 1100;
        width: 30px;
        height: 30px;
        padding: 0;
        border: 1px solid #e8ddd8;
        border-radius: 50%;
        background: #fff;
        color: var(--shannen-dark);
        box-shadow: 0 4px 16px rgba(168, 82, 58, 0.15);
        cursor: pointer;
        left: calc(var(--sidebar-current-width) - 15px);
        transition: left 0.25s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .sidenav-edge-toggle-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        font-size: 22px;
        font-weight: 700;
        font-family: Georgia, "Times New Roman", serif;
        user-select: none;
        pointer-events: none;
        color: inherit;
        line-height: 1;
    }

    .sidenav-edge-toggle:hover {
        background: var(--shannen);
        color: #fff;
        border-color: var(--shannen);
        box-shadow: 0 6px 20px rgba(237, 137, 103, 0.35);
    }

    /* Jangan tampil di atas modal (Bootstrap modal z-index ~1050) */
    body.modal-open .sidenav-edge-toggle {
        visibility: hidden;
        pointer-events: none;
        opacity: 0;
    }

    .sidenav-header .sidenav-toggler.d-none.d-xl-block {
        display: none !important;
    }
}

@media (max-width: 1199.98px) {
    .sidenav-edge-toggle {
        display: none !important;
    }

    .sidenav.fixed-left ~ .main-content,
    .navbar-vertical.navbar-expand-xs.fixed-left ~ .main-content {
        margin-left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}