/* Pretendard GOV - 정부 웹사이트 표준 폰트 */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/packages/pretendard-gov/dist/web/static/pretendard-gov.css');

/* 정부상징체(ROKG) - 로컬 폰트 파일을 웹 정적 리소스로 제공 */
/* 폰트 파일 위치: wwwroot/fonts/ROKG_R.ttf */
@font-face {
    font-family: 'ROKGov';
    src: url('/fonts/ROKG_R.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    /* 폰트 렌더링 최적화 */
    -webkit-font-feature-settings: "liga" off;
    font-feature-settings: "liga" off;
}

:root {
    /* 공공기관 스타일 색상 */

    /* 저장 버튼 색상 */
    --gov-blue: #1B4D7A;          /* 주요 버튼 남색 */
    --gov-blue-hover: #153A5F;    /* 버튼 호버 */
    --gov-blue-500: #63a4dd;   /* HOVER */
    --gov-blue-400: #5c8bc6;   /* 배경/강조 */



    --gov-blue-light: #E8F0F7; 
    --gov-gray-50: #F8F9FA;       /* 배경 */
    --gov-gray-100: #F1F3F5;
    --gov-gray-200: #E9ECEF;
    --gov-gray-300: #DEE2E6;
    --gov-gray-400: #CED4DA;
    --gov-gray-500: #ADB5BD;
    --gov-gray-600: #868E96;
    --gov-gray-700: #495057;
    --gov-gray-800: #343A40;
    --gov-gray-900: #212529;
    --gov-success: #28A745;
    --gov-warning: #FFC107;
    --gov-save: #256EF4;
    --gov-danger: #DC3545;
    --gov-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --gov-shadow-md: 0 2px 8px rgba(0, 0, 0, 0.1);
    --gov-shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.15);
    --gov-radius-sm: 4px;
    --gov-radius-md: 6px;
    --gov-radius-lg: 8px;
    --gov-radius-xl: 12px;
}

* {
    box-sizing: border-box;
}

html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

body {
    font-family: 'Pretendard GOV', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: #F5F5F5;
    color: var(--gov-gray-900);
    margin: 0;
    padding: 0;
    min-height: 100vh;
    line-height: 1.6;
}

/* Header */
header {
    background: #FFFFFF;
    box-shadow: var(--gov-shadow-sm);
    border-bottom: 2px solid var(--gov-blue);
}

.navbar {
    padding: 16px 24px;
}

.navbar-brand {
    font-size: 20px;
    font-weight: 700;
    /*color: var(--gov-blue) !important;*/
    text-decoration: none;
}

/* 헤더 로고 및 타이틀 */
.logo-container {
    flex-shrink: 0;
}

.header-logo {
    height: 80px;
    width: auto;
    object-fit: contain;
}

