/* 상단 헤더 공통 스타일 — /stock · /stock/issue · /stock/ma05 3개 페이지가 함께 쓴다.
   마크업은 application/views/chart/_page_header.php 한 곳에 있다.
   ★ 헤더를 고칠 일이 생기면 이 파일과 위 PHP 두 개만 수정하면 3페이지에 동시 반영된다.
   (각 페이지의 인라인 <style> 은 이 파일 뒤에 오므로, 페이지별 예외가 필요하면 거기서 덮어쓴다) */

.dashboard-header {
    padding-left: 10px;          /* 본문 컨테이너(.dashboard-container) 의 padding-left 와 동일 */
    padding-right: 10px;
    width: auto;
    margin: 0 0 5px;             /* 위 0 / 아래 5px — 세 페이지 콘텐츠 시작 높이를 맞춘다 */
    display: flex;
    align-items: center;
    gap: 12px;
}

/* 로고 + 서비스명 (클릭 = hongpro.world, iframe 대비 _top) */
.hdr-brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; cursor: pointer; }
.hdr-avatar { height: 36px; width: 36px; border-radius: 20%; object-fit: cover; flex-shrink: 0; }
.hdr-title { font-size: 20px; font-weight: 700; color: #1a1a1a; }
.hdr-sep { color: #ced4da; }

#display_symbol_name { font-size: 17px; font-weight: 700; color: #495057; display: block; flex-shrink: 0; white-space: nowrap; }

/* 기본 표시 종목이 추천이 아니라 예시임을 알리는 배지 (종목 선택 시 JS 가 숨김) */
#example_badge {
    display: none; margin-left: 8px; padding: 2px 8px; font-size: 11px; font-weight: 700;
    color: #e8590c; background: #fff4e6; border: 1px solid #ffd8a8; border-radius: 10px; vertical-align: middle;
}

/* 우측 페이지 이동 */
.hdr-nav { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.hdr-nav a {
    display: inline-flex; align-items: center; gap: 5px; padding: 6px 13px; border-radius: 8px;
    font-size: 13px; font-weight: 700; color: #495057; background: #fff; border: 1px solid #e9ecef;
    text-decoration: none; white-space: nowrap;
    transition: background .15s, color .15s, border-color .15s;
}
.hdr-nav a:hover { background: #f1f3f5; color: #212529; border-color: #dee2e6; }
.hdr-nav a.on { background: #3182f6; border-color: #3182f6; color: #fff; }   /* 현재 페이지 */
.hdr-nav .ico { font-size: 15px; line-height: 1; }

/* 좁은 화면 — 헤더가 줄바꿈되며 네비가 아래로 내려간다 */
@media (max-width: 900px) {
    .dashboard-header { flex-wrap: wrap; padding-left: 4px; padding-right: 4px; gap: 8px; }
    #display_symbol_name { font-size: 15px; white-space: normal; }
    .hdr-nav { margin-left: 0; width: 100%; }
    .hdr-nav a { padding: 5px 10px; font-size: 12px; }
}