﻿/* 2025.09.16 Minimal patch: invalid 아이콘/파란 포커스 문제만 수정 (그 외 레이아웃/폰트/사이드바는 그대로) */
/* 2025.09.17 Changed: 비번 아이콘 기본 정렬을 텍스트와 동일하게 통일, 오프셋은 data ebv suffix pw 에서만 적용 */

:root {
    --header-h: 64px;
    --footer-h: 40px;
    --sidebar-w: 250px;
    --eb-invalid-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    --bs-form-invalid-bg-image: var(--eb-invalid-icon);
    /* 2025.09.17 Added: 비번 우측 내장 버튼 영역 폭 변수 */
    --ebv-suffix-w: 3.6rem;
}

html, body {
    height: 100%;
    margin: 0;
}

:root {
    --app-font-serif: "Malgun Gothic", "Apple SD Gothic Neo", "Segoe UI", "Helvetica Neue", Arial, system-ui, sans-serif;
    --bs-font-sans-serif: var(--app-font-serif);
    --bs-body-font-family: var(--app-font-serif);
    --bs-heading-font-family: var(--app-font-serif);
}

html, body, button, input, select, textarea {
    font-family: var(--app-font-serif) !important;
    line-height: 1.55;
}

pre, code, kbd, samp {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace !important;
}

body {
    display: grid;
    grid-template-rows: auto 1fr auto;
    overflow-x: hidden;
    overflow-y: hidden;
}

.sticky-top {
    position: sticky;
    top: 0;
    z-index: 1060;
}

#layout-body {
    grid-row: 2;
    min-height: 0;
    display: block;
    padding-left: var(--sidebar-w) !important;
}

#main {
    height: calc(100vh - var(--header-h) - var(--footer-h));
    overflow: auto;
    padding: 1rem;
    box-sizing: border-box;
}

footer.footer {
    grid-row: 3;
    position: relative;
    z-index: 1200;
    background: #fff;
}

/* 사이드바 */
.sidebar-host {
    position: fixed;
    left: 0;
    top: var(--header-h);
    bottom: var(--footer-h);
    width: var(--sidebar-w);
    background: #6c757d;
    border-right: 1px solid #6c757d;
    overflow: auto;
    z-index: 1000;
}

#sidebar-accordion .nav-link {
    display: flex !important;
    align-items: center !important;
    gap: .5rem;
    width: 100% !important;
    padding: .75rem 1rem !important;
    margin: 0 !important;
    background: #6c757d !important;
    color: #fff !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    border: 0 !important;
    box-shadow: none !important;
    background-clip: padding-box !important;
}

#sidebar-accordion hr, #sidebar-accordion .dropdown-divider, #sidebar-accordion .list-group-item {
    display: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

#sidebar-accordion .collapse .nav-link {
    padding-left: calc(1rem + 2.25rem) !important;
}

#sidebar-accordion .nav-link:hover, #sidebar-accordion .nav-link:focus, #sidebar-accordion .nav-link.active {
    background: #4f5b66 !important;
    color: #fff !important;
    outline: none !important;
    box-shadow: none !important;
}

#sidebar-accordion > a.nav-link[aria-expanded="true"]:not(:hover):not(:focus):not(.active) {
    background: #6c757d !important;
    color: #fff !important;
}

#sidebar-accordion .nav-link span {
    flex: 1 1 auto;
    min-width: 0;
}

#sidebar-accordion .nav-link .toggle-icon {
    display: inline-flex !important;
    align-items: center;
    margin-left: auto;
    transition: transform .2s ease;
    opacity: .85;
}

#sidebar-accordion a.nav-link[aria-expanded="true"] .toggle-icon, #sidebar-accordion a.nav-link:not(.collapsed) .toggle-icon {
    transform: rotate(180deg);
}

/* 푸터 */
.app-footer {
    padding-top: .35rem !important;
    padding-bottom: .35rem !important;
    line-height: 1.2;
}

    .app-footer .container {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        gap: .25rem !important;
        flex-wrap: nowrap !important;
    }

        .app-footer .container > * {
            margin-top: 0 !important;
            margin-bottom: 0 !important;
        }

    .app-footer nav {
        display: flex;
        flex-wrap: nowrap !important;
        gap: .25rem !important;
    }

    .app-footer a, .app-footer span {
        line-height: 1.1;
    }

html, body, #main, .sidebar-host {
    overflow-x: hidden !important;
}

/* 모바일 */
@media (max-width: 768px) {
    :root {
        --sidebar-w: 60px;
    }

    #layout-body {
        padding-left: var(--sidebar-w) !important;
    }

    #sidebar-accordion .nav-link {
        justify-content: center !important;
        align-items: center !important;
        gap: 0 !important;
        padding: .75rem 0 !important;
    }

        #sidebar-accordion .nav-link span {
            display: none !important;
        }

        #sidebar-accordion .nav-link .toggle-icon, #sidebar-accordion .nav-link.dropdown-toggle::after {
            display: none !important;
        }

    #sidebar-accordion .collapse .nav-link {
        padding-left: 0 !important;
    }

    footer.app-footer .container, footer.app-footer .container-fluid {
        text-align: initial !important;
    }
}

/* MVC 유효성 기본 출력 숨김 */
.alert.validation-summary-valid {
    display: none !important;
}

.field-validation-valid {
    display: none !important;
}


/* 공통 invalid 아이콘과 여백 */
.form-control.is-invalid,
.form-control.input-validation-error {
    background-image: var(--bs-form-invalid-bg-image) !important;
    background-repeat: no-repeat !important;
    background-position: right .75rem center !important; /* 기본 위치 통일 */
    background-size: 1rem 1rem !important;
    padding-right: 2rem !important;
    background-color: var(--bs-body-bg, #fff) !important;
    border-color: var(--bs-danger, #dc3545) !important;
}

    /* 2025.09.17 Changed: 아래의 기존 password 전용 강제 오프셋은 제거
   input[type="password"].form-control.is-invalid,
   input[type="password"].form-control.input-validation-error,
   .form-control.is-invalid[name="Password"],
   .form-control.input-validation-error[name="Password"] { ... } */

    /* 2025.09.17 Added: 우측 보조버튼이 있을 때만 아이콘 오프셋 적용(옵트인) */
    .form-control.is-invalid[data-ebv-suffix="pw"],
    .form-control.input-validation-error[data-ebv-suffix="pw"] {
        background-position: calc(100% - var(--ebv-suffix-w, 3.6rem)) center !important;
        padding-right: calc(var(--ebv-suffix-w, 3.6rem) + .4rem) !important;
    }

/* 포커스 스타일 */
.form-control:focus {
    background-color: var(--bs-body-bg, #fff) !important;
    box-shadow: none !important;
}

.form-control.is-invalid:focus,
.form-control.input-validation-error:focus {
    border-color: var(--bs-danger, #dc3545) !important;
    box-shadow: 0 0 0 .25rem rgba(220,53,69,.25) !important;
    outline: 0 !important;
}