.header-title {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.header-title-main {
    /* 기존: font-family: 'ROKGov', 'Noto Sans KR', sans-serif; */
    font-family: 'Pretendard GOV', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 22px;
    font-weight: 600;
    color: #000000;
    line-height: 1.2;
    letter-spacing: 0.01em;
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
    text-rendering: auto;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

.header-title-sub {
    /* 기존: font-family: 'ROKGov', 'Noto Sans KR', sans-serif; */
    font-family: 'Pretendard GOV', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 20px;
    font-weight: 500;
    color: #000000;
    line-height: 1.2;
    letter-spacing: 0.02em;
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
    text-rendering: auto;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

/* Container */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 32px 24px;
}

.container-fluid {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2px 6px;
}

/* Typography */
h1 {
    font-size: 28px;
    font-weight: 700;
    color: var(--gov-gray-900);
    margin-bottom: 24px;
}

h2 {
    font-size: 22px;
    font-weight: 600;
    color: var(--gov-gray-800);
    margin-bottom: 16px;
}

h5 {
    font-size: 18px;
    font-weight: 600;
    color: var(--gov-gray-800);
    margin-bottom: 12px;
}

.text-muted {
    color: var(--gov-gray-800) !important;
}

/* 본문 p 태그의 text-muted를 더 진하게 */
p.text-muted {
    color: var(--gov-gray-700) !important;
}

.small {
    font-size: 13px;
}

/* Cards */
.card {
    background: #FFFFFF;
    border: 1px solid var(--gov-gray-200);
    border-radius: 0 !important;
    box-shadow: var(--gov-shadow-sm);
    margin-bottom: 24px;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.card:hover {
    box-shadow: var(--gov-shadow-md);
}

.card-header {
    background: var(--gov-gray-50);
    border-bottom: 2px solid var(--gov-blue);
    padding: 16px 20px;
    font-weight: 600;
    color: var(--gov-gray-800);
}

.card-body {
    padding: 24px;
}

.card-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--gov-gray-900);
    margin-bottom: 16px;
}

/* Buttons */
.btn {
    border-radius: var(--gov-radius-md);
    font-weight: 500;
    padding: 10px 20px;
    transition: all 0.2s ease;
    border: none;
    font-size: 14px;
}

.btn-primary {
    background: var(--gov-blue);
    color: #FFFFFF;
}

.btn-primary:hover {
    background: var(--gov-blue-hover);
    box-shadow: var(--gov-shadow-md);
}

.btn-secondary {
    background: var(--gov-blue-400);
    color: #FFFFFF;
}

.btn-secondary:hover {
    background: var(--gov-blue-500);
}

/* 저장 버튼 스타일 */
.btn-save {
    background: #8B1A1A;
    color: #FFFFFF;
}

.btn-save:hover {
    background: #6F1414;
    color: #FFFFFF;
    box-shadow: var(--gov-shadow-md);
}

.btn-success {
    background: var(--gov-success);
    color: #FFFFFF;
}

.btn-success:hover {
    background: #218838;
    box-shadow: var(--gov-shadow-md);
}

.btn-warning {
    background: var(--gov-warning);
    color: black;
}

.btn-warning:hover {
    background: #E0A800;
    box-shadow: var(--gov-shadow-md);
}

.btn-info {
    background: var(--gov-blue-light);
    color: var(--gov-blue);
    border: 1px solid var(--gov-blue);
}

.btn-info:hover {
    background: #D4E3F0;
}

.btn-danger {
    background: var(--gov-danger);
    color: #FFFFFF;
}

.btn-danger:hover {
    background: #C82333;
    box-shadow: var(--gov-shadow-md);
}

.btn-outline-primary {
    border: 1.5px solid var(--gov-blue);
    color: var(--gov-blue);
    background: transparent;
}

.btn-outline-primary:hover {
    background: var(--gov-blue);
    color: #FFFFFF;
}

.btn-outline-secondary {
    border: 1.5px solid var(--gov-gray-400);
    color: var(--gov-gray-700);
    background: transparent;
}

.btn-outline-secondary:hover {
    background: var(--gov-gray-400);
    color: #FFFFFF;
}

.btn-sm {
    padding: 6px 12px;
    font-size: 13px;
}

.btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none !important;
}

/* Form Controls */
.form-label {
    font-weight: 500;
    color: var(--gov-gray-800);
    margin-bottom: 8px;
    font-size: 14px;
}

.form-control {
    border: 1px solid var(--gov-gray-300);
    border-radius: 0 !important;
    padding: 10px 14px;
    font-size: 14px;
    transition: all 0.2s ease;
    background: #FFFFFF;
}

.form-control:focus {
    border-color: var(--gov-blue);
    box-shadow: 0 0 0 3px rgba(27, 77, 122, 0.1);
    outline: none;
}

.form-control::placeholder {
    color: var(--gov-gray-400);
}

.form-select {
    border: 1px solid var(--gov-gray-300);
    border-radius: var(--gov-radius-md);
    padding: 10px 14px;
    font-size: 14px;
    transition: all 0.2s ease;
    background: #FFFFFF;
}

.form-select:focus {
    border-color: var(--gov-blue);
    box-shadow: 0 0 0 3px rgba(27, 77, 122, 0.1);
    outline: none;
}

.form-control-sm {
    padding: 6px 10px;
    font-size: 13px;
}

.form-select-sm {
    padding: 6px 10px;
    font-size: 13px;
}

/* Tables */
.table {
    background: #FFFFFF;
    border-radius: var(--gov-radius-md);
    overflow: hidden;
}

