/* style.css */
/* 제공해주신 스타일을 기반으로 재구성한 최종 스타일시트 */

/* ================================================================== */
/* 1. 기본 리셋 및 폰트 설정 (제공해주신 폰트) */
/* ================================================================== */

@import "https://hangeul.pstatic.net/hangeul_static/css/nanum-square-neo.css";

:root {
    /* 색상 변수를 제공해주신 스타일에 맞춰 재정의 */
    --primary-color: #dc2626; /* 주 색상 (Red) */
    --primary-color-dark: #b91c1c; /* 주 색상 (Hover) */
    --text-color-primary: #1F2937; /* 기본 텍스트 색상 */
    --text-color-secondary: #6B7280; /* 보조 텍스트 색상 */
    --bg-color: #F9FAFB; /* 전체 배경 색상 */
    --surface-color: #FFFFFF; /* 카드, 컨테이너 배경색 */
    --border-color: #E5E7EB; /* 테두리 색상 */
    --gray-200: #E5E7EB;
    --gray-400: #9CA3AF;
    --gray-500: #6B7280;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'NanumSquareNeo', Pretendard, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
    background-color: var(--bg-color);
    color: var(--text-color-primary);
    line-height: 1.6;
}

/* ================================================================== */
/* 2. 제공해주신 커스텀 스타일 */
/* ================================================================== */

/* 로고 텍스트 스타일 */
.logo-text {
    color: #684229;
    text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.8), 0px -1px 1px rgba(0, 0, 0, 0.2);
}
/* 다크모드용 로고 (참고용) */
.dark .logo-text {
    color: #ffffff;
    text-shadow: 0px 2px 3px rgba(0, 0, 0, 0.5);
}

/* 웹킷 브라우저 스크롤바 스타일 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background-color: var(--gray-200); }
.dark ::-webkit-scrollbar-track { background-color: #374151; } /* dark:bg-gray-700 */
::-webkit-scrollbar-thumb { background-color: var(--gray-400); border-radius: 0.375rem; }
.dark ::-webkit-scrollbar-thumb { background-color: var(--gray-500); }
::-webkit-scrollbar-thumb:hover { background-color: var(--gray-500); }
.dark ::-webkit-scrollbar-thumb:hover { background-color: #4b5563; } /* dark:bg-gray-600 */

/* 활성화된 네비게이션 링크 스타일 */
.nav-link.active {
    background-color: #dc2626; /* @apply bg-red-600 */
    color: #ffffff; /* @apply text-white */
}

/* 테이블 좌측 컬럼 고정 */
.table-sticky-left { position: sticky; left: 0; z-index: 10; }
.table-sticky-header { position: sticky; top: 0; z-index: 20; }

/* 로딩 스피너 스타일 */
.loader {
    border: 4px solid #e5e7eb;
    border-top: 4px solid #dc2626;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
}
.dark .loader { border-color: #4b5563; border-top-color: #dc2626; }
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 모달 배경 스타일 */
.modal-backdrop { backdrop-filter: blur(4px); }

/* ================================================================== */
/* 3. 기본 레이아웃 및 컴포넌트 (기존 스타일 유지) */
/* ================================================================== */

.container {
    width: 90%;
    max-width: 1200px;
    margin: 2.5rem auto;
    padding: 2.5rem;
    background-color: var(--surface-color);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.05), 0 2px 4px -2px rgb(0 0 0 / 0.05);
}

/* [수정됨] 반응형 문제를 일으키던 header 관련 @media 쿼리 제거 */
.form-group { margin-bottom: 1.5rem; }
.form-group label { display: block; margin-bottom: 0.5rem; font-weight: 500; font-size: 0.9rem; }
.form-control {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 1rem;
    background-color: #fff;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.dark .form-control { background-color: #374151; border-color: #4b5563; }
.form-control:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.2);
}

@media (max-width: 768px) {
    .container {
        width: 100%;
        margin: 0;
        border-radius: 0;
        border-left: none;
        border-right: none;
        padding: 2rem 1.5rem;
    }
}
