/* Top Header — white background, 56px height, fixed */
.top-header {
    position: fixed; top: 0; left: 240px; right: 0; height: 56px;
    background: #ffffff; border-bottom: 1px solid #E2E8F0;
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 20px; z-index: 90;
    transition: left 0.2s;
}
.sidebar.collapsed ~ .main-area .top-header { left: 62px; }

.top-header-left { display: flex; align-items: center; gap: 10px; }
.top-header-brand { font-family: 'Exo 2', sans-serif; font-weight: 700; font-size: 18px; color: #0D2240; }

.top-header-right { display: flex; align-items: center; gap: 8px; }

.header-icon-btn {
    width: 36px; height: 36px; border-radius: 8px; border: none;
    background: transparent; color: #64748B; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.15s, color 0.15s;
}
.header-icon-btn:hover { background: #F1F5F9; color: #0D2240; }

/* User Dropdown */
.user-dropdown { position: relative; }
.user-btn {
    display: flex; align-items: center; gap: 8px; padding: 4px 10px;
    border: 1px solid #E2E8F0; border-radius: 8px; background: #fff;
    cursor: pointer; font-size: 13px; color: #0D2240;
}
.user-btn:hover { background: #F8FAFC; }
.user-avatar {
    width: 28px; height: 28px; border-radius: 50%; background: #00897B; color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 12px;
}
.user-name { font-weight: 500; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.user-menu {
    position: absolute; top: 100%; right: 0; margin-top: 4px;
    background: #fff; border: 1px solid #E2E8F0; border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.08); min-width: 180px; z-index: 200;
}
.user-menu-item {
    display: block; padding: 8px 16px; color: #475569; text-decoration: none;
    font-size: 13px; transition: background 0.15s;
}
.user-menu-item:hover { background: #F8FAFC; color: #0D2240; }
.user-menu hr { border: none; border-top: 1px solid #E2E8F0; margin: 4px 0; }