/* /Components/Common/AppFooter.razor.rz.scp.css */
/* 앱 푸터 스타일 */
.app-footer[b-b04g0qqcid] {
   background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
   color: #e5e7eb;
   padding: 3rem 0 1rem;
   margin-top: auto;
}

.footer-container[b-b04g0qqcid] {
   max-width: 1600px;
   margin: 0 auto;
   padding: 0 20px;
}

/* 푸터 콘텐츠 */
.footer-content[b-b04g0qqcid] {
   display: grid;
   grid-template-columns: 2fr 1fr 1fr 1.5fr;
   gap: 3rem;
   margin-bottom: 2rem;
}

/* 푸터 섹션 */
.footer-section[b-b04g0qqcid] {
   display: flex;
   flex-direction: column;
}

/* 로고 영역 */
.footer-logo[b-b04g0qqcid] {
   display: flex;
   align-items: center;
   margin-bottom: 1rem;
}

.logo-text[b-b04g0qqcid] {
   font-family: 'Outfit', 'Inter', sans-serif;
   font-weight: 200;
   font-size: 2rem;
   letter-spacing: 0.1em;
   background: linear-gradient(135deg, #e5e7eb, #fbbf24);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   text-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
}

.footer-description[b-b04g0qqcid] {
   color: #9ca3af;
   line-height: 1.6;
   margin: 0;
   font-size: 0.95rem;
}

/* 푸터 제목 */
.footer-title[b-b04g0qqcid] {
   font-size: 1.1rem;
   font-weight: 600;
   margin-bottom: 1rem;
   color: #f3f4f6;
   letter-spacing: 0.02em;
}

/* 푸터 링크 */
.footer-links[b-b04g0qqcid] {
   list-style: none;
   padding: 0;
   margin: 0;
}

.footer-links li[b-b04g0qqcid] {
   margin-bottom: 0.75rem;
}

.footer-links a[b-b04g0qqcid] {
   color: #9ca3af;
   text-decoration: none;
   font-size: 0.9rem;
   transition: all 0.3s ease;
   position: relative;
}

.footer-links a:hover[b-b04g0qqcid] {
   color: #fbbf24;
   transform: translateX(5px);
}

.footer-links a[b-b04g0qqcid]::before {
   content: '';
   position: absolute;
   left: -10px;
   top: 50%;
   transform: translateY(-50%);
   width: 0;
   height: 1px;
   background: #fbbf24;
   transition: width 0.3s ease;
}

.footer-links a:hover[b-b04g0qqcid]::before {
   width: 6px;
}

/* 연락처 정보 */
.contact-info[b-b04g0qqcid] {
   display: flex;
   flex-direction: column;
   gap: 0.75rem;
}

.contact-item[b-b04g0qqcid] {
   display: flex;
   align-items: flex-start;
   gap: 0.5rem;
   color: #9ca3af;
   font-size: 0.9rem;
   line-height: 1.5;
}

.contact-icon[b-b04g0qqcid] {
   font-size: 1rem;
   margin-top: 0.1rem;
   filter: grayscale(0.3);
}

/* 하단 푸터 */
.footer-bottom[b-b04g0qqcid] {
   border-top: 1px solid #374151;
   padding-top: 2rem;
}

.footer-bottom-content[b-b04g0qqcid] {
   display: flex;
   justify-content: space-between;
   align-items: center;
   flex-wrap: wrap;
   gap: 1rem;
}

.copyright[b-b04g0qqcid] {
   color: #6b7280;
   font-size: 0.9rem;
}

.copyright span[b-b04g0qqcid] {
   font-family: 'Outfit', 'Inter', sans-serif;
   font-weight: 300;
   letter-spacing: 0.02em;
}

.footer-bottom-links[b-b04g0qqcid] {
   display: flex;
   align-items: center;
   gap: 1rem;
}

.footer-bottom-links a[b-b04g0qqcid] {
   color: #9ca3af;
   text-decoration: none;
   font-size: 0.85rem;
   transition: color 0.3s ease;
}

.footer-bottom-links a:hover[b-b04g0qqcid] {
   color: #fbbf24;
}

.separator[b-b04g0qqcid] {
   color: #6b7280;
   font-size: 0.8rem;
}

.version-info[b-b04g0qqcid] {
   color: #6b7280;
   font-size: 0.85rem;
   font-family: 'Inter', monospace;
   font-weight: 300;
   letter-spacing: 0.05em;
}

/* 반응형 디자인 */
@media (max-width: 1024px) {
   .footer-content[b-b04g0qqcid] {
      grid-template-columns: 1fr 1fr;
      gap: 2rem;
   }

   .footer-container[b-b04g0qqcid] {
      padding: 0 15px;
   }
}

@media (max-width: 768px) {
   .app-footer[b-b04g0qqcid] {
      padding: 2rem 0 1rem;
   }

   .footer-content[b-b04g0qqcid] {
      grid-template-columns: 1fr 1fr;
      gap: 1.5rem;
      text-align: center;
   }

   .footer-bottom-content[b-b04g0qqcid] {
      flex-direction: column;
      text-align: center;
      gap: 1rem;
   }

   .footer-bottom-links[b-b04g0qqcid] {
      justify-content: center;
      flex-wrap: wrap;
      gap: 1rem 2rem;
   }

   .logo-text[b-b04g0qqcid] {
      font-size: 1.6rem;
   }

   .footer-links a[b-b04g0qqcid]::before {
      display: none;
   }

   .footer-links a:hover[b-b04g0qqcid] {
      transform: none;
   }

   /* 푸터 섹션을 2열 2행으로 배치 */
   .footer-section:nth-child(1)[b-b04g0qqcid] {
      grid-column: 1 / -1;
      /* 첫 번째 섹션(로고)은 전체 너비 */
   }

   /* 모바일에서 연락처 항목 가운데 정렬 */
   .contact-info[b-b04g0qqcid] {
      align-items: center;
   }

   .contact-item[b-b04g0qqcid] {
      justify-content: center;
   }
}

@media (max-width: 480px) {
   .logo-text[b-b04g0qqcid] {
      font-size: 1.4rem;
   }

   .footer-content[b-b04g0qqcid] {
      grid-template-columns: 1fr;
      gap: 1.5rem;
   }

   .footer-section[b-b04g0qqcid] {
      padding: 0 1rem;
   }

   .footer-section:nth-child(1)[b-b04g0qqcid] {
      grid-column: 1;
      margin-bottom: 1rem;
   }

   /* 하단 푸터 링크를 2줄로 표시 */
   .footer-bottom-content[b-b04g0qqcid] {
      gap: 0.8rem;
   }

   .footer-bottom-links[b-b04g0qqcid] {
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
      align-items: center;
   }

   .footer-bottom-links .separator[b-b04g0qqcid] {
      display: none;
   }
}
/* /Components/Common/AppHeader.razor.rz.scp.css */
/* 앱 헤더 스타일 */
.app-header[b-rzdzcpxh6u] {
   background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #ec4899 100%);
   color: white;
   padding: 0.5rem 0;
   box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   z-index: 1000;
   backdrop-filter: blur(10px);
   overflow: visible;
}

.header-container[b-rzdzcpxh6u] {
   width: 100%;
   margin: 0 auto;
   padding: 0 2rem;
   display: flex;
   align-items: center;
   justify-content: space-between;
   height: 48px;
   overflow: visible;
}

/* 로고 영역 */
.header-left[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   flex: 1 0 auto;
   /* 왼쪽 영역이 너비를 차지하도록 함 */
}

.header-logo[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
}

.logo-link[b-rzdzcpxh6u] {
   text-decoration: none;
   color: inherit;
   transition: all 0.3s ease;
}

.logo-link:hover[b-rzdzcpxh6u] {
   transform: scale(1.05);
}

.logo-text[b-rzdzcpxh6u] {
   font-family: 'Outfit', 'Inter', sans-serif;
   font-weight: 600;
   font-size: 1.8rem;
   letter-spacing: 0.1em;
   background: linear-gradient(135deg, #ffffff, #fbbf24);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   text-shadow: 0 0 30px rgba(255, 255, 255, 0.3);
}

/* 중앙 네비게이션 */
.header-center[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   flex: 0 1 auto;
   /* 중앙 영역은 콘텐츠 크기만큼만 차지하도록 함 */
   justify-content: center;
}

.main-nav[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   gap: 2rem;
}

.nav-link[b-rzdzcpxh6u] {
   color: rgba(255, 255, 255, 0.9);
   text-decoration: none;
   font-weight: 500;
   padding: 0.5rem 1rem;
   border-radius: 8px;
   transition: all 0.3s ease;
   position: relative;
   letter-spacing: 0.02em;
}

.nav-link:hover[b-rzdzcpxh6u] {
   color: white;
   background: rgba(255, 255, 255, 0.1);
   transform: translateY(-1px);
}

.nav-link.active[b-rzdzcpxh6u] {
   color: #fbbf24;
   background: rgba(251, 191, 36, 0.1);
   font-weight: 600;
}

.nav-link.active[b-rzdzcpxh6u]::after {
   content: '';
   position: absolute;
   bottom: -8px;
   left: 50%;
   transform: translateX(-50%);
   width: 6px;
   height: 6px;
   background: #fbbf24;
   border-radius: 50%;
}

/* 우측 사용자 영역 */
.header-right[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   flex: 1 0 auto;
   /* 오른쪽 영역이 너비를 차지하도록 함 */
   justify-content: flex-end;
   /* 오른쪽 정렬 */
}

.header-item[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
}

/* 사용자 메뉴 */
.user-menu[b-rzdzcpxh6u] {
   position: relative;
   overflow: visible;
   z-index: 1001;
}

.user-menu-btn[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   gap: 0.5rem;
   background: rgba(255, 255, 255, 0.1);
   border: 1px solid rgba(255, 255, 255, 0.2);
   color: white;
   padding: 0.5rem 1rem;
   border-radius: 8px;
   cursor: pointer;
   font-size: 0.9rem;
   font-weight: 500;
   transition: all 0.3s ease;
}

.user-menu-btn:hover[b-rzdzcpxh6u] {
   background: rgba(255, 255, 255, 0.2);
   transform: translateY(-1px);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.user-avatar[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 32px;
   height: 32px;
   background: rgba(255, 255, 255, 0.2);
   border-radius: 50%;
   font-size: 1rem;
}

.user-name[b-rzdzcpxh6u] {
   font-weight: 500;
}

.dropdown-arrow[b-rzdzcpxh6u] {
   font-size: 0.8rem;
   transition: transform 0.3s ease;
}

.user-menu-btn:hover .dropdown-arrow[b-rzdzcpxh6u] {
   transform: rotate(180deg);
}

/* 드롭다운 메뉴 */
.dropdown-menu[b-rzdzcpxh6u] {
   position: fixed;
   top: calc(100% + 0.5rem);
   right: auto;
   left: auto;
   margin-top: 0;
   background: white;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
   min-width: 220px;
   max-width: 300px;
   overflow: visible;
   z-index: 9999;
   animation: dropdownSlide-b-rzdzcpxh6u 0.3s ease-out;
   /* 화면 끝에서 자동 조정 */
   transform-origin: top right;
   /* 화면 경계를 고려한 위치 조정 */
   max-height: calc(100vh - 80px);
   overflow-y: auto;
}

/* 뷰포트 우측 끝에서 자동 조정 */
@media (max-width: 768px) {
   .dropdown-menu[b-rzdzcpxh6u] {
      right: -3rem;
      min-width: 200px;
   }
}

@keyframes dropdownSlide-b-rzdzcpxh6u {
   from {
      opacity: 0;
      transform: translateY(-10px);
   }

   to {
      opacity: 1;
      transform: translateY(0);
   }
}

.dropdown-item[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   gap: 0.75rem;
   padding: 0.75rem 1rem;
   color: #374151;
   text-decoration: none;
   background: none;
   border: none;
   width: 100%;
   text-align: left;
   font-size: 0.9rem;
   transition: background 0.2s ease;
   cursor: pointer;
}

.dropdown-item:hover[b-rzdzcpxh6u] {
   background: #f3f4f6;
}

.dropdown-divider[b-rzdzcpxh6u] {
   height: 1px;
   background: #e5e7eb;
   margin: 0.5rem 0;
}

/* 인증 버튼 (로그인/회원가입) */
.auth-btn[b-rzdzcpxh6u] {
   background: rgba(255, 255, 255, 0.1);
   border: 2px solid rgba(255, 255, 255, 0.3);
   color: white;
   padding: 0.5rem 1.2rem;
   border-radius: 8px;
   font-weight: 600;
   cursor: pointer;
   transition: all 0.3s ease;
   letter-spacing: 0.02em;
   text-decoration: none;
   display: inline-block;
   font-size: 0.9rem;
}

.auth-btn:hover[b-rzdzcpxh6u] {
   background: rgba(255, 255, 255, 0.2);
   border-color: rgba(255, 255, 255, 0.5);
   color: white;
   transform: translateY(-1px);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
   text-decoration: none;
}

/* 기존 로그인 버튼 (사용하지 않음) */
.login-btn[b-rzdzcpxh6u] {
   background: rgba(255, 255, 255, 0.1);
   border: 2px solid rgba(255, 255, 255, 0.3);
   color: white;
   padding: 0.5rem 1.5rem;
   border-radius: 8px;
   font-weight: 600;
   cursor: pointer;
   transition: all 0.3s ease;
   letter-spacing: 0.02em;
}

.login-btn:hover[b-rzdzcpxh6u] {
   background: rgba(255, 255, 255, 0.2);
   border-color: rgba(255, 255, 255, 0.5);
   transform: translateY(-1px);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* 반응형 디자인 */
@media (max-width: 1024px) {
   .header-container[b-rzdzcpxh6u] {
      padding: 0 15px;
   }

   .main-nav[b-rzdzcpxh6u] {
      gap: 1.5rem;
   }

   .nav-link[b-rzdzcpxh6u] {
      padding: 0.4rem 0.8rem;
      font-size: 0.9rem;
   }
}

@media (max-width: 768px) {
   .header-center[b-rzdzcpxh6u] {
      display: none;
   }

   .header-container[b-rzdzcpxh6u] {
      justify-content: space-between;
      padding: 0 15px;
   }

   .logo-text[b-rzdzcpxh6u] {
      font-size: 1.5rem;
   }

   .user-menu-btn[b-rzdzcpxh6u] {
      padding: 0.4rem 0.8rem;
      font-size: 0.8rem;
   }

   .user-name[b-rzdzcpxh6u] {
      display: none;
   }
}

@media (max-width: 480px) {
   .logo-text[b-rzdzcpxh6u] {
      font-size: 1.3rem;
   }

   .user-avatar[b-rzdzcpxh6u] {
      width: 28px;
      height: 28px;
      font-size: 0.9rem;
   }
}

.app-header .user-menu .dropdown-menu.show[b-rzdzcpxh6u] {
   display: block;
   border: 1px solid rgba(0, 0, 0, .05);
   animation: dropdown-fade-in-b-rzdzcpxh6u .15s ease-out;
   right: -2rem;
}

@keyframes dropdown-fade-in-b-rzdzcpxh6u {
   from {
      opacity: 0;
      transform: translateY(-5px);
   }

   to {
      opacity: 1;
      transform: translateY(0);
   }
}

/* 드롭다운 헤더 */
.dropdown-header[b-rzdzcpxh6u] {
   padding: 1rem;
   background-color: #f9fafb;
}

.user-info[b-rzdzcpxh6u] {
   display: flex;
   flex-direction: column;
   overflow: hidden;
   /* 자식 요소의 text-overflow를 위해 필요 */
}

.user-name-full[b-rzdzcpxh6u] {
   font-weight: 600;
   color: #111827;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   width: 100%;
}

.user-email-short[b-rzdzcpxh6u] {
   font-size: 0.875rem;
   color: #6b7280;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   width: 100%;
}

/* 드롭다운 아이템 */
.dropdown-item i[b-rzdzcpxh6u] {
   color: #6b7280;
   font-size: 1.1rem;
   transition: color 0.2s ease;
}

.dropdown-item:hover i[b-rzdzcpxh6u] {
   color: #1f2937;
}

.dropdown-item:active[b-rzdzcpxh6u] {
   background-color: #e5e7eb;
}

.dropdown-item-danger[b-rzdzcpxh6u] {
   color: #ef4444;
}

.dropdown-item-danger:hover[b-rzdzcpxh6u],
.dropdown-item-danger:focus[b-rzdzcpxh6u] {
   background-color: #fee2e2;
   color: #b91c1c;
}

.dropdown-item-danger:hover i[b-rzdzcpxh6u],
.dropdown-item-danger:focus i[b-rzdzcpxh6u] {
   color: #b91c1c;
}

/* 모바일/데스크톱 표시/숨김 */
.desktop-only[b-rzdzcpxh6u] {
   display: block;
}

.mobile-only[b-rzdzcpxh6u] {
   display: none;
}

/* 모바일 햄버거 메뉴 */
.mobile-menu-btn[b-rzdzcpxh6u] {
   background: transparent;
   border: none;
   padding: 0.5rem;
   cursor: pointer;
   display: flex;
   flex-direction: column;
   gap: 0.2rem;
   justify-content: center;
   align-items: center;
   width: 40px;
   height: 40px;
}

.hamburger-line[b-rzdzcpxh6u] {
   display: block;
   width: 24px;
   height: 3px;
   background: white;
   border-radius: 1.5px;
   transition: all 0.3s ease;
}

.mobile-menu-btn:hover .hamburger-line[b-rzdzcpxh6u] {
   background: #fbbf24;
}

/* 모바일 사이드바 오버레이 */
.mobile-sidebar-overlay[b-rzdzcpxh6u] {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.5);
   z-index: 2000;
   display: none;
   backdrop-filter: blur(2px);
}

.mobile-sidebar-overlay.show[b-rzdzcpxh6u] {
   display: block;
   animation: fadeIn-b-rzdzcpxh6u 0.3s ease-out;
}

/* 모바일 사이드바 */
.mobile-sidebar[b-rzdzcpxh6u] {
   position: absolute;
   top: 0;
   right: 0;
   width: 280px;
   height: 100%;
   background: white;
   box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
   transform: translateX(100%);
   animation: slideInFromRight-b-rzdzcpxh6u 0.3s ease-out forwards;
}

.mobile-sidebar-overlay.show .mobile-sidebar[b-rzdzcpxh6u] {
   transform: translateX(0);
}

/* 모바일 사이드바 헤더 */
.mobile-sidebar-header[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 1.5rem;
   background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #ec4899 100%);
   color: white;
}

.mobile-sidebar-header .user-info[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   gap: 1rem;
}

.mobile-sidebar-header .user-avatar[b-rzdzcpxh6u] {
   width: 40px;
   height: 40px;
   background: rgba(255, 255, 255, 0.2);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 1.2rem;
}

.mobile-sidebar-header .user-details[b-rzdzcpxh6u] {
   display: flex;
   flex-direction: column;
}

.mobile-sidebar-header .user-name[b-rzdzcpxh6u] {
   font-weight: 600;
   font-size: 1rem;
}

.mobile-sidebar-header .user-email[b-rzdzcpxh6u] {
   font-size: 0.8rem;
   opacity: 0.8;
}

.close-btn[b-rzdzcpxh6u] {
   background: transparent;
   border: none;
   color: white;
   font-size: 1.5rem;
   cursor: pointer;
   padding: 0.5rem;
   border-radius: 4px;
   transition: background 0.3s ease;
}

.close-btn:hover[b-rzdzcpxh6u] {
   background: rgba(255, 255, 255, 0.1);
}

/* 모바일 사이드바 콘텐츠 */
.mobile-sidebar-content[b-rzdzcpxh6u] {
   padding: 1rem 0;
   height: calc(100% - 120px);
   overflow-y: auto;
}

/* 모바일 네비게이션 */
.mobile-nav[b-rzdzcpxh6u] {
   border-bottom: 1px solid #e5e7eb;
   margin-bottom: 1rem;
}

.mobile-nav-link[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   gap: 1rem;
   padding: 1rem 1.5rem;
   color: #374151;
   text-decoration: none;
   transition: all 0.3s ease;
   border-left: 4px solid transparent;
}

.mobile-nav-link:hover[b-rzdzcpxh6u] {
   background: #f3f4f6;
   border-left-color: #6366f1;
   color: #6366f1;
   text-decoration: none;
}

.mobile-nav-link i[b-rzdzcpxh6u] {
   font-size: 1.2rem;
   width: 20px;
   text-align: center;
}

/* 모바일 사용자 액션 */
.mobile-user-actions[b-rzdzcpxh6u] {
   padding-top: 1rem;
}

.mobile-action-link[b-rzdzcpxh6u] {
   display: flex;
   align-items: center;
   gap: 1rem;
   padding: 0.75rem 1.5rem;
   color: #6b7280;
   text-decoration: none;
   transition: all 0.3s ease;
   background: none;
   border: none;
   width: 100%;
   text-align: left;
   cursor: pointer;
}

.mobile-action-link:hover[b-rzdzcpxh6u] {
   background: #f9fafb;
   color: #374151;
   text-decoration: none;
}

.mobile-action-link.logout-btn[b-rzdzcpxh6u] {
   color: #ef4444;
   border-top: 1px solid #e5e7eb;
   margin-top: 1rem;
   padding-top: 1rem;
}

.mobile-action-link.logout-btn:hover[b-rzdzcpxh6u] {
   background: #fef2f2;
   color: #dc2626;
}

.mobile-action-link i[b-rzdzcpxh6u] {
   font-size: 1.1rem;
   width: 18px;
   text-align: center;
}

/* 애니메이션 */
@keyframes fadeIn-b-rzdzcpxh6u {
   from {
      opacity: 0;
   }

   to {
      opacity: 1;
   }
}

@keyframes slideInFromRight-b-rzdzcpxh6u {
   from {
      transform: translateX(100%);
   }

   to {
      transform: translateX(0);
   }
}

/* 반응형 - 모바일에서 표시/숨김 전환 */
@media (max-width: 768px) {
   .desktop-only[b-rzdzcpxh6u] {
      display: none;
   }

   .mobile-only[b-rzdzcpxh6u] {
      display: block;
   }
}
/* /Components/LineMapBoard/POCard.razor.rz.scp.css */
/* PO 카드 컴포넌트 스타일 */
.po-card[b-cy8d86on8h] {
   width: 240px;
   background: #fff;
   border-radius: 8px;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   padding: 8px;
   margin: 4px;
   cursor: pointer;
   transition: all 0.2s ease;
   position: relative;
   overflow: hidden;
}

.po-card:hover[b-cy8d86on8h] {
   box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
   transform: translateY(-2px);
}

.po-card.selected[b-cy8d86on8h] {
   box-shadow: 0 4px 16px rgba(0, 102, 204, 0.3);
   transform: translateY(-2px);
}

.po-card[draggable="true"][b-cy8d86on8h] {
   cursor: grab;
}

.po-card[draggable="true"]:active[b-cy8d86on8h] {
   cursor: grabbing;
}

/* 카드 헤더 */
.po-card-header[b-cy8d86on8h] {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 4px;
}

.po-number[b-cy8d86on8h] {
   font-weight: 600;
   font-size: 0.9em;
   color: #333;
}

.f-number[b-cy8d86on8h] {
   color: #0066cc;
}

.po-number-text[b-cy8d86on8h] {
   color: #666;
}

.po-status[b-cy8d86on8h] {
   display: flex;
   align-items: center;
}

.status-badge[b-cy8d86on8h] {
   padding: 2px 6px;
   border-radius: 12px;
   font-size: 0.7em;
   font-weight: 500;
   text-transform: uppercase;
   letter-spacing: 0.5px;
}

.status-pending[b-cy8d86on8h] {
   background-color: #fff3cd;
   color: #856404;
}

.status-in-progress[b-cy8d86on8h] {
   background-color: #d1ecf1;
   color: #0c5460;
}

.status-completed[b-cy8d86on8h] {
   background-color: #d4edda;
   color: #155724;
}

.status-cancelled[b-cy8d86on8h] {
   background-color: #f8d7da;
   color: #721c24;
}

/* 카드 본문 */
.po-card-body[b-cy8d86on8h] {
   display: flex;
   flex-direction: column;
   gap: 4px;
}

/* 제품 이미지 */
.po-image-container[b-cy8d86on8h] {
   width: 100%;
   height: 60px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 6px;
   overflow: hidden;
   background-color: #f8f9fa;
   border: 1px solid #e9ecef;
}

.po-image[b-cy8d86on8h] {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.po-image-placeholder[b-cy8d86on8h] {
   color: #6c757d;
   font-size: 1.5em;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   height: 100%;
}

/* 스타일명 */
.po-style-name[b-cy8d86on8h] {
   font-weight: 600;
   font-size: 0.9em;
   color: #333;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

/* 바이어명 */
.po-buyer-name[b-cy8d86on8h] {
   font-size: 0.8em;
   color: #666;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

/* 수량 정보 */
.po-quantity[b-cy8d86on8h] {
   display: flex;
   align-items: center;
   gap: 4px;
   font-size: 0.8em;
   color: #495057;
}

.po-quantity i[b-cy8d86on8h] {
   color: #6c757d;
}

/* 납기일 */
.po-delivery-date[b-cy8d86on8h] {
   display: flex;
   align-items: center;
   gap: 4px;
   font-size: 0.8em;
   color: #495057;
}

.po-delivery-date i[b-cy8d86on8h] {
   color: #6c757d;
}

.po-delivery-date.overdue[b-cy8d86on8h] {
   color: #dc3545;
}

.po-delivery-date.overdue i[b-cy8d86on8h] {
   color: #dc3545;
}

/* 진행률 */
.po-progress[b-cy8d86on8h] {
   margin-top: 4px;
}

.po-progress .progress[b-cy8d86on8h] {
   height: 4px;
   background-color: #e9ecef;
   border-radius: 2px;
}

.po-progress .progress-bar[b-cy8d86on8h] {
   background-color: #0066cc;
   border-radius: 2px;
   transition: width 0.3s ease;
}

.po-progress small[b-cy8d86on8h] {
   font-size: 0.7em;
   display: block;
   margin-top: 2px;
   text-align: right;
}

/* 카드 액션 버튼 */
.po-card-actions[b-cy8d86on8h] {
   position: absolute;
   top: 8px;
   right: 8px;
   display: flex;
   gap: 4px;
   opacity: 0;
   transition: opacity 0.2s ease;
}

.po-card-actions.show[b-cy8d86on8h] {
   opacity: 1;
}

.po-card-actions .btn[b-cy8d86on8h] {
   padding: 4px 6px;
   border-radius: 4px;
   font-size: 0.7em;
   border: 1px solid #dee2e6;
   background-color: rgba(255, 255, 255, 0.9);
   backdrop-filter: blur(4px);
}

.po-card-actions .btn:hover[b-cy8d86on8h] {
   background-color: #fff;
   transform: scale(1.05);
}

.po-card-actions .btn-outline-primary:hover[b-cy8d86on8h] {
   background-color: #0066cc;
   color: #fff;
}

.po-card-actions .btn-outline-secondary:hover[b-cy8d86on8h] {
   background-color: #6c757d;
   color: #fff;
}

.po-card-actions .btn-outline-danger:hover[b-cy8d86on8h] {
   background-color: #dc3545;
   color: #fff;
}

/* 반응형 디자인 */
@media (max-width: 768px) {
   .po-card[b-cy8d86on8h] {
      width: 100%;
      max-width: 280px;
      margin: 4px;
   }

   .po-card-actions[b-cy8d86on8h] {
      position: static;
      opacity: 1;
      justify-content: center;
      margin-top: 8px;
   }
}

/* 드래그 앤 드롭 상태 */
.po-card.dragging[b-cy8d86on8h] {
   opacity: 0.5;
   transform: rotate(2deg);
}

/* 애니메이션 */
@keyframes cardPulse-b-cy8d86on8h {
   0% {
      transform: scale(1);
   }

   50% {
      transform: scale(1.02);
   }

   100% {
      transform: scale(1);
   }
}

.po-card.pulse[b-cy8d86on8h] {
   animation: cardPulse-b-cy8d86on8h 0.3s ease;
}

/* 다크 모드 지원 */
@media (prefers-color-scheme: dark) {
   .po-card[b-cy8d86on8h] {
      background-color: #2d3748;
      color: #e2e8f0;
      border-color: #4a5568;
   }

   .po-number[b-cy8d86on8h] {
      color: #e2e8f0;
   }

   .po-buyer-name[b-cy8d86on8h] {
      color: #a0aec0;
   }

   .po-quantity[b-cy8d86on8h],
   .po-delivery-date[b-cy8d86on8h] {
      color: #cbd5e0;
   }

   .po-image-container[b-cy8d86on8h] {
      background-color: #4a5568;
      border-color: #718096;
   }

   .po-image-placeholder[b-cy8d86on8h] {
      color: #a0aec0;
   }

   .po-card-actions .btn[b-cy8d86on8h] {
      background-color: rgba(45, 55, 72, 0.9);
      border-color: #718096;
      color: #e2e8f0;
   }
}

/* 컴팩트 PO 카드 스타일 (라인맵 전용) */
.po-card-compact[b-cy8d86on8h] {
   transition: all 0.2s ease;
   border-left-width: 4px !important;
   font-size: 0.8rem;
}

.po-card-compact:hover[b-cy8d86on8h] {
   transform: translateY(-1px);
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.po-card-compact[draggable="true"][b-cy8d86on8h] {
   cursor: grab;
}

.po-card-compact[draggable="true"]:active[b-cy8d86on8h] {
   cursor: grabbing;
   transform: rotate(2deg);
}

.po-card-compact .badge[b-cy8d86on8h] {
   font-size: 0.6rem;
   padding: 0.2rem 0.4rem;
}

@media (max-width: 768px) {
   .po-card-compact[b-cy8d86on8h] {
      font-size: 0.75rem;
   }

   .po-card-compact .badge[b-cy8d86on8h] {
      font-size: 0.55rem;
   }
}

/* 다크 모드에서 컴팩트 카드 스타일 */
@media (prefers-color-scheme: dark) {
   .po-card-compact[b-cy8d86on8h] {
      background: #2d3748;
      color: #e2e8f0;
   }
}
/* /Components/LineMapBoard/PODetailModal.razor.rz.scp.css */
/* PO 상세 정보 모달 스타일 */
.modal-overlay[b-b3r5mmun8r] {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: rgba(0, 0, 0, 0.5);
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 1050;
   backdrop-filter: blur(4px);
}

.modal-content.po-detail-modal[b-b3r5mmun8r] {
   background: #fff;
   border-radius: 12px;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
   max-width: 800px;
   width: 90%;
   max-height: 90vh;
   overflow-y: auto;
   animation: modalFadeIn-b-b3r5mmun8r 0.3s ease;
}

@keyframes modalFadeIn-b-b3r5mmun8r {
   from {
      opacity: 0;
      transform: scale(0.9);
   }

   to {
      opacity: 1;
      transform: scale(1);
   }
}

/* 모달 헤더 */
.modal-header[b-b3r5mmun8r] {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 20px 24px;
   border-bottom: 1px solid #e9ecef;
}

.modal-title[b-b3r5mmun8r] {
   display: flex;
   align-items: center;
   gap: 16px;
}

.modal-title h5[b-b3r5mmun8r] {
   margin: 0;
   font-size: 1.25rem;
   font-weight: 600;
   color: #333;
}

.po-number-badge[b-b3r5mmun8r] {
   padding: 6px 12px;
   border-radius: 20px;
   color: #fff;
   font-size: 0.85rem;
   font-weight: 600;
   letter-spacing: 0.5px;
}

.btn-close[b-b3r5mmun8r] {
   background: none;
   border: none;
   font-size: 1.2rem;
   color: #6c757d;
   cursor: pointer;
   padding: 8px;
   border-radius: 4px;
   transition: all 0.2s ease;
}

.btn-close:hover[b-b3r5mmun8r] {
   background-color: #f8f9fa;
   color: #333;
}

/* 모달 본문 */
.modal-body[b-b3r5mmun8r] {
   padding: 24px;
}

/* 제품 이미지 섹션 */
.po-image-section[b-b3r5mmun8r] {
   display: flex;
   flex-direction: column;
   gap: 12px;
}

.po-detail-image[b-b3r5mmun8r] {
   width: 100%;
   max-height: 300px;
   object-fit: cover;
   border-radius: 8px;
   border: 1px solid #e9ecef;
}

.po-image-placeholder[b-b3r5mmun8r] {
   width: 100%;
   height: 200px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   background-color: #f8f9fa;
   border: 2px dashed #dee2e6;
   border-radius: 8px;
   color: #6c757d;
}

.po-image-placeholder i[b-b3r5mmun8r] {
   font-size: 3rem;
   margin-bottom: 8px;
}

.image-actions[b-b3r5mmun8r] {
   display: flex;
   gap: 8px;
   flex-wrap: wrap;
}

.image-actions .btn[b-b3r5mmun8r] {
   flex: 1;
   min-width: 100px;
}

/* 상세 정보 섹션 */
.po-details-section[b-b3r5mmun8r] {
   display: flex;
   flex-direction: column;
   gap: 20px;
}

.detail-group[b-b3r5mmun8r] {
   border: 1px solid #e9ecef;
   border-radius: 8px;
   padding: 16px;
   background-color: #f8f9fa;
}

.detail-group h6[b-b3r5mmun8r] {
   margin: 0 0 12px 0;
   font-size: 1rem;
   font-weight: 600;
   color: #0066cc;
   border-bottom: 1px solid #dee2e6;
   padding-bottom: 8px;
}

.detail-item[b-b3r5mmun8r] {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 8px 0;
   border-bottom: 1px solid #e9ecef;
}

.detail-item:last-child[b-b3r5mmun8r] {
   border-bottom: none;
}

.detail-item label[b-b3r5mmun8r] {
   font-weight: 500;
   color: #495057;
   margin: 0;
   min-width: 80px;
}

.detail-item span[b-b3r5mmun8r] {
   color: #333;
   text-align: right;
}

.buyer-name[b-b3r5mmun8r] {
   font-weight: 600;
}

.status-badge[b-b3r5mmun8r] {
   padding: 4px 8px;
   border-radius: 12px;
   font-size: 0.75rem;
   font-weight: 500;
   text-transform: uppercase;
   letter-spacing: 0.5px;
}

.status-pending[b-b3r5mmun8r] {
   background-color: #fff3cd;
   color: #856404;
}

.status-in-progress[b-b3r5mmun8r] {
   background-color: #d1ecf1;
   color: #0c5460;
}

.status-completed[b-b3r5mmun8r] {
   background-color: #d4edda;
   color: #155724;
}

.status-cancelled[b-b3r5mmun8r] {
   background-color: #f8d7da;
   color: #721c24;
}

/* 진행률 섹션 */
.progress-container[b-b3r5mmun8r] {
   display: flex;
   align-items: center;
   gap: 12px;
}

.progress-container .progress[b-b3r5mmun8r] {
   flex: 1;
   height: 8px;
   background-color: #e9ecef;
   border-radius: 4px;
}

.progress-container .progress-bar[b-b3r5mmun8r] {
   background-color: #0066cc;
   border-radius: 4px;
   transition: width 0.3s ease;
}

.progress-text[b-b3r5mmun8r] {
   font-size: 0.9rem;
   font-weight: 500;
   color: #0066cc;
   min-width: 60px;
}

/* 히스토리 섹션 */
.po-history-section[b-b3r5mmun8r] {
   margin-top: 24px;
   padding-top: 24px;
   border-top: 1px solid #e9ecef;
}

.po-history-section h6[b-b3r5mmun8r] {
   margin: 0 0 16px 0;
   font-size: 1rem;
   font-weight: 600;
   color: #0066cc;
}

.history-timeline[b-b3r5mmun8r] {
   display: flex;
   flex-direction: column;
   gap: 12px;
   max-height: 200px;
   overflow-y: auto;
}

.history-item[b-b3r5mmun8r] {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 8px 12px;
   background-color: #f8f9fa;
   border-radius: 6px;
   border-left: 3px solid #0066cc;
}

.history-date[b-b3r5mmun8r] {
   font-size: 0.8rem;
   color: #6c757d;
   min-width: 80px;
}

.history-action[b-b3r5mmun8r] {
   flex: 1;
   font-size: 0.9rem;
   color: #333;
}

.history-user[b-b3r5mmun8r] {
   font-size: 0.8rem;
   color: #6c757d;
   font-style: italic;
}

/* 모달 푸터 */
.modal-footer[b-b3r5mmun8r] {
   display: flex;
   justify-content: flex-end;
   gap: 12px;
   padding: 20px 24px;
   border-top: 1px solid #e9ecef;
   background-color: #f8f9fa;
   border-radius: 0 0 12px 12px;
}

.modal-footer .btn[b-b3r5mmun8r] {
   min-width: 80px;
   font-size: 0.9rem;
   border-radius: 6px;
   transition: all 0.2s ease;
}

.modal-footer .btn:hover[b-b3r5mmun8r] {
   transform: translateY(-1px);
}

/* 반응형 디자인 */
@media (max-width: 768px) {
   .modal-content.po-detail-modal[b-b3r5mmun8r] {
      width: 95%;
      max-height: 95vh;
   }

   .modal-header[b-b3r5mmun8r] {
      padding: 16px;
   }

   .modal-body[b-b3r5mmun8r] {
      padding: 16px;
   }

   .modal-title[b-b3r5mmun8r] {
      flex-direction: column;
      align-items: flex-start;
      gap: 8px;
   }

   .modal-title h5[b-b3r5mmun8r] {
      font-size: 1.1rem;
   }

   .po-number-badge[b-b3r5mmun8r] {
      font-size: 0.8rem;
      padding: 4px 8px;
   }

   .detail-item[b-b3r5mmun8r] {
      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
   }

   .detail-item label[b-b3r5mmun8r] {
      min-width: auto;
   }

   .detail-item span[b-b3r5mmun8r] {
      text-align: left;
   }

   .progress-container[b-b3r5mmun8r] {
      flex-direction: column;
      gap: 8px;
   }

   .progress-text[b-b3r5mmun8r] {
      min-width: auto;
      text-align: center;
   }

   .modal-footer[b-b3r5mmun8r] {
      padding: 16px;
      flex-wrap: wrap;
   }

   .modal-footer .btn[b-b3r5mmun8r] {
      flex: 1;
      min-width: 120px;
   }

   .image-actions[b-b3r5mmun8r] {
      flex-direction: column;
   }

   .image-actions .btn[b-b3r5mmun8r] {
      min-width: auto;
   }
}

@media (max-width: 576px) {
   .modal-content.po-detail-modal[b-b3r5mmun8r] {
      width: 100%;
      height: 100vh;
      max-height: 100vh;
      border-radius: 0;
   }

   .history-item[b-b3r5mmun8r] {
      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
   }

   .history-date[b-b3r5mmun8r] {
      min-width: auto;
   }
}

/* 다크 모드 지원 */
@media (prefers-color-scheme: dark) {
   .modal-content.po-detail-modal[b-b3r5mmun8r] {
      background-color: #2d3748;
      color: #e2e8f0;
   }

   .modal-header[b-b3r5mmun8r] {
      border-bottom-color: #4a5568;
   }

   .modal-title h5[b-b3r5mmun8r] {
      color: #e2e8f0;
   }

   .btn-close[b-b3r5mmun8r] {
      color: #a0aec0;
   }

   .btn-close:hover[b-b3r5mmun8r] {
      background-color: #4a5568;
      color: #e2e8f0;
   }

   .detail-group[b-b3r5mmun8r] {
      background-color: #4a5568;
      border-color: #718096;
   }

   .detail-group h6[b-b3r5mmun8r] {
      color: #63b3ed;
      border-bottom-color: #718096;
   }

   .detail-item[b-b3r5mmun8r] {
      border-bottom-color: #718096;
   }

   .detail-item label[b-b3r5mmun8r] {
      color: #cbd5e0;
   }

   .detail-item span[b-b3r5mmun8r] {
      color: #e2e8f0;
   }

   .po-image-placeholder[b-b3r5mmun8r] {
      background-color: #4a5568;
      border-color: #718096;
      color: #a0aec0;
   }

   .history-item[b-b3r5mmun8r] {
      background-color: #4a5568;
      border-left-color: #63b3ed;
   }

   .history-action[b-b3r5mmun8r] {
      color: #e2e8f0;
   }

   .history-date[b-b3r5mmun8r],
   .history-user[b-b3r5mmun8r] {
      color: #a0aec0;
   }

   .modal-footer[b-b3r5mmun8r] {
      background-color: #4a5568;
      border-top-color: #718096;
   }

   .progress-container .progress[b-b3r5mmun8r] {
      background-color: #4a5568;
   }

   .progress-container .progress-bar[b-b3r5mmun8r] {
      background-color: #63b3ed;
   }

   .progress-text[b-b3r5mmun8r] {
      color: #63b3ed;
   }
}
/* /Layout/MainLayout.razor.rz.scp.css */
.page[b-ls9njfky6p] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-ls9njfky6p] {
    /* 헤더의 높이만큼 상단 패딩을 주어 콘텐츠가 가려지지 않게 함 */
    padding-top: 64px;
    min-height: calc(100vh - 60px);
    /* 푸터 높이를 제외한 최소 높이 */
}

main.no-padding-top[b-ls9njfky6p] {
    padding-top: 0;
}

.sidebar[b-ls9njfky6p] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-ls9njfky6p] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

.top-row[b-ls9njfky6p]  a,
.top-row[b-ls9njfky6p]  .btn-link {
    white-space: nowrap;
    margin-left: 1.5rem;
    text-decoration: none;
}

.top-row[b-ls9njfky6p]  a:hover,
.top-row[b-ls9njfky6p]  .btn-link:hover {
    text-decoration: underline;
}

.top-row[b-ls9njfky6p]  a:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 640.98px) {
    .top-row[b-ls9njfky6p] {
        justify-content: space-between;
    }

    .top-row[b-ls9njfky6p]  a,
    .top-row[b-ls9njfky6p]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-ls9njfky6p] {
        flex-direction: row;
    }

    .sidebar[b-ls9njfky6p] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-ls9njfky6p] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-ls9njfky6p]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-ls9njfky6p],
    article[b-ls9njfky6p] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-ck5vn94tfj] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-ck5vn94tfj] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-ck5vn94tfj] {
    font-size: 1.1rem;
}

