/* --- my-itinerary.html 전용 스타일 --- */

/* --- 프로젝트 버블 스타일 --- */
.project-bubbles-wrapper {
    margin-bottom: 2em;
    padding: 5px 0;
    border-bottom: 1px solid var(--border-light-color);
    background-color: var(--content-bg-color);
}
#project-bubbles-container {
    display: flex;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 10px var(--base-padding); /* 좌우 패딩 적용 */
    gap: 12px;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}
#project-bubbles-container::-webkit-scrollbar { display: none; } /* Webkit */

.project-bubble {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    border-radius: 20px; /* 캡슐 모양 */
    border: 1px solid var(--border-color);
    background-color: var(--content-bg-color);
    color: var(--text-light-color);
    font-size: 0.95em;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    text-align: center;
    box-sizing: border-box;
}
.project-bubble:hover {
    border-color: var(--primary-color);
    color: var(--primary-color);
    background-color: var(--primary-light-color);
}
.project-bubble.active {
    background-color: var(--primary-color);
    color: white;
    border-color: var(--primary-color);
    font-weight: 700;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.project-bubble.add-new-project { /* '+' 버튼 */
    color: var(--primary-color);
    border-style: dashed;
    padding: 8px 12px;
    min-width: 40px; /* 원형 유지 */
}
.project-bubble.add-new-project i {
    font-size: 1.1em;
    margin: 0; /* 아이콘만 있을 때 마진 제거 */
    width: auto; /* 너비 자동 */
}
.project-bubble.add-new-project:hover {
    background-color: var(--primary-color);
    color: white;
}

/* --- 일정 컨트롤 바 스타일 --- */
.itinerary-controls-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5em;
    flex-wrap: wrap; /* 작은 화면에서 줄바꿈 */
    gap: 15px;
    padding: 10px;
    background-color: #f8f9fa;
    border-radius: var(--border-radius);
    border: 1px solid var(--border-light-color);
}
.itinerary-controls-bar .control-group {
    display: flex;
    align-items: center;
    gap: 8px;
}
.itinerary-controls-bar .filter-group i {
    color: var(--text-light-color);
}
.itinerary-controls-bar select {
    padding: 6px 10px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    font-size: 0.9em;
    background-color: var(--content-bg-color);
    font-family: inherit;
    min-width: 120px; /* 최소 너비 */
}
.itinerary-controls-bar .action-group button {
    font-size: 0.9em;
    padding: 7px 12px;
    /* 기본 버튼 스타일 상속 */
}
.itinerary-controls-bar .action-group button i {
    margin-right: 5px;
    width: auto; /* 아이콘 너비 자동 */
}
.itinerary-controls-bar .action-group button:disabled {
    background-color: #ccc;
    cursor: not-allowed;
    opacity: 0.7;
}

/* --- 커스텀 일정 테이블 스타일 --- */
.custom-itinerary-table {
    /* 기본 테이블 스타일 상속 */
    margin-bottom: 1em;
    font-size: 0.9em; /* 테이블 폰트 크기 조정 */
}
.custom-itinerary-table th,
.custom-itinerary-table td {
    /* 기본 테이블 스타일 상속 */
    padding: 10px 12px;
    vertical-align: middle; /* 기본 중간 정렬 */
}
.custom-itinerary-table tbody tr {
    cursor: grab; /* 드래그 가능 표시 */
}
.custom-itinerary-table tbody tr:not(.sortable-chosen) {
    cursor: pointer; /* 편집 가능 표시 */
}
.custom-itinerary-table tbody tr:hover {
    background-color: #f1f3f5;
}
/* 컬럼 너비 및 정렬 */
.custom-itinerary-table th:nth-child(1), /* 체크박스 */
.custom-itinerary-table td:nth-child(1) {
    text-align: center;
    width: 40px;
}
.custom-itinerary-table th:nth-child(2), /* 날짜 */
.custom-itinerary-table td:nth-child(2) {
    width: 15%;
    min-width: 90px;
}
.custom-itinerary-table th:nth-child(3), /* 시간 */
.custom-itinerary-table td:nth-child(3) {
    width: 10%;
    min-width: 60px;
}
.custom-itinerary-table th:nth-child(4), /* 활동 */
.custom-itinerary-table td:nth-child(4) {
    width: 30%;
    min-width: 150px;
    white-space: normal; /* 내용 길면 줄바꿈 */
    vertical-align: top; /* 줄바꿈 시 상단 정렬 */
}
.custom-itinerary-table th:nth-child(5), /* 예산 */
.custom-itinerary-table td:nth-child(5) {
    text-align: right;
    width: 12%;
    min-width: 80px;
}
.custom-itinerary-table th:nth-child(6), /* 통화 */
.custom-itinerary-table td:nth-child(6) {
    width: 8%;
    min-width: 50px;
    text-align: center;
}
.custom-itinerary-table th:nth-child(7), /* 메모 */
.custom-itinerary-table td:nth-child(7) {
    width: 22%;
    min-width: 150px;
    white-space: normal; /* 내용 길면 줄바꿈 */
    vertical-align: top; /* 줄바꿈 시 상단 정렬 */
}
.custom-itinerary-table td a { /* 활동 링크 */
    color: var(--primary-color);
    text-decoration: none;
}
.custom-itinerary-table td a:hover {
    text-decoration: underline;
}
.custom-itinerary-table input[type="checkbox"] {
    vertical-align: middle;
    cursor: pointer;
}

/* --- 총 예산 표시 바 스타일 --- */
.itinerary-summary-bar {
    margin-top: 1.5em;
    padding: 1em;
    background-color: #f0f2f5; /* 약간 다른 배경색 */
    border: 1px solid var(--border-light-color);
    border-radius: var(--border-radius);
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}
.itinerary-summary-bar .total-label { font-weight: 500; }
.itinerary-summary-bar strong { font-size: 1.2em; color: var(--primary-color); margin: 0 5px; }
.itinerary-summary-bar select {
    max-width: 80px;
    padding: 6px 8px;
    font-size: 0.9em;
    background-color: white;
    border-radius: 4px;
    border: 1px solid var(--border-color);
}
#itinerary-rate-disclaimer { /* 환율 상태 표시 */
    margin-left: 10px;
    font-size: 0.8em;
    color: var(--text-light-color);
}

/* 반응형 조정 */
@media (max-width: 767px) {
    .custom-itinerary-table { font-size: 0.85em; }
    .custom-itinerary-table th,
    .custom-itinerary-table td {
        padding: 8px 10px;
        white-space: nowrap; /* 기본 줄바꿈 방지 */
    }
    /* 모바일에서 줄바꿈 필요한 컬럼 */
    .custom-itinerary-table td:nth-child(4), /* 활동 */
    .custom-itinerary-table td:nth-child(7) { /* 메모 */
        white-space: normal;
        min-width: 120px; /* 최소 너비 조정 */
    }
    .itinerary-controls-bar, .itinerary-summary-bar {
        justify-content: flex-start; /* 모바일에서 왼쪽 정렬 */
    }
    .itinerary-summary-bar { padding: 0.8em; }
}