.table thead th {
    background: var(--gov-blue);
    color: #FFFFFF;
    border-bottom: 2px solid var(--gov-blue-hover);
    font-weight: 600;
    padding: 12px 16px;
    font-size: 13px;
}

.table tbody td {
    border-bottom: 1px solid var(--gov-gray-200);
    padding: 12px 16px;
    font-size: 14px;
    color: var(--gov-gray-700);
}

.table tbody tr:hover {
    background: var(--gov-gray-50);
}

.table-bordered {
    border: 1px solid var(--gov-gray-300);
}

.table-bordered th,
.table-bordered td {
    border: 1px solid var(--gov-gray-300);
}

.table-light {
    text-align: center;
    background: var(--gov-gray-50);
}

/* Tabs */
.nav-tabs {
    border-bottom: 2px solid var(--gov-gray-300);
    margin-bottom: 24px;
}

.nav-tabs .nav-link {
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--gov-gray-600);
    font-weight: 500;
    padding: 12px 20px;
    margin-right: 8px;
    border-radius: var(--gov-radius-md) var(--gov-radius-md) 0 0;
    transition: all 0.2s ease;
}

.nav-tabs .nav-link:hover {
    color: var(--gov-blue);
    background: var(--gov-blue-light);
    border-bottom-color: transparent;
}

.nav-tabs .nav-link.active {
    color: var(--gov-blue);
    background: transparent;
    border-bottom-color: var(--gov-blue);
    font-weight: 600;
}

/* Alerts */
.alert {
    border-radius: var(--gov-radius-md);
    padding: 14px 18px;
    border: 1px solid;
    font-size: 14px;
    margin-bottom: 16px;
}

.alert-info {
    background: var(--gov-blue-light);
    color: var(--gov-blue);
    border-color: var(--gov-blue);
}

.alert-success {
    background: #D4EDDA;
    color: #155724;
    border-color: #C3E6CB;
}

.alert-warning {
    background: #FFF3CD;
    color: #856404;
    border-color: #FFEAA7;
}

.alert-danger {
    background: #F8D7DA;
    color: #721C24;
    border-color: #F5C6CB;
}

/* Modals */
.modal-content {
    border-radius: var(--gov-radius-lg);
    border: 1px solid var(--gov-gray-300);
    box-shadow: var(--gov-shadow-lg);
}

.modal-header {
    border-bottom: 2px solid var(--gov-blue);
    padding: 20px 24px;
    background: var(--gov-gray-50);
}

.modal-title {
    font-weight: 600;
    color: var(--gov-gray-900);
}

.modal-body {
    padding: 24px;
}

.modal-footer {
    border-top: 1px solid var(--gov-gray-200);
    padding: 16px 24px;
}

/* List Group */
.list-group-item {
    border: 1px solid var(--gov-gray-200);
    border-radius: var(--gov-radius-md);
    margin-bottom: 8px;
    padding: 16px;
    transition: all 0.2s ease;
}

.list-group-item:hover {
    background: var(--gov-gray-50);
    border-color: var(--gov-blue);
}

.list-group-item-action {
    cursor: pointer;
}

/* Form Check */
.form-check {
    padding: 12px 16px;
    border-radius: var(--gov-radius-md);
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

.form-check:hover {
    background: var(--gov-gray-50);
}

.form-check-input {
    width: 18px;
    height: 18px;
    border: 2px solid var(--gov-gray-300);
    border-radius: var(--gov-radius-sm);
    cursor: pointer;
}

.form-check-input:checked {
    background-color: var(--gov-blue);
    border-color: var(--gov-blue);
}

.form-check-label {
    margin-left: 8px;
    font-size: 14px;
    color: var(--gov-gray-800);
    cursor: pointer;
}

/* Spinner */
.spinner-border-sm {
    width: 14px;
    height: 14px;
    border-width: 2px;
}

/* Focus States */
.btn:focus,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 3px rgba(27, 77, 122, 0.1);
}

