/* ========================================
   SweetAlert2 커스텀
   ======================================== */
div.swal2-container h2.swal2-title {
    font-size: 20px;
    line-height: 28px;
}

div.swal2-container button.swal2-styled.swal2-confirm {
    background-color: var(--primary);
}

/* ============================================================
   OMS 색상 토큰 — base 기본값(폴백)
   ------------------------------------------------------------
   · company_theme 스키마 기준. custom.css(업체 override)가 최하단에서
     재정의하며, 없거나 값이 빠지면(null) 아래 base로 동작.
   · [Tier 1] 테마 가능 = 스키마 11컬럼과 1:1. 업체가 덮는 색.
   · [Tier 2] 고정 base = 스키마 컬럼 없음(배경·rule-head·상태색·중립·
     사이드바 파생). 업체가 바꾸지 않는다.
   · 새 색은 hex 하드코딩 금지 → 반드시 var(--토큰) 참조.
   ============================================================ */
:root {
    /* ── 브랜드 / 주요(네이비) ────────────────────────────── */
    --primary:            #1f2740;  /* 브랜드 · 주요 액션 · 정보 바 */
    --primary-hover:      #2a3354;  /* 주요 버튼 hover */
    --on-primary:         #ffffff;  /* 네이비 위 글자(값) */
    --on-primary-sub:     #9aa0b8;  /* 네이비 위 보조 라벨 */
    --on-primary-caption: #7a8099;  /* 네이비 위 캡션 */
    --on-primary-line:    rgba(255,255,255,0.16); /* 네이비 위 구분선 */
    --on-primary-nav:     #c2c7d6;  /* 사이드바 기본 메뉴 글자 */
    --on-primary-navsub:  #98a0bb;  /* 사이드바 아이콘/비활성 */

    /* ── 표면(Surface) ────────────────────────────────────── */
    --background:        #f4f4f1;  /* 페이지 배경 */
    --surface:           #ffffff;  /* 카드 · 패널 */
    --surface-sunken:    #faf9f6;  /* 테이블 헤더 · 그리드 배경 */
    --surface-sunken-50: #f5f4f0;  /* 반투명 대체 — 달력 전월/익월 셀 */
    --fill:              #f3f2ee;  /* 옅은 채움(검색창·태그·메뉴 버튼) */
    --mat:               #e7e5df;  /* 문서(인보이스/거래명세서) 뒤 매트 배경 */

    /* ── 테두리 / 구분선 ──────────────────────────────────── */
    --border:        #e0ddd3;  /* 카드 · 인풋 테두리 */
    --border-light:  #ecebe4;  /* 약한 구분선 */
    --border-row:    #f3f2ee;  /* 테이블 행 구분선 */
    /* 강한 헤더 밑줄 전용 — 브랜드색과 분리해 중립 다크로 고정.
     * 브랜드를 바꿔도 데이터 표 헤더선은 브랜드색을 따라가지 않는다. */
    --rule-head:       var(--text);  /* = #20232b 차콜 */
    --scrollbar-thumb: #cdccc4;  /* 스크롤바 thumb */
    --skeleton:        #e9e6dd;  /* 스켈레톤 로딩 자리표시 */

    /* ── 텍스트 ───────────────────────────────────────────── */
    --text:           #20232b;  /* 본문 기본 */
    --text-strong:    #3e404a;  /* 강조 보조 */
    --text-secondary: #5c6068;  /* 본문 보조 */
    --text-muted:     #9a998f;  /* 보조 라벨 · 캡션 */
    --text-faint:     #aeada4;  /* 더 옅은 캡션 */
    --text-disabled:  #c4c3ba;  /* 비활성 글자 */

    /* ── 시맨틱(의미) 색 ──────────────────────────────────── */
    --danger:        #c0473a;
    --danger-bg:     #fbe9e7;
    --danger-border: #f0c5be;  /* 미수 · 삭제 · 경고 */
    --info:          #2f4ad0;
    --info-bg:       #e3e9fb;
    --info-surface:  #fbfcff;  /* 담김 · 활성 강조 · 세트그룹 배경 */
    /* 완료·신제품. 값은 브랜드 심벌의 그린(symbol.png 실측 #2a8e6f)과 동일 —
     * 인쇄 별색 PANTONE 3282 C 와 짝이다(2026-08-05 통일). */
    --success:       #2a8e6f;
    --success-bg:    #e7f3ec;
    --success-bg-40: #eef7f1;  /* -40=근태 오늘 열 연한 강조 */
    --credit:        #7c5cc9;
    --credit-bg:     #efeaf9;  /* 여신(외상) */
    --card:          #0f766e;
    --card-bg:       #dcf1ee;  /* 카드(결제) — 여신과 상반되는 결제구분 */
    /* 결제 CTA — 네이비 요약바 위에서 유일하게 대비가 서는 강조색.
     * 글자는 --primary(네이비) — 오렌지 위 흰 글자는 AA 미달, 네이비는 7:1대. */
    --pay:        #e8a13c;
    --pay-hover:  #d8912c;  /* 결제하기 CTA · 합계금액 강조 */
    --warning:    #d6831a;
    --warning-bg: #fdf3e7;  /* 마감 임박 · 주의 */
    --negative:   #f0a093;  /* 네이비 위 음수(미수금) */
    --cal-sat:    #3a5bd9;  /* 캘린더 토요일(일요일은 --danger 재사용) */
    --notify-dot: #e0533f;  /* 알림 점 */

    /* ── 오버레이 스크림 (신규 보강 — 모달·오버레이 필수) ──── */
    --scrim:        rgba(20,22,30,0.22);  /* 모달 오버레이 스크림 */
    --scrim-strong: rgba(20,22,30,0.42);  /* 강한 스크림(중요 다이얼로그·이미지 뷰어) */

    /* ── 폼 컨트롤 (신규 보강 — 체크박스·라디오 채움색) ────── */
    --control-accent: var(--primary);  /* 브랜드로 통일 · 테마 자동 추종 */

    /* ── 진행 단계 스테퍼(네이비 hero 위) ─────────────────── */
    --step-line:    #3a4366;  /* 대기 연결선(어두운 네이비) */
    --step-pending: #626879;  /* 대기 점 · 라벨 · 'N단계' 캡션 */

    /* ── 서비스 카테고리 액센트(포털 칩) ──────────────────── */
    --svc-order-bg:    #dff0ff;
    --svc-order:       #2863ab;  /* 주문 */
    --svc-edu-bg:      #ffe6e3;
    --svc-edu:         #a03f3c;  /* 동영상교육 */
    --svc-area-bg:     #ddf6e4;
    --svc-area:        #007840;  /* 상권관리 */
    --svc-contract-bg: #eeebff;
    --svc-contract:    #6453a7;  /* 전자계약 */
    --svc-commute-bg:  #fdecd5;
    --svc-commute:     #8d5500;  /* 출퇴근 */
    --svc-survey-bg:   #d4f6f8;
    --svc-survey:      #007780;  /* 설문조사 */
    --svc-qsc-bg:      #fde7fa;
    --svc-qsc:         #8b4486;  /* QSC */

    /* ── 즐겨찾기 ─────────────────────────────────────────── */
    --favorite: #e8a91e;
    --favorite-heart: #c0473a;

    /* ── 품온(Temperature) ────────────────────────────────── */
    --temp-room:      #7b4800;
    --temp-room-bg:   #ffebd2;  /* 실온 */
    --temp-cold:      #00676f;
    --temp-cold-bg:   #d0f7f9;  /* 냉장 */
    --temp-frozen:    #005f8a;
    --temp-frozen-bg: #d4f4ff;  /* 냉동 */

    /* ── 비활성(Disabled) 버튼 ────────────────────────────── */
    --disabled-fill:  #b6b5ad;
    --checkbox-border: #a9a79c;

    --rg-filter-bg:  var(--fill);
    --rg-summary-bg: var(--mat);
    --sidebar-bg:        var(--primary);
    --sidebar-bg-light:  var(--primary-hover);
    --sidebar-bg-dark:   color-mix(in srgb, var(--primary) 82%, #000);
    --sidebar-hover-bg:  var(--primary-hover);
    --sidebar-active-bg: var(--background);
}



/* ========================================
   메인 사이드바
   ======================================== */
.main-menu {
    background: var(--sidebar-bg);
    border-right: none;
}

.main-menu:hover {
    width: 255px;
    overflow: visible;
}

/* 스크롤 버튼 */
.scroll-controls > .scroll-btn {
    width: 100%;
    background-color: var(--sidebar-bg-dark);
    color: var(--on-primary-nav);
    border-top: 1px solid var(--sidebar-bg-light);
}

.scroll-controls > .scroll-btn:hover {
    background-color: var(--sidebar-bg-light);
    color: var(--on-primary);
    border-top: 1px solid var(--sidebar-bg-light);
}

.scroll-controls > .scroll-btn:disabled {
    background-color: var(--sidebar-bg);
    color: var(--sidebar-bg-light);
}

.scroll-controls > .scroll-btn:disabled > i {
    color: var(--sidebar-bg-light);
}

.scrollbar::-webkit-scrollbar {
    width: 4px;
    background-color: transparent;
    border: none;
}

.scrollbar::-webkit-scrollbar-track {
    background-color: var(--sidebar-bg-dark);
    border-radius: 9999px;
}

.scrollbar::-webkit-scrollbar-thumb {
    background-color: var(--sidebar-bg-light);
    border-radius: 9999px;
    -webkit-box-shadow: none;
}

.scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: var(--on-primary-nav);
}

.scrollbar::-webkit-scrollbar-button {
    display: none;
}


/* ========================================
   툴바 레이아웃
   ======================================== */
.title_sch:not(:has(.bookmark)) {
    display: block;
    align-items: center;
    background: var(--fill);
    color: #333 !important;
    padding: 10px 10px 10px 15px;
    justify-content: space-between;
    border: 1px solid var(--border);
    border-radius: 5px;
    width: calc(100% - 27px);
    margin: 5px 0 2px !important;
}

.title_sch:has(.bookmark) {
    display: block;
    align-items: center;
    /* 구 네이비 그라데이션(#0f2a4a→#1b4070) → 브랜드 단색 (custom-sample 검증 후 이관) */
    background: var(--primary);
    color: #fff !important;
    padding: 10px 10px 10px 15px;
    justify-content: space-between;
    border: 1px solid var(--primary-hover);
    border-bottom: 0;
    border-radius: 5px 5px 0 0;
    width: calc(100% - 27px);
    margin-bottom: 0 !important;
}

