/**
 * DINO FINDER — 로그인 v2 기준 전역 UI 톤 통일
 * 모든 페이지에서 tokens 다음·기능 CSS 마지막에 로드
 */

/* ----- 기본 ----- */
html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body.login-v2,
body.app-v2 {
    font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
    color: var(--text-dark);
    letter-spacing: var(--letter-tight);
}

body.app-v2 {
    font-size: var(--font-base-app);
    line-height: var(--leading-normal);
    background: var(--bg-page);
}

/* ----- 브랜드 로고 (logo.png — DINO 흰색 / 나머지 형광) ----- */
.brand-logo-stack {
    position: relative;
    display: block;
    line-height: 0;
    isolation: isolate;
}

.brand-logo-stack .brand-logo {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: left center;
}

.brand-logo--dino {
    display: block;
    clip-path: inset(0 calc(100% - var(--logo-dino-split) + var(--logo-rest-overlap)) 0 0);
    filter: brightness(0) invert(1);
    opacity: 0.96;
}

.brand-logo--rest {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    clip-path: inset(0 0 0 calc(var(--logo-dino-split) - var(--logo-rest-overlap)));
    filter: var(--logo-neon-filter);
    pointer-events: none;
}

/* ----- 앱 레이아웃 표면 ----- */
body.app-v2 .sidebar {
    background: var(--brand-sidebar-gradient);
}

body.app-v2 .sidebar .header.sidebar-app-hero {
    background: transparent;
}

body.app-v2 .main-content {
    background: var(--bg-page);
}

body.app-v2 .main-content .messages-container,
body.app-v2 .main-content .container > section,
body.app-v2 .dashboard-panel,
body.app-v2 .results-pro-shell {
    border-color: var(--border-light);
}

/* ----- 입력 ----- */
body.app-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
body.app-v2 select,
body.app-v2 textarea,
body.login-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
body.login-v2 select,
body.login-v2 textarea {
    border-color: var(--border-strong);
    border-radius: var(--radius-md);
}

body.app-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):focus,
body.app-v2 select:focus,
body.app-v2 textarea:focus,
body.login-v2 input:focus,
body.login-v2 select:focus,
body.login-v2 textarea:focus {
    outline: none;
    border-color: var(--focus-border);
    box-shadow: var(--focus-ring);
}

/* ----- 주요 CTA (로그인 버튼과 동일 그라데이션) ----- */
body.app-v2 .trend-btn,
body.app-v2 #searchBtn.trend-btn,
body.app-v2 .btn-primary,
body.app-v2 button.btn-primary,
body.app-v2 .search-btn-primary,
body.app-v2 .smart-search-run-btn,
body.app-v2 .auto-search-start-btn,
body.app-v2 .dino-btn--primary,
body.app-v2 .dino-btn--coupon,
body.app-v2 .goldbox-search-btn,
body.app-v2 .competitor-wing-fetch-btn,
body.app-v2 .ad-campaign-btn--primary,
body.app-v2 .ad-campaign-btn--detail,
body.app-v2 .kw-nav-modal__btn--confirm,
body.app-v2 .main-content .category-btn.category-search-btn.control-btn,
body.login-v2 .btn-primary,
.sidebar .trend-btn,
#searchBtn.trend-btn {
    background: var(--brand-cta-gradient);
    border: none;
    border-color: transparent;
    color: var(--text-on-brand);
    border-radius: var(--radius-md);
    box-shadow: var(--brand-cta-shadow);
    font-weight: 800;
    letter-spacing: var(--letter-tight);
    transition:
        filter 0.2s ease,
        transform 0.15s ease,
        box-shadow 0.2s ease;
}

body.app-v2 .trend-btn:hover:not(:disabled),
body.app-v2 #searchBtn.trend-btn:hover:not(:disabled),
body.app-v2 .btn-primary:hover:not(:disabled),
body.app-v2 button.btn-primary:hover:not(:disabled),
body.app-v2 .search-btn-primary:hover:not(:disabled),
body.app-v2 .smart-search-run-btn:hover:not(:disabled),
body.app-v2 .auto-search-start-btn:hover:not(:disabled),
body.app-v2 .dino-btn--primary:hover:not(:disabled),
body.app-v2 .dino-btn--coupon:hover:not(:disabled),
body.app-v2 .goldbox-search-btn:hover:not(:disabled),
body.app-v2 .competitor-wing-fetch-btn:hover:not(:disabled),
body.app-v2 .ad-campaign-btn--primary:hover:not(:disabled),
body.app-v2 .ad-campaign-btn--detail:hover:not(:disabled),
body.app-v2 .kw-nav-modal__btn--confirm:hover:not(:disabled),
body.app-v2 .main-content .category-btn.category-search-btn.control-btn:hover:not(:disabled),
body.login-v2 .btn-primary:hover:not(:disabled),
.sidebar .trend-btn:hover:not(:disabled),
#searchBtn.trend-btn:hover:not(:disabled) {
    background: var(--brand-cta-gradient);
    filter: brightness(1.06);
    transform: translateY(-1px);
    box-shadow: var(--brand-cta-shadow-hover);
}

/* 보조 버튼 */
body.app-v2 .btn-secondary,
body.app-v2 button.btn-secondary,
body.login-v2 .btn-secondary {
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-card);
    color: var(--text-primary);
    font-weight: 700;
}

body.app-v2 .btn-secondary:hover:not(:disabled),
body.login-v2 .btn-secondary:hover:not(:disabled) {
    background: var(--bg-page);
    border-color: var(--border-strong);
}

/* ----- 카드·패널 ----- */
body.app-v2 .main-content .messages-container,
body.login-v2 .login-v2-card,
body.app-v2 .modal-content,
body.app-v2 .notice-modal--pro .notice-modal__panel {
    border-radius: var(--radius-2xl);
    box-shadow: var(--shadow-card);
}

/* ----- 알림 ----- */
body.app-v2 .alert-success,
body.login-v2 .alert-success {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #065f46;
    border-radius: var(--radius-md);
}

body.app-v2 .alert-error,
body.login-v2 .alert-error {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
    border-radius: var(--radius-md);
}

body.app-v2 .alert-warning,
body.login-v2 .alert-warning {
    background: #fffbeb;
    border-color: #fde68a;
    color: #92400e;
    border-radius: var(--radius-md);
}

/* ----- 로그인 좌측 패널 ----- */
body.login-v2 .login-v2-aside {
    background: var(--brand-aside-gradient);
}

/* ----- 인증 보조 페이지 타이포 ----- */
body.login-v2 .login-v2-card-kicker {
    font-size: var(--font-small);
    color: var(--text-muted);
}

body.login-v2 .login-v2-card-title {
    font-size: clamp(1.5rem, 2vw, 1.75rem);
    color: var(--text-heading);
}

body.login-v2 .login-v2-card-desc {
    font-size: var(--font-body);
    color: var(--text-secondary);
}

@media (prefers-reduced-motion: reduce) {
    body.app-v2 .trend-btn:hover:not(:disabled),
    body.app-v2 .btn-primary:hover:not(:disabled),
    body.login-v2 .btn-primary:hover:not(:disabled) {
        transform: none;
    }
}