.sidebar-offcanvas{position:fixed;top:0;right:-100%;width:400px;height:100%;background-color:#fff;transition:right .3s ease-in-out;z-index:999}.sidebar-offcanvas.offcanvas-enable{right:0;transition:all .3s ease}.offcanvas-enable .sidebar-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:-1;transition:all .3s ease}.sidebar-content{overflow-y:auto}.modal-wrapper{background-color:var(--sky-blue);padding:20px;box-shadow:0 4px 12px rgba(0,0,0,.1);height:100vh}.notification-body{height:calc(100vh - 170px);overflow-y:auto;overflow-x:hidden}.notification-item{background-color:#fff;border-radius:10px;padding:20px;margin-bottom:20px;box-shadow:0 4px 12px rgba(0,0,0,.1);transition:transform .3s ease,box-shadow .3s ease;display:flex;flex-direction:column}.notification-item:hover{transform:translateY(-10px);box-shadow:0 8px 16px rgba(0,0,0,.15)}.notification-item div{font-family:Arial,sans-serif;font-size:15px;color:#333;margin-bottom:5px}.notification-item strong{color:#333;font-weight:700}.notification-message{font-size:18px;color:#2c3e50;margin-bottom:16px;font-weight:500}.notification-created-by,.notification-date,.notification-type{font-size:14px;color:#7f8c8d}.notification-link,.notification-read-link{font-size:14px}.notification-item a{color:#3498db;text-decoration:none;font-weight:500;transition:color .3s ease}.notification-item a:hover{color:#2980b9;text-decoration:underline}.notification-item:last-child{margin-bottom:0}.show-icon-badge{position:absolute;right:-4px;top:-7px;height:15px;width:15px;border-radius:20px;background-color:#22c55e;animation:badgeZoom .6s ease-in-out infinite;display:flex;justify-content:center;align-items:center;font-size:10px;color:#000}@keyframes badgeZoom{0%,to{transform:scale(1);transition:all .3s ease}50%{transform:scale(1.2);transition:all .3s ease}}