.bi[b-ck5vn94tfj] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-ck5vn94tfj] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-ck5vn94tfj] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-ck5vn94tfj] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-ck5vn94tfj] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-ck5vn94tfj] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-ck5vn94tfj] {
        padding-bottom: 1rem;
    }

    .nav-item[b-ck5vn94tfj]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-ck5vn94tfj]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-ck5vn94tfj]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

@media (min-width: 641px) {
    .navbar-toggler[b-ck5vn94tfj] {
        display: none;
    }

    .collapse[b-ck5vn94tfj] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }

    .nav-scrollable[b-ck5vn94tfj] {
        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Pages/BillingPage.razor.rz.scp.css */
.billing-container[b-t6p5e26cce] {
   max-width: 960px;
   margin: 2rem auto;
   padding: 2rem;
}

.page-title[b-t6p5e26cce] {
   font-weight: 700;
   margin-bottom: 0.5rem;
}

.page-subtitle[b-t6p5e26cce] {
   font-size: 1.1rem;
   color: #6c757d;
   margin-bottom: 2rem;
}

.billing-card[b-t6p5e26cce] {
   background-color: #fff;
   border: 1px solid #dee2e6;
   border-radius: 0.75rem;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
   overflow: hidden;
   /* For border-radius on child elements */
}

.card-header[b-t6p5e26cce] {
   background-color: #f8f9fa;
   padding: 1rem 1.5rem;
   font-size: 1.25rem;
   font-weight: 600;
   border-bottom: 1px solid #dee2e6;
   display: flex;
   align-items: center;
}

.card-header i[b-t6p5e26cce] {
   color: #0d6efd;
}

.card-body[b-t6p5e26cce] {
   padding: 1.5rem;
}

.plan-details[b-t6p5e26cce] {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 0.5rem;
}

.plan-name[b-t6p5e26cce] {
   font-size: 1.2rem;
   font-weight: 600;
}

.plan-price[b-t6p5e26cce] {
   font-size: 1.2rem;
   font-weight: 600;
   color: #0d6efd;
}

.payment-method[b-t6p5e26cce] {
   display: flex;
   align-items: center;
   gap: 1rem;
   margin-bottom: 0.5rem;
}

.payment-details[b-t6p5e26cce] {
   display: flex;
   flex-direction: column;
}

.card-number[b-t6p5e26cce] {
   font-family: monospace;
   font-size: 1.1rem;
   letter-spacing: 1px;
}

.table[b-t6p5e26cce] {
   margin-bottom: 0;
}

.table th[b-t6p5e26cce] {
   font-weight: 600;
   color: #495057;
}

.table td[b-t6p5e26cce] {
   vertical-align: middle;
}

.badge[b-t6p5e26cce] {
   padding: 0.5em 0.75em;
   font-size: 0.8rem;
   font-weight: 600;
}
/* /Pages/Home.razor.rz.scp.css */
/* 기본 컨테이너 */
.home-container[b-xt33hqfdcg] {
   font-family: 'Inter', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   /* Fixed header를 위한 패딩은 MainLayout에서 처리됨 */
}

/* Hero 그라데이션 배경 */
.hero-gradient[b-xt33hqfdcg] {
   background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 35%, #a855f7 70%, #ec4899 100%);
   position: relative;
   overflow: hidden;
}

.hero-gradient[b-xt33hqfdcg]::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: linear-gradient(45deg, rgba(99, 102, 241, 0.05) 0%, rgba(139, 92, 246, 0.05) 50%, rgba(236, 72, 153, 0.05) 100%);
   z-index: 1;
}

