@charset "utf-8";

/* ============================================
   자동입찰 공통 모던 스타일
   ============================================ */

/* --- 공통 래퍼 --- */
.ab-page { padding:20px 24px 30px; background:#fff; }
.ab-page .page-desc {
    font-size:13px; color:#888; margin-bottom:18px; line-height:1.6;
}

/* --- 패널 헤더 강화 --- */
.card-view.ab-card > .panel-heading {
    border-bottom:2px solid var(--manage-color, #337ab7);
    padding:14px 20px;
}
.card-view.ab-card > .panel-heading .panel-title {
    font-size:17px; letter-spacing:-0.3px;
}
.card-view.ab-card > .panel-heading .page-account {
    font-size:12px; color:#888; font-weight:normal; margin-left:12px;
}
.card-view.ab-card > .panel-heading .page-account i { margin-right:3px; }
.card-view.ab-card > .panel-heading .page-warn {
    font-size:12px; color:#d9534f; font-weight:normal; margin-left:12px;
}
.card-view.ab-card > .panel-heading .page-warn a { color:#d9534f; text-decoration:underline; }

/* --- 버튼 중앙 정렬 --- */
.ab-card .btn {
    display:inline-flex !important; align-items:center; justify-content:center;
    gap:4px; vertical-align:middle; line-height:1 !important;
    padding-top:9px !important; padding-bottom:9px !important;
}
.ab-card .btn-sm {
    padding-top:8px !important; padding-bottom:8px !important;
}
.ab-card .btn-xs {
    padding-top:5px !important; padding-bottom:5px !important;
}

/* --- 툴바 / 액션바 --- */
.ab-toolbar {
    display:flex; justify-content:space-between; align-items:center;
    margin-bottom:14px; flex-wrap:wrap; gap:8px;
}
.ab-toolbar .left,
.ab-toolbar .right { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }

/* --- 필터바 --- */
.ab-filter {
    display:flex; gap:10px; align-items:center; flex-wrap:wrap;
    margin-bottom:16px; padding:14px 16px;
    background:#f8f9fa; border:1px solid #eee; border-radius:6px;
}
.ab-filter label {
    font-size:12px; font-weight:600; color:#555; white-space:nowrap;
}
.ab-filter input[type="text"],
.ab-filter input[type="date"],
.ab-filter input[type="number"],
.ab-filter select {
    padding:6px 10px; border:1px solid #d5d5d5; border-radius:4px;
    font-size:13px; background:#fff; transition:border-color .2s;
}
.ab-filter input:focus,
.ab-filter select:focus { border-color:var(--manage-color, #337ab7); outline:none; }

/* --- 정보바 --- */
.ab-info-bar {
    display:flex; justify-content:space-between; align-items:center;
    margin-bottom:12px; font-size:13px; color:#666;
}
.ab-info-bar .total { font-weight:600; color:#333; }

/* --- 테이블 공통 --- */
.ab-table { width:100%; border-collapse:collapse; border:1px solid #e5e5e5; }
.ab-table th {
    padding:9px 10px;
    background:#f8f9fa;
    border:1px solid #e5e5e5;
    font-size:12px; font-weight:600; color:#555;
    text-align:center; vertical-align:middle;
    white-space:nowrap; letter-spacing:-0.2px;
    text-transform:uppercase;
}
.ab-table th.sortable, .ab-table th[onclick] { cursor:pointer; user-select:none; }
.ab-table th.sortable:hover, .ab-table th[onclick]:hover { background:#eef1f5; }
.ab-table th .sort-icon { margin-left:2px; color:#bbb; font-size:10px; }
.ab-table th .sort-icon.asc,
.ab-table th .sort-icon.desc { color:var(--manage-color, #337ab7); }
.ab-table td {
    padding:8px 10px;
    border:1px solid #e5e5e5;
    font-size:13px; color:#333;
    vertical-align:middle;
}
.ab-table tbody tr { transition:background .15s; }
.ab-table tbody tr:hover { background:#f5f8ff; }
.ab-table tbody tr.row-excluded { background:#fffcf0; }
.ab-table tbody tr.row-excluded:hover { background:#fff8e0; }
.ab-table tbody tr.is-new { background:#f0fdf4; }

/* td 정렬 헬퍼 (board.css 오버라이드) */
#bbs .ab-table td { text-align:center; }
#bbs .ab-table td.tl { text-align:left !important; }
#bbs .ab-table td.tr { text-align:right !important; }

/* 테이블 빈 상태 */
.ab-table .ab-empty td {
    text-align:center !important; padding:50px 20px;
    color:#aaa; font-size:14px;
}

/* --- 배지 --- */
.ab-badge {
    display:inline-block; padding:3px 10px; border-radius:12px;
    font-size:11px; font-weight:600; letter-spacing:-0.2px;
    line-height:1.4;
}
.ab-badge.success { background:#e8f5e9; color:#2e7d32; }
.ab-badge.warning { background:#fff3e0; color:#e65100; }
.ab-badge.danger  { background:#ffebee; color:#c62828; }
.ab-badge.info    { background:#e3f2fd; color:#1565c0; }
.ab-badge.muted   { background:#f5f5f5; color:#888; }

/* --- 상태 텍스트 --- */
.ab-status-success { color:#2e7d32; font-weight:600; }
.ab-status-fail    { color:#c62828; font-weight:600; }
.ab-status-skip    { color:#e65100; }
.ab-status-off     { color:#888; font-weight:600; }

/* --- 탭 --- */
.ab-tabs {
    display:flex; border-bottom:2px solid var(--manage-color, #337ab7);
    margin-bottom:18px;
}
.ab-tabs .tab {
    padding:10px 24px; cursor:pointer;
    font-size:13px; font-weight:600; color:#888;
    border:1px solid transparent; border-bottom:none;
    margin-right:2px; border-radius:5px 5px 0 0;
    background:#f8f9fa; transition:all .2s;
}
.ab-tabs .tab:hover { color:#555; background:#eef1f5; }
.ab-tabs .tab.active {
    background:var(--manage-color, #337ab7); color:#fff;
    border-color:var(--manage-color, #337ab7);
}

/* --- 페이징 --- */
.ab-paging { text-align:center; margin:20px 0 30px; }
.ab-paging a, .ab-paging span {
    display:inline-block; padding:6px 12px; margin:0 2px;
    border:1px solid #ddd; border-radius:4px;
    text-decoration:none; color:#555; font-size:13px;
    transition:all .15s;
}
.ab-paging a:hover { background:#f0f4ff; border-color:var(--manage-color, #337ab7); color:var(--manage-color, #337ab7); }
.ab-paging span.current {
    background:var(--manage-color, #337ab7); color:#fff !important;
    border-color:var(--manage-color, #337ab7);
    font-weight:600;
}

/* --- 로딩 --- */
.ab-loading-spin { display:none; margin-left:8px; color:var(--manage-color, #337ab7); }
.ab-loading-overlay {
    display:none; position:absolute; top:0; left:0; right:0; bottom:0;
    background:rgba(255,255,255,0.75); z-index:100;
    text-align:center; padding-top:100px;
}
.ab-loading-overlay i { font-size:28px; color:var(--manage-color, #337ab7); }

/* --- 폼 (모달 등) --- */
.ab-form-row { margin-bottom:12px; }
.ab-form-row label {
    display:inline-block; width:130px;
    font-size:13px; font-weight:600; color:#555;
    vertical-align:top; padding-top:8px;
}
.ab-form-row label .required { color:#d9534f; margin-left:2px; }
.ab-form-row input[type="text"],
.ab-form-row input[type="number"],
.ab-form-row textarea,
.ab-form-row select {
    padding:7px 10px; border:1px solid #d5d5d5; border-radius:4px;
    font-size:13px; transition:border-color .2s;
}
.ab-form-row input:focus,
.ab-form-row select:focus { border-color:var(--manage-color, #337ab7); outline:none; }

/* --- 테스트 결과 --- */
.ab-test-result {
    margin-top:12px; padding:12px; border:1px solid #ddd;
    background:#f9f9f9; border-radius:6px; display:none;
    font-size:12px; word-break:break-all; max-height:200px; overflow-y:auto;
}
.ab-test-result.success { border-color:#a5d6a7; background:#e8f5e9; }
.ab-test-result.fail    { border-color:#ef9a9a; background:#ffebee; }

/* --- 입찰관리 전용 --- */
.ab-container { display:flex; min-height:calc(100vh - 150px); position:relative; }
.ab-lnb {
    width:220px; min-width:220px;
    border-right:1px solid #e5e5e5; background:#f8f9fa;
    overflow-y:auto; padding:8px;
    transition:width 0.2s, min-width 0.2s, padding 0.2s, opacity 0.2s;
}
.ab-lnb { font-size:13px; }
.ab-lnb .jstree-default .jstree-node { min-height:24px; height:auto; }
.ab-lnb .jstree-default .jstree-anchor { font-size:13px; white-space:normal; word-break:break-all; height:auto; line-height:1.4; }
.ab-lnb .lnb-header {
    font-size:13px; font-weight:600; padding:8px 10px;
    background:#fff; border:1px solid #e5e5e5; border-radius:5px;
    margin-bottom:10px; cursor:pointer; transition:all .2s;
}
.ab-lnb .lnb-header:hover { background:#eef1f5; }
.ab-lnb .lnb-header.active {
    background:var(--manage-color, #337ab7); color:#fff;
    border-color:var(--manage-color, #337ab7);
}
.ab-lnb.collapsed { width:0; min-width:0; padding:0; overflow:hidden; border-right:none; opacity:0; }
.ab-lnb-toggle {
    position:absolute; left:220px; top:8px; z-index:10;
    width:22px; height:40px; border:1px solid #ccc; border-left:none;
    background:#f8f9fa; border-radius:0 4px 4px 0; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    font-size:11px; color:#666; transition:left 0.2s;
}
.ab-lnb-toggle:hover { background:#e8e8e8; color:#333; }
.ab-lnb.collapsed + .ab-lnb-toggle { left:0; }
.ab-rnb { flex:1; padding:18px; overflow-x:auto; background:#fff; }
.ab-rnb h4 { font-size:15px; font-weight:600; margin:0 0 12px; color:#333; }
.ab-rnb .info-bar {
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:6px;
    margin-bottom:12px; padding:10px 14px;
    background:#f8f9fa; border:1px solid #eee; border-radius:5px;
}

/* --- 동기화/액션바 --- */
.ab-sync-bar { margin-bottom:12px; text-align:right; }
.ab-sync-bar .btn { margin-left:5px; }

/* --- 인라인 편집 --- */
#bbs .ab-table .inline-edit {
    width:100%; box-sizing:border-box;
    padding:5px 8px; border:1px solid #d5d5d5; border-radius:4px;
    text-align:right; font-size:12px; transition:border-color .2s;
}
#bbs .ab-table .inline-edit:focus { border-color:var(--manage-color, #337ab7); outline:none; }

/* --- 자동입찰 토글 --- */
.ab-toggle { cursor:pointer; font-weight:600; }
.ab-toggle.on { color:#2e7d32; }
.ab-toggle.off { color:#aaa; }

/* --- 검색바 --- */
.ab-search { display:flex; gap:6px; margin-bottom:12px; }
.ab-search input {
    padding:6px 12px; border:1px solid #d5d5d5; border-radius:4px;
    width:200px; font-size:13px; transition:border-color .2s;
}
.ab-search input:focus { border-color:var(--manage-color, #337ab7); outline:none; }

/* --- 컬럼 토글 메뉴 --- */
.column-menu {
    position:absolute; top:100%; right:0; z-index:1000;
    background:#fff; border:1px solid #ccc; border-radius:4px;
    box-shadow:0 4px 12px rgba(0,0,0,0.15);
    padding:8px 12px; min-width:150px;
    max-height:400px; overflow-y:auto;
}
.column-menu label { display:block; padding:3px 0; font-size:12px; cursor:pointer; white-space:nowrap; }
.column-menu label input { margin-right:5px; vertical-align:middle; }

/* --- 요약 통계 카드 --- */
.ab-summary-cards {
    display:flex; gap:12px; margin-bottom:16px; flex-wrap:wrap;
}
.ab-summary-card {
    flex:1; min-width:120px; padding:14px 18px;
    background:#fff; border:1px solid #e5e5e5; border-radius:6px;
    text-align:center; box-shadow:0 1px 3px rgba(0,0,0,0.06);
}
.ab-summary-card .card-label { font-size:12px; color:#888; margin-bottom:4px; }
.ab-summary-card .card-value { font-size:22px; font-weight:700; color:#333; }
.ab-summary-card.success .card-value { color:#2e7d32; }
.ab-summary-card.danger .card-value { color:#c62828; }
.ab-summary-card.info .card-value { color:#1565c0; }

/* --- 대시보드 --- */
.db-cards { display:flex; gap:12px; margin-bottom:20px; flex-wrap:wrap; }
.db-card {
    flex:1; min-width:130px; padding:16px;
    background:#fff; border:1px solid #e5e5e5; border-radius:6px;
    text-align:center; box-shadow:0 1px 3px rgba(0,0,0,0.06);
}
.db-card .db-label { font-size:12px; color:#888; margin-bottom:6px; }
.db-card .db-value { font-size:24px; font-weight:700; color:#333; }
.db-card .db-sub { font-size:11px; color:#aaa; margin-top:4px; }
.db-row { display:flex; gap:16px; margin-bottom:20px; flex-wrap:wrap; }
.db-col { flex:1; min-width:300px; }
.db-panel {
    background:#fff; border:1px solid #e5e5e5; border-radius:6px;
    padding:16px; box-shadow:0 1px 3px rgba(0,0,0,0.06);
}
.db-panel h5 { font-size:14px; font-weight:600; margin:0 0 12px; color:#333; }
.db-stat-row { display:flex; justify-content:space-between; padding:6px 0; font-size:13px; border-bottom:1px solid #f0f0f0; }
.db-stat-row:last-child { border-bottom:none; }
.db-stat-label { color:#666; }
.db-stat-value { font-weight:600; color:#333; }
.db-fail-table { width:100%; border-collapse:collapse; font-size:12px; }
.db-fail-table th { background:#f8f9fa; padding:8px 10px; border:1px solid #e5e5e5; font-weight:600; color:#555; text-align:center; }
.db-fail-table td { padding:7px 10px; border:1px solid #e5e5e5; color:#333; vertical-align:middle; }
.db-scheduler-status { padding:12px 16px; background:#f8f9fa; border:1px solid #e5e5e5; border-radius:6px; font-size:13px; }

/* --- 소진율 프로그레스바 --- */
.spend-bar { display:inline-block; width:100%; height:16px; background:#eee; border-radius:3px; overflow:hidden; position:relative; }
.spend-bar-fill { height:100%; border-radius:3px; transition:width .3s; }
.spend-bar-text { position:absolute; width:100%; text-align:center; font-size:10px; font-weight:600; color:#333; line-height:16px; top:0; }

/* --- Top 버튼 --- */
.ab-btn-top {
    display:none; position:fixed; right:30px; bottom:30px; z-index:999;
    width:42px; height:42px; line-height:42px; text-align:center;
    background:var(--manage-color, #337ab7); color:#fff;
    border-radius:50%; font-size:16px; text-decoration:none;
    box-shadow:0 3px 10px rgba(0,0,0,.2); transition:all .2s;
    border:none; cursor:pointer;
}
.ab-btn-top:hover {
    background:#fff; color:var(--manage-color, #337ab7);
    box-shadow:0 3px 14px rgba(0,0,0,.25);
}