/**
 * common.css - 전역 테마 및 공통 UI 컴포넌트
 */

/* 1. 테마 변수 정의 */
:root {
    --bg-main: #0D0D11;
    --bg-sidebar: #0D0D11;
    --bg-card: #16161E;
    --border-color: #2A2A35;
    --text-main: #E0E0E0;
    --text-muted: #8E8E93;
    --accent: #4F46E5;
    --input-bg: rgba(255, 255, 255, 0.03);
}

[data-theme="light"] {
    --bg-main: #F9FAFB;
    --bg-sidebar: #FFFFFF;
    --bg-card: #FFFFFF;
    --border-color: rgba(0, 0, 0, 0.08);
    --text-main: #1F2937;
    --text-muted: #6B7280;
    --accent: #4F46E5;
    --input-bg: #FFFFFF;
}

/* 2. 전역 초기화 및 바디 */
body { 
    font-family: 'Pretendard', sans-serif; 
    background-color: var(--bg-main) !important; 
    color: var(--text-main) !important; 
    margin: 0; 
    overflow: hidden; 
    transition: all 0.3s ease; 
}

/* 3. 사이드바 및 레이아웃 공통 */
.sidebar {
    background-color: var(--bg-sidebar);
    border-color: var(--border-color);
    display: flex;
    flex-direction: column;
    overflow: visible !important; 
    flex-shrink: 0;
    z-index: 100; 
}

.resizer { width: 4px; cursor: col-resize; background: transparent; transition: background 0.2s; z-index: 50; flex-shrink: 0; }
.resizer:hover, .resizer.active { background: #4F46E5; }

/* 4. 커스텀 스크롤바 */
.custom-scroll::-webkit-scrollbar { width: 4px; height: 4px; }
.custom-scroll::-webkit-scrollbar-thumb { background: #4F46E5; border-radius: 10px; }
[data-theme="light"] .custom-scroll::-webkit-scrollbar-thumb {
    background: #E5E7EB;
    border: 3px solid #F9FAFB;
}

/* 5. 공통 호버 메뉴 및 버튼 스타일 */
.hover-menu {
    opacity: 0; visibility: hidden; transform: translateY(10px);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1000;
}
.group:hover .hover-menu, .group\/profile:hover .hover-menu { 
    opacity: 1 !important; visibility: visible !important; transform: translateY(0) !important; 
}

/* 라이트모드 버튼 보정 */
[data-theme="light"] button:not(.bg-indigo-600) {
    background-color: #FFFFFF !important;
    color: #4B5563 !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
}

/* 6. 메인 아이콘 (사이드바 메뉴용) */
.main-icon-btn {
    background: transparent !important;
    color: var(--text-main) !important; 
    opacity: 0.6;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.main-icon-btn:hover {
    opacity: 1;
    transform: scale(1.2);
}

/* 7. 플러스 메뉴 디자인 */
.plus-menu {
    position: absolute;
    bottom: calc(100% + 15px);
    left: 0;
    width: 300px;
    padding: 12px;
    background-color: var(--bg-sidebar);
    border: 1px solid var(--border-color);
    border-radius: 24px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    z-index: 10000 !important;
}