/* Responsive - Mobile First */
@media (max-width: 576px) {
    html {
        font-size: 14px;
    }

    body {
        background: #F5F5F5;
    }

    .container,
    .container-fluid {
        padding: 12px;
    }

    /* Header */
    .navbar {
        padding: 12px 16px;
    }

    .navbar-brand {
        font-size: 18px;
    }

    /* 헤더 로고 및 타이틀 모바일 */
    .header-logo {
        height: 60px;
    }

    .header-title {
        flex: 1;
        min-width: 0;
    }

    .header-title-main {
        font-size: 18px;
        line-height: 1.3;
    }

    .header-title-sub {
        font-size: 14px;
        line-height: 1.3;
    }

    /* 모바일 헤더 레이아웃 개선 */
    .navbar .container-fluid {
        flex-wrap: wrap;
    }

    .navbar .d-flex.align-items-center.gap-3.flex-grow-1 {
        flex: 1 1 100%;
        margin-bottom: 8px;
    }

    .navbar .d-flex.align-items-center.gap-3:last-child {
        flex: 1 1 100%;
        justify-content: flex-end;
        margin-top: 0;
    }

    .logo-container {
        flex-shrink: 0;
    }

    /* Typography */
    h1 {
        font-size: 22px;
        margin-bottom: 16px;
    }

    h2 {
        font-size: 18px;
        margin-bottom: 12px;
    }

    h5 {
        font-size: 16px;
        margin-bottom: 10px;
    }

    /* Cards */
    .card {
        border-radius: 0 !important;
        margin-bottom: 16px;
    }

    .card-header {
        padding: 12px 16px;
        font-size: 14px;
    }

    .card-body {
        border-radius: 0 !important;
        padding: 16px;
    }

    .card-title {
        font-size: 16px;
        margin-bottom: 12px;
    }

    /* Buttons */
    .btn {
        padding: 10px 16px;
        font-size: 14px;
        width: 100%;
        margin-bottom: 8px;
    }

    .btn:last-child {
        margin-bottom: 0;
    }

    .btn-sm {
        padding: 8px 12px;
        font-size: 12px;
    }

    /* Form Controls */
    .form-label {
        font-size: 13px;
        margin-bottom: 6px;
    }

    .form-control,
    .form-select {
        padding: 10px 12px;
        font-size: 14px;
    }

    .form-control-sm,
    .form-select-sm {
        padding: 6px 8px;
        font-size: 12px;
    }

    /* Tables - Mobile Card View */
    .table-responsive {
        margin: 0;
        padding: 0;
    }

    .table {
        border: none;
        background: transparent;
    }

    .table thead {
        display: none;
    }

    .table tbody {
        display: block;
    }

    .table tbody tr {
        display: block;
        background: #FFFFFF;
        border: 1px solid var(--gov-gray-200);
        border-radius: var(--gov-radius-md);
        margin-bottom: 12px;
        padding: 16px;
        box-shadow: var(--gov-shadow-sm);
        position: relative;
    }

    /* 카드 타이틀 (순번 표시) */
    .table tbody tr:before {
        content: attr(data-card-title);
        display: block;
        font-size: 15px;
        font-weight: 600;
        color: var(--gov-blue);
        margin-bottom: 12px;
        padding-bottom: 12px;
        border-bottom: 2px solid var(--gov-gray-200);
    }

    .table tbody td {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 12px;
        padding: 12px 0;
        border: none;
        border-bottom: 1px solid var(--gov-gray-100);
        font-size: 14px;
    }

    .table tbody td:last-child {
        border-bottom: none;
        padding-top: 12px;
        margin-top: 4px;
        padding-bottom: 0;
    }

    .table tbody td:before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--gov-gray-700);
        font-size: 14px;
        flex-shrink: 0;
        min-width: 100px;
        width: 100px;
    }

    /* 작업 컬럼(마지막 컬럼)은 레이블 숨기기 */
    .table tbody td:last-child:before {
        content: none;
        display: none;
    }

    .table tbody td input,
    .table tbody td select {
        flex: 1;
        margin: 0;
        min-width: auto !important;
    }

    .table tbody td button {
        flex: 0 0 auto;
        margin-top: 0;
        min-width: 60px;
        width: auto;
    }
    
    /* 작업 컬럼(마지막 컬럼)은 버튼을 전체 너비로 */
    .table tbody td:last-child {
        align-items: stretch;
        justify-content: stretch;
        gap: 0;
    }
    
    .table tbody td:last-child button {
        width: 100%;
        flex: 1;
        margin: 0;
    }

    /* 모바일에서 테이블 min-width 제거 (카드 뷰) */
    #artworkTable,
    #awardTable {
        min-width: auto !important;
    }

    /* Tabs */
    .nav-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap;
        margin-bottom: 16px;
    }

    .nav-tabs .nav-item {
        flex-shrink: 0;
    }

    .nav-tabs .nav-link {
        padding: 10px 16px;
        font-size: 13px;
        white-space: nowrap;
    }

    /* Alerts */
    .alert {
        padding: 12px 14px;
        font-size: 13px;
        margin-bottom: 12px;
    }

    /* Modals */
    .modal-content {
        margin: 10px;
        border-radius: var(--gov-radius-lg);
    }

    .modal-header {
        padding: 16px;
    }

    .modal-title {
        font-size: 18px;
    }

    .modal-body {
        padding: 16px;
    }

    .modal-footer {
        padding: 12px 16px;
        flex-direction: column;
    }

    .modal-footer .btn {
        width: 100%;
        margin-bottom: 8px;
    }

    .modal-footer .btn:last-child {
        margin-bottom: 0;
    }

    /* List Group */
    .list-group-item {
        padding: 12px;
        font-size: 13px;
    }

    /* Form Check */
    .form-check {
        padding: 10px 12px;
    }

    .form-check-label {
        font-size: 13px;
    }

    /* Utility Classes */
    .mb-3 {
        margin-bottom: 12px;
    }

    .mb-4 {
        margin-bottom: 16px;
    }

    .mt-3 {
        margin-top: 12px;
    }

    .mt-4 {
        margin-top: 16px;
    }

    /* Button Groups */
    .d-flex.gap-2 {
        gap: 8px;
    }

    .d-flex.flex-wrap {
        flex-wrap: wrap;
    }

    .flex-fill {
        flex: 1 1 auto;
    }

    /* Text */
    .small {
        font-size: 12px;
    }

    .text-muted {
        font-size: 13px;
    }

    /* Row and Column adjustments */
    .row {
        margin-left: -8px;
        margin-right: -8px;
    }

    .row > * {
        padding-left: 8px;
        padding-right: 8px;
    }
}

