html,body{margin:0;font-family:inherit;background-color:transparent;overflow-x:hidden;width:100%;position:relative}.navbar,.navbar[class*=bg-],.navbar.bg-danger,.navbar.bg-light,.navbar.bg-dark{background:#00000080!important;backdrop-filter:blur(15px);border-bottom:1px solid rgba(255,255,255,.1);padding:8px 16px;box-shadow:0 4px 12px #0003;position:sticky;top:0;z-index:10000;min-height:60px;display:flex;align-items:center}.dropdown-menu,.notification-dropdown,.profile-dropdown{z-index:10001!important}.navbar .container-fluid{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap}.navbar-brand{display:flex;align-items:center;gap:8px;flex-shrink:1;min-width:0;margin:0}.navbar .d-flex.align-items-center.gap-2{flex-shrink:0;display:flex!important;align-items:center!important}.navbar-brand span{color:#fff!important;font-family:inherit;font-size:20px;font-weight:700;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}@media (min-width: 992px){.navbar-brand span{font-size:24px}}.navbar-brand img{height:32px;width:32px;object-fit:cover;border-radius:8px;flex-shrink:0}.mobile-top-actions{display:flex;align-items:center;gap:12px;flex-shrink:0}.mobile-top-actions a{display:flex;align-items:center;justify-content:center;text-decoration:none;margin:0!important}.burger-btn{width:30px;height:20px;position:relative;background:none;border:none;cursor:pointer;padding:0;z-index:10002}.burger-btn span{display:block;width:100%;height:2px;background:#fff;border-radius:2px;position:absolute;transition:all .3s cubic-bezier(.4,0,.2,1)}.burger-btn span:nth-child(1){top:0}.burger-btn span:nth-child(2){top:50%;transform:translateY(-50%)}.burger-btn span:nth-child(3){bottom:0}.burger-btn.active span:nth-child(1){top:50%;transform:translateY(-50%) rotate(45deg)}.burger-btn.active span:nth-child(2){opacity:0;transform:translate(-20px,-50%)}.burger-btn.active span:nth-child(3){bottom:50%;transform:translateY(50%) rotate(-45deg)}.mobile-menu-overlay{position:fixed;top:0;left:0;width:100%;height:100vh;background:#000000e6;backdrop-filter:blur(40px);-webkit-backdrop-filter:blur(40px);z-index:10001;display:flex;flex-direction:column;padding:80px 25px 40px;transform:translate(100%);transition:transform .4s cubic-bezier(.4,0,.2,1);overflow-y:auto;visibility:hidden}.mobile-menu-overlay.active{transform:translate(0);visibility:visible}.menu-header{margin-bottom:40px}.user-profile-section{display:flex;align-items:center;gap:15px;padding:20px;background:#ffffff0d;border-radius:20px;border:1px solid rgba(255,255,255,.1)}.menu-avatar{width:60px;height:60px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.2)}.user-details h5{color:#fff;margin:0;font-weight:600}.user-details p{color:#ffffff80;margin:0;font-size:13px}.menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.menu-item{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:20px;display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;transition:all .2s ease}.menu-item:active{transform:scale(.95);background:#ffffff1a}.icon-box{width:45px;height:45px;background:#ffffff1a;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px}.icon-box.plus-bg{background:linear-gradient(135deg,#ff416c,#ff4b2b);box-shadow:0 4px 15px #ff416c4d}.menu-item span{color:#fff;font-size:14px;font-weight:500}.menu-footer{margin-top:auto;padding-top:30px}.logout-link{display:flex;align-items:center;justify-content:center;gap:10px;color:#ff4b2b;text-decoration:none;font-weight:600;padding:15px;background:#ff4b2b1a;border-radius:15px}.mobile-bottom-nav,.nav-item-mobile,.plus-icon,.navbar-toggler{display:none!important}.navbar-nav .nav-link{font-size:14px;font-weight:500;color:#fff!important;transition:color .3s ease;padding:6px 12px;position:relative}.navbar-nav .nav-link:hover{color:#e0e0e0}.navbar-nav .nav-link.text-danger{color:#ffc107}.navbar-nav .nav-link.text-danger:hover{color:#fff}.navbar-nav .dropdown-menu{font-size:14px}#navbarProfileImage{width:28px;height:28px;object-fit:cover;border-radius:50%;margin-right:8px}.container{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between}.logo{font-size:24px;font-weight:700;color:#d72626}.logo span{color:#000}.search-bar{flex:1;max-width:400px;margin:0 20px;padding:8px 12px;border:1px solid #ccc;border-radius:4px}.nav-links a{margin-left:20px;color:#fff;text-decoration:none;font-size:14px}.nav-links .btn-keluar{padding:6px 14px;background-color:#fff3;color:#fff;border-radius:4px}.notification-badge{position:absolute;top:50%;left:100%;transform:translate(-10px,-50%);background:#f44;color:#fff;border-radius:50%;padding:2px 7px;font-size:11px;font-weight:700;z-index:10;min-width:18px;text-align:center;line-height:1.2;box-shadow:0 1px 4px #0000001f}.nav-link{position:relative}.nav-link .notification-badge{margin-left:4px;left:auto;right:-18px;top:50%;transform:translateY(-50%)}.notification-dropdown{position:absolute;top:100%;right:0;width:300px;background:#fff;border-radius:8px;box-shadow:0 4px 12px #00000026;display:none;z-index:1000;margin-top:5px}.notification-dropdown.show{display:block}@media (max-width: 768px){body{padding-bottom:0}.notification-dropdown{position:absolute;top:100%;right:10px;left:auto;width:320px;max-width:calc(100vw - 20px);height:auto;max-height:450px;margin-top:10px;border-radius:12px;z-index:10001;background:#fff;box-shadow:0 8px 24px #0003;overflow:hidden}.notification-list{max-height:350px}.btn-close-white.d-lg-none{display:none!important}}.notification-header{padding:12px 16px;border-bottom:1px solid #eee;display:flex;justify-content:space-between;align-items:center}.notification-header h6{margin:0;font-weight:600}.btn-mark-all{background:none;border:none;color:#dc3545;font-size:12px;cursor:pointer}.notification-list{max-height:400px;overflow-y:auto}.notification-item{padding:12px 16px;border-bottom:1px solid #eee;cursor:pointer;transition:all .2s ease}.notification-item:hover{background:#f8f9fa}.notification-item.unread{background:#fff8f8}.notification-content{display:flex;gap:10px;align-items:flex-start;padding:8px}.sender-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 2px 4px #0000001a;flex-shrink:0}.notification-details{flex:1;min-width:0}.notification-message{margin-bottom:4px}.notification-message strong{font-size:13px;color:#1a1d21;display:block;margin-bottom:2px}.notification-message p{font-size:12px;color:#666;margin:0;line-height:1.4}.notification-meta{display:flex;align-items:center;gap:8px;margin-top:4px}.notification-time{font-size:11px;color:#999}.unread-indicator{width:6px;height:6px;border-radius:50%;background:#dc3545}.no-notifications{text-align:center;padding:32px 16px;color:#666}.no-notifications i{font-size:24px;margin-bottom:8px;opacity:.5}.notification-group{margin-bottom:16px}.notification-date{padding:8px 16px;font-size:12px;font-weight:600;color:#666;background:#f8f9fa}.notif-blink{animation:notif-blink-anim .7s alternate 2}@keyframes notif-blink-anim{0%{color:#ffc107;filter:none}50%{color:#fff;filter:drop-shadow(0 0 2px #ffc107)}to{color:#ffc107;filter:none}}.notif-label{display:inline!important;font-weight:600;margin-left:4px}.profile-dropdown{min-width:260px;border-radius:14px;box-shadow:0 8px 32px #3c3c3c2e;padding-top:0;padding-bottom:0;border:none}.profile-dropdown-header{display:flex;align-items:center;padding:18px 18px 10px;background:#fff6f0;border-top-left-radius:14px;border-top-right-radius:14px}.profile-dropdown-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;margin-right:14px;border:2px solid #f7b731}.profile-dropdown-info{display:flex;flex-direction:column}.profile-dropdown-name{font-weight:600;font-size:1.08rem;color:#d35400}.profile-dropdown-email{font-size:.93rem;color:#888}.profile-dropdown .dropdown-divider{margin:0 0 .5rem}.profile-dropdown .dropdown-item{display:flex;align-items:center;gap:8px;padding:12px 18px;font-size:1rem;color:#333;border-radius:8px;transition:background .18s}.profile-dropdown .dropdown-item i{min-width:18px;text-align:center;color:#f7b731}.profile-dropdown .dropdown-item:hover{background:#fff6e3;color:#d35400}.profile-dropdown .dropdown-item.text-danger,.profile-dropdown .dropdown-item.text-danger i{color:#e74c3c}@media (max-width: 576px){.navbar{padding:12px 20px}.navbar-brand span{font-size:20px}.mobile-bottom-nav{width:92%;bottom:12px}}@media (max-width: 400px){.navbar-brand span{font-size:18px;max-width:150px}.nav-item-mobile span{display:none}.mobile-bottom-nav{height:55px}.plus-icon{width:40px;height:40px;margin-top:-25px}}