/**
 * 상단메뉴 페이지 공통 스타일
 * - catSales / catSalesTax / singleSales 등 조회/집계 페이지 공통
 * - 페이지 디자인 표준 (feedback_page_design_standard.md 참조)
 */

/* ═══════════════════════════════════════════════════════
   페이지 상단 툴바 (좌: 카드 / 우: 합계 그리드)
   ═══════════════════════════════════════════════════════ */
.page-toolbar {
    display: flex;
    gap: 10px;
    margin-bottom: 8px;
}
.toolbar-left {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    width: 320px;
    flex-shrink: 0;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.toolbar-right {
    flex: 1;
    min-width: 0;
}

/* 카드 헤더 (파란 그라데이션) */
.toolbar-left .title-badge {
    padding: 10px 14px;
    background: linear-gradient(135deg, #2c7be5, #1e6fd9);
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    text-align: center;
    letter-spacing: 0.5px;
    border-bottom: 1px solid rgba(0,0,0,0.05);
}

/* 카드 정보 리스트 */
.toolbar-left .item-info {
    padding: 10px 14px;
    font-size: 12.5px;
    color: #444;
}
.toolbar-left .item-info .info-row {
    display: flex;
    padding: 5px 0;
    border-bottom: 1px dashed #eef0f3;
}
.toolbar-left .item-info .info-row:last-child { border-bottom: none; }
.toolbar-left .item-info .info-label {
    width: 70px;
    color: #8a95a4;
    font-size: 11.5px;
    flex-shrink: 0;
}
.toolbar-left .item-info .info-value {
    flex: 1;
    color: #1f2937;
    font-weight: 500;
    word-break: break-all;
}

/* 카드 하단 액션 버튼 */
.toolbar-left button.btn-point2 {
    margin: 0;
    padding: 10px;
    border: none;
    border-top: 1px solid #e5e7eb;
    background: #f8f9fa;
    color: #2c7be5;
    border-radius: 0;
    cursor: pointer;
    font-weight: 500;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: background 0.15s;
}
.toolbar-left button.btn-point2:hover { background: #e7f1ff; }
.toolbar-left button.btn-point2 i { font-size: 14px; }

/* 카드 내부 토글/Pill 버튼들은 풀너비 + 적절한 패딩 */
.toolbar-left .segment-toggle,
.toolbar-left > .btn-pill {
    margin: 8px 12px;
    width: calc(100% - 24px);
    box-sizing: border-box;
}
.toolbar-left .segment-toggle {
    display: flex;
}
.toolbar-left .segment-toggle button {
    flex: 1;
}
.toolbar-left > .btn-pill {
    justify-content: center;
}

/* ═══════════════════════════════════════════════════════
   세그먼트 토글 (매입/매출)
   ═══════════════════════════════════════════════════════ */
.segment-toggle {
    display: inline-flex;
    border: 1px solid #d0d7de;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}
.segment-toggle button {
    padding: 6px 18px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    color: #666;
    transition: all 0.15s;
    min-width: 56px;
}
.segment-toggle button:hover { background: #f6f8fa; }
.segment-toggle button.active { background: #2c7be5; color: #fff; }
.segment-toggle button + button { border-left: 1px solid #d0d7de; }
.segment-toggle button.active + button,
.segment-toggle button:has(+ .active) { border-left-color: #2c7be5; }

/* ═══════════════════════════════════════════════════════
   Pill 버튼 (분류선택, 농업경영체 등)
   ═══════════════════════════════════════════════════════ */
.btn-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border: 1px solid #d0d7de;
    border-radius: 16px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    color: #444;
    transition: all 0.15s;
    white-space: nowrap;
}
.btn-pill:hover { background: #f6f8fa; border-color: #2c7be5; }
.btn-pill.filled {
    background: #e7f1ff;
    border-color: #2c7be5;
    color: #2c7be5;
    font-weight: 500;
}
.btn-pill i { font-size: 14px; }

/* ═══════════════════════════════════════════════════════
   Pill 체크박스 (주민번호xxx, 현금판매 포함 등)
   ═══════════════════════════════════════════════════════ */
.filter-checks {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
}
.filter-checks label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 12px;
    border: 1px solid #d0d7de;
    border-radius: 16px;
    background: #fff;
    cursor: pointer;
    color: #555;
    transition: all 0.15s;
    user-select: none;
    white-space: nowrap;
}
.filter-checks label:hover { background: #f6f8fa; border-color: #2c7be5; }
.filter-checks label.checked {
    background: #e7f1ff;
    border-color: #2c7be5;
    color: #2c7be5;
    font-weight: 500;
}
.filter-checks label.checked::before {
    content: '✓';
    font-weight: bold;
    margin-right: 2px;
}
.filter-checks input[type="checkbox"] { display: none; }

/* ═══════════════════════════════════════════════════════
   합계 그리드 (4×2)
   ═══════════════════════════════════════════════════════ */
.summary-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 6px;
    height: 100%;
}
.summary-cell {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.summary-cell .label { font-size: 12px; color: #666; margin-bottom: 4px; }
.summary-cell .value {
    font-size: 15px;
    font-weight: 600;
    color: #222;
    text-align: right;
}
.summary-cell.range {
    background: #f0f7ff;
    border-color: #cfe3ff;
}
.summary-cell.range .value { color: #2c7be5; }

/* ═══════════════════════════════════════════════════════
   합계 그리드 — split-half 변형 (ledgerBook 등 12셀 페이지)
   좌(전체) / 우(구간) 50/50 분할 컨테이너
   ═══════════════════════════════════════════════════════ */
.summary-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 8px;
}
.summary-grid.summary-grid--half {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    height: auto;
}
.summary-section-title {
    margin: 0 0 4px 0;
    font-size: 12px;
    font-weight: 700;
    color: #1e6fd9;
    padding-left: 2px;
}
.summary-section-title .period {
    font-weight: 400;
    color: #6b7280;
    margin-left: 4px;
}

/* ═══════════════════════════════════════════════════════
   검색 필터 영역
   ═══════════════════════════════════════════════════════ */
.search-filter-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: #fafbfc;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin-bottom: 8px;
}
.search-filter-row .filter-group {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.search-filter-row .filter-group label {
    font-size: 13px;
    color: #555;
    font-weight: 500;
}
.search-filter-row .divider {
    width: 1px;
    height: 22px;
    background: #d0d7de;
    margin: 0 4px;
}

/* ═══════════════════════════════════════════════════════
   빠른 날짜 선택 버튼
   ═══════════════════════════════════════════════════════ */
.quick-date-btns {
    display: inline-flex;
    gap: 4px;
    margin-left: 8px;
}
.quick-date-btns button {
    padding: 4px 10px;
    border: 1px solid #d0d7de;
    background: #fff;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
    color: #555;
}
.quick-date-btns button:hover {
    background: #f6f8fa;
    border-color: #2c7be5;
    color: #2c7be5;
}
.quick-date-btns button.active {
    background: #2c7be5;
    color: #fff;
    border-color: #2c7be5;
}

/* 분기/반기 드롭다운 */
.dropdown-wrap {
    position: relative;
    display: inline-block;
}
.dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    border: 1px solid #d0d7de;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    z-index: 999;
    min-width: 80px;
}
.dropdown-menu .dd-item {
    padding: 6px 12px;
    cursor: pointer;
    font-size: 12px;
}
.dropdown-menu .dd-item:hover { background: #f0f8ff; }

/* ═══════════════════════════════════════════════════════
   AG Grid 공통 - 날짜 그룹 / 고객 병합
   ═══════════════════════════════════════════════════════ */
/* rowSpan 셀 (거래일자 병합용) */
.ag-theme-alpine .ag-cell[rowspan]:not([rowspan="1"]) {
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    background: #cddddd !important;
    font-weight: 500;
}
/* 날짜 그룹 짝/홀 교차 배경 */
.ag-theme-alpine .ag-row.date-group-odd .ag-cell { background-color: #ffffff !important; }
.ag-theme-alpine .ag-row.date-group-even .ag-cell { background-color: #f0f0ee !important; }
/* 병합 셀은 그룹 배경보다 우선 */
.ag-theme-alpine .ag-row.date-group-odd .ag-cell[rowspan]:not([rowspan="1"]),
.ag-theme-alpine .ag-row.date-group-even .ag-cell[rowspan]:not([rowspan="1"]) {
    background: #cddddd !important;
}
/* 같은 고객 연속 행 - 하단 테두리 제거 */
.ag-theme-alpine .ag-row.cust-continuation .ag-cell {
    border-bottom-width: 0 !important;
    border-bottom-color: transparent !important;
}
/* 날짜 그룹 마지막 행 - 구분선 */
.ag-theme-alpine .ag-row.date-group-end .ag-cell {
    border-bottom: 1px solid #d0d7de !important;
}
/* 일요일 행 (빨간 글자) */
.ag-theme-alpine .ag-row.sunday-row .ag-cell { color: #ff0000 !important; }

/* 농업경영체 O/X */
.farm-o { color: #0000ff; font-weight: bold; }
.farm-x { color: #ff0000; }