.hero-gradient .hero-body[b-xt33hqfdcg] {
   position: relative;
   z-index: 2;
}

.container[b-xt33hqfdcg] {
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 20px;
}

/* Hero Section */
.hero-section[b-xt33hqfdcg] {
   background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #ec4899 100%);
   color: white;
   padding: 100px 0 80px;
   /* 높이 증가 */
   text-align: center;
   position: relative;
   overflow: hidden;
}

.hero-container[b-xt33hqfdcg] {
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 20px;
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 4rem;
   align-items: center;
   min-height: 600px;
   /* 최소 높이 설정 */
}

.hero-content[b-xt33hqfdcg] {
   text-align: left;
}

.hero-title[b-xt33hqfdcg] {
   font-size: 3.5rem;
   font-weight: 700;
   margin-bottom: 1.5rem;
   line-height: 1.2;
}

.hero-highlight[b-xt33hqfdcg] {
   color: #fbbf24;
}

.hero-description[b-xt33hqfdcg] {
   font-size: 1.3rem;
   margin-bottom: 2.5rem;
   opacity: 0.9;
   line-height: 1.6;
}

.hero-buttons[b-xt33hqfdcg] {
   display: flex;
   gap: 1rem;
   margin-bottom: 3rem;
   flex-wrap: wrap;
}

