/* style.css */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* Custom Scrollbar */
.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: #f1f1f1;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
    animation: fadeIn 0.5s ease-out forwards;
}

/* Scrollbar hide utility */
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* 이미지 썸네일 호버 효과 */
.thumbnail-hover {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.thumbnail-hover:hover {
    transform: scale(1.03); /* 살짝 확대 */
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
}

/* 이미지 모달 등장 애니메이션용 */
#imageModal:not(.hidden) img {
    transform: scale(1);
}

/* 이미지 모달 z-index 최상위 설정 */
#imageModal {
    z-index: 9999 !important; /* 강제로 최상위 */
}

/* 아코디언 애니메이션 */
.max-h-0 {
    max-height: 0;
}
.max-h-screen {
    max-height: 1000px; /* 충분히 큰 값 */
}
