.notification-bell{position:relative}.notification-bell__overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:998}.notification-bell__dropdown{position:absolute;top:calc(100% + 8px);right:0;width:360px;max-height:500px;background:white;border:1px solid var(--color-border-default);border-radius:8px;box-shadow:var(--shadow-lg);z-index:999;display:flex;flex-direction:column;overflow:hidden}.notification-bell__header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--color-border-default)}.notification-bell__list{overflow-y:auto;max-height:400px}.notification-bell__empty{padding:40px;text-align:center;color:var(--color-text-secondary);font-size:var(--font-size-sm)}.notification-bell__item{display:flex;align-items:flex-start;padding:12px 16px;border-bottom:1px solid var(--color-border-default);cursor:pointer;transition:background-color var(--transition-default);gap:12px}.notification-bell__item:hover{background-color:var(--color-background-hover)}.notification-bell__item--unread{background-color:var(--color-primary-50)}.notification-bell__item-content{flex:1;min-width:0}.notification-bell__item-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;gap:8px}.notification-bell__item-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary);flex:1}.notification-bell__item-dot{width:8px;height:8px;border-radius:50%;background-color:var(--color-primary-500);flex-shrink:0}.notification-bell__item-message{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.notification-bell__item-time{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.notification-bell__footer{padding:12px 16px;border-top:1px solid var(--color-border-default);text-align:center}@media (max-width:768px){.notification-bell__dropdown{width:320px;right:-80px}}.main-layout{display:flex;min-height:100vh;background-color:var(--color-background-default)}@media (max-width:768px){.main-layout{flex-direction:column}}.main-layout__sidebar{width:260px;background-color:var(--color-white);border-right:1px solid var(--color-border-default);transition:width var(--transition-default);flex-shrink:0;display:flex;flex-direction:column}.main-layout__sidebar.closed{width:64px}.main-layout__sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:20px 16px;border-bottom:1px solid var(--color-border-default)}.main-layout__logo{margin:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-primary-700);white-space:nowrap;overflow:hidden}.main-layout__sidebar.closed .main-layout__logo{display:none}.main-layout__sidebar-toggle{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:none;border:none;border-radius:4px;cursor:pointer;color:var(--color-text-secondary);transition:background-color var(--transition-default)}.main-layout__sidebar-toggle:hover{background-color:var(--color-background-hover)}.main-layout__nav{flex:1;overflow-y:auto;padding:8px 0}.main-layout__nav-list{list-style:none;margin:0;padding:0}.main-layout__nav-item{margin:4px 8px}.main-layout__nav-link{display:flex;align-items:center;gap:12px;padding:12px 16px;color:var(--color-text-primary);text-decoration:none;border-radius:4px;transition:all var(--transition-default)}.main-layout__nav-link:hover{background-color:var(--color-background-hover);color:var(--color-primary-700)}.main-layout__nav-link.active{background-color:var(--color-primary-50);color:var(--color-primary-700);font-weight:var(--font-weight-medium)}.main-layout__nav-icon{font-size:20px;flex-shrink:0;width:24px;text-align:center}.main-layout__nav-label{white-space:nowrap;overflow:hidden}.main-layout__sidebar.closed .main-layout__nav-label{display:none}.main-layout__main{flex:1;display:flex;flex-direction:column;overflow:hidden}.main-layout__header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background-color:var(--color-white);border-bottom:1px solid var(--color-border-default);flex-shrink:0}.main-layout__header-left{flex:1}.main-layout__page-title{margin:0;font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.main-layout__header-right{display:flex;align-items:center;gap:16px}@media (max-width:768px){.main-layout__mobile-overlay{display:block!important;position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);z-index:999}.main-layout__sidebar{position:fixed;left:0;top:0;bottom:0;z-index:1000;transform:translateX(-100%);transition:transform var(--transition-default);width:280px;box-shadow:var(--shadow-lg)}.main-layout__sidebar.open{transform:translateX(0)}.main-layout__main{margin-left:0;width:100%}.main-layout__header{padding:12px 16px;flex-wrap:wrap;gap:12px}.main-layout__header-left{flex:1;min-width:0;display:flex;align-items:center;gap:12px}.main-layout__mobile-menu-button{display:flex!important;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:none;border:1px solid var(--color-border-default);border-radius:4px;cursor:pointer;color:var(--color-text-primary);font-size:20px;transition:background-color var(--transition-default)}.main-layout__mobile-menu-button:hover{background-color:var(--color-background-hover)}.main-layout__page-title{font-size:var(--font-size-lg)}.main-layout__header-right{flex-wrap:wrap;gap:8px}.main-layout__user-info{flex-direction:column;align-items:flex-end;gap:4px}.main-layout__user-name{font-size:var(--font-size-sm)}.main-layout__user-role{font-size:var(--font-size-xs)}.main-layout__content{padding:16px}.main-layout__nav-link{padding:12px 16px}.main-layout__nav-icon{font-size:18px}}.main-layout__user-info{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.main-layout__user-name{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.main-layout__user-role{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-transform:capitalize}.main-layout__content{flex:1;overflow-y:auto;padding:24px}@media (max-width:768px){.main-layout__sidebar{position:fixed;left:0;top:0;bottom:0;z-index:1000;transform:translateX(-100%)}.main-layout__sidebar.open{transform:translateX(0)}.main-layout__main{width:100%}.main-layout__header{padding:12px 16px}.main-layout__content{padding:16px}}