.title_sch .tool_text {
    width: auto;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 26px;
}

/* 북마크 있음(메뉴 타이틀·남색 배경) → 흰색 글자 */
.title_sch:has(.bookmark) .tool_text {
    color: #fff !important;
}

/* 북마크 없음(섹션 헤더·밝은 배경) → 진회색 글자 */
.title_sch:not(:has(.bookmark)) .tool_text {
    color: #333 !important;
}

/* 매뉴얼 버튼 — 메뉴 제목줄의 즐겨찾기 별 옆.
   .tool_text 는 남색 배경이라 글자색(#fff)을 그대로 물려받는다. */
.manual-link {
    margin-left: 6px;
    cursor: pointer;
    opacity: 0.85;
}

.manual-link:hover {
    opacity: 1;
}

.tool_btn {
    width: auto;
    flex: 1;
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-start;
    flex-wrap: nowrap;
}

.tool_btn .tool_btn_inner,
.tool_btn .tool_btn_inner_sec {
    flex-shrink: 0;
}


/* ========================================
   메인 메뉴 상단 / 네비게이션
   ======================================== */
.main-menu-top {
    border-bottom: 1px solid var(--sidebar-bg-light);
    border-right: 1px solid var(--sidebar-bg-light);
    background: var(--sidebar-bg-dark);
}

.main-menu li>a {
    color: var(--on-primary-nav);
}

.main-menu li:hover>a, nav.main-menu li.active>a {
    color: var(--on-primary);
    background-color: var(--sidebar-hover-bg);
}

.main-menu-top a {
    color: var(--on-primary);
    background-color: var(--sidebar-bg-dark);
    float: left;
    width: 53px;
}

.main-menu-top a:hover {
    color: var(--on-primary);
    background-color: var(--sidebar-bg-light);
}


/* ========================================
   서브 사이드메뉴
   ======================================== */
.side-menu-header-title {
    width: calc(100% - 1px);
    background: var(--sidebar-bg-dark);
    border: none;
    border-left: 2px solid var(--sidebar-bg-light);
    border-top: 1px solid var(--sidebar-bg-light);
}

.side-menu-header-title span {
    color: var(--on-primary);
    font-size: 14px;
}

.side-menu {
    background: var(--sidebar-bg);
    border-right: 1px solid var(--sidebar-bg-dark);
    width: 201px;
}

.content, .container-main {
    transition: left 0s ease;
}

/* 서브 사이드메뉴 항목 */
.side-menu .side-menu-item {
    color: var(--on-primary-nav);
    padding: 0 10px 0 25px !important;
    letter-spacing: -0.6px;
    border-left: 3px solid transparent;
}

/* 아코디언 그룹 내 하위 항목 = navsub(그룹 타이틀보다 한 단계 낮은 톤) */
.menu-group-items .side-menu-item {
    color: var(--on-primary-navsub);
}

.side-menu .side-menu-item.active {
    color: var(--on-primary);
    font-weight: normal;
    background-color: var(--sidebar-bg-light);
    border-left-color: var(--on-primary);
}

.side-menu .side-menu-item.active:hover, .menu-group .side-menu-item:hover {
    color: var(--on-primary) !important;
}

.menu-group-items .side-menu-item::before {
    left: 15px;
    width: 6px;
}

.side-menu .side-menu-trigger:hover, .side-menu-item:hover, .side-menu-pin-trigger:hover {
    color: var(--on-primary);
    background-color: var(--sidebar-hover-bg);
}

.side-menu .side-menu-trigger,
.side-menu .side-menu-pin-trigger {
    color: var(--on-primary-nav);
}


/* ========================================
   서브 사이드 검색박스
   ======================================== */
.search-form input.search-input {
    background: var(--sidebar-bg-dark);
    border: none;
    color: var(--on-primary);
    padding: 0 45px 0 17px;
    width: calc(100% - 60px);
}

.search-form input.search-input::placeholder {
    color: var(--on-primary-nav);
}

.search-form button {
    color: var(--on-primary-nav);
    height: 43px;
    top: 1px;
}

.search-content-title {
    font-size: 12px;
    margin-top: 8px;
    padding: 5px 16px;
    color: var(--on-primary-nav);
    font-weight: normal;
}

.search-content-title::before {
    font-family: "Font Awesome 6 Pro";
    font-weight: 400;
    content: "\f002";
    margin-right: 6px;
}

/* 검색 결과 */
.search-box-result > .search-content ul > li > a.search-content-link {
    width: calc(100% - 30px);
    color: var(--on-primary-nav);
    padding: 10px;
}

.search-box-result > .search-content ul > li > a.search-content-link:hover {
    background: var(--sidebar-bg-dark);
}

.search-box-result > .search-content ul > li > a.search-content-link span {
    color: var(--on-primary);
    letter-spacing: -0.6px;
}

.search-box-result > .search-content ul > li > a.search-content-link h4 {
    color: var(--on-primary-nav);
}

.search-box-result .search-content {
    min-width: 197px;
    border-left: 2px solid var(--sidebar-bg-dark);
}

.search-box-result .search-content::-webkit-scrollbar-thumb {
    background-color: var(--sidebar-bg-light);
}

.search-box-result .search-content::-webkit-scrollbar-thumb:hover {
    background-color: var(--on-primary-nav);
}

.search-box-result .search-content::-webkit-scrollbar-track {
    background-color: var(--sidebar-bg-dark);
}

.search-box-result {
    border-left: 2px solid var(--sidebar-bg-light);
}

.search-box {
    width: calc(100% - 1px);
    border-left: 2px solid var(--sidebar-bg-light);
    height: 45px;
}


/* ========================================
   로고 영역
   ======================================== */
.side-ci {
    background: var(--sidebar-bg-dark);
    width: 201px;
    border: none;
    border-bottom: 1px solid var(--sidebar-bg-light);
}

.side-ci a img {
    padding: 13px 9px;
}

.bookmark {
    margin: 0 0 0 5px;
}


/* ========================================
   컨텐츠 영역
   ======================================== */
.content-header {
    background: var(--surface);
}

.content-header-tab-group .tab-group-btn {
    color: var(--text-secondary);
    border: 1px solid var(--text-secondary);
}

.content-header-tab-group .tab-group-btn:active {
    background-color: var(--fill);
}

.content-header-tab-group .tab-group-btn.selected {
    color: var(--primary);
    border: 1px solid var(--primary);
    background: var(--fill);
}

.content-header-tab-group .tab-group-btn.selected ul li a {
    color: var(--primary);
}

.content-header-tab-group .tab-group-btn.selected ul li a span {
    width: max-content;
    min-width: 100px;
}

.content-header-tab-group .tab-group-btn ul li a {
    color: var(--text-secondary);
}

div.swal2-container button.swal2-styled.swal2-confirm {
    background-color: var(--primary);
}

.popover {
    border-right: 1px solid var(--border);
    margin-left: 0 !important;
}

.popover-menu {
    background: var(--primary) !important;
}

.popover-menu:after {
    border-bottom-color: var(--primary);
}

.popover-btn {
    border-top: 1px solid var(--surface);
}

.title_sch .tool_btn_inner:hover {
    background-color: var(--fill);
    outline: 1px solid var(--text-secondary);
}

.title_sch .tool_btn_inner {
    height: 25px !important;
    border-radius: 5px;
}

input:focus, select:focus {
    outline: 1px solid #3b7ddb;
}

.form_sch_btn:hover, .td_select:hover {
    outline: 1px solid var(--text-secondary);
}

.tool_btn_inner[data-shortcut]::before{
    margin-right: 4px;
}


/* ========================================
   검색 폼 컨트롤 (병합됨)
   ======================================== */
.form_sch_control {
    height: 20px;
    padding: 4px 5px;
    width: 151px;
    border-radius: 5px;
    background: var(--surface-sunken);
    border-color: #dfe2ea;
}

.form_sch_control:focus {
    background: #fff;
    box-shadow: 0 0 0 2.5px rgba(59, 125, 219, .1);
}

/* 버튼 1개 있는 td_sch */
.td_sch:has(button) .form_sch_control {
    width: 108px;
    padding-right: 25px;
    padding-left: 5px;
    margin: 0;
}

/* 버튼 2개 있는 td_sch */
.td_sch:has(button:nth-of-type(2)) .form_sch_control {
    width: 67px;
}

.container_sch table tr td.td_sch span {
    width: 16px;
}

/* 검색 라벨 버튼 (병합됨) */
.sch_from_label_button {
    float: right;
    height: 29px;
    margin: 0;
    margin-top:1px;
    padding: 1px 10px;
    border-radius: 5px;
}

/* 상품 이미지(썸네일) 행 한정: 선택/미리보기 버튼을 파일명 바로 뒤에 왼쪽 정렬로 흐르게.
   전역 float:right 는 미리보기가 없을 때 선택이 td 우측 끝으로 밀려 큰 공백이 생기고,
   미리보기 생성 시 선택 위치가 점프하므로 이 영역만 float:left 로 고정한다.
   (참고) flex/inline-block 은 셀 최소폭을 강제해 table-layout:auto 상 다른 행의 컬럼 정렬을
   흔들므로 사용하지 않는다. float 은 out-of-flow 라 위 품목 행들과 시작 위치가 정렬된다.
   ※ 표시 순서 [선택][미리보기] 는 'JS append 순서 + 이 float:left' 조합으로 성립하므로 함께 유지할 것. */
#item_manage_data_form .td_sch:has(.fileName) .sch_from_label_button {
    float: left;
    margin-left: 5px;
}

/* 상품 이미지 파일명(11)·URL(10) 입력 공통 폭 — 기존 인라인 width:572px 21곳을 중앙화 */
#item_manage_data_form .td_sch:has(.fileName) .fileName,
#item_manage_data_form .td_sch .form_sch_control[name$="FileUrl"] {
    width: 572px;
}

.sch_from_label_button:hover {
    outline: 1px solid var(--text-secondary);
}

.td_sch .sch_from_label_button + .sch_from_label_button {
    margin-right: 3px;
    margin-top: 1px;
    padding: 1px 10px;
    border-radius: 5px;
}

