@charset "UTF-8";

/* ===================================================
   1. 공통 네비게이션 & 브랜드 스타일
   =================================================== */
.navbar { background-color: #ffffff; border-bottom: 1px solid #e2e8f0; padding: 10px 0; }
.navbar-brand { font-weight: 900; font-size: 1.4rem; color: #0f172a !important; margin-right: 20px; }
.navbar-brand span { color: #f59e0b; }
.nav-link { font-weight: 600; color: #475569 !important; padding: 8px 12px !important; font-size: 0.95rem; }
.nav-link:hover { color: #f59e0b !important; }

/* ===================================================
   2. 드롭다운 및 프로필/알림 메뉴
   =================================================== */
.dropdown-menu { 
    border: 1px solid #e2e8f0; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1); 
    border-radius: 6px; margin-top: 5px; padding: 5px 0; min-width: 160px; 
}
.dropdown-item { font-weight: 500; color: #334155; padding: 6px 20px; font-size: 0.9rem; }
.dropdown-item:hover { background-color: #fff7ed; color: #f59e0b; }
.dropdown-divider { margin: 5px 0; border-top: 1px solid #f1f5f9; }

/* 알림 아이콘 & 메뉴 */
.noti-btn { border-radius: 50%; width: 38px; height: 38px; border: 1px solid #e2e8f0; background-color: #fff; }
.noti-badge { font-size: 0.65rem; }
.noti-dropdown-menu { width: 320px; max-width: calc(100vw - 20px); border-radius: 12px; overflow: hidden; }
.noti-list-body { max-height: 350px; overflow-y: auto; }

/* 프로필 버튼 & 메뉴 */
.user-profile-btn { border-radius: 20px; padding: 6px 14px; border: 1px solid #e2e8f0; background-color: #fff; }
.user-dropdown-menu { border: 1px solid #f1f5f9; box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1); border-radius: 12px; padding: 0 0 8px 0; min-width: 240px; }
.user-dropdown-header { padding: 16px 20px; background-color: #f8fafc; border-bottom: 1px solid #e2e8f0; margin-bottom: 8px; border-radius: 12px 12px 0 0; }
.user-dropdown-item { padding: 10px 20px; font-size: 0.95rem; font-weight: 600; color: #475569; display: flex; align-items: center; transition: all 0.2s; }
.user-dropdown-item i { font-size: 1.1rem; margin-right: 12px; color: #94a3b8; transition: color 0.2s; }
.user-dropdown-item:hover { background-color: #fff7ed; color: #f59e0b; }
.user-dropdown-item:hover i { color: #f59e0b; }
.user-dropdown-item.logout { color: #ef4444; }
.user-dropdown-item.logout i { color: #fca5a5; }
.user-dropdown-item.logout:hover { background-color: #fef2f2; color: #dc2626; }
.user-dropdown-item.logout:hover i { color: #dc2626; }

/* 프로필 내부 폰트 사이즈 유틸 */
.fs-profile-name { font-size: 1.05rem; }
.fs-profile-suffix { font-size: 0.85rem; }
.fs-profile-email { font-size: 0.75rem; }

/* ===================================================
   3. 로그인 모달
   =================================================== */
.header-auth-zone { display: flex; align-items: center; gap: 10px; position: relative; }
.modal-content { border-radius: 12px; border: none; box-shadow: 0 10px 25px rgba(0,0,0,0.1); }
.form-control:focus { border-color: #f59e0b; box-shadow: 0 0 0 0.25rem rgba(245, 158, 11, 0.25); }
.login-brand { font-weight: 900; font-size: 2rem; color: #0f172a; text-align: center; margin-bottom: 20px; }
.login-brand span { color: #f59e0b; }

/* ===================================================
   4. 도구모음 메가 메뉴
   =================================================== */
.mega-dropdown-menu { padding: 10px; border-radius: 6px; }
.dropdown-header { font-size: 0.85rem; font-weight: 700; color: #475569 !important; background-color: #f8fafc !important; padding: 8px 14px; margin: 4px 8px 8px 8px; border-radius: 8px; border: 1px solid #f1f5f9; display: flex; justify-content: space-between; align-items: center; user-select: none; }
.dropdown-header i { color: #94a3b8; }
.dropdown-header .toggle-icon { transition: transform 0.3s ease; font-size: 0.8rem; }
.dropdown-header[aria-expanded="false"] .toggle-icon { transform: rotate(180deg); }
.btn-close-menu { background-color: #f8fafc; border: 1px solid #e2e8f0; transition: background-color 0.2s; }
.btn-close-menu:active { background-color: #e2e8f0; }

/* ===================================================
   5. 푸터 (Footer)
   =================================================== */
footer { background-color: #0f172a; padding: 45px 0 30px; text-align: center; color: #94a3b8; margin-top: auto; }
.footer-logo { color: #ffffff !important; font-size: 1.4rem; letter-spacing: 1px; }
.footer-links { margin: 15px 0; }
.footer-links a { color: #cbd5e1; text-decoration: none; font-size: 0.95rem; margin: 0 12px; transition: color 0.2s; }
.footer-links a:hover { color: #f59e0b; }
.footer-disclaimer { font-size: 0.8rem; color: #64748b; margin-bottom: 20px; line-height: 1.6; word-break: keep-all; }
.footer-info { font-size: 0.85rem; color: #64748b; margin-bottom: 20px; line-height: 1.8; }
.footer-info span { margin: 0 8px; color: #334155; }
.footer-info b { color: #94a3b8; font-weight: normal; } 
.footer-bottom { font-size: 0.85rem; border-top: 1px solid #1e293b; padding-top: 20px; margin-top: 10px; }

/* ===================================================
   6. 반응형 (Media Queries)
   =================================================== */
@media (min-width: 992px) {
    .mega-dropdown-menu { min-width: 700px !important; }
    .mega-menu-col:not(:last-child) { border-right: 1px solid #e2e8f0; } 
    .mega-dropdown-menu .dropdown-header { pointer-events: none; cursor: default !important; }
    .mega-dropdown-menu .toggle-icon { display: none !important; }
    .mega-dropdown-menu .collapse { display: block !important; height: auto !important; }
}
@media (max-width: 991.98px) {
    .header-auth-zone { margin-right: 10px; }
    .navbar-nav { padding-top: 15px; }
    .navbar-nav .nav-item { position: relative; }
    .navbar-nav .dropdown-menu { position: absolute !important; top: 100%; left: 0; width: 100%; z-index: 1050; background-color: #ffffff; box-shadow: 0 15px 35px rgba(0,0,0,0.15) !important; border: 1px solid #e2e8f0; border-radius: 8px; margin-top: 5px; }
    .mega-dropdown-menu { padding: 5px 0 !important; max-height: 60vh; overflow-y: auto; overflow-x: hidden; }
    .mega-dropdown-menu::-webkit-scrollbar { width: 4px; }
    .mega-dropdown-menu::-webkit-scrollbar-thumb { background-color: #cbd5e1; border-radius: 4px; }
    .mega-menu-col:not(:last-child) { border-right: none !important; margin-bottom: 10px; }
    
    .noti-dropdown-wrapper { position: static !important; } 
    .noti-dropdown-menu { position: absolute !important; top: 100% !important; right: 0 !important; left: auto !important; margin-top: 10px !important; }
}