/* 고유 클래스 스코핑 */
.premium-login-auth {
    --auth-blue: #2563eb;
    --auth-bg: #ffffff;
    --auth-text: #1e293b;
    --auth-muted: #64748b;
    --auth-border: #e2e8f0;
    
    display: flex;
    justify-content: center;
    padding: 60px 20px;
    font-family: 'Pretendard', sans-serif !important;
}

.premium-login-auth .auth-card {
    width: 100%;
    max-width: 400px;
    background: var(--auth-bg);
    border-radius: 20px;
    padding: 40px;
}

.premium-login-auth .auth-header { text-align: center; margin-bottom: 30px; }
.premium-login-auth .auth-header i { font-size: 40px; color: var(--auth-blue); margin-bottom: 15px; }
.premium-login-auth .auth-header h2 { font-size: 22px; font-weight: 700; color: var(--auth-text); margin: 0; }

.premium-login-auth .auth-group { margin-bottom: 18px; }
.premium-login-auth .auth-group label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 7px; color: var(--auth-text); }
.premium-login-auth .auth-input-raw { position: relative; }
.premium-login-auth .auth-input-raw i { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: var(--auth-muted); }

.premium-login-auth .auth-input-raw input {
    width: 100%;
    padding: 12px 15px 12px 45px;
    border: 1px solid var(--auth-border);
    border-radius: 10px;
    font-size: 14px;
    transition: 0.2s;
    outline: none;
    box-sizing: border-box !important;
}

.premium-login-auth .auth-input-raw input:focus { border-color: var(--auth-blue); box-shadow: 0 0 0 3px rgba(37,99,235,0.1); }

.premium-login-auth .auth-btn {
    width: 100%;
    padding: 14px;
    background: var(--auth-blue);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    margin-top: 10px;
}

.premium-login-auth .auth-footer { margin-top: 25px; text-align: center; font-size: 13px; color: var(--auth-muted); }
.premium-login-auth .auth-footer a { color: var(--auth-blue); text-decoration: none; font-weight: 600; }

/* 링크 및 구분선 스타일 */
.auth-helper-links {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
    font-size: 13px;
}
.auth-helper-links a { color: var(--auth-muted); text-decoration: none; transition: 0.2s; }
.auth-helper-links a:hover { color: var(--auth-blue); }
.auth-helper-links .divider {
    width: 1px;
    height: 12px;
    background: var(--auth-border);
    margin: 0 12px;
}

/* 모달 레이아웃 */
.find-modal-overlay {
    display: none; /* 초기 숨김 */
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(8px);
    z-index: 1000;
    justify-content: center;
    align-items: center;
}
.find-modal-content {
    background: #fff;
    width: 100%;
    max-width: 400px;
    padding: 35px;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
    animation: modalFadeUp 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes modalFadeUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* 탭 스타일 */
.find-modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; }
.find-tabs { display: flex; gap: 20px; }
.find-tabs button {
    background: none; border: none; font-size: 18px; font-weight: 700;
    color: #cbd5e1; cursor: pointer; padding-bottom: 5px; transition: 0.3s;
}
.find-tabs button.active { color: var(--auth-text); border-bottom: 2px solid var(--auth-blue); }
.close-modal { background: none; border: none; font-size: 28px; color: var(--auth-muted); cursor: pointer; }