/* ===========================================
   모바일 반응형 — 호스트 엘리먼트 레벨 스타일
   (Shadow DOM 내부 스타일은 components/ 참고)
   =========================================== */

/* Grid 이미지 썸네일 */
.grid-thumbnail {
    object-fit: cover;
    border-radius: 4px;
}

@media screen and (max-width: 768px) {

    /* Grid: 호스트 엘리먼트에 최소 너비 → 부모 컨테이너에서 수평 스크롤 */
    vaadin-grid {
        min-width: 600px;
    }

    /* 모바일에서 썸네일 크기 축소 */
    .grid-thumbnail {
        width: 80px !important;
        height: 80px !important;
    }
}