/* 셀렉트 (병합됨) */
.td_select {
    outline: 1px solid var(--border);
    height: 28px;
    width: 100%;
    min-width: 161px;
}

.td_select.required {
    background-image: url(../img/br_down.png) !important;
    background-repeat: no-repeat !important;
    background-position: 95% 50% !important;
    background-size: 10px !important;
}

select {
    background-position: 95% 50%;
}

/* clear 아이콘 (병합됨) */
.clear-icon {
    top: 14px !important;
    right: 7px !important;
    width: 13px !important;
    padding: 4px !important;
    font-size: 12px !important;
}

/* 폼 전체 너비 컨트롤 (병합됨) */
.form_sch_fwc {
    width: calc(100% - 10px) !important;
}


/* ========================================
   메뉴 그룹 (아코디언)
   ======================================== */
.menu-group:first-child {
    border-top: 1px solid var(--sidebar-bg-light);
}

.menu-group-title {
    color: var(--on-primary-nav);
    background-color: var(--sidebar-bg-dark);
    border-bottom: 1px solid var(--sidebar-bg-light);
}

.menu-group-title:hover {
    background-color: var(--sidebar-hover-bg);
    color: var(--on-primary);
    border-left-color: var(--on-primary);
}

.menu-group-title span::before {
    color: var(--on-primary-nav);
}

.menu-group-title:hover span::before {
    color: var(--on-primary);
}

.menu-group-title .menu-group-arrow {
    color: var(--on-primary-nav);
}

.menu-group-title:hover .menu-group-arrow {
    color: var(--on-primary);
}

.menu-group-toggle:checked ~ .menu-group-title {
    background-color: var(--sidebar-bg);
    color: var(--on-primary);
    border-left: 5px solid var(--sidebar-bg-light);
    border-top: 1px solid var(--sidebar-bg-light);
}

.menu-group-toggle:checked ~ .menu-group-title span::before {
    color: var(--on-primary);
}

.menu-group-toggle:checked ~ .menu-group-title .menu-group-arrow {
    color: var(--on-primary);
}

.menu-group-toggle:checked ~ .menu-group-items {
    border-bottom: 1px solid var(--sidebar-bg-light);
}

.menu-group-items {
    background-color: var(--sidebar-bg-dark);
}

.menu-group-items .side-menu-item::before {
    background-color: var(--sidebar-bg-light);
}

.menu-group-items .side-menu-item:hover::before,
.menu-group-items .side-menu-item.active::before {
    background-color: var(--on-primary);
}

.menu-expand-all-btn {
    color: var(--on-primary);
}

.side-menu-items {
    width: calc(100% - 1px);
    background-color: var(--sidebar-bg-dark);
    border-left: 2px solid var(--sidebar-bg-light);
}


/* ========================================
   사이드메뉴 접기/열기
   ======================================== */
.side-menu.open {
    -webkit-transform: translateX(-200px);
    transform: translateX(-200px);
}

.main-menu.open {
    width: 55px;
}

.main-menu .main-menu-top a i {
    transform: rotate(-180deg);
    transition: transform 0.3s ease;
}

nav.main-menu:has(~ section > .side-menu.pinned.open) .main-menu-top a i {
    transform: rotate(0deg);
}

nav.main-menu {
    position: absolute;
}

nav.main-menu .scrollbar:hover {
    overflow-y: auto;
}

.main-menu-top > .side-ci {
    margin: 0 0 0 53px;
}

.main-menu-top > .side-ci a {
    width: 100%;
    cursor: default;
}

.main-menu-top > .side-ci > a:hover {
    color: inherit;
    background-color: var(--sidebar-bg-dark);
}


/* ========================================
   서브메뉴 스크롤
   ======================================== */
.side-menu .side-menu-items {
    overflow-y: auto;
}

.side-menu .side-menu-items::-webkit-scrollbar {
    width: 4px;
}

.side-menu .side-menu-items::-webkit-scrollbar-thumb {
    border-radius: 9999px;
    background-color: var(--sidebar-bg-light);
}

.side-menu .side-menu-items::-webkit-scrollbar-thumb:hover {
    background-color: var(--on-primary-nav);
}

.side-menu .side-menu-items::-webkit-scrollbar-track {
    background-color: var(--sidebar-bg-dark);
}


/* ========================================
   RealGrid 테이블
   ======================================== */
.rg-header .rg-table tr td, .rg-head .rg-table tr td {
    background: var(--surface-sunken);
}

.rg-popup-item:hover, .rg-popup-item-focused {
    background-color: var(--sidebar-bg-dark);
}

.rg-filter .rg-table tr td, .rg-filter-panel-row, .rg-filter-panel-renderer {
    background-color: var(--rg-filter-bg);
}

.rg-header-summary .rg-table tr td, .rg-sum .rg-table tr td {
    background-color: var(--rg-summary-bg);
}


/* ========================================
   daterangepicker 커스텀
   ======================================== */
.daterangepicker {
    border-color: var(--border);
}

.daterangepicker:before {
    border-bottom-color: var(--border);
}

.daterangepicker.drop-up:before {
    border-top-color: var(--border);
}

.daterangepicker td.in-range {
    background-color: var(--fill);
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: var(--primary);
}

.daterangepicker td.off,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date,
.daterangepicker td.off.end-date {
    color: var(--text-secondary);
}

.daterangepicker td.disabled,
.daterangepicker option.disabled {
    color: var(--text-secondary);
}

.daterangepicker td.week,
.daterangepicker th.week {
    color: var(--border);
}

.daterangepicker td.available:hover,
.daterangepicker th.available:hover {
    background-color: #2a5a9c;
}

.daterangepicker select.hourselect,
.daterangepicker select.minuteselect,
.daterangepicker select.secondselect,
.daterangepicker select.ampmselect {
    background: var(--fill);
    border-color: var(--border);
}

.daterangepicker .calendar-time select.disabled {
    color: var(--border);
}

.daterangepicker .drp-buttons {
    border-top-color: var(--border);
}

.daterangepicker .applyBtn {
    background-color: var(--primary);
    border-color: var(--primary);
}

.daterangepicker .cancelBtn, .daterangepicker .applyBtn {
    border-radius: 5px;
}

.daterangepicker .cancelBtn:hover {
    border-color: var(--text-secondary);
    color: var(--text-secondary);
}

.daterangepicker .ranges li:hover {
    background-color: var(--fill);
}

.daterangepicker .ranges li.active {
    background-color: var(--primary);
}

.daterangepicker.show-ranges.single.rtl .drp-calendar.left,
.daterangepicker.show-ranges.single.ltr .drp-calendar.left,
.daterangepicker.show-ranges.rtl .drp-calendar.right,
.daterangepicker.show-ranges.ltr .drp-calendar.left {
    border-color: var(--border);
}


/* ========================================
   두 번째 파일에만 있는 선택자들
   ======================================== */
.container_sch > form > table {
    table-layout: fixed;
}

.container_sch {
    display: block;
    float: left;
    height: fit-content;
    border: 1px solid var(--border);
    border-radius: 0 0 5px 5px;
    color: var(--text);
    background: var(--surface) !important;
    margin-top: 0;
    min-width: initial;
}

/* 멀티코드 피커 */
.multicode-picker {
    height: 28px !important;
    border-radius: 5px!important;
    background: transparent!important;
    border: 0!important;
}

.picker-content {
    flex: none!important;
    width: 155px!important;
    margin-right: 4px!important;
    height: 20px!important;
    outline: 1px solid var(--border)!important;
    border: 0!important;
    float: left!important;
    padding: 4px 3px!important;
    font-size: 11px!important;
    border-radius: 5px!important;
    display: block!important;
    background-color: var(--surface)!important;
    font-weight: normal!important;
}

.picker-content .selected-text {
    float: left !important;
    padding-left: 5px;
}

.placeholder-text {
    float: left !important;
    padding-left: 5px!important;
}

.picker-buttons {
    display: block!important;
}

.picker-buttons > button {
    display: block!important;
}

.dropdown-arrow {
    position: absolute!important;
    right: 39px!important;
    width: 25px!important;
    background: url(../img/br_down.png) no-repeat right!important;
    background-position: 60% 50%!important;
    background-size: 10px!important;
    -webkit-appearance: none!important;
    -moz-appearance: none!important;
    -o-appearance: none!important;
    appearance: none!important;
    border: 0!important;
}

.dropdown-arrow:hover {
    background-color: transparent!important;
}

.dropdown-arrow i {
    display: none!important;
}

.add-btn {
    display: block!important;
    float: right!important;
    padding: 1px 9px!important;
    height: 28px!important;
    text-align: center!important;
    border: 0!important;
    background-color: var(--fill)!important;
    outline: 1px solid var(--border)!important;
    cursor: pointer!important;
    border-radius: 5px!important;
    color: var(--text)!important;
    font-size: 9px!important;
}

.add-btn:hover {
    background-color: inherit!important;
    color: inherit!important;
    outline: 1px solid var(--text-secondary)!important;
}

/* 가상계좌번호 행 — 계좌번호 input 이 남는 폭을 채우고, 발급/해제 버튼은 라벨 길이만큼만 차지한다.
   input 이 310px 고정이던 시절, 라벨이 두 글자 긴 "가상계좌발급 해제" 가 표시되면
   input+버튼 합이 셀 폭을 넘어 버튼이 다음 줄로 밀리며 행이 깨졌다.
   버튼에 display 를 지정하면 .dp_none(display:none) 을 덮어써 숨김 토글이 깨지므로 지정하지 않는다. */
.td_sch:has(.btn_bank_account) .account_no_row {
    display: flex;
    align-items: center;
    gap: 5px;
}

.td_sch:has(.btn_bank_account) .account_no_row .form_sch_control {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
}

.td_sch:has(.btn_bank_account) .account_no_row .sch_from_label_button {
    flex: 0 0 auto;
    float: none;
    margin: 0;
}

.realgrid_main_last table tr td.th_sch {
    line-height: 1.2;
}

#user_info_manage_data_form .form_sch_fwc,
#bizarea_manage_data_form {
    width: 430px !important;
}

#company_manage_data_form .td_sch:has(.form_btn_addr_popup) .form_sch_control {
    width: 363px !important;
}

#company_manage_data_form .td_sch .sch_from_label_button.form_btn_addr_popup {
    margin:0;
}

#bizarea_manage_data_form .td_sch:has(.form_btn_addr_popup) .form_sch_control {
    width: 363px;
}

