.topbar{z-index:999;background-color:#fdfdfd;border-bottom:1px solid #f4f4f4;width:100%;height:4rem;transition:all .2s ease-in-out;position:fixed;top:0}.topbar .container{align-items:center;max-width:100%;height:100%;padding:0 1rem;display:flex;position:relative}.topbar .topbar_logo{width:8rem}.topbar .topbar_logo img{object-fit:cover;width:100%;height:100%}.topbar .topbar_right{z-index:1;align-items:center;gap:1.5rem;display:flex;position:relative}.topbar .notify_icon{cursor:pointer;color:#1f2937;font-size:20px}.notification_unread{background-color:#ef4444;border-radius:9999px;width:.5rem;height:.5rem;animation:1s cubic-bezier(0,0,.2,1) infinite ping;position:absolute;top:0;right:0}.notification_read{background-color:#ef4444;border-radius:9999px;width:.5rem;height:.5rem;display:block;position:absolute;top:0;right:0}.topbar .topbar_profile{cursor:pointer;background:0 0;border:2px solid #0064ff;border-radius:9999px;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;padding:0;transition:border-color .2s ease-in-out;display:flex;overflow:hidden}.topbar .topbar_profile:hover{border-color:#0052cc}.topbar .topbar_profile img{object-fit:cover;width:100%;height:100%;display:block}.topbar .desktop_topbar{justify-content:space-between;align-items:center;width:100%;display:flex}@media (min-width:1024px){.topbar .desktop_topbar{justify-content:space-between;align-items:center;width:100%;display:flex}}.topbar .mobile_topbar{display:none}@media (min-width:1024px){.topbar .mobile_topbar{display:none}}.profile_card{z-index:1000;background-color:#fff;border:1px solid #e5e7eb;border-radius:.5rem;flex-direction:column;gap:.25rem;min-width:200px;padding:.75rem;display:flex;position:absolute;top:calc(100% + .5rem);left:0;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}@media (min-width:1024px){.profile_card{left:auto;right:0}}.profile_card a{text-align:left;color:#1f2937;border-radius:.375rem;align-items:center;gap:.5rem;width:100%;padding:.5rem .75rem;font-size:.875rem;text-decoration:none;display:flex}.profile_card a:hover{color:#000;background-color:#f3f4f6}.profile_card button{text-align:left;color:#ef4444;cursor:pointer;background:0 0;border:none;border-radius:.375rem;align-items:center;gap:.5rem;width:100%;padding:.5rem .75rem;font-size:.875rem;display:flex}.profile_card button:hover{background-color:#f3f4f6}.profile_card .px-4{padding-left:.75rem;padding-right:.75rem}.profile_card .py-2{padding-top:.5rem;padding-bottom:.5rem}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}