/* ==========================================================================
   dashboard_theme.css — 시안 디자인 리스킨 레이어
   기존 마크업/JS/데이터는 건드리지 않고 "룩"만 덧입힌다.
   (head.html에서 my_css.css 뒤에 로드되어 우선 적용됨)
   ========================================================================== */

:root {
    --t-bg: #eceadf;
    --t-card: #FFFFFF;
    --t-ink: #1d1d1d;
    --t-ink2: #3c3c3a;
    --t-muted: #9a9a93;
    --t-faint: #bcbcb5;
    --t-line: #f0efe9;
    --t-soft: #f3f2ee;
    --t-sand: #e7e3d5;
    --t-red: #DD1402;
    --t-red-soft: #FBE6E2;
    --t-radius: 22px;
    --t-shadow: 0 1px 2px rgba(20, 16, 14, .03), 0 16px 36px -26px rgba(30, 20, 16, .3);
    --t-font: 'NanumSquare_ac', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ---- 전역 폰트 / 배경 ---- */
body,
.aside_btn, .aside_a, .aside_b, .aside_submenu_btn,
.nav_title, .nav_middle_title,
.card, .card-title, .btn, input, select, textarea, button, table {
    font-family: var(--t-font);
}

body {
    background-color: var(--t-bg) !important;
    letter-spacing: -0.01em;
    -webkit-font-smoothing: antialiased;
}

#main {
    background-color: var(--t-bg);
}

/* ==========================================================================
   상단 NAV
   ========================================================================== */
#nav {
    background-color: var(--t-card) !important;
    box-shadow: 0 1px 0 var(--t-line), 0 8px 24px -20px rgba(30, 20, 16, .4) !important;
    border-bottom: none;
}

/* 문의게시판 버튼 → 레드 포인트 */
.inquiry-btn {
    background: var(--t-red) !important;
    box-shadow: 0 6px 16px -8px rgba(221, 20, 2, .6) !important;
    border-radius: 999px !important;
}
.inquiry-btn:hover {
    background: #c11200 !important;
    box-shadow: 0 8px 20px -8px rgba(221, 20, 2, .7) !important;
}

/* 로그아웃 버튼 → 다크 ghost */
.logout-btn {
    background: var(--t-ink) !important;
    box-shadow: var(--t-shadow) !important;
    border-radius: 999px !important;
}
.logout-btn:hover {
    background: #000 !important;
}

/* 사용자 뱃지 */
.username-badge {
    background: var(--t-soft) !important;
    border: 1px solid var(--t-line) !important;
    border-radius: 999px !important;
    color: var(--t-ink2) !important;
    box-shadow: none !important;
}

/* ==========================================================================
   좌측 사이드바 (Aside) — 흰 라운드 카드 + 캡슐 메뉴
   ========================================================================== */
#aside {
    background-color: var(--t-bg) !important;
    border-right: none !important;
    padding: 80px 12px 16px 12px !important;
}

/* 메뉴 묶음을 흰 카드 위에 얹지 않고, 항목 단위 캡슐로 처리 */
.aside_accordion {
    margin-bottom: 2px;
}

/* 1depth 메뉴 버튼 → 캡슐 */
.aside_btn {
    border-radius: 999px;
    padding: 11px 14px !important;
    color: var(--t-ink2) !important;
    font-weight: 600;
    font-size: 14.5px;
    transition: background .15s, color .15s;
}
.aside_btn .nav_title {
    color: var(--t-ink2) !important;
    font-size: 14.5px;
    margin-left: 6px;
}
.aside_btn:hover {
    background: var(--t-soft);
    color: var(--t-ink) !important;
    font-weight: 600;
}
.aside_btn:hover .nav_title {
    color: var(--t-ink) !important;
}
/* 메뉴 아이콘 톤 */
.aside_btn img {
    filter: grayscale(1) opacity(.55);
    transition: filter .15s;
}
.aside_btn:hover img {
    filter: none;
}

/* 펼쳐진 서브메뉴 컨테이너 — 기존 인라인 navy(#172852) 강제 오버라이드 */
#aside .aside_div {
    background-color: transparent !important;
    border-radius: 14px;
    padding: 2px 4px;
}

/* 2depth/3depth 링크 → 라이트 + 레드 포인트 */
#aside .aside_a,
#aside .aside_b {
    color: var(--t-ink2) !important;
    font-size: 13.5px;
    border-radius: 10px;
    position: relative;
}
#aside .aside_a:hover,
#aside .aside_b:hover {
    background-color: var(--t-soft) !important;
    color: var(--t-ink) !important;
    font-weight: 600;
}

/* 링크 앞 점 (시안의 sub-item 도트) */
#aside .aside_a::before {
    content: "";
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--t-faint);
    transition: background .15s;
}
#aside .aside_a:hover::before {
    background: var(--t-red);
}

/* 중분류(서브 토글) 버튼 */
.aside_submenu_btn {
    color: var(--t-muted) !important;
    font-weight: 600;
    border-radius: 10px;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
}
.aside_submenu_btn:hover {
    color: var(--t-ink) !important;
    background: var(--t-soft);
}
.aside_submenu_btn .nav_middle_title {
    color: var(--t-ink2) !important;
    font-size: 13.5px;
}
.custom_arrow {
    color: var(--t-faint) !important;
}

/* 즐겨찾기 별 아이콘(favorite_span) 색 */
.favorite-toggle .fa-star,
.favorite-toggle i.fas {
    color: var(--t-red) !important;
}

/* ==========================================================================
   카드 (Bootstrap .card) → 시안 라운드 카드
   ========================================================================== */
.card {
    background-color: var(--t-card);
    border: none !important;
    border-radius: var(--t-radius) !important;
    box-shadow: var(--t-shadow) !important;
}
.card-title {
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    color: var(--t-ink);
}

/* ==========================================================================
   대시보드 탭 (.nav-tabs) → 시안 세그먼트 필
   ========================================================================== */
.nav-tabs {
    border-bottom: none !important;
    background: var(--t-card);
    display: inline-flex;
    padding: 6px;
    border-radius: 999px;
    box-shadow: var(--t-shadow);
    gap: 2px;
}
.nav-tabs .nav-link {
    background-color: transparent !important;
    color: var(--t-muted) !important;
    border: none !important;
    border-radius: 999px !important;
    font-weight: 700;
    padding: 9px 18px !important;
}
.nav-tabs .nav-link.active {
    background-color: var(--t-ink) !important;
    color: #fff !important;
}

/* ==========================================================================
   기준일자 변경 등 아웃라인 버튼 미세 보정
   ========================================================================== */
.btn-outline-primary {
    border-radius: 999px;
}