/* ═══════════════════════════════════════
   중개오토AI 디자인 시스템 (섹션 31 기준)
   ═══════════════════════════════════════ */

/* ── CSS 변수 ── */
:root {
    --bg: #FFFFFF;
    --bg2: #F8F9FA;
    --bg3: #F1F3F5;
    --text: #1A1A2E;
    --text2: #6C757D;
    --text3: #ADB5BD;
    --blue: #3B7FD4;
    --blue2: #2563EB;
    --blue-light: #EFF6FF;
    --success: #10B981;
    --warning: #F59E0B;
    --danger: #EF4444;
    --border: #E5E7EB;
    --border2: #D1D5DB;
}

/* ── 기본 스타일 ── */
body {
    -webkit-font-smoothing: antialiased;
    font-family: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--text);
    background: var(--bg2);
}

/* ── 모바일 입력 필드 (iOS 자동 줌 방지) ── */
input, select, textarea {
    font-size: 16px !important;
}

/* ── 스크롤바 ── */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-thumb { background: var(--border2); border-radius: 2px; }

/* ── 텍스트 줄임 ── */
.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ── 카드 터치 피드백 ── */
.bg-white[class*="rounded-xl"] {
    transition: transform 0.1s, box-shadow 0.1s;
}
.bg-white[class*="rounded-xl"]:active {
    transform: scale(0.98);
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

/* ── 안전 영역 (노치 대응) ── */
main { padding-bottom: env(safe-area-inset-bottom, 20px); }
.safe-bottom { padding-bottom: env(safe-area-inset-bottom, 0px); }

/* ── 뱃지 ── */
.badge { border-radius: 6px; padding: 3px 8px; font-size: 12px; font-weight: 500; }
.badge-sale { background: #FEF3C7; color: #92400E; }
.badge-jeonse { background: #DBEAFE; color: #1E40AF; }
.badge-monthly { background: #D1FAE5; color: #065F46; }

/* ── 모달 바텀시트 ── */
.fixed.inset-0 .absolute.bottom-0 {
    animation: slideUp 0.2s ease-out;
}
@keyframes slideUp {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

/* ── PC 레이아웃 ── */
@media (min-width: 1024px) {
    body { padding-bottom: 0 !important; }
    .fixed.inset-0 .absolute.bottom-0 {
        animation: fadeIn 0.2s ease-out;
    }
    @keyframes fadeIn {
        from { opacity: 0; transform: translateY(-50%) scale(0.95); }
        to { opacity: 1; transform: translateY(-50%) scale(1); }
    }
    input, select, textarea { font-size: 14px !important; }
}

/* ── 로딩 애니메이션 ── */
@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}
.loading-pulse { animation: pulse 1.5s infinite; }

/* ── 토글 스위치 ── */
.peer:checked ~ .peer-checked\:bg-primary {
    background-color: var(--blue);
}