#bizarea_manage_data_form .td_sch .sch_from_label_button.form_btn_addr_popup {
    margin:0;
}

.td_select {
    padding: 4px 10px;
    border-radius: 5px;
    min-width: 160px;
}


/* ========================================
   검색영역 라벨버튼 폭 조정
   ======================================== */
.td_sch:has(.sch_from_label_button.form_btn_partner_popup) .form_sch_control.auto-clearable {
    width: 97px;
    padding-right: 25px;
    padding-left: 5px;
    margin: 0;
    border-radius: 5px;
}

.td_sch:has(.sch_from_label_button.partner_popup_btn) .form_sch_control.required {
    width: 98px;
    border-radius: 5px;
}

.td_sch:has(.sch_from_label_button) .form_sch_control {
    width: 98px;
}

.td_sch:has(.form_sch_control) .sch_from_label_button {
    height: 28px;
    line-height: 28px;
    margin-top: 0;
}


/* ========================================
   커스텀 체크박스 칩
   ======================================== */
.td_sch {
    position: relative;
    text-align: center;
}

.custom-checkbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
    margin: 0;
}

/* pill 체크박스: 네이티브 input 이 라벨(pill) 전체를 덮어 클릭되도록.
   root.css 의 옛 .custom-checkbox{width:14px;height:14px} 가 이겨 input 이 16px 로 줄어
   pill 위를 못 덮어 클릭 안 되던 버그 수정 (고특이도로 오버라이드 방지). */
.custom-checkbox:has(+ .custom-label) {
    width: 100%;
    height: 100%;
}

.custom-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 13px 5px 10px;
    border-radius: 10px;
    border: 1px solid #dde0e8;
    background: var(--surface-sunken);
    font-size: 12px;
    color: #5a6070;
    cursor: pointer;
    transition: all .18s ease;
    user-select: none;
    min-width: 50px;
}

.custom-label:hover {
    background: #edf1f7;
    border-color: #c0c6d2;
}

.custom-label::before {
    content: '';
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1.5px solid #c0c6d2;
    background: #fff;
    transition: all .18s ease;
}

.custom-checkbox:checked + .custom-label {
    background: #e8eef7;
    border-color: #a3b8d8;
    color: #0f2a4a;
    font-weight: 600;
}

.custom-checkbox:checked + .custom-label::before {
    background: #0f2a4a;
    border-color: #0f2a4a;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.5 6L5 8.5L9.5 3.5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-size: 10px;
    background-position: center;
    background-repeat: no-repeat;
}


/* ========================================
   subtitle_sch (서브 타이틀 바)
   ======================================== */
.subtitle_sch {
    background: var(--fill);
    padding: 10px 0;
    display: block;
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--border);
    border-bottom: 0;
    border-radius: 10px 10px 0 0;
    width: calc(100% - 1px);
    margin-bottom: 0 !important;
}

.subtitle_sch table {
    float: left;
    width: 1160px !important;
    border: 0;
    margin: 10px 15px 10px 10px;
}

/*.subtitle_sch ~ .realgrid_main .rg-grid {
    border-radius: 0;
}*/

.subtitle_sch table tr .th_sch {
    font-style: normal;
    font-weight: normal;
    color: #333;
    padding: 0 5px 0 0;
}

.container_sch table tr td.th_sch {
    font-style: normal;
    font-weight: bold;
    color: #333;
}


/* ========================================
   툴바 버튼 구분선
   ======================================== */
.title_sch:has(.tool_btn .tool_btn) .tool_btn:has(> button) > .tool_btn::before {
    content: '';
    display: inline-block;
    width: 1px;
    height: 15px;
    background: #d0cfcf;
    margin: 5px 3px 5px 7px;
    vertical-align: middle;
}


/* ========================================
   탭 활성 컨테이너 내 title_sch 리셋
   ======================================== */
.tab-active-container > .title_sch {
    background: transparent;
    color: #333 !important;
    padding: 0;
    align-items: center;
    justify-content: space-between;
    border: 0;
    border-bottom: 0;
    border-radius: 10px 10px 0 0;
    width: calc(100%);
    margin-bottom: 0 !important;
    display: block;
}


/* ========================================
   기타 추가 룰
   ======================================== */
.realgrid_main_grid_right {
    height: calc(100vh - 90px);
}

#price_sd_bulk_manage_form .td_sch:has(.sch_from_label_button) .form_sch_control {
    width: 94px;
}

nav.main-menu.clicked {
    width: 55px !important;
    overflow: hidden !important;
    transition: width 0.2s ease;
}

nav.main-menu.clicked ~ section .side-menu.pinned.open {
    transform: translateX(-200px);
    z-index: 999;
}

body:has(.side-menu.pinned.open:hover) .side-menu.pinned.open {
    transform: translateX(-200px);
    z-index: 999;
}

.btn_pw_change {
    padding: 7px 12px !important;
    font-weight: bold !important;
    font-size: 10px !important;
    height: 30px !important;
    text-align: center;
    border: 0;
    background-color: #f7f7f7;
    outline: 1px solid #bbb;
    margin-left: 5px;
    cursor: pointer;
    border-radius: 4px;
}

.tabs {
    gap: 3px;
    padding: 2px 10px 0 0;
}

.tab-item {
    border-radius: 5px 5px 0 0;
}

hr:has(+ .tab-container-dom .subtitle_sch) {
    display: none;
}

/* 전자세금계산서 전송 그리드 — 행 상태별 셀 스타일 (색과 취소선 분리해 조합) */
.cell-strike {
    text-decoration: line-through;
}
.cell-deleted {
    color: #b0b0b0;
}
.cell-issued {
    color: #0d6efd;
}
.cell-error {
    color: #dc3545;
}

/* ════════════════════════════════════════════════════════════
   [재작업 복구] 전역 표준 + 클레임 3종 — 2026-07-15
   ════════════════════════════════════════════════════════════ */