.btn[b-xt33hqfdcg] {
   padding: 1rem 2rem;
   border: none;
   border-radius: 8px;
   font-size: 1rem;
   font-weight: 600;
   cursor: pointer;
   text-decoration: none;
   display: inline-block;
   transition: all 0.3s ease;
}

.btn-primary[b-xt33hqfdcg] {
   background: white;
   color: #1f2937;
}

.btn-secondary[b-xt33hqfdcg] {
   background: transparent;
   color: white;
   border: 2px solid white;
}

.btn-outline[b-xt33hqfdcg] {
   background: transparent;
   border: 2px solid #6366f1;
   color: #6366f1;
}

/* CTA 애니메이션 */
.cta-button[b-xt33hqfdcg] {
   position: relative;
   overflow: hidden;
   transform: translateY(0);
   transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.cta-button:hover[b-xt33hqfdcg] {
   transform: translateY(-2px);
   box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

.cta-button:active[b-xt33hqfdcg] {
   transform: translateY(0);
}

.cta-button[b-xt33hqfdcg]::before {
   content: '';
   position: absolute;
   top: 0;
   left: -100%;
   width: 100%;
   height: 100%;
   background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
   transition: left 0.5s;
}

.cta-button:hover[b-xt33hqfdcg]::before {
   left: 100%;
}

.hero-stats[b-xt33hqfdcg] {
   display: flex;
   gap: 2rem;
   flex-wrap: wrap;
}

.stat-item[b-xt33hqfdcg] {
   text-align: center;
}

.stat-number[b-xt33hqfdcg] {
   display: block;
   font-size: 2rem;
   font-weight: 700;
   color: #fbbf24;
}

.stat-label[b-xt33hqfdcg] {
   font-size: 0.9rem;
   opacity: 0.8;
}

/* Hero Visual - Dashboard Preview */
.hero-visual[b-xt33hqfdcg] {
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 2rem;
   min-height: 400px;
}

.dashboard-preview[b-xt33hqfdcg] {
   width: 100%;
   max-width: 350px;
   margin: 0 auto;
}

.preview-card[b-xt33hqfdcg] {
   background: rgba(255, 255, 255, 0.95);
   color: #1f2937;
   padding: 2rem;
   border-radius: 16px;
   box-shadow: 0 12px 48px rgba(0, 0, 0, 0.15);
   backdrop-filter: blur(12px);
   border: 1px solid rgba(255, 255, 255, 0.2);
}

.card-title[b-xt33hqfdcg] {
   font-size: 1.25rem;
   font-weight: 700;
   margin-bottom: 1.5rem;
   color: #6366f1;
   text-align: center;
}

.line-item[b-xt33hqfdcg] {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 0.75rem 0;
   border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.line-item:last-child[b-xt33hqfdcg] {
   border-bottom: none;
}

.line-name[b-xt33hqfdcg] {
   font-weight: 600;
   font-size: 1rem;
}

.line-status[b-xt33hqfdcg] {
   padding: 0.25rem 0.75rem;
   border-radius: 20px;
   font-size: 0.875rem;
   font-weight: 600;
}

.line-status.active[b-xt33hqfdcg] {
   background-color: #10b981;
   color: white;
}

.line-status.idle[b-xt33hqfdcg] {
   background-color: #f59e0b;
   color: white;
}



/* 간단한 애니메이션 */
@keyframes fadeIn-b-xt33hqfdcg {
   from {
      opacity: 0;
   }

   to {
      opacity: 1;
   }
}

/* Features Section */
.features-section[b-xt33hqfdcg] {
   padding: 80px 0;
   background: #f8fafc;
}

.section-header[b-xt33hqfdcg] {
   text-align: center;
   margin-bottom: 4rem;
}

.section-title[b-xt33hqfdcg] {
   font-size: 2.5rem;
   font-weight: 700;
   margin-bottom: 1rem;
   color: #1f2937;
}

.section-subtitle[b-xt33hqfdcg] {
   font-size: 1.2rem;
   color: #6b7280;
}

.features-grid[b-xt33hqfdcg] {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
   gap: 2rem;
}

.feature-card[b-xt33hqfdcg] {
   background: white;
   padding: 2rem;
   border-radius: 12px;
   text-align: center;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.feature-card:hover[b-xt33hqfdcg] {
   transform: translateY(-5px);
   box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);
}

.feature-icon[b-xt33hqfdcg] {
   width: 60px;
   height: 60px;
   background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin: 0 auto 1rem;
   color: white;
}

.feature-title[b-xt33hqfdcg] {
   font-size: 1.25rem;
   font-weight: 600;
   margin-bottom: 1rem;
   color: #1f2937;
}

.feature-description[b-xt33hqfdcg] {
   color: #6b7280;
   line-height: 1.6;
}

/* Pricing Section */
.pricing-section[b-xt33hqfdcg] {
   padding: 80px 0;
   background: white;
}

.pricing-grid[b-xt33hqfdcg] {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
   gap: 2rem;
   margin-top: 3rem;
}

.pricing-card[b-xt33hqfdcg] {
   background: white;
   border: 2px solid #e5e7eb;
   border-radius: 16px;
   padding: 2rem;
   text-align: center;
   position: relative;
   transition: all 0.3s ease;
}

.pricing-card:hover[b-xt33hqfdcg] {
   transform: translateY(-5px);
   box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);
}

.pricing-card.featured[b-xt33hqfdcg] {
   border-color: #6366f1;
   transform: scale(1.05);
   box-shadow: 0 12px 25px rgba(99, 102, 241, 0.15);
}

.pricing-badge[b-xt33hqfdcg] {
   position: absolute;
   top: -10px;
   left: 50%;
   transform: translateX(-50%);
   background: linear-gradient(135deg, #6366f1, #8b5cf6);
   color: white;
   padding: 0.5rem 1.5rem;
   border-radius: 20px;
   font-size: 0.9rem;
   font-weight: 600;
}

.pricing-header[b-xt33hqfdcg] {
   margin-bottom: 2rem;
}

.pricing-title[b-xt33hqfdcg] {
   font-size: 1.5rem;
   font-weight: 700;
   margin-bottom: 1rem;
   color: #1f2937;
}

.pricing-price[b-xt33hqfdcg] {
   margin-bottom: 1rem;
}

.price-amount[b-xt33hqfdcg] {
   font-size: 2.5rem;
   font-weight: 700;
   color: #6366f1;
}

.price-period[b-xt33hqfdcg] {
   font-size: 1rem;
   color: #6b7280;
}

.pricing-description[b-xt33hqfdcg] {
   color: #6b7280;
   margin-bottom: 2rem;
}

.pricing-features[b-xt33hqfdcg] {
   list-style: none;
   padding: 0;
   margin: 0 0 2rem 0;
   text-align: left;
}

.pricing-features li[b-xt33hqfdcg] {
   padding: 0.75rem 0;
   border-bottom: 1px solid #f3f4f6;
   position: relative;
   padding-left: 1.5rem;
}

.pricing-features li[b-xt33hqfdcg]:before {
   content: '✓';
   position: absolute;
   left: 0;
   color: #10b981;
   font-weight: bold;
}

/* Testimonials Section */
.testimonials-section[b-xt33hqfdcg] {
   padding: 80px 0;
   background: #f8fafc;
}

.testimonials-grid[b-xt33hqfdcg] {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
   gap: 2rem;
   margin-top: 3rem;
}

.testimonial-card[b-xt33hqfdcg] {
   background: white;
   padding: 2rem;
   border-radius: 16px;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.testimonial-card:hover[b-xt33hqfdcg] {
   transform: translateY(-5px);
   box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);
}

.testimonial-rating[b-xt33hqfdcg] {
   margin-bottom: 1rem;
}

.star[b-xt33hqfdcg] {
   color: #fbbf24;
   font-size: 1.2rem;
   margin-right: 0.1rem;
}

.testimonial-text[b-xt33hqfdcg] {
   font-size: 1.1rem;
   line-height: 1.6;
   color: #374151;
   margin-bottom: 1.5rem;
   font-style: italic;
}

.testimonial-author[b-xt33hqfdcg] {
   display: flex;
   align-items: center;
   gap: 1rem;
}

.author-avatar[b-xt33hqfdcg] {
   font-size: 2rem;
   width: 50px;
   height: 50px;
   background: #f3f4f6;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
}

.author-name[b-xt33hqfdcg] {
   font-weight: 600;
   color: #1f2937;
   margin-bottom: 0.25rem;
}

.author-role[b-xt33hqfdcg] {
   font-size: 0.9rem;
   color: #6b7280;
}

/* FAQ Section */
.faq-section[b-xt33hqfdcg] {
   padding: 80px 0;
   background: white;
}

.faq-grid[b-xt33hqfdcg] {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
   gap: 2rem;
}

.faq-item[b-xt33hqfdcg] {
   background: white;
   padding: 1.5rem;
   border-radius: 8px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.faq-item:hover[b-xt33hqfdcg] {
   transform: translateY(-2px);
   box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
}

.faq-question[b-xt33hqfdcg] {
   font-size: 1.1rem;
   font-weight: 600;
   margin-bottom: 0.5rem;
   color: #1f2937;
}

.faq-answer[b-xt33hqfdcg] {
   color: #6b7280;
   line-height: 1.6;
   margin: 0;
}

/* Contact Section */
.contact-section[b-xt33hqfdcg] {
   padding: 80px 0;
   background: #f8fafc;
}

.contact-content[b-xt33hqfdcg] {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 4rem;
   margin-top: 3rem;
}

.contact-info h3[b-xt33hqfdcg],
.contact-form h3[b-xt33hqfdcg] {
   font-size: 1.5rem;
   font-weight: 700;
   margin-bottom: 2rem;
   color: #1f2937;
}

.contact-items[b-xt33hqfdcg] {
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
}

.contact-item[b-xt33hqfdcg] {
   display: flex;
   align-items: flex-start;
   gap: 1rem;
}

.contact-icon[b-xt33hqfdcg] {
   font-size: 1.5rem;
   margin-top: 0.25rem;
}

.contact-label[b-xt33hqfdcg] {
   font-weight: 600;
   color: #1f2937;
   margin-bottom: 0.25rem;
}

.contact-value[b-xt33hqfdcg] {
   color: #6b7280;
}

.form-group[b-xt33hqfdcg] {
   margin-bottom: 1.5rem;
}

.form-group label[b-xt33hqfdcg] {
   display: block;
   font-weight: 600;
   color: #1f2937;
   margin-bottom: 0.5rem;
}

.form-group input[b-xt33hqfdcg],
.form-group textarea[b-xt33hqfdcg] {
   width: 100%;
   padding: 0.75rem;
   border: 1px solid #d1d5db;
   border-radius: 8px;
   font-size: 1rem;
   transition: border-color 0.3s ease;
}

.form-group input:focus[b-xt33hqfdcg],
.form-group textarea:focus[b-xt33hqfdcg] {
   outline: none;
   border-color: #6366f1;
   box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}

/* Newsletter Section */
.newsletter-section[b-xt33hqfdcg] {
   background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #ec4899 100%);
   color: white;
   padding: 80px 0;
   text-align: center;
}

.newsletter-content[b-xt33hqfdcg] {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 3rem;
   align-items: center;
}

.newsletter-text[b-xt33hqfdcg] {
   text-align: left;
}

.newsletter-title[b-xt33hqfdcg] {
   font-size: 2.5rem;
   font-weight: 700;
   margin-bottom: 1rem;
}

.newsletter-description[b-xt33hqfdcg] {
   font-size: 1.2rem;
   opacity: 0.9;
   line-height: 1.6;
}

.newsletter-form[b-xt33hqfdcg] {
   text-align: left;
}

.email-input-group[b-xt33hqfdcg] {
   display: flex;
   gap: 1rem;
   margin-bottom: 1rem;
}

.email-input[b-xt33hqfdcg] {
   flex: 1;
   padding: 1rem;
   border: none;
   border-radius: 8px;
   font-size: 1rem;
}

.newsletter-note[b-xt33hqfdcg] {
   font-size: 0.9rem;
   opacity: 0.8;
   margin: 0;
}

.dashboard[b-xt33hqfdcg] {
   padding: 2rem;
   max-width: 1200px;
   margin: 0 auto;
}

.dashboard-header[b-xt33hqfdcg] {
   text-align: center;
   margin-bottom: 2rem;
}

.dashboard-header h1[b-xt33hqfdcg] {
   font-size: 2.5rem;
   margin-bottom: 0.5rem;
   color: #1f2937;
}

.dashboard-header p[b-xt33hqfdcg] {
   color: #6b7280;
   font-size: 1.1rem;
}

.stats[b-xt33hqfdcg] {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
   gap: 1.5rem;
   margin-bottom: 3rem;
}

.stat-card[b-xt33hqfdcg] {
   background: white;
   padding: 1.5rem;
   border-radius: 12px;
   text-align: center;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.stat-card h3[b-xt33hqfdcg] {
   color: #6b7280;
   font-size: 0.9rem;
   margin-bottom: 0.5rem;
   text-transform: uppercase;
}

.number[b-xt33hqfdcg] {
   font-size: 2rem;
   font-weight: 700;
   color: #6366f1;
}

.scroll-to-top[b-xt33hqfdcg] {
   position: fixed;
   bottom: 2rem;
   right: 2rem;
   width: 50px;
   height: 50px;
   background: linear-gradient(135deg, #6366f1, #8b5cf6);
   color: white;
   border: none;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
   z-index: 1000;
   transition: all 0.3s ease;
}

.scroll-to-top:hover[b-xt33hqfdcg] {
   transform: translateY(-3px);
   box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

.scroll-to-top svg[b-xt33hqfdcg] {
   transition: transform 0.3s ease;
}

.scroll-to-top:hover svg[b-xt33hqfdcg] {
   transform: translateY(-2px);
}

/* 반응형 디자인 */
@media (max-width: 1024px) {
   .hero-container[b-xt33hqfdcg] {
      grid-template-columns: 1fr;
      text-align: center;
      gap: 2rem;
   }

   .hero-content[b-xt33hqfdcg] {
      text-align: center;
   }

   .newsletter-content[b-xt33hqfdcg] {
      grid-template-columns: 1fr;
      text-align: center;
      gap: 2rem;
   }

   .newsletter-text[b-xt33hqfdcg] {
      text-align: center;
   }

   .newsletter-form[b-xt33hqfdcg] {
      text-align: center;
   }

   .contact-content[b-xt33hqfdcg] {
      grid-template-columns: 1fr;
      gap: 2rem;
   }
}

@media (max-width: 768px) {
   .container[b-xt33hqfdcg] {
      padding: 0 15px;
   }

   .hero-title[b-xt33hqfdcg] {
      font-size: 2.5rem;
   }

   .section-title[b-xt33hqfdcg] {
      font-size: 2rem;
   }

   .features-grid[b-xt33hqfdcg] {
      grid-template-columns: 1fr;
   }

   .faq-grid[b-xt33hqfdcg] {
      grid-template-columns: 1fr;
   }

   .email-input-group[b-xt33hqfdcg] {
      flex-direction: column;
   }

   .hero-buttons[b-xt33hqfdcg] {
      justify-content: center;
   }

   .scroll-to-top[b-xt33hqfdcg] {
      bottom: 1rem;
      right: 1rem;
   }

   .pricing-grid[b-xt33hqfdcg] {
      grid-template-columns: 1fr;
   }

   .testimonials-grid[b-xt33hqfdcg] {
      grid-template-columns: 1fr;
   }

   .hero-section[b-xt33hqfdcg] {
      padding: 60px 0 40px;
   }

   .hero-container[b-xt33hqfdcg] {
      min-height: auto;
   }
}

/* 
    Home.razor.css
    Home 페이지, 특히 로그인 후 대시보드에 대한 스타일을 정의합니다.
    모던하고 깔끔한 UI/UX를 제공하는 것을 목표로 합니다.
*/

/* 대시보드 컨테이너 */
.dashboard-container[b-xt33hqfdcg] {
   padding: 2rem;
   padding-top: 5rem;
   /* 헤더 아래 여백 증가 */
   background-color: #f8f9fa;
   /* 밝은 회색 배경 */
   min-height: 100vh;
}

/* 대시보드 헤더 */
.dashboard-header[b-xt33hqfdcg] {
   margin-top: 1rem;
   /* 추가 상단 여백 */
}

/* 대시보드 헤더 */
.dashboard-header .welcome-message[b-xt33hqfdcg] {
   font-weight: 700;
   color: #343a40;
}

/* 모든 카드 공통 스타일 */
.dashboard-container .card[b-xt33hqfdcg] {
   border: none;
   border-radius: 0.75rem;
   /* 둥근 모서리 */
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
   /* 부드러운 그림자 */
   transition: all 0.3s ease;
   overflow: hidden;
   /* 내부 요소가 카드를 벗어나지 않도록 */
}

.dashboard-container .card:hover[b-xt33hqfdcg] {
   transform: translateY(-5px);
   /* 호버 시 살짝 떠오르는 효과 */
   box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.dashboard-container .card-title[b-xt33hqfdcg] {
   font-weight: 600;
   color: #495057;
   display: flex;
   align-items: center;
}

.dashboard-container .card-title i[b-xt33hqfdcg] {
   color: #0d6efd;
   /* 기본 아이콘 색상 */
}

/* 라인 가동 현황 카드 */
.line-status-grid[b-xt33hqfdcg] {
   display: flex;
   flex-direction: column;
   gap: 1rem;
}

.line-status-item .line-name[b-xt33hqfdcg] {
   font-weight: 500;
   margin-bottom: 0.25rem;
   color: #6c757d;
}

/* PO 현황 요약 카드 */
.summary-card .stat-item .stat-value[b-xt33hqfdcg] {
   font-size: 2rem;
   font-weight: 700;
   margin: 0;
}

.summary-card .stat-item .stat-label[b-xt33hqfdcg] {
   font-size: 0.9rem;
   color: #6c757d;
   margin: 0;
}

/* 활동 로그 카드 */
.activity-log-list[b-xt33hqfdcg] {
   display: flex;
   flex-direction: column;
   gap: 1rem;
   max-height: 300px;
   overflow-y: auto;
   padding-right: 10px;
}

.activity-item[b-xt33hqfdcg] {
   display: flex;
   align-items: center;
   gap: 1rem;
}

.activity-icon[b-xt33hqfdcg] {
   width: 40px;
   height: 40px;
   border-radius: 50%;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
}

.activity-icon i[b-xt33hqfdcg] {
   font-size: 1.1rem;
}

.activity-content p[b-xt33hqfdcg] {
   margin-bottom: 0.1rem;
}

/* 공지 및 알림 카드 */
.notification-list[b-xt33hqfdcg] {
   display: flex;
   flex-direction: column;
   gap: 1rem;
}

.notification-item[b-xt33hqfdcg] {
   display: flex;
   align-items: center;
   gap: 1rem;
}

.notification-icon[b-xt33hqfdcg] {
   width: 40px;
   height: 40px;
   border-radius: 12px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
}

.notification-icon i[b-xt33hqfdcg] {
   font-size: 1.2rem;
}
/* /Pages/LineMapPage.razor.rz.scp.css */
/* 기존 스타일 유지 */
.line-map-board[b-hcg7q37fb2] {
   cursor: grab;
   user-select: none;
   /* 텍스트 선택 방지 */
}

.line-map-board.active[b-hcg7q37fb2] {
   cursor: grabbing;
}

/* 커스텀 스케줄 그리드 스타일 - 밝은 무채색 파스텔 */
.schedule-grid[b-hcg7q37fb2] {
   width: 100%;
   background: #fafafa;
   border-radius: 0 0 16px 16px;
   overflow: hidden;
}

.schedule-header[b-hcg7q37fb2] {
   display: grid;
   grid-template-columns: 150px repeat(20, minmax(60px, 1fr));
   background: linear-gradient(135deg, #f5f5f5 0%, #e8e8e8 100%);
   border-bottom: 2px solid #d0d0d0;
}

.line-header-cell[b-hcg7q37fb2] {
   padding: 0.8rem 0.5rem;
   background: linear-gradient(135deg, #f8f8f8 0%, #eeeeee 100%);
   color: #1a1a1a;
   font-weight: 600;
   font-size: 0.8rem;
   display: flex;
   align-items: center;
   justify-content: center;
   border-right: 1px solid #ddd;
   text-align: center;
}

.date-header-cell[b-hcg7q37fb2] {
   padding: 0.6rem 0.3rem;
   text-align: center;
   border-right: 1px solid #ddd;
   background: linear-gradient(135deg, #f9f9f9 0%, #f0f0f0 100%);
   color: #333;
   font-weight: 600;
   font-size: 0.75rem;
   transition: all 0.2s ease;
}

.date-header-cell.today[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #e8e8e8 0%, #d8d8d8 100%);
   color: #222;
   font-weight: 800;
   box-shadow: inset 0 0 0 2px #bbb;
}

.date-header-cell.weekend[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #e6f3ff 0%, #cce7ff 100%);
   color: #1565c0;
}

.date-header-cell.holiday[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #ffe6e6 0%, #ffcccc 100%);
   color: #c62828;
}

.date-info .day-name[b-hcg7q37fb2] {
   font-size: 0.7rem;
   text-transform: uppercase;
   letter-spacing: 0.3px;
   margin-bottom: 0.1rem;
}

.date-info .date-number[b-hcg7q37fb2] {
   font-size: 1rem;
   font-weight: 700;
}



.schedule-body[b-hcg7q37fb2] {
   max-height: 500px;
   overflow-y: auto;
}

.schedule-row[b-hcg7q37fb2] {
   display: grid;
   grid-template-columns: 150px repeat(20, minmax(60px, 1fr));
   border-bottom: 1px solid #e0e0e0;
   min-height: 70px;
}

.schedule-row:hover[b-hcg7q37fb2] {
   background-color: #f8f8f8;
}

.line-name-cell[b-hcg7q37fb2] {
   padding: 0.8rem 0.5rem;
   background: linear-gradient(135deg, #f6f6f6 0%, #eeeeee 100%);
   color: #1a1a1a;
   font-weight: 600;
   font-size: 0.8rem;
   border-right: 1px solid #ddd;
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
}

.line-info[b-hcg7q37fb2] {
   width: 100%;
}

.schedule-cell[b-hcg7q37fb2] {
   padding: 0.4rem 0.2rem;
   border-right: 1px solid #e0e0e0;
   background-color: #fdfdfd;
   position: relative;
   min-height: 70px;
   display: flex;
   flex-direction: column;
   gap: 0.2rem;
   transition: all 0.2s ease;
}

.schedule-cell:hover[b-hcg7q37fb2] {
   background-color: #f5f5f5;
}

.schedule-cell.weekend[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #f0f8ff 0%, #e6f3ff 100%);
   opacity: 0.9;
}

.schedule-cell.holiday[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #fff5f5 0%, #ffe6e6 100%);
   opacity: 0.9;
}

.schedule-cell.past-date[b-hcg7q37fb2] {
   background-color: #f2f2f2;
   opacity: 0.6;
}

.schedule-cell.drop-target[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #f0f8ff 0%, #e0f0ff 100%);
   border: 2px dashed #90caf9;
   box-shadow: inset 0 0 10px rgba(144, 202, 249, 0.3);
}

.empty-cell[b-hcg7q37fb2] {
   display: flex;
   align-items: center;
   justify-content: center;
   height: 100%;
   text-align: center;
   color: #999;
   font-style: italic;
   font-size: 0.7rem;
}

.po-assignment[b-hcg7q37fb2] {
   background: #3498db;
   color: white;
   border-radius: 4px;
   padding: 0.3rem;
   margin-bottom: 0.2rem;
   cursor: pointer;
   position: relative;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
   transition: all 0.2s ease;
   font-size: 0.7rem;
}

.po-assignment:hover[b-hcg7q37fb2] {
   transform: translateY(-1px);
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.po-assignment .po-number[b-hcg7q37fb2] {
   font-weight: 600;
   font-size: 0.75rem;
   margin-bottom: 0.1rem;
   line-height: 1.1;
}

.po-assignment .po-details[b-hcg7q37fb2] {
   display: flex;
   flex-direction: column;
   gap: 0.05rem;
}

.po-assignment .po-details small[b-hcg7q37fb2] {
   font-size: 0.65rem;
   line-height: 1.1;
}

.po-assignment .quantity[b-hcg7q37fb2] {
   opacity: 0.9;
   font-weight: 500;
}

.btn-remove[b-hcg7q37fb2] {
   position: absolute;
   top: -0.2rem;
   right: -0.2rem;
   background: #f44336;
   color: white;
   border: none;
   border-radius: 50%;
   width: 16px;
   height: 16px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 0.6rem;
   cursor: pointer;
   opacity: 0;
   transition: all 0.2s ease;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.po-assignment:hover .btn-remove[b-hcg7q37fb2] {
   opacity: 1;
}

.btn-remove:hover[b-hcg7q37fb2] {
   background: #d32f2f;
   transform: scale(1.1);
}

/* 반응형 개선 */
@media (max-width: 1600px) {

   .schedule-header[b-hcg7q37fb2],
   .schedule-row[b-hcg7q37fb2] {
      grid-template-columns: 120px repeat(20, minmax(50px, 1fr));
   }

   .line-header-cell[b-hcg7q37fb2],
   .line-name-cell[b-hcg7q37fb2] {
      padding: 0.6rem 0.3rem;
      font-size: 0.75rem;
   }

   .date-header-cell[b-hcg7q37fb2] {
      padding: 0.5rem 0.2rem;
      font-size: 0.7rem;
   }

   .schedule-cell[b-hcg7q37fb2] {
      padding: 0.3rem 0.15rem;
      min-height: 60px;
   }

   .po-assignment[b-hcg7q37fb2] {
      padding: 0.25rem;
      font-size: 0.65rem;
   }

   .po-assignment .po-number[b-hcg7q37fb2] {
      font-size: 0.7rem;
   }
}

@media (max-width: 1200px) {

   .schedule-header[b-hcg7q37fb2],
   .schedule-row[b-hcg7q37fb2] {
      grid-template-columns: 100px repeat(15, minmax(45px, 1fr));
   }

   .line-header-cell[b-hcg7q37fb2],
   .line-name-cell[b-hcg7q37fb2] {
      padding: 0.5rem 0.25rem;
      font-size: 0.7rem;
   }

   .date-header-cell[b-hcg7q37fb2] {
      padding: 0.4rem 0.15rem;
      font-size: 0.65rem;
   }

   .date-info .day-name[b-hcg7q37fb2] {
      font-size: 0.6rem;
   }

   .date-info .date-number[b-hcg7q37fb2] {
      font-size: 0.9rem;
   }

   .schedule-cell[b-hcg7q37fb2] {
      padding: 0.25rem 0.1rem;
      min-height: 50px;
   }

   .po-assignment[b-hcg7q37fb2] {
      padding: 0.2rem;
      font-size: 0.6rem;
   }

   .po-assignment .po-number[b-hcg7q37fb2] {
      font-size: 0.65rem;
   }

   .po-assignment .po-details small[b-hcg7q37fb2] {
      font-size: 0.6rem;
   }
}

@media (max-width: 768px) {

   .schedule-header[b-hcg7q37fb2],
   .schedule-row[b-hcg7q37fb2] {
      grid-template-columns: 80px repeat(10, minmax(40px, 1fr));
   }

   .line-header-cell[b-hcg7q37fb2],
   .line-name-cell[b-hcg7q37fb2] {
      padding: 0.4rem 0.2rem;
      font-size: 0.65rem;
   }

   .date-header-cell[b-hcg7q37fb2] {
      padding: 0.3rem 0.1rem;
      font-size: 0.6rem;
   }

   .date-info .day-name[b-hcg7q37fb2] {
      font-size: 0.55rem;
   }

   .date-info .date-number[b-hcg7q37fb2] {
      font-size: 0.8rem;
   }

   .schedule-cell[b-hcg7q37fb2] {
      padding: 0.2rem 0.05rem;
      min-height: 45px;
   }

   .po-assignment[b-hcg7q37fb2] {
      padding: 0.15rem;
      font-size: 0.55rem;
   }

   .po-assignment .po-number[b-hcg7q37fb2] {
      font-size: 0.6rem;
   }

   .po-assignment .po-details small[b-hcg7q37fb2] {
      font-size: 0.55rem;
   }

   .btn-remove[b-hcg7q37fb2] {
      width: 14px;
      height: 14px;
      font-size: 0.55rem;
   }
}

/* PO 사이드바 카드 스타일 */
.po-sidebar-card[b-hcg7q37fb2] {
   border-radius: 16px !important;
   overflow: hidden;
   box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08) !important;
   border: 1px solid #ddd !important;
}

.po-sidebar-card .card-header[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #f8f8f8 0%, #f0f0f0 100%);
   border-bottom: 2px solid #e0e0e0;
   padding: 1.5rem 1.25rem;
}

.po-sidebar-card .card-header h4[b-hcg7q37fb2] {
   color: #333;
   text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
   font-size: 1.2rem;
}

.po-sidebar-card .card-header .badge[b-hcg7q37fb2] {
   font-size: 0.9rem;
   border-radius: 12px;
   font-weight: 600;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* PO 카드 텍스트 크기 개선 */
.po-sidebar-card .card-body .text-muted[b-hcg7q37fb2],
.po-sidebar-card .card-body small[b-hcg7q37fb2] {
   font-size: 0.9rem !important;
}

.po-sidebar-card .card-body .badge[b-hcg7q37fb2] {
   font-size: 0.85rem !important;
   padding: 0.4rem 0.8rem;
}

.po-sidebar-card .card-body strong[b-hcg7q37fb2] {
   font-size: 1.1rem !important;
}

.po-sidebar-card .card-body .text-truncate[b-hcg7q37fb2] {
   font-size: 1rem !important;
}

/* 드롭다운 버튼 크기 조정 */
.po-sidebar-card .card-body .btn-sm[b-hcg7q37fb2] {
   font-size: 0.9rem;
}

/* 섹션 헤더 공통 스타일 */
.section-header[b-hcg7q37fb2] {
   display: flex;
   justify-content: space-between;
   align-items: center;
}

.section-title[b-hcg7q37fb2] {
   color: #37474f;
   font-size: 1rem;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.5px;
}

/* 각 섹션별 스타일 */

.filters-container[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #f9f9f9 0%, #f2f2f2 100%);
   border: 1px solid #e0e0e0;
   border-radius: 8px;
   padding: 0.75rem;
}

.filters-container .row[b-hcg7q37fb2] {
   margin: 0;
}

.filters-container .col-6[b-hcg7q37fb2] {
   padding: 0 0.25rem;
}

.active-filters-section[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #f5f5f5 0%, #eeeeee 100%);
   border: 1px solid #d0d0d0;
   border-radius: 12px;
   padding: 1rem;
}

/* 새 PO 추가 버튼 스타일 */
.po-sidebar-card .btn-success[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #999 0%, #777 100%);
   border: none;
   border-radius: 12px;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
   transition: all 0.3s ease;
   font-size: 1rem;
   text-transform: uppercase;
   letter-spacing: 0.5px;
}

.po-sidebar-card .btn-success:hover[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #777 0%, #999 100%);
   transform: translateY(-2px);
   box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
}

.po-sidebar-card .btn-success:active[b-hcg7q37fb2] {
   transform: translateY(0);
}



/* 선택 박스 스타일 */
.filters-container .form-select-sm[b-hcg7q37fb2] {
   border-radius: 6px;
   border: 1px solid #ddd;
   background-color: white;
   font-size: 0.85rem;
   padding: 0.5rem;
   font-weight: 500;
   transition: all 0.2s ease;
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m1 6 7 7 7-7'/%3e%3c/svg%3e");
}

.filters-container .form-select-sm:focus[b-hcg7q37fb2] {
   background-color: white;
   border-color: #888;
   box-shadow: 0 0 0 0.15rem rgba(136, 136, 136, 0.1);
}

/* 필터 배지 스타일 */
.filter-badges[b-hcg7q37fb2] {
   display: flex;
   flex-wrap: wrap;
   gap: 0.5rem;
}

.filter-badges .badge[b-hcg7q37fb2] {
   border-radius: 20px;
   font-size: 0.85rem;
   padding: 0.5rem 1rem;
   font-weight: 500;
   display: flex;
   align-items: center;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.filter-badges .badge.bg-info[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #aaa 0%, #888 100%) !important;
   color: white !important;
}

.filter-badges .badge.bg-warning[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #bbb 0%, #999 100%) !important;
   color: white !important;
}

.filter-badges .badge.bg-success[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #999 0%, #777 100%) !important;
   color: white !important;
}

/* 전체 지우기 버튼 스타일 */
.active-filters-section .btn-link[b-hcg7q37fb2] {
   color: #666;
   font-weight: 600;
   transition: all 0.2s ease;
   font-size: 0.9rem;
}

.active-filters-section .btn-link:hover[b-hcg7q37fb2] {
   color: #333;
   text-decoration: underline !important;
}

/* 카드 바디 스타일 개선 */
.po-sidebar-card .card-body[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #f8f8f8 0%, #f2f2f2 100%);
   padding: 1rem 1.25rem;
}

/* 로딩 상태 스타일 */
.po-sidebar-card .spinner-border[b-hcg7q37fb2] {
   width: 3rem;
   height: 3rem;
   border-width: 0.3rem;
}

/* 빈 상태 아이콘 스타일 */
.po-sidebar-card .display-4[b-hcg7q37fb2] {
   font-size: 3rem;
   opacity: 0.5;
}

/* Syncfusion Scheduler 모던 스타일 */
.modern-scheduler-card[b-hcg7q37fb2] {
   border-radius: 16px !important;
   overflow: hidden;
   box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12) !important;
}

/* 헤더 배경을 밝은 무채색 파스텔로 변경 */
.bg-gradient-primary[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #f5f5f5 0%, #e8e8e8 100%);
   color: #333 !important;
}

[b-hcg7q37fb2] .modern-scheduler {
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   border-radius: 0 0 16px 16px;
   background-color: #fefefe;
}

/* 스케줄러 툴바 파스텔 스타일링 */
[b-hcg7q37fb2] .modern-scheduler .e-schedule-toolbar {
   background: linear-gradient(135deg, #e1f5fe 0%, #f0f4c3 100%);
   border-bottom: 1px solid #b39ddb;
   padding: 12px 16px;
}

[b-hcg7q37fb2] .modern-scheduler .e-schedule-toolbar .e-toolbar-items {
   gap: 8px;
}

/* 스케줄러 헤더 파스텔 색상 및 텍스트 개선 */
[b-hcg7q37fb2] .modern-scheduler .e-header-row {
   background: linear-gradient(135deg, #f8bbd9 0%, #e1bee7 100%);
}

[b-hcg7q37fb2] .modern-scheduler .e-header-cells {
   background: linear-gradient(135deg, #f8bbd9 0%, #e1bee7 100%);
   color: #4a4a4a !important;
   font-weight: 600 !important;
   font-size: 0.9rem !important;
   border-right: 1px solid #d1c4e9;
   border-bottom: 1px solid #d1c4e9;
   text-align: center;
   padding: 12px 8px;
}

/* 날짜 셀 파스텔 색상 및 텍스트 개선 */
[b-hcg7q37fb2] .modern-scheduler .e-date-header-container .e-header-cells {
   background: linear-gradient(135deg, #c8e6c9 0%, #dcedc8 100%);
   color: #2e7d32 !important;
   font-weight: 700 !important;
   font-size: 1rem !important;
   border-right: 1px solid #a5d6a7;
   border-bottom: 1px solid #a5d6a7;
}

/* 요일 헤더 스타일 개선 */
[b-hcg7q37fb2] .modern-scheduler .e-day-header {
   background: linear-gradient(135deg, #ffcdd2 0%, #f8bbd9 100%);
   color: #c2185b !important;
   font-weight: 600 !important;
   font-size: 0.85rem !important;
   text-transform: uppercase;
   letter-spacing: 0.5px;
   padding: 8px;
   border-right: 1px solid #f48fb1;
}

/* 현재 날짜 하이라이트 */
[b-hcg7q37fb2] .modern-scheduler .e-header-cells.e-current-date {
   background: linear-gradient(135deg, #81c784 0%, #aed581 100%) !important;
   color: #1b5e20 !important;
   font-weight: 800 !important;
   box-shadow: inset 0 0 0 2px #4caf50;
}

/* 작업 셀 파스텔 색상 */
[b-hcg7q37fb2] .modern-scheduler .e-work-cells {
   background-color: #fafafa;
   border-right: 1px solid #e8eaf6;
   border-bottom: 1px solid #e8eaf6;
   transition: background-color 0.2s ease;
}

[b-hcg7q37fb2] .modern-scheduler .e-work-cells:hover {
   background-color: #f3e5f5;
}

/* 오늘 날짜 셀 하이라이트 */
[b-hcg7q37fb2] .modern-scheduler .e-work-cells.e-current-date {
   background-color: #e8f5e8 !important;
   border: 1px solid #81c784;
}

/* 리소스 헤더 (라인명) 파스텔 스타일링 */
[b-hcg7q37fb2] .modern-scheduler .e-resource-cells {
   background: linear-gradient(135deg, #ffecb3 0%, #fff9c4 100%);
   color: #ef6c00 !important;
   font-weight: 600 !important;
   font-size: 0.9rem !important;
   border-right: 1px solid #ffcc02;
   border-bottom: 1px solid #ffcc02;
   text-align: center;
   padding: 10px 8px;
}

/* 시간 슬롯 헤더 */
[b-hcg7q37fb2] .modern-scheduler .e-time-cells-wrap .e-time-cells {
   background: linear-gradient(135deg, #e1f5fe 0%, #e0f2f1 100%);
   color: #00695c !important;
   font-weight: 500 !important;
   border-right: 1px solid #80cbc4;
   border-bottom: 1px solid #80cbc4;
}

[b-hcg7q37fb2] .modern-scheduler .e-content-wrap {
   border-radius: 0 0 16px 16px;
}

/* 이벤트 템플릿 스타일 */
.modern-event-template[b-hcg7q37fb2] {
   border-radius: 8px;
   padding: 8px 12px;
   color: white;
   height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
   border: none !important;
   font-size: 0.85rem;
}

.event-header[b-hcg7q37fb2] {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 4px;
}

.event-po-number[b-hcg7q37fb2] {
   font-weight: 600;
   font-size: 0.9rem;
}

.event-quantity[b-hcg7q37fb2] {
   background: rgba(255, 255, 255, 0.2);
   padding: 2px 6px;
   border-radius: 12px;
   font-size: 0.75rem;
   font-weight: 500;
}

.event-content[b-hcg7q37fb2] {
   display: flex;
   flex-direction: column;
   gap: 2px;
}

.event-style[b-hcg7q37fb2] {
   font-weight: 500;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.event-buyer[b-hcg7q37fb2] {
   font-size: 0.75rem;
   opacity: 0.9;
}

.event-delivery[b-hcg7q37fb2] {
   font-size: 0.7rem;
   opacity: 0.8;
   display: flex;
   align-items: center;
   gap: 4px;
}

/* 툴팁 스타일 */
.modern-tooltip[b-hcg7q37fb2] {
   background: white;
   border-radius: 12px;
   box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
   overflow: hidden;
   min-width: 280px;
}

.tooltip-header[b-hcg7q37fb2] {
   padding: 12px 16px;
   color: white;
   font-weight: 600;
}

.tooltip-body[b-hcg7q37fb2] {
   padding: 16px;
}

.tooltip-row[b-hcg7q37fb2] {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 8px 0;
   border-bottom: 1px solid #f0f0f0;
}

.tooltip-row:last-child[b-hcg7q37fb2] {
   border-bottom: none;
}

.tooltip-label[b-hcg7q37fb2] {
   font-weight: 500;
   color: #666;
   font-size: 0.85rem;
}

.tooltip-value[b-hcg7q37fb2] {
   font-weight: 600;
   color: #333;
   font-size: 0.85rem;
}

/* 반응형 디자인 */
@media (max-width: 768px) {
   .modern-scheduler-card[b-hcg7q37fb2] {
      border-radius: 12px !important;
   }

   .modern-event-template[b-hcg7q37fb2] {
      padding: 6px 8px;
      font-size: 0.75rem;
   }

   .event-po-number[b-hcg7q37fb2] {
      font-size: 0.8rem;
   }

   .event-quantity[b-hcg7q37fb2] {
      font-size: 0.7rem;
   }

   /* 모바일에서 헤더 텍스트 크기 조정 */
   [b-hcg7q37fb2] .modern-scheduler .e-header-cells {
      font-size: 0.8rem !important;
      padding: 8px 4px;
   }

   [b-hcg7q37fb2] .modern-scheduler .e-date-header-container .e-header-cells {
      font-size: 0.9rem !important;
   }
}

/* 스케줄러 헤더 버튼 파스텔 스타일 */
.btn-light.active[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #b39ddb 0%, #ce93d8 100%) !important;
   color: #4a148c !important;
   font-weight: 600;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   border: none;
}

.btn-light:hover[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #d1c4e9 0%, #e1bee7 100%) !important;
   color: #6a1b9a !important;
   transform: translateY(-1px);
   transition: all 0.2s ease;
   border: none;
}

/* 배지 파스텔 스타일 */
.badge.bg-light.text-primary[b-hcg7q37fb2] {
   background: linear-gradient(135deg, #e1f5fe 0%, #f0f4c3 100%) !important;
   color: #01579b !important;
   font-weight: 600;
   padding: 6px 12px;
   border-radius: 20px;
   border: 1px solid #81d4fa;
}

/* 드래그 앤 드롭 개선 */
[b-hcg7q37fb2] .modern-scheduler .e-event {
   transition: all 0.2s ease;
}

[b-hcg7q37fb2] .modern-scheduler .e-event:hover {
   transform: translateY(-2px);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* 주말 및 휴일 셀 파스텔 스타일 */
[b-hcg7q37fb2] .modern-scheduler .e-work-cells.e-disable-dates {
   background: linear-gradient(135deg, #ffecb3 0%, #fff8e1 100%);
   opacity: 0.8;
   color: #bf360c !important;
}

[b-hcg7q37fb2] .modern-scheduler .e-header-cells.e-disable-dates {
   background: linear-gradient(135deg, #ffcdd2 0%, #ffebee 100%);
   color: #c62828 !important;
   font-weight: 500 !important;
}

/* 달력 네비게이션 버튼 개선 */
[b-hcg7q37fb2] .modern-scheduler .e-schedule-toolbar .e-toolbar-item {
   background: linear-gradient(135deg, #e8eaf6 0%, #f3e5f5 100%);
   border: 1px solid #d1c4e9;
   color: #5e35b1 !important;
   border-radius: 8px;
   font-weight: 500;
}

[b-hcg7q37fb2] .modern-scheduler .e-schedule-toolbar .e-toolbar-item:hover {
   background: linear-gradient(135deg, #d1c4e9 0%, #e1bee7 100%);
   color: #4527a0 !important;
}

/* 월/주 뷰 전환 시 더 나은 대비 */
[b-hcg7q37fb2] .modern-scheduler .e-timeline-view .e-resource-left-td {
   background: linear-gradient(135deg, #c8e6c9 0%, #dcedc8 100%);
   color: #2e7d32 !important;
   font-weight: 600 !important;
   border-right: 2px solid #81c784;
}

/* 텍스트 선명도 개선을 위한 텍스트 섀도우 */
[b-hcg7q37fb2] .modern-scheduler .e-header-cells,
[b-hcg7q37fb2] .modern-scheduler .e-date-header-container .e-header-cells,
[b-hcg7q37fb2] .modern-scheduler .e-resource-cells,
[b-hcg7q37fb2] .modern-scheduler .e-time-cells {
   text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
}

/* 반응형 개선 */
@media (max-width: 991.98px) {
   .po-sidebar-card[b-hcg7q37fb2] {
      margin-bottom: 2rem;
   }

   .po-sidebar-card .card-header[b-hcg7q37fb2] {
      padding: 1rem;
   }

   .po-sidebar-card .card-header h4[b-hcg7q37fb2] {
      font-size: 1.1rem;
   }

   .po-sidebar-card .btn-success[b-hcg7q37fb2] {
      font-size: 0.9rem;
      padding: 0.75rem 1rem;
   }

   .filters-container[b-hcg7q37fb2],
   .active-filters-section[b-hcg7q37fb2] {
      padding: 0.5rem;
   }

   .section-title[b-hcg7q37fb2] {
      font-size: 0.9rem;
   }

   .po-sidebar-card .card-body .text-muted[b-hcg7q37fb2],
   .po-sidebar-card .card-body small[b-hcg7q37fb2] {
      font-size: 0.85rem !important;
   }

   .po-sidebar-card .card-body .badge[b-hcg7q37fb2] {
      font-size: 0.8rem !important;
   }
}

@media (max-width: 576px) {
   .po-sidebar-card .card-header[b-hcg7q37fb2] {
      padding: 0.75rem;
   }

   .filter-badges[b-hcg7q37fb2] {
      gap: 0.25rem;
   }

   .filter-badges .badge[b-hcg7q37fb2] {
      font-size: 0.8rem;
      padding: 0.4rem 0.8rem;
   }

   .search-section[b-hcg7q37fb2],
   .filter-section[b-hcg7q37fb2],
   .active-filters-section[b-hcg7q37fb2] {
      padding: 0.5rem;
      margin-bottom: 1rem;
   }

   .po-sidebar-card .card-body .text-muted[b-hcg7q37fb2],
   .po-sidebar-card .card-body small[b-hcg7q37fb2] {
      font-size: 0.8rem !important;
   }

   .po-sidebar-card .card-body .badge[b-hcg7q37fb2] {
      font-size: 0.75rem !important;
   }

   .po-sidebar-card .card-body strong[b-hcg7q37fb2] {
      font-size: 1rem !important;
   }

   .po-sidebar-card .card-body .text-truncate[b-hcg7q37fb2] {
      font-size: 0.9rem !important;
   }
}

/* =========================================== */
/* 고성능 드래그 앤 드롭 스타일링 */
/* =========================================== */

/* 드래그 오버 효과 - 하드웨어 가속 및 성능 최적화 */
.drag-over[b-hcg7q37fb2] {
   outline: 2px dashed #3498db !important;
   outline-offset: -2px !important;
   background-color: rgba(52, 152, 219, 0.08) !important;
   transform: translateZ(0);
   /* 하드웨어 가속 */
   transition: none;
   /* 부드러운 전환 제거로 성능 향상 */
   will-change: outline, background-color;
   /* 브라우저 최적화 힌트 */
}

/* 드래그 중인 PO 카드 스타일 */
.dragging[b-hcg7q37fb2] {
   opacity: 0.6;
   transform: translateZ(0) scale(1.02);
   /* 하드웨어 가속 + 약간 확대 */
   transition: none;
   /* 즉시 반응 */
   will-change: opacity, transform;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
   z-index: 1000;
}

/* 드래그 모드 활성화 시 전체 보드 스타일 */
.dragging-mode[b-hcg7q37fb2] {
   user-select: none;
   /* 텍스트 선택 방지 */
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
}

/* 드래그 가능한 요소의 기본 커서 */
.po-card[draggable="true"][b-hcg7q37fb2] {
   cursor: grab;
}

.po-card[draggable="true"]:active[b-hcg7q37fb2] {
   cursor: grabbing;
}

/* =========================================== */
/* PO 카드 크기 조정 (Resize) 기능 */
/* =========================================== */

/* PO 카드가 스케줄러에 배정되었을 때의 기본 스타일 */
.po-assignment[b-hcg7q37fb2] {
   position: relative;
   display: flex;
   align-items: center;
   justify-content: space-between;
   border-radius: 4px;
   margin-bottom: 2px;
   transition: all 0.2s ease;
   min-width: 100%;
   box-sizing: border-box;
}

/* Resize handle 공통 스타일 */
.po-assignment .resize-handle[b-hcg7q37fb2] {
   position: absolute;
   top: 0;
   bottom: 0;
   width: 6px;
   background: rgba(255, 255, 255, 0.3);
   cursor: ew-resize;
   opacity: 0;
   transition: opacity 0.2s ease;
   z-index: 10;
}

/* 왼쪽 resize handle */
.po-assignment .resize-handle.left[b-hcg7q37fb2] {
   left: 0;
   border-left: 2px solid rgba(255, 255, 255, 0.8);
   border-radius: 4px 0 0 4px;
}

/* 오른쪽 resize handle */
.po-assignment .resize-handle.right[b-hcg7q37fb2] {
   right: 0;
   border-right: 2px solid rgba(255, 255, 255, 0.8);
   border-radius: 0 4px 4px 0;
}

/* PO 카드 hover 시 resize handle 표시 */
.po-assignment:hover .resize-handle[b-hcg7q37fb2] {
   opacity: 1;
}

/* Resize 중일 때의 스타일 */
.po-assignment.resizing[b-hcg7q37fb2] {
   z-index: 1000;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
   opacity: 0.9;
}

.po-assignment.resizing .resize-handle[b-hcg7q37fb2] {
   opacity: 1;
   background: rgba(255, 255, 255, 0.5);
}

/* 여러 날짜에 걸친 PO 카드 스타일 */
.po-assignment.multi-day[b-hcg7q37fb2] {
   background: linear-gradient(90deg, currentColor 0%, rgba(255, 255, 255, 0.1) 50%, currentColor 100%);
   border: 2px dashed currentColor;
   border-radius: 6px;
   min-height: 32px;
}

.po-assignment.multi-day .po-number[b-hcg7q37fb2] {
   font-weight: 600;
   text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}

.po-assignment.multi-day .po-details[b-hcg7q37fb2] {
   opacity: 0.9;
}

/* 크기 조정 가이드라인 */
.schedule-grid.resizing .schedule-cell[b-hcg7q37fb2] {
   border: 1px dashed #007bff;
   background: rgba(0, 123, 255, 0.05);
}

.schedule-grid.resizing .schedule-cell.resize-target[b-hcg7q37fb2] {
   background: rgba(0, 123, 255, 0.15);
   border: 2px solid #007bff;
}

/* 반응형 디자인 - 작은 화면에서는 resize handle 크기 증가 */
@media (max-width: 768px) {
   .po-assignment .resize-handle[b-hcg7q37fb2] {
      width: 8px;
   }

   .po-assignment .resize-handle.left[b-hcg7q37fb2] {
      border-left: 3px solid rgba(255, 255, 255, 0.8);
   }

   .po-assignment .resize-handle.right[b-hcg7q37fb2] {
      border-right: 3px solid rgba(255, 255, 255, 0.8);
   }
}
/* /Pages/LoginPage.razor.rz.scp.css */
/* 
  LoginPage.razor.css
  로그인 페이지 전용 스타일시트
*/

/* 페이지 전체를 감싸는 컨테이너 */
[b-bfwmpuqyhl] .login-container {
   display: flex;
   /* Flexbox 레이아웃 사용 */
   align-items: center;
   /* 수직 중앙 정렬 */
   justify-content: center;
   /* 수평 중앙 정렬 */
   min-height: 100vh;
   /* 최소 높이를 화면 전체 높이로 설정 */
   background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   /* 그라데이션 배경 */
   padding: 1rem;
}

/* 로그인 폼을 감싸는 카드 */
[b-bfwmpuqyhl] .login-card {
   background: white;
   padding: 2.5rem 2rem;
   border-radius: 15px;
   box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
   width: 100%;
   max-width: 420px;
   /* 카드의 최대 너비 제한 */
   text-align: center;
   border: 1px solid #eee;
}

/* 제목 스타일 */
[b-bfwmpuqyhl] .login-title {
   font-size: 2rem;
   font-weight: 700;
   margin-bottom: 0.5rem;
   color: #333;
}

/* 부제목 스타일 */
[b-bfwmpuqyhl] .login-subtitle {
   margin-bottom: 2rem;
   color: #6c757d;
}

/* 폼 그룹 스타일 */
[b-bfwmpuqyhl] .form-group {
   text-align: left;
   margin-bottom: 1.5rem;
}

[b-bfwmpuqyhl] .form-group label {
   font-weight: 600;
   margin-bottom: 0.5rem;
   display: block;
   color: #495057;
}

/* 입력 필드 스타일 */
[b-bfwmpuqyhl] .form-control {
   border-radius: 8px;
   padding: 0.75rem 1rem;
   border: 1px solid #ced4da;
   transition: all 0.3s ease;
   /* 부드러운 전환 효과 */
}

[b-bfwmpuqyhl] .form-control:focus {
   border-color: #667eea;
   box-shadow: 0 0 0 0.2rem rgba(102, 126, 234, 0.25);
}

/* 버튼 스타일 */
[b-bfwmpuqyhl] .btn-primary {
   background-color: #667eea;
   border-color: #667eea;
   padding: 0.75rem;
   border-radius: 8px;
   font-weight: 600;
   letter-spacing: 0.5px;
   transition: all 0.3s ease;
   /* 부드러운 전환 효과 */
   width: 100%;
}

/* 버튼 호버 & 포커스 시 애니메이션 */
[b-bfwmpuqyhl] .btn-primary:hover,
[b-bfwmpuqyhl] .btn-primary:focus {
   background-color: #5a6fd8;
   border-color: #5a6fd8;
   transform: translateY(-2px);
   /* 살짝 위로 이동 */
   box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
}

/* 회원가입 링크 스타일 */
[b-bfwmpuqyhl] .register-link {
   margin-top: 1.5rem;
   color: #6c757d;
}

[b-bfwmpuqyhl] .register-link a {
   color: #667eea;
   font-weight: 600;
   text-decoration: none;
}

[b-bfwmpuqyhl] .register-link a:hover {
   text-decoration: underline;
}
/* /Pages/ProfilePage.razor.rz.scp.css */
.profile-container[b-7t1znbjqsi] {
   max-width: 768px;
   margin: 2rem auto;
   padding: 2rem;
}

.page-title[b-7t1znbjqsi] {
   font-weight: 700;
   margin-bottom: 0.5rem;
}

.page-subtitle[b-7t1znbjqsi] {
   font-size: 1.1rem;
   color: #6c757d;
   margin-bottom: 2rem;
}

.profile-card[b-7t1znbjqsi] {
   background-color: #fff;
   border: 1px solid #dee2e6;
   border-radius: 0.75rem;
   margin-bottom: 2rem;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.card-header[b-7t1znbjqsi] {
   background-color: #f8f9fa;
   padding: 1rem 1.5rem;
   font-size: 1.25rem;
   font-weight: 600;
   border-bottom: 1px solid #dee2e6;
   display: flex;
   align-items: center;
}

.card-header i[b-7t1znbjqsi] {
   color: #0d6efd;
}

.card-body[b-7t1znbjqsi] {
   padding: 1.5rem;
}

.form-label[b-7t1znbjqsi] {
   font-weight: 500;
}

.form-control:read-only[b-7t1znbjqsi] {
   background-color: #e9ecef;
}

.btn-primary[b-7t1znbjqsi] {
   padding: 0.75rem;
   font-size: 1rem;
   font-weight: 600;
}
/* /Pages/RegisterPage.razor.rz.scp.css */
/* 
  RegisterPage.razor.css
  회원가입 페이지 전용 스타일시트
*/

/* 페이지 전체를 감싸는 컨테이너 */
[b-e8md5mzrwf] .register-container {
   display: flex;
   align-items: center;
   justify-content: center;
   min-height: 100vh;
   background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
   /* 그라데이션 방향 반전 */
   padding: 1rem;
}

/* 회원가입 폼을 감싸는 카드 */
[b-e8md5mzrwf] .register-card {
   background: white;
   padding: 2.5rem 2rem;
   border-radius: 15px;
   box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
   width: 100%;
   max-width: 420px;
   text-align: center;
   border: 1px solid #eee;
}

/* 제목 스타일 */
[b-e8md5mzrwf] .register-title {
   font-size: 2rem;
   font-weight: 700;
   margin-bottom: 0.5rem;
   color: #333;
}

/* 부제목 스타일 */
[b-e8md5mzrwf] .register-subtitle {
   margin-bottom: 2rem;
   color: #6c757d;
}

/* 폼 그룹 스타일 */
[b-e8md5mzrwf] .form-group {
   text-align: left;
   margin-bottom: 1.5rem;
}

[b-e8md5mzrwf] .form-group label {
   font-weight: 600;
   margin-bottom: 0.5rem;
   display: block;
   color: #495057;
}

/* 입력 필드 스타일 */
[b-e8md5mzrwf] .form-control {
   border-radius: 8px;
   padding: 0.75rem 1rem;
   border: 1px solid #ced4da;
   transition: all 0.3s ease;
}

[b-e8md5mzrwf] .form-control:focus {
   border-color: #764ba2;
   box-shadow: 0 0 0 0.2rem rgba(118, 75, 162, 0.25);
}

/* 버튼 스타일 */
[b-e8md5mzrwf] .btn-primary {
   background-color: #764ba2;
   border-color: #764ba2;
   padding: 0.75rem;
   border-radius: 8px;
   font-weight: 600;
   letter-spacing: 0.5px;
   transition: all 0.3s ease;
   width: 100%;
}

/* 버튼 호버 & 포커스 시 애니메이션 */
[b-e8md5mzrwf] .btn-primary:hover,
[b-e8md5mzrwf] .btn-primary:focus {
   background-color: #6a4392;
   border-color: #6a4392;
   transform: translateY(-2px);
   box-shadow: 0 4px 15px rgba(118, 75, 162, 0.4);
}

/* 로그인 링크 스타일 */
[b-e8md5mzrwf] .login-link {
   margin-top: 1.5rem;
   color: #6c757d;
}

[b-e8md5mzrwf] .login-link a {
   color: #764ba2;
   font-weight: 600;
   text-decoration: none;
}

[b-e8md5mzrwf] .login-link a:hover {
   text-decoration: underline;
}

</rewritten_file[b-e8md5mzrwf]>