/* ===== enhancements.css =====
   1. Tombol lihat/sembunyikan password (dipasang otomatis oleh toggle-password.js)
   2. Menu dashboard bisa digeser kanan-kiri (drag/scroll) kalau isinya panjang
*/

/* --- 1. Toggle Password --- */
.pwd-toggle-wrapper {
    position: relative;
    display: block;
}
.pwd-toggle-wrapper input[type="password"],
.pwd-toggle-wrapper input[type="text"] {
    width: 100%;
}
.pwd-toggle-btn {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 2.4rem;
    border: none;
    background: transparent;
    color: #888;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    z-index: 5;
}
.pwd-toggle-btn:hover { color: #6f2da8; }
.pwd-toggle-btn:focus { outline: none; box-shadow: none; }

/* --- 2. Menu dashboard geser kanan-kiri --- */
.menu-geser {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: #6f2da8 #eee;
    cursor: grab;
    user-select: none;
}
.menu-geser.geser-aktif {
    cursor: grabbing;
}
.menu-geser::-webkit-scrollbar {
    height: 6px;
}
.menu-geser::-webkit-scrollbar-track {
    background: #eee;
    border-radius: 10px;
}
.menu-geser::-webkit-scrollbar-thumb {
    background: #6f2da8;
    border-radius: 10px;
}
.menu-geser > .nav-item,
.menu-geser > li {
    flex: 0 0 auto;
}
.menu-geser .nav-link {
    white-space: nowrap;
}