/* ========================================================
 * 채팅 헤더 스타일 (head_style_0018.css에서 이동, 2025-10-02)
 * Phase 2.2f: 채팅 헤더 분리
 * 원본 위치: head_style_0018.css 라인 14-53 (40 라인)
 * ======================================================== */

    .chat-header {
      display: none !important; /* 헤더 숨김 (2025-10-20) */
      padding: 8px 16px;
      border-bottom: none;
      background: var(--bg-primary);
      align-items: center;
      justify-content: space-between;
    }

    /* 상단 왼쪽 고정 드롭다운 (사이드바 밖) */
    .top-left-dropdown {
      position: fixed !important;
      top: 12px !important;
      left: calc(250px + 20px) !important; /* 사이드바 너비(250px) + 여백(20px) */
      z-index: 1000 !important;
      width: auto !important;
      max-width: 220px !important;
    }

    /* 드롭다운 버튼 가로 길이 축소 */
    .top-left-dropdown .unified-dropdown-button {
      width: auto !important;
      padding: 8px 12px !important;
      font-size: 13px !important;
    }

    .operation-status {
      display: none;
      padding: 12px 20px;
      border-bottom: 1px solid var(--border-color);
      background: var(--bg-primary);
      gap: 10px;
      align-items: center;
      flex-wrap: wrap;
    }

    .operation-status.visible {
      display: flex;
    }

    .status-pill {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 14px;
      border-radius: 999px;
      font-size: 13px;
      font-weight: 600;
      color: #ffffff;
      box-shadow: 0 10px 24px rgba(26, 35, 126, 0.15);
      backdrop-filter: blur(6px);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .status-pill:hover {
      transform: translateY(-1px);
      box-shadow: 0 12px 28px rgba(26, 35, 126, 0.18);
    }

    .status-pill .status-icon {
      font-size: 14px;
    }

    .status-pill.status-image {
      background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 40%, #ec4899 100%);
    }

    .status-pill.status-web {
      background: linear-gradient(135deg, #0ea5e9 0%, #2563eb 45%, #1d4ed8 100%);
    }

    .chat-actions {
      display: flex;
      gap: 8px;
    }

    .action-btn {
      padding: 8px 12px;
      background: var(--bg-secondary);
      border: 1px solid var(--border-color);
      border-radius: 6px;
      cursor: pointer;
      transition: all 0.2s;
      font-size: 14px;
    }

    .action-btn:hover {
      background: var(--bg-chat);
    }

    /* ======== Responsive ======== */
    @media (max-width: 768px) {
      .top-left-dropdown {
        display: none !important;
      }
    }

    /* 모바일 반응형 */
    @media (max-width: 768px) {
      .chat-header {
        padding: 8px 16px 8px 56px !important; /* 수정: 햄버거(40px) + 여백(16px) 공간 확보 */
        gap: 8px !important; /* 수정: 간격 축소 */
        flex-wrap: nowrap !important;
      }

      .operation-status {
        padding: 10px 16px;
        gap: 8px;
      }

      .status-pill {
        font-size: 12px;
        padding: 5px 12px;
      }

      /* ★ 추가: 헤더 드롭다운 강제 표시 */
      .chat-header .header-dropdown {
        display: flex !important;
        flex: 0 0 auto !important;
        min-width: 0 !important;
        max-width: 100px !important;
      }

      .chat-header .unified-dropdown {
        display: flex !important;
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: 100px !important;
        min-width: 0 !important;
        overflow: visible !important;
        visibility: visible !important;
      }

      .chat-header .unified-dropdown-button {
        width: auto !important;
        max-width: 100% !important;
        padding: 4px 6px !important;
        font-size: 10px !important;
        gap: 3px !important;
        overflow: hidden !important;
        display: flex !important;
        visibility: visible !important;
        border-radius: 6px !important;
        border-width: 1px !important;
      }

      .chat-header .unified-dropdown-button .text {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        max-width: 60px !important;
        flex: 0 1 auto !important;
      }

      .chat-header .unified-dropdown-button .icon {
        font-size: 12px !important;
        flex-shrink: 0 !important;
      }

      .chat-header .unified-dropdown-button .arrow {
        font-size: 8px !important;
        flex-shrink: 0 !important;
      }

      .chat-actions {
        gap: 6px;
      }

      .action-btn {
        padding: 6px 10px;
        font-size: 13px;
      }
    }