/* 커스텀 스타일 */

/* 스크롤바 스타일링 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #4f46e5, #7c3aed);
}

/* 애니메이션 */
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes slideIn {
    from { opacity: 0; transform: translateX(-20px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes pulse-glow {
    0%, 100% { box-shadow: 0 0 5px rgba(99, 102, 241, 0.5); }
    50% { box-shadow: 0 0 20px rgba(99, 102, 241, 0.8); }
}

/* 폼 요소 애니메이션 */
.travel-style-option div,
input[type="radio"] + div {
    animation: fadeIn 0.3s ease-out;
}

/* 입력 필드 포커스 효과 */
input:focus, select:focus, textarea:focus {
    animation: pulse-glow 2s infinite;
}

/* 카드 호버 효과 */
.bg-white {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

section.bg-white:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* 버튼 ripple 효과 */
button {
    position: relative;
    overflow: hidden;
}

button::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
}

button:active::after {
    width: 300px;
    height: 300px;
}

/* 로딩 애니메이션 개선 */
.animate-spin {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.animate-bounce {
    animation: bounce 1s infinite;
}

@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
        animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }
    50% {
        transform: translateY(-25%);
        animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
}

/* 그라데이션 텍스트 */
.bg-clip-text {
    -webkit-background-clip: text;
    background-clip: text;
}

/* 체크박스 스타일 */
input[type="checkbox"] {
    cursor: pointer;
    accent-color: #6366f1;
}

input[type="checkbox"]:checked + span {
    text-decoration: line-through;
    color: #9ca3af;
}

/* 일정 카드 타임라인 */
.space-y-4 > div {
    position: relative;
}

.space-y-4 > div:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 2rem;
    top: 100%;
    width: 2px;
    height: 1rem;
    background: linear-gradient(to bottom, #e5e7eb, transparent);
}

/* 모바일 최적화 */
@media (max-width: 640px) {
    .grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .text-4xl {
        font-size: 1.875rem;
    }

    .p-8 {
        padding: 1.5rem;
    }
}

/* 프린트 스타일 */
@media print {
    header, footer, button, .fixed {
        display: none !important;
    }

    body {
        background: white !important;
    }

    .shadow-lg, .shadow-xl {
        box-shadow: none !important;
    }

    .rounded-2xl {
        border: 1px solid #e5e7eb;
    }
}

/* 다크모드 지원 (선택적) */
@media (prefers-color-scheme: dark) {
    /* 필요시 다크모드 스타일 추가 */
}