/* ── 전역: 그리드 외부 네이티브 스크롤바 디자인 ── */
*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
*::-webkit-scrollbar-thumb {
    background: #c8cfda;
    border-radius: 8px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover {
    background: #aab4c4;
    background-clip: padding-box;
}
*::-webkit-scrollbar-track {
    background: transparent;
}

/* ── 전역: 기간(daterange/DateTimeRange) 입력 텍스트 가운데 정렬 ── */
input[name*="daterange" i],
input[name*="dateRange"],
input[id*="daterange" i],
input[id*="dateRangePicker" i] {
    text-align: center;
}

/* ── 전역: select 드롭다운 옵션 크기 — 고배율(DPR2) 환경에서 과대 표시 방지 ── */
select option {
    font-size: 12px;
}

/* ── 검색영역 체크박스+라벨 한 줄 (칩 라벨은 inline-flex 필요 → 제외) ── */
.container_sch .th_sch:has(input[type="checkbox"]) {
    white-space: nowrap;
}
.container_sch input[type="checkbox"] {
    vertical-align: middle;
}
.container_sch input[type="checkbox"] + label:not(.custom-label),
.container_sch label + input[type="checkbox"] {
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap;
}

/* ════════════════════════════════════════════════════════════
   체크박스 전역 표준
   - 박스: 16px, 테두리 var(--checkbox-border), 라운드 3px
   - 체크 시: var(--primary) 채움 + 흰 SVG 체크 (검색영역 칩의 웰과 동일 언어)
   - 라벨 위치: 박스 왼쪽 · 라벨 오른쪽 (마크업 표준)
   ════════════════════════════════════════════════════════════ */
input.custom-checkbox {
    appearance: none;
    width: 16px;
    height: 16px;
    border: 1px solid var(--checkbox-border);
    border-radius: 3px;
    background-color: #fff;
    vertical-align: middle;
    cursor: pointer;
}
input.custom-checkbox:checked {
    background-color: var(--primary);
    border-color: var(--primary);
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.5 6L5 8.5L9.5 3.5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-size: 10px;
    background-position: center;
    background-repeat: no-repeat;
}
/* root.css 의 옛 스트로크(#333 회전 바) 체크 제거 — 흰 SVG 체크로 통일 */
input.custom-checkbox:checked::before,
input.custom-checkbox:checked::after {
    display: none;
}
/* 네이티브 체크박스(재고현황/채권제한/단가승인/물건관리/팝업 등)도 같은 색 언어와 크기 */
input[type="checkbox"]:not(.custom-checkbox):not(.menu-group-toggle) {
    accent-color: var(--primary);
    width: 15px;
    height: 15px;
    vertical-align: middle;
    margin-top: -2px;
    cursor: pointer;
}
/* 체크박스와 연결된 라벨도 포인터 커서: 감싸는 라벨 / 바로 옆 라벨 / span 래퍼(QC식) 뒤 라벨 */
label:has(input[type="checkbox"]),
input[type="checkbox"] + label,
span:has(> input.custom-checkbox) + label {
    cursor: pointer;
}
/* 검색영역 칩의 웰 체크색도 표준 남색으로 통일(기존 #0f2a4a 오버라이드) */
.td_sch .custom-checkbox:checked + .custom-label::before {
    background-color: var(--primary);
    border-color: var(--primary);
}

/* ════════════════════════════════════════════════════════════
   클레임 3종(품질/배송/QC) — 상세 패널 디자인 표준화
   품질=fms/bmr/rtnApprovalManage(#rtnApprovalManageGrid),
   배송=fms/bor/rtnLogisApprovalManage, QC=fms/bor/rtnQcApprovalManage
   (rtnClaimRegistration 은 동일 구조의 다른 화면 — 함께 스코프)
   ════════════════════════════════════════════════════════════ */

/* 1) 상세 패널 내부 스크롤(그리드와 같은 높이 유지, 내용 넘치면 패널 안에서 스크롤) */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last,
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last {
    overflow-y: auto;
    overflow-x: hidden;
    margin-left: 0 !important; /* root.css 기본 5px — 검색영역 좌측선과 정렬 */
}
/* 패널 padding: QC(박스로 시작)는 위 8px, 품질/배송(툴바로 시작)은 위 0 — 툴바 상단 밀착 */
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last {
    padding: 8px 10px;
    box-sizing: border-box; /* 인라인 고정폭에 padding 가산 방지 */
}
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last {
    padding: 0 10px 8px;
    box-sizing: border-box;
}
/* 최상단 첫 item_grid(진행상태 툴바 래퍼)와 툴바 자체의 위 마진 제거 → 패널 상단 밀착 */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last form > .item_grid:first-child,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last form > .item_grid:first-child,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last form > .item_grid:first-child {
    margin-top: 0 !important;
}
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last form > .item_grid:first-child > .title_sch,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last form > .item_grid:first-child > .title_sch,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last form > .item_grid:first-child > .title_sch {
    margin-top: 0 !important;
}

/* 2) 폼 행 밑줄 제거(입력박스가 이미 행을 구분) + 행 상하 간격 통일 */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last table tr:not(.section-header) > td,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last table tr:not(.section-header) > td,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last table tr:not(.section-header) > td,
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last .tab-content table tr:not(.section-header) > td {
    border-bottom: 0 !important;
    padding-top: 3px;
    padding-bottom: 3px;
}

/* 3) 섹션 헤더(기본정보/원 주문정보/반품요청 정보/접수정보): 검정 밑줄 → 표준 섹션 바.
   상하 라인은 inset shadow 로 그려 위 간격 밴드(border-top 흰색)와 공존 */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last tr.section-header > td,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last tr.section-header > td,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last tr.section-header > td,
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last tr.section-header > td {
    background: var(--fill);
    background-clip: padding-box;
    border: 0 !important;
    box-shadow: inset 0 1px 0 var(--border), inset 0 -1px 0 var(--border);
    color: var(--primary);
    font-weight: bold;
    padding: 6px 8px !important;
    text-align: left !important;
    white-space: nowrap;
}
/* 첫 섹션을 제외한 섹션 바 위에 8px 간격(흰 밴드) — 위 입력행과 붙지 않게 */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last tr.section-header:not(:first-child) > td,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last tr.section-header:not(:first-child) > td,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last tr.section-header:not(:first-child) > td,
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last tr.section-header:not(:first-child) > td {
    border-top: 8px solid #fff !important;
}

/* 4) 상세 표 좌우 여백 정규화: root.css 기본 margin(5px 15px 5px 5px) → 상하만.
   툴바(792px)와 표(792px)의 시작/끝 선 일치. QC 는 반품정보 탭 폼 표에만 적용 */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last table,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last table,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last table,
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last .tab-content table {
    margin: 5px 0 !important;
}

/* ════════════════════════════════════════════════════════════
   물건관리(opr/bop/siteManage, #siteManageGrid) 상세폼:
   품질클레임관리(rtnApprovalManage)와 동일한 표준 섹션 바로 정규화.
   (5개 섹션이 각각 별도 <table> — 섹션 간격은 표 margin으로 처리)
   ════════════════════════════════════════════════════════════ */
/* 폼 행 밑줄 제거(입력박스가 이미 행 구분) + 상하 간격 통일 */
.tab-main-container:has(#siteManageGrid) .realgrid_main_last table tr:not(.section-header) > td {
    border-bottom: 0 !important;
    padding-top: 3px;
    padding-bottom: 3px;
}
/* 섹션 헤더: 검은 밑줄(#333) → 표준 섹션 바(var(--fill) + inset 상하 라인).
   모든 바(텍스트/버튼) 높이 32px 고정 + 수직 중앙정렬로 균일 */
.tab-main-container:has(#siteManageGrid) .realgrid_main_last tr.section-header > td {
    background: var(--fill);
    background-clip: padding-box;
    border: 0 !important;
    box-shadow: inset 0 1px 0 var(--border), inset 0 -1px 0 var(--border);
    color: var(--primary);
    font-weight: bold;
    height: 32px;
    padding: 0 8px !important;
    text-align: left !important;
    white-space: nowrap;
    vertical-align: middle;
}
/* 상권분석 섹션의 지도 버튼 셀은 우측 정렬 유지 */
.tab-main-container:has(#siteManageGrid) .realgrid_main_last tr.section-header > td:nth-child(2) {
    text-align: right !important;
}
/* 지도 버튼: 첨부파일 추가/삭제 버튼과 동일 스타일(#f7f7f7·검정·radius5·h25·outline 1px #bbb) */
.tab-main-container:has(#siteManageGrid) .realgrid_main_last tr.section-header .tool_btn_inner {
    padding: 5px 7px !important;
    font-size: 10px;
    font-weight: 700;
    height: 25px;
    line-height: 11.5px;
    border: 0 !important;
    border-radius: 5px;
    background: #f7f7f7;
    color: #000;
    outline: 1px solid #bbb;
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
}
.tab-main-container:has(#siteManageGrid) .realgrid_main_last tr.section-header .tool_btn_inner:hover {
    background-color: var(--fill);
    outline: 1px solid var(--text-secondary);
}
/* 섹션(각 표): 패널 폭 채움(첨부파일 그리드와 우측 정렬) + 섹션 간 상하 여백 8px */
.tab-main-container:has(#siteManageGrid) .realgrid_main_last table {
    width: 100% !important;
    table-layout: fixed;
    margin: 4px 0 !important;
}
/* 첨부파일 헤더(title_sch)도 동일한 섹션 바로 통일 (라벨 좌측 + 추가/삭제 우측, 폭·높이 일치) */
.tab-main-container:has(#siteManageGrid) .realgrid_main_last > .title_sch {
    background: var(--fill);
    box-shadow: inset 0 1px 0 var(--border), inset 0 -1px 0 var(--border);
    color: var(--primary);
    width: 100% !important;
    height: 32px;
    min-height: 32px;
    padding: 0 8px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}
.tab-main-container:has(#siteManageGrid) .realgrid_main_last > .title_sch .tool_text {
    color: var(--primary);
    font-weight: bold;
}

/* 5) 진행상태 툴바: 표와 같은 폭(792px)·같은 좌우선, 텍스트 시작선(8px)은 섹션 바와 일치.
   root.css 고정 height:25px + border-box 조합의 붕괴 방지를 위해 height:auto 필수 */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last .item_grid > .title_sch,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last .item_grid > .title_sch,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last .item_grid > .title_sch {
    width: 792px !important;
    box-sizing: border-box;
    height: auto !important;
    padding: 10px 8px !important;
}

/* 6) 툴바/상태영역 체크박스 배치 보정 — 시각 표준은 전역(input.custom-checkbox) 규칙이 담당 */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last .title_sch input.custom-checkbox,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last .title_sch input.custom-checkbox,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last .title_sch input.custom-checkbox {
    margin: 0 5px 0 0;
    flex: 0 0 auto;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last input.custom-checkbox {
    flex: 0 0 auto;
}

/* 7) 패널 폼 입력 폭 통일: 고정폭(161/677px) 대신 자기 셀을 정확히 채움 — 우측 끝선이 열 그리드에 정렬 */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last table td input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last table td input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last table td input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last table td input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last table td textarea,
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last table td textarea,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last table td textarea,
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last table td textarea {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100% !important;
}
/* border-box 전환으로 줄어드는 입력 높이 보정: 타 화면 입력(20px+패딩 8px)과 동일한 28px */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last table td input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last table td input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last table td input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last table td input.form_sch_control:not([type="hidden"]) {
    height: 28px !important;
}
/* 돋보기 버튼이 같이 있는 셀(접수자/승인자/매입거래처 등): 버튼 폭만큼 입력을 줄여 버튼 끝선을 열 선에 */
.tab-main-container:has(#rtnApprovalManageGrid) .realgrid_main_last table td:has(button.sch_from_label_button) input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnClaimRegistrationGrid) .realgrid_main_last table td:has(button.sch_from_label_button) input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnLogisApprovalManageGrid) .realgrid_main_last table td:has(button.sch_from_label_button) input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#rtnQcApprovalManageGrid) .realgrid_main_last table td:has(button.sch_from_label_button) input.form_sch_control:not([type="hidden"]) {
    width: calc(100% - 31px) !important;
}

/* 8) 코멘트 textarea 표준 입력 톤 + 피드 박스/섹션 간격 */
.tab-main-container:has(#rtnApprovalManageGrid) textarea,
.tab-main-container:has(#rtnClaimRegistrationGrid) textarea,
.tab-main-container:has(#rtnLogisApprovalManageGrid) textarea,
.tab-main-container:has(#rtnQcApprovalManageGrid) textarea {
    border: 1px solid #bbb;
    border-radius: 5px;
    padding: 6px 8px;
    font-size: 12px;
    color: #333;
}
.tab-main-container:has(#rtnApprovalManageGrid) .item_grid,
.tab-main-container:has(#rtnQcApprovalManageGrid) .item_grid,
.tab-main-container:has(#rtnClaimRegistrationGrid) .item_grid,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .item_grid {
    margin-top: 8px;
}
.tab-main-container:has(#rtnApprovalManageGrid) .no-feed-box,
.tab-main-container:has(#rtnQcApprovalManageGrid) .no-feed-box,
.tab-main-container:has(#rtnClaimRegistrationGrid) .no-feed-box,
.tab-main-container:has(#rtnLogisApprovalManageGrid) .no-feed-box {
    border-color: var(--border);
    background: var(--surface-sunken);
    color: #5a6070;
}

/* ── QC 클레임 관리 전용 ────────────────────────────── */

/* 반품정보(info_item) 표준 박스 — 코멘트 카드(자체 카드 스타일)는 제외 */
.tab-main-container:has(#rtnQcApprovalManageGrid) .qc_grid_item .info_item {
    border: 1px solid var(--border);
    border-radius: 5px;
    background: #fff;
    padding: 10px 12px 5px;
    margin-bottom: 8px;
}
/* 바깥 카드(qc_grid_item)의 자체 테두리/그림자/padding 제거 — 이중 박스 방지 */
.tab-main-container:has(#rtnQcApprovalManageGrid) .qc_grid_item {
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    margin-bottom: 8px;
}
/* 반품정보 리스트: 명시적 2열(라벨80px+값 ×2) 그리드 — wrap 어긋남 방지. ul 내부 hr 은 전체 폭 */
.tab-main-container:has(#rtnQcApprovalManageGrid) .qc_grid_item .info_item ul {
    display: grid;
    grid-template-columns: 80px 1fr 80px 1fr;
    column-gap: 8px;
    align-items: center;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) .qc_grid_item .info_item ul > hr {
    grid-column: 1 / -1;
    width: 100%;
    margin: 4px 0;
    border: 0;
    border-top: 1px solid var(--border-light);
    float: none;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) .qc_grid_item .info_item .item_title {
    flex: none;
    padding: 6px 0;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) .qc_grid_item .info_item .item_content {
    flex: none;
    width: auto;
    max-width: none;
    padding: 6px 8px 6px 0;
    margin: 0;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) .qc_grid_item .info_item .item_content.max_content {
    grid-column: 2 / -1;
}
/* 양 탭 콘텐츠 래퍼 폭을 상세 표와 동일한 792px 로 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .flex.flex-col,
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab2 .flex.flex-col {
    width: 792px;
}
/* 상태영역 hr 제거(체크박스 행-QC담당부서 행 사이) */
.tab-main-container:has(#rtnQcApprovalManageGrid) .qc_stat_group hr {
    display: none;
}
/* QC 관리 탭: 좌측 영역(패널) 전체가 하나로 스크롤 — root.css 클리핑/고정높이 해제 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 {
    overflow: visible !important;
    height: auto !important;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .qc_grid_half {
    overflow: visible !important;
    height: auto !important;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .tab-content-main {
    height: auto !important;
    float: none;
}
/* 좌(피드)/우(입력 카드) 정렬: 간격 10px, 같은 높이. 고정 calc 높이 해제 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .item_grid.tool_btn_main {
    display: flex;
    gap: 10px;
    align-items: stretch;
    height: auto !important;
}
/* 우측 입력 영역(스텝퍼~코멘트)을 표준 카드로 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .qc_grid_half + .qc_grid_half {
    border: 1px solid var(--border);
    border-radius: 5px;
    background: #fff;
    padding: 10px 12px;
    box-sizing: border-box;
}
/* 스텝퍼(등록~완료/저장) 아래 구분선으로 카드 헤더화 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .status_group {
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-light);
    margin-bottom: 4px;
}
/* QC담당부서 입력: 고정 100px → 남는 폭 채움 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .qc_stat_group .status_select input.form_sch_control {
    flex: 1 1 auto;
    width: auto !important;
}
/* 코멘트 영역: float 아래로 내려 전체 폭 확보 + 내부 float 버튼 클리어픽스 (BFC 금지) */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .item_comment {
    clear: both;
    width: 100%;
    margin-top: 8px;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .item_comment_textarea::after {
    content: "";
    display: block;
    clear: both;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .item_comment_textarea textarea {
    width: 100%;
    box-sizing: border-box;
}
/* 첨부파일 행: 고정 343px → 카드 폭 채움, 라벨/버튼 줄바꿈 방지, 높이 28px 통일 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .item_comment_textarea .fileBox {
    width: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 6px;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .item_comment_textarea .fileBox b {
    flex: 0 0 auto;
    white-space: nowrap;
    font-size: 12px;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .item_comment_textarea .fileBox .fileName {
    flex: 1 1 auto;
    height: 28px;
    box-sizing: border-box;
    margin-left: 0;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .item_comment_textarea .fileBox .btn_file {
    flex: 0 0 auto;
    white-space: nowrap;
    height: 28px;
    line-height: 26px;
    padding: 0 10px;
    box-sizing: border-box;
    margin-left: 0;
}
/* 좌측 빈 상태 박스: 우측 카드와 같은 높이로 채우고 문구 중앙 정렬 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .qc_grid_half > .no-feed-box {
    height: 100%;
    box-sizing: border-box;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .qc_grid_half > .no-feed-box ul {
    justify-content: center;
}
/* 코멘트 카드 내부를 카드 폭에 맞게: 작성자(좌)+날짜(우) 한 줄, 내용·삭제버튼 전체 폭 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .comment_item .item_title {
    flex: 1 1 auto;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .comment_item .item_date {
    flex: 0 0 auto;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .comment_item .item_content,
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .comment_item .item_content.max_content {
    flex: 1 1 100%;
    width: auto;
    max-width: none;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .comment_item .comment_edit {
    width: 100%;
    margin: 0;
}
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .comment_item .item_content .item_grid {
    width: 100%;
    float: none;
}
/* 레이아웃 잔재 제거: 내용 없는 100vh 빈 컬럼(tab-content-main 직속, 인라인 display:flex) 숨김 */
.tab-main-container:has(#rtnQcApprovalManageGrid) #tab1 .tab-content-main > .flex.flex-col {
    display: none !important;
}

/* ════════════════════════════════════════════════════════════
   상담관리(opr/bop/consultManage, #consultManageGrid):
   QC 클레임 관리(rtnQcApprovalManage)와 동일한 상세 카드/info_item 스타일로 정규화.
   (탭 없음 — QC의 #tab1 자리에 .tab-content-main 직접)
   ════════════════════════════════════════════════════════════ */
/* 내용 없는 100vh 빈 컬럼 제거 */
.tab-main-container:has(#consultManageGrid) .tab-content-main > .grid-main > .flex.flex-col + .flex.flex-col {
    display: none !important;
}
/* 콘텐츠 컬럼이 패널 폭을 채움(고정 700px → 우측 그리드와의 빈 여백 제거) */
.tab-main-container:has(#consultManageGrid) .tab-content-main > .grid-main > .flex.flex-col:first-child {
    width: 100% !important;
    box-sizing: border-box;
}
/* info_item 표준 박스 */
.tab-main-container:has(#consultManageGrid) .qc_grid_item .info_item {
    border: 1px solid var(--border);
    border-radius: 5px;
    background: #fff;
    padding: 10px 12px 5px;
    margin-bottom: 8px;
}
/* 바깥 카드(qc_grid_item) 이중 박스 방지 */
.tab-main-container:has(#consultManageGrid) .qc_grid_item {
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    margin-bottom: 8px;
}
/* info_item: root.css 고정폭(60/230/255/580px) 대신 카드 폭에 비례하는 flex로 채움
   (라벨 80px + 값이 각 50%씩 → 2열이 카드 전체 폭을 채워 정렬) */
.tab-main-container:has(#consultManageGrid) .qc_grid_item .info_item ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.tab-main-container:has(#consultManageGrid) .qc_grid_item .info_item ul > hr {
    flex: 0 0 100%;
    width: 100%;
    height: 1px;
    margin: 4px 0;
    border: 0;
    border-top: 1px solid var(--border-light);
    background: none;
    float: none;
}
.tab-main-container:has(#consultManageGrid) .qc_grid_item .info_item .item_title {
    flex: 0 0 80px;
    box-sizing: border-box;
    padding: 6px 0 !important;
}
.tab-main-container:has(#consultManageGrid) .qc_grid_item .info_item .item_content {
    flex: 0 0 calc(50% - 80px);
    box-sizing: border-box;
    width: auto;
    max-width: none;
    padding: 6px 8px 6px 0 !important;
    margin: 0;
}
.tab-main-container:has(#consultManageGrid) .qc_grid_item .info_item .item_content.right-content {
    flex: 0 0 calc(50% - 80px);
}
/* 전체폭 값(max_content / 주소 colspan3): 한 줄 전체 채움 */
.tab-main-container:has(#consultManageGrid) .qc_grid_item .info_item .item_content.max_content,
.tab-main-container:has(#consultManageGrid) .qc_grid_item .info_item .item_content[colspan="3"] {
    flex: 0 0 100%;
}
/* 연결 물건 제목(detail-section-title): 회색 #f0f0f0 → 표준 섹션 바 헤더 */
.tab-main-container:has(#consultManageGrid) .detail-section-title {
    background: var(--fill) !important;
    box-shadow: inset 0 1px 0 var(--border), inset 0 -1px 0 var(--border);
    color: var(--primary);
    padding: 6px 8px !important;
    border-radius: 5px 5px 0 0;
}
/* 연결 물건 헤더 버튼: 표준 버튼 톤(#f7f7f7·outline #bbb) */
.tab-main-container:has(#consultManageGrid) .detail-section-title .tool_btn_inner {
    padding: 4px 8px;
    font-size: 11px;
    font-weight: 700;
    background: #f7f7f7;
    color: #000;
    border: 0;
    border-radius: 5px;
    outline: 1px solid #bbb;
    margin-left: 4px;
    cursor: pointer;
}
/* consultSiteBox: 헤더 바로 아래 info_item을 헤더와 연결(상단 라운드 제거) */
.tab-main-container:has(#consultManageGrid) #consultSiteBox .info_item {
    border-radius: 0 0 5px 5px;
    border-top: 0;
}
/* item_grid(상담이력+입력) 상단 간격 */
.tab-main-container:has(#consultManageGrid) .item_grid {
    margin-top: 8px;
}
/* no-feed-box 톤(테두리 카드) */
.tab-main-container:has(#consultManageGrid) .no-feed-box {
    border: 1px solid var(--border);
    border-radius: 5px;
    background: var(--surface-sunken);
    color: #5a6070;
}
/* 좌(이력)/우(입력) 정렬: flex 10px gap, 같은 높이 */
.tab-main-container:has(#consultManageGrid) .item_grid.tool_btn_main {
    display: flex;
    gap: 10px;
    align-items: stretch;
    height: auto !important;
}
/* qc_grid_half: root.css height:100%(→stretch 무력화) 해제 → align-items:stretch로 좌우 같은 높이 */
.tab-main-container:has(#consultManageGrid) .item_grid.tool_btn_main .qc_grid_half {
    height: auto !important;
    overflow: visible !important;
}
/* 우측 입력 카드 */
.tab-main-container:has(#consultManageGrid) .qc_grid_half + .qc_grid_half {
    border: 1px solid var(--border);
    border-radius: 5px;
    background: #fff;
    padding: 10px 12px;
    box-sizing: border-box;
}
/* 좌측 빈 이력 박스: 우측 카드와 같은 높이 + 문구 중앙정렬 */
.tab-main-container:has(#consultManageGrid) .qc_grid_half > .no-feed-box {
    height: 100%;
    box-sizing: border-box;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* 상태 탭 그룹 아래 구분선(카드 헤더화) */
.tab-main-container:has(#consultManageGrid) .status_group {
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-light);
    margin-bottom: 8px;
}
/* textarea 표준 입력 톤 — form_sch_control의 outline과 중복되지 않게 border 제거(이중선 방지) */
.tab-main-container:has(#consultManageGrid) textarea {
    border: 0;
    outline: 1px solid #bbb;
    border-radius: 5px;
    padding: 6px 8px;
    font-size: 12px;
    color: #333;
}
/* 입력 카드 폼: 인풋/셀렉트/textarea 고정폭(262/272px) → 셀 채움(카드 초과로 라벨 세로줄바꿈되던 것 해소) */
.tab-main-container:has(#consultManageGrid) .qc_grid_half table td input.form_sch_control:not([type="hidden"]),
.tab-main-container:has(#consultManageGrid) .qc_grid_half table td textarea,
.tab-main-container:has(#consultManageGrid) .qc_grid_half table td select {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100% !important;
}
/* 라벨 셀은 한 줄 유지 */
.tab-main-container:has(#consultManageGrid) .qc_grid_half table td.th_sch {
    white-space: nowrap;
}
/* 인풋 높이 28px 통일(form_sch_control 기본 20px → 상담유형 select 28px과 정렬). textarea 제외 */
.tab-main-container:has(#consultManageGrid) .qc_grid_half table td input.form_sch_control:not([type="hidden"]) {
    height: 28px !important;
}
/* 상담내용 저장 / 이력 삭제 버튼: 200px 중앙 고정 → 카드 폭 채움 */
.tab-main-container:has(#consultManageGrid) .qc_grid_half .form_btn_hst_save,
.tab-main-container:has(#consultManageGrid) .qc_grid_half .comment_edit,
.tab-main-container:has(#consultManageGrid) .qc_grid_half .comment_edit button {
    width: 100% !important;
    box-sizing: border-box;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
/* 상담이력(comment_item): root.css 고정폭(제목215·날짜80·내용290·max_content295px) → 카드 폭 채움 */
.tab-main-container:has(#consultManageGrid) .comment_item .item_title {
    flex: 1 1 auto;
}
.tab-main-container:has(#consultManageGrid) .comment_item .item_date {
    flex: 0 0 auto;
}
.tab-main-container:has(#consultManageGrid) .comment_item .item_content,
.tab-main-container:has(#consultManageGrid) .comment_item .item_content.max_content {
    flex: 0 0 100%;
    width: auto;
    max-width: none;
}
.tab-main-container:has(#consultManageGrid) .comment_item .item_content .item_grid {
    width: 100%;
    float: none;
}

/* ── 감가지원금(매입/판매): 배부현황 탭 그리드 시작선을 등록 탭(서브툴바 47px+마진 6px)과 일치 ── */
.tab-main-container:has(#purPuSubsidyBfsManageGrid) #purPuSubsidyBfsStateManageGrid,
.tab-main-container:has(#salSdSubsidyBfsManageGrid) #salSdSubsidyBfsStateManageGrid {
    margin-top: 53px !important;
}

/* 메뉴관리: 좌 트리 폭 435→390 — 우측 폼 표(747px)가 화면(1440) 안에 들어오게 */
.layout-fill .realgrid_main_menu_first {
    width: 390px !important;
}


/* ========================================
   로그인 비주얼 패널 — 그라데이션 장식의 단색화
   (custom-sample.css 검증 후 이관. login.css의 radial-gradient
    광원/도트 패턴을 브랜드 변수 기반 단색으로 대체 — 로드 순서상
    login.css 뒤라 항상 이김)
   ======================================== */
/* 광원 효과 → 브랜드 밝은 톤의 은은한 단색 틴트 (농도는 %, 0%=제거) */
.login-visual::before {
    background: color-mix(in srgb, var(--primary-hover) 22%, transparent);
}

/* 도트 패턴 → 제거 */
.login-visual::after {
    background-image: none;
}

/* ========================================
   QSC 배정 화면(qscScheduleManage) 회차 바 · 일괄 지정 툴바

   이 영역은 라벨-값 격자가 아니라 툴바다. 전역 검색 컨트롤 클래스
   (.form_sch_control 153px · .td_select 159px · .sch_from_label_button)는
   "고정폭 + float" 라서 '한 셀에 컨트롤 하나'를 전제로 만들어졌고,
   한 줄에 [버튼][셀렉트][버튼] 을 묶으면 폭이 모자라 float 이 줄바꿈된다.
   게다가 .sch_from_label_button 은 root.css 의 float:left 를
   이 파일 위쪽(:489)에서 float:right 로 덮으므로, 셀렉트(왼쪽)와
   버튼(오른쪽)이 반대편으로 갈라진다 — 2026-08-04 레이아웃 붕괴의 직접 원인.

   그래서 전역 클래스를 쓰지 않고 이 화면 전용 flex 컨테이너를 둔다.
   구성은 [필드][필드][필드] 한 줄이며, 필드 = 라벨 + 컨트롤 묶음이다.
   필드 사이는 넓게(column-gap) · 필드 안은 좁게(gap) 띄워 그룹 경계를 눈으로 만든다.
   float 이 없으므로 창 폭이 줄면 필드 단위로 줄바꿈되고, 컨트롤이 흩어지지 않는다.
   (선례: 위 #popup_order_date_time_bulk_form / #item_manage_data_form 화면 전용 오버라이드)
   ======================================== */
.qsc-toolbar {
    /* 부모(우측 세로 flex)의 항목 — 그리드가 flex:1 1 auto 로 남는 높이를 가져가므로
       여기서 줄어들지 않게 고정한다. 안 하면 화면이 짧을 때 툴바가 눌려 잘린다 */
    flex: 0 0 auto;
    /* 가로 스크롤 컨테이너. 최소 너비는 안쪽 __row 가 갖는다 —
       이 요소에 min-width 를 걸면 부모가 min-width:0 이라 스크롤 대신 그리드 밖으로 삐져나온다 */
    overflow-x: auto;
    overflow-y: hidden;
    margin: 5px 0 0 0;
    background: #fafafa;
    border: 1px solid #e5e5e5;
    border-radius: 3px;
    box-sizing: border-box;
}

/* 실제 한 줄. nowrap + min-width 로 절대 두 줄이 되지 않는다.
   폭이 모자라면 위 컨테이너가 가로 스크롤을 내주므로 컨트롤이 접히거나 찌그러지지 않는다.
   min-width 를 픽셀로 적으면 버튼 라벨 한 글자만 바뀌어도 손으로 다시 더해야 한다 —
   자식이 모두 flex:0 0 auto + nowrap 이므로 max-content 가 곧 그 합이고, 브라우저가 알아서 맞춘다 */
.qsc-toolbar__row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 14px;
    min-width: max-content;
    padding: 7px 10px;
    box-sizing: border-box;
}

/* 라벨 + 그에 딸린 컨트롤 한 묶음 */
.qsc-toolbar__field {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

/* 라벨 — .th_sch 와 같은 외형(11px·bold·우측정렬)이되 폭은 최소치만 잡는다.
   min-width 로 줄바꿈됐을 때도 컨트롤 시작 위치가 세로로 맞는다 */
.qsc-toolbar__label {
    flex: 0 0 auto;
    min-width: 44px;
    font-size: 11px;
    font-weight: bold;
    color: #333;
    letter-spacing: -0.5px;
    text-align: right;
    white-space: nowrap;
}

.qsc-toolbar__select,
.qsc-toolbar__input {
    height: 23px;
    padding: 3px 5px;
    font-size: 11px;
    color: #333;
    background: #fff;
    border: 0;
    outline: 1px solid #bbb;
    border-radius: 2px;
    box-sizing: border-box;
    min-width: 0;
}

/* 가장 긴 라벨(주간: "2026-W31 (07/27~08/02) · 이번")이 잘리지 않는 최소치.
   월간·분기는 이보다 짧다. 더 줄이면 끝의 '· 이번' 부터 잘린다 */
.qsc-toolbar__select {
    flex: 0 0 auto;
    width: 200px;
    cursor: pointer;
}

.qsc-toolbar__input {
    flex: 0 0 auto;
    width: 108px;
}

.qsc-toolbar__input--date {
    width: 96px;
    text-align: center;
}

.qsc-toolbar__select:hover,
.qsc-toolbar__input:not([readonly]):hover {
    outline: 1px solid #888;
}

.qsc-toolbar__btn {
    flex: 0 0 auto;
    height: 23px;
    padding: 2px 9px;
    font-size: 11px;
    font-weight: bold;
    color: #333;
    background-color: #f7f7f7;
    border: 0;
    outline: 1px solid #bbb;
    border-radius: 2px;
    cursor: pointer;
    white-space: nowrap;
}

.qsc-toolbar__btn:hover:not(:disabled) {
    outline: 1px solid #888;
}

/* 회차 이동 버튼은 범위 끝에서 비활성된다 — JS 가 아니라 CSS 가 비활성 외형을 맡는다 */
.qsc-toolbar__btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.qsc-toolbar__btn--icon {
    width: 23px;
    padding: 2px 0;
    text-align: center;
}

/* 앞 컨트롤과 다른 동작이므로 한 칸 띄운다 (이번 회차 · 선택 행에 적용) */
.qsc-toolbar__btn--gap {
    margin-left: 8px;
}

/* 누락 경고 — 평소 비어 있고, 남는 폭을 흡수해 우측 끝으로 밀린다 */
.qsc-toolbar__summary {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 11px;
    text-align: right;
    white-space: nowrap;
}

.qsc-toolbar__summary--warn {
    color: #C0392B;
    font-weight: bold;
}

/* ========================================
   QSC 폼 상세 (fragments/qscFormDetail) — info_item 3단

   consultManage(:1726~)의 info_item 규격을 그대로 따르되 2단 → 3단으로만 넓힌다.
   그쪽 공식은 "라벨 80px 고정 + 값 calc(단수분 - 80px)" 이라 한 행이 카드 폭을 꽉 채우고
   열이 세로로 정렬된다. 3단이면 값이 calc(33.333% - 80px) 이다.

   font-size·text-align·줄바꿈은 건드리지 않는다 — consultManage 도 덮지 않고 상속받으며,
   그래야 두 화면의 글자가 같아 보인다.

   이 fragment 는 그리드 id 가 다른 두 화면(배정·배점)이 공유하므로
   consultManage 처럼 :has(#...Grid) 로 스코프할 수 없어 .qsc-form-detail 클래스를 쓴다.
   ======================================== */

/* 바깥 카드(qc_grid_item) 이중 박스 방지 — 테두리는 안쪽 .info_item 이 갖는다 */
.qsc-form-detail.qc_grid_item {
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    margin: 5px 0 0 0;
    /* 값 칸은 calc(33.333% - 80px) 이라 패널이 좁아지면 같이 줄어든다.
       점검일(2026/07/23)과 코드명이 접히지 않는 하한이 값 칸 170px 이고,
       (170 + 80 라벨) / 33.333% ≈ 750 + info_item 좌우 padding 24 = 774 → 780px.
       권장 폭 1440px 에서 이 패널은 855px 이라 평소에는 걸리지 않고,
       1366px 이하로 좁아질 때만 폭을 지켜 준다. */
    min-width: 780px;
}

.qsc-form-detail .info_item {
    border: 1px solid var(--border);
    border-radius: 5px;
    background: #fff;
    padding: 10px 12px 5px;
    margin-bottom: 0;
}

.qsc-form-detail .info_item ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.qsc-form-detail .info_item .item_title {
    flex: 0 0 80px;
    box-sizing: border-box;
    padding: 6px 0 !important;
}

.qsc-form-detail .info_item .item_content {
    flex: 0 0 calc(33.333% - 80px);
    box-sizing: border-box;
    width: auto;
    max-width: none;
    padding: 6px 8px 6px 0 !important;
    margin: 0;
}

/* 제목·설명은 한 행 전체를 값으로 쓴다 (consultManage 의 max_content 와 같은 역할) */
.qsc-form-detail .info_item .item_content--wide {
    flex: 0 0 calc(100% - 80px);
}

/* 팝업 없이 눌러서 고르는 멀티코드 피커(.multicode-picker--inline).
   생김새는 품목 다중선택과 같고, 검색 버튼(.add-btn) 없이 화살표만 둔다.
   기본 배치가 .add-btn 자리를 비워 두고 있어(오른쪽 39px) 그 자리만 되돌린다. */
/* 기본 min-width 200px 이 걸려 있어 인라인 style 의 width 로는 못 줄인다 */
.multicode-picker--inline {
    min-width: 0 !important;
}

.multicode-picker--inline .picker-content {
    width: 100% !important;
    margin-right: 0 !important;
    /* 고른 코드명을 전부 이어 붙여 넣으므로 칸 너비를 넘길 수 있다.
       흘러넘치면 옆 조회조건 칸을 덮으므로 여기서 자른다(전체 목록은 title 로 뜬다) */
    overflow: hidden;
}

.multicode-picker--inline .selected-text {
    /* flex 자식은 기본 min-width 가 auto 라 글자 길이만큼 버틴다. 0 으로 풀어야 말줄임이 걸린다 */
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.multicode-picker--inline .dropdown-arrow {
    right: 4px !important;
}

/* 같은 줄의 조회조건 <select>(.td_select)와 크기를 맞춘 변형.

   테두리·높이·모서리는 건드리지 않는다. 이 파일 941줄부터의 테마 블록이 picker 와 .td_select 를
   이미 같은 모양으로 칠해 두었다 — 높이 28px, radius 5px, outline var(--border).
   어긋나는 것은 너비뿐이다: .td_select 는 width:100% + min-width:161px 라 칸을 채워 161px 이 되고,
   picker 는 .picker-content 155px + margin-right 4px = 159px 로 2px 좁다.
   그래서 컨테이너 너비만 잡아 준다(.picker-content 는 --inline 이 width:100% 로 채운다).

   ⚠ 보이는 박스는 컨테이너가 아니라 .picker-content 다. 테마가 컨테이너를
     border:0 + transparent 로 지우기 때문에, 컨테이너에 테두리를 주면 안쪽 박스를 감싸는
     링이 하나 더 생긴다. 높이도 테마가 !important 로 28px 을 박아 두어 여기서 줄이면
     .picker-content 만 남아 세로가 어긋난다. 둘 다 실제로 겪은 것이라 적어 둔다.

   ⚠ --inline 을 직접 고치지 않는다. 피킹리스트관리(BOR150)·반품피킹은 옆칸이
     .form_sch_control 이라 기준이 다르다 — 거기까지 바뀌면 그 화면이 어긋난다. */
.multicode-picker--select {
    width: 161px;
}

/* 보이는 박스는 .picker-content 다. --inline 이 width:100% 로 채우는데 div 라 content-box 여서
   테마의 padding(4px 3px)이 밖으로 더 붙어 161 이 아니라 167px 로 그려졌다.
   .td_select 는 <select> 라 브라우저 기본이 border-box — 같은 100% 라도 padding 이 안에 들어간다.
   그래서 여기만 border-box 로 맞춘다.
   ⚠ 높이도 같이 못 박아야 한다. 테마의 height:20px 은 padding 8px 이 더해져 28px 이 되는 값이라,
     box-sizing 만 바꾸면 20px 로 납작해진다. */
.multicode-picker--select .picker-content {
    box-sizing: border-box !important;
    height: 28px !important;
}

/* .td_select 는 12px 인데 picker 테마 기본은 11px 이라 옆칸보다 작아 보인다 */
.multicode-picker--select .selected-text,
.multicode-picker--select .placeholder-text {
    font-size: 12px !important;
}

/* 화살표 칸의 남은 구분선·배경. 검색 버튼(.add-btn)과 나란히 놓일 때를 전제한 모양이라
   화살표만 있는 여기서는 박스 안에 선이 하나 더 그려진다 */
.multicode-picker--select .picker-buttons {
    border-left: 0 !important;
    background: none !important;
}

/* 기본 .dropdown-item 은 선택된 항목을 보여 주는 줄이라 좌우로 벌려 놨다.
   여기서는 체크박스와 글자가 붙어 있어야 고르기 좋다. */
.multicode-picker--inline .dropdown-item {
    justify-content: flex-start;
    gap: 6px;
    cursor: pointer;
}

.multicode-picker--inline .dropdown-item:hover {
    background-color: var(--fill);
}

.multicode-picker--inline .dropdown-item input {
    margin: 0;
    cursor: pointer;
}

/* .clear-all-btn 배치를 빌려 쓰되 색은 되돌린다 — 지우는 버튼이 아니라 고르는 버튼이다 */
.multicode-picker--inline .select-all-btn {
    color: var(--text-secondary);
}

.multicode-picker--inline .select-all-btn:hover {
    background-color: var(--fill);
    color: var(--text);
}

/* .dropdown-content 의 padding 안쪽이라 머리줄이 좌우로 떠 보인다 */
.multicode-picker--inline .dropdown-header {
    margin: -8px -8px 4px;
}

/* ============================================================
   배포 감지 안내 토스트 (main.js showBuildUpdateToast)
   ------------------------------------------------------------
   SweetAlert2 를 쓰지 않는다. Swal.fire 는 떠 있던 다이얼로그를 파괴하면서
   그 promise 를 isDismissed 로 끊어버려, 사용자가 저장 확인창을 조작하는
   중에 이 배경 안내가 뜨면 그 작업이 조용히 취소된다.
   ============================================================ */

/* ── 팝업(토스트) 본체 ─────────────────────────────────── */
.update-toast {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 1000; /* SweetAlert2(1060) 보다 아래 — 사용자가 연 다이얼로그를 가리지 않는다 */
    width: 340px;
    padding: 16px 16px 14px 18px;
    background: var(--primary);
    color: var(--on-primary);
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(31, 39, 64, 0.28);
}

.update-toast__body {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.update-toast__icon {
    flex: none;
    display: flex;
    margin-top: 1px;
    opacity: 0.9;
}

/* 화살표가 아래로 떨어질 때 viewBox 밖으로 삐져나오지 않게 자른다 */
.update-toast__icon svg {
    overflow: hidden;
}

/* 아래로 떨어지는 다운로드 화살표 애니메이션 */
.update-toast__icon .arrow {
    animation: dlDrop 1.6s ease-in-out infinite;
}

@keyframes dlDrop {
    0%   { transform: translateY(-9px); opacity: 0; }
    20%  { opacity: 1; }
    70%  { transform: translateY(0);    opacity: 1; }
    100% { transform: translateY(5px);  opacity: 0; }
}

.update-toast__text { flex: 1; min-width: 0; }

.update-toast__title {
    font-size: 13.5px;
    font-weight: 800;
    line-height: 1.4;
}

.update-toast__desc {
    margin-top: 3px;
    font-size: 11.5px;
    line-height: 1.5;
    color: var(--on-primary-sub);
}

.update-toast__actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 14px;
}

.update-toast__btn {
    height: 32px;
    font-family: inherit;
    font-size: 12.5px;
    border-radius: 8px;
    cursor: pointer;
}

/* 보조 — 나중에 */
.update-toast__btn--ghost {
    padding: 0 12px;
    border: 1px solid var(--on-primary-line);
    background: transparent;
    color: var(--on-primary);
    font-weight: 700;
}

.update-toast__btn--ghost:hover {
    background: var(--primary-hover);
}

/* 주요 — 새로고침 */
.update-toast__btn--primary {
    padding: 0 14px;
    border: none;
    background: var(--on-primary);
    color: var(--primary);
    font-weight: 800;
}

.update-toast__btn--primary:hover {
    background: #f0f0ee;
}
.realgrid_main_last .claim-reason-editor {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
}
.realgrid_main_last .claim-reason-editor > .td_select,
.realgrid_main_last .claim-reason-editor > .form_sch_control {
    flex: 1 1 0;
    width: 0 !important;
    min-width: 0 !important;
    float: none;
    box-sizing: border-box;
}
.realgrid_main_last .claim-reason-editor > .form_btn_reason_save,
.realgrid_main_last .claim-reason-editor > .form_btn_reason_popup {
    flex: 0 0 28px;
    width: 28px;
    float: none;
    margin: 0;
    box-sizing: border-box;
}
.realgrid_main_last .claim-detail-scroll {
    min-width: 0;
    scrollbar-gutter: stable;
    padding: 0 6px 6px 0;
    box-sizing: border-box;
}
.realgrid_main_last .claim-detail-scroll > table {
    width: calc(100% - 10px);
    table-layout: fixed;
    margin: 5px;
}
.realgrid_main_last .claim-detail-scroll > table > colgroup > col:nth-child(odd) {
    width: 12.6263% !important;
}
.realgrid_main_last .claim-detail-scroll > table > colgroup > col:nth-child(even) {
    width: 20.707% !important;
}
.realgrid_main_last .claim-detail-scroll table .form_sch_control,
.realgrid_main_last .claim-detail-scroll table textarea {
    box-sizing: border-box;
    max-width: 100%;
}