@media (min-width: 577px) {
    .flex-md-grow-0 {
        flex-grow: 0 !important;
    }
    
    /* 모바일 전환 전까지 테이블 고정 너비 유지 (스크롤 보장) */
    #artworkTable {
        min-width: 1500px;
    }
    
    #awardTable {
        min-width: 1800px;
    }
    
    /* 테이블 셀 padding 조정 */
    .table thead th {
        padding: 10px 12px;
        font-size: 14px;
    }
    
    .table tbody td {
        padding: 8px 12px;
    }
    
    /* 입력 필드 width 넓히기 (height는 form-control-sm 유지) */
    .table tbody td input,
    .table tbody td select {
        width: 100%;
    }
    
    /* PC에서 작업 컬럼 버튼 중앙 정렬 및 크기 유지 */
    .table tbody td:last-child {
        text-align: center;
    }
    
    .table tbody td:last-child button {
        min-width: 60px;
    }
}

@media (min-width: 577px) and (max-width: 768px) {
    .container,
    .container-fluid {
        padding: 20px;
    }

    h1 {
        font-size: 26px;
    }

    .card-body {
        padding: 20px;
    }

    .btn {
        padding: 10px 18px;
        font-size: 14px;
    }

    .table {
        font-size: 13px;
    }

    .nav-tabs .nav-link {
        padding: 12px 18px;
        font-size: 14px;
    }
}

@media (min-width: 769px) {
    /* Desktop styles are already defined above */
}

/* Utility Classes */
.gap-2 {
    gap: 8px;
}

.mb-0 {
    margin-bottom: 0;
}

.mb-2 {
    margin-bottom: 8px;
}

.mb-3 {
    margin-bottom: 16px;
}

.mb-4 {
    margin-bottom: 24px;
}

.mt-2 {
    margin-top: 8px;
}

.mt-3 {
    margin-top: 16px;
}

.mt-4 {
    margin-top: 24px;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.d-flex {
    display: flex;
}

.align-items-end {
    align-items: flex-end;
}

.w-100 {
    width: 100%;
}

.justify-content-between {
    justify-content: space-between;
}