/* 반응형 스타일 정의 */

/* 태블릿 이하 */
@media (max-width: 992px) {
    .sidebar {
        width: 80%;
    }

    .gu-info {
        display: none !important;
    }
}

/* 모바일 */
@media (max-width: 768px) {
    /* 지도 툴팁 */
    .map-tooltip {
        font-size: 11px;
        padding: 6px 10px;
        max-width: 180px;
    }

    /* 구 정보 박스 숨김 */
    .gu-info {
        display: none !important;
    }

    /* 모달 반응형 */
    .modal-building-info .row {
        flex-direction: column;
    }

    .modal-building-info .col-7,
    .modal-building-info .col-5 {
        flex: 1;
        max-width: 100%;
    }

    .modal-building-info .chart-section {
        margin-bottom: 20px;
    }

    .modal-building-info #chartControls {
        flex-direction: column;
        gap: 8px;
        align-items: stretch;
    }

    .modal-building-info #chartControls .form-select {
        width: 100% !important;
    }

    /* 건물 정보 반응형 */
    .building-info .row {
        flex-direction: column;
    }

    .building-info .col-7,
    .building-info .col-5 {
        flex: 1;
        max-width: 100%;
    }

    .building-info .chart-section {
        margin-bottom: 20px;
    }

    .building-info #chartControls {
        flex-direction: column;
        gap: 8px;
        align-items: stretch;
    }

    .building-info #chartControls .form-select {
        width: 100% !important;
    }
}

/* 매우 작은 화면 */
@media (max-width: 480px) {
    .sidebar {
        width: 95%;
    }

    .map-container {
        left: 0;
    }

    .side-tab {
        width: 50px;
    }

    .secondary-side-tab {
        left: 50px;
        width: 120px;
    }

    .toolbar {
        right: 10px;
        top: 10px;
    }

    .toolbar .btn {
        width: 36px;
        height: 36px;
    }
}
