로그인 이후 스타일 적용

src/main/resources/static/css/main.css

@@ -1225,6 +1225,114 @@ body {
     display: none;
   }
 }
+.header-user-info {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 4px 6px;
+  border-radius: 6px;
+}
+.header-user-info .user-identity {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+}
+.header-user-info .user-identity .user-icon {
+  width: 16px;
+  height: 18px;
+  display: block;
+}
+.header-user-info .user-identity .user-name {
+  font-family: "Noto Sans CJK KR", sans-serif;
+  font-size: 16px;
+  font-weight: 400;
+  color: #515961;
+  white-space: nowrap;
+}
+.header-user-info .divider {
+  font-size: 8px;
+  color: var(--text-gray);
+  line-height: 1;
+}
+.header-user-info .header-link {
+  font-family: "Noto Sans CJK KR", sans-serif;
+  font-size: 16px;
+  font-weight: 400;
+  color: #515961;
+  text-decoration: none;
+  white-space: nowrap;
+  background: none;
+  border: none;
+  padding: 0;
+  cursor: pointer;
+  transition: color 0.3s ease;
+}
+.header-user-info .header-link:hover {
+  color: var(--primary-blue);
+}
+.header-user-info .mypage-dropdown {
+  position: relative;
+}
+.header-user-info .mypage-dropdown .mypage-toggle {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+.header-user-info .mypage-dropdown .mypage-dropdown-menu {
+  position: absolute;
+  top: calc(100% + 8px);
+  right: 0;
+  min-width: 200px;
+  background: var(--white);
+  border: 1px solid var(--border-gray);
+  border-radius: 12px;
+  box-shadow: var(--shadow-xl);
+  padding: 8px 0;
+  visibility: hidden;
+  opacity: 0;
+  transform: translateY(-10px);
+  transition: all 0.3s ease;
+  z-index: 100;
+}
+.header-user-info .mypage-dropdown .mypage-dropdown-menu .mypage-menu-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+.header-user-info .mypage-dropdown .mypage-dropdown-menu .mypage-menu-list li {
+  margin: 0;
+}
+.header-user-info .mypage-dropdown .mypage-dropdown-menu .mypage-menu-list li a {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 24px;
+  color: var(--text-dark);
+  text-decoration: none;
+  font-size: 14px;
+  font-weight: 500;
+  transition: all 0.3s ease;
+}
+.header-user-info .mypage-dropdown .mypage-dropdown-menu .mypage-menu-list li a i {
+  font-size: 14px;
+  width: 16px;
+  text-align: center;
+}
+.header-user-info .mypage-dropdown .mypage-dropdown-menu .mypage-menu-list li a:hover {
+  background: var(--light-bg);
+  color: var(--primary-blue);
+}
+.header-user-info .mypage-dropdown.active .mypage-dropdown-menu {
+  visibility: visible;
+  opacity: 1;
+  transform: translateY(0);
+}
+
+@media (max-width: 768px) {
+  .header-user-info {
+    display: none;
+  }
+}
 .global-footer {
   background: #1A1A2E;
   color